/* Theme Name: Speak Up Prayer Theme URI: https://speakupprayer.com Author: Speak Up Description: Block theme for speakupprayer.com — continuous prayer campaigns. Instrument Serif for display, Newsreader for reading. Every word on every surface is edited in WordPress; this theme holds the design and nothing else. Requires at least: 6.7 Requires PHP: 8.1 Version: 0.1.1 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: speakupprayer */ /* ═══ ONE RULE, TWO CONTEXTS ══════════════════════════════════════════ The block editor is an iframe whose carries .editor-styles-wrapper, and this file is injected there UNSCOPED. So a plain class selector styles the block in the editor AND on the page from one rule. Same convention as the Community theme. Keep it that way: the editor should not lie. ════════════════════════════════════════════════════════════════════ */ /* ── masthead ─────────────────────────────────────────────────────── */ /* The masthead and footer sit outside the constrained container, so root padding never reaches them — without this the wordmark is clipped at the viewport edge. max() centres them in wideSize and still guarantees a gutter. */ .sup-header{ border-bottom:1px solid var(--wp--preset--color--hairline); padding:20px max(24px, calc((100% - 1240px) / 2)); align-items:baseline; gap:16px; } .sup-mark{ font-family:var(--wp--preset--font-family--display); font-size:20px; line-height:1; margin:0; } .sup-mark a{ color:var(--wp--preset--color--ink); text-decoration:none; } /* ── the small caps label (style: su-label) is defined in styles/block ── */ /* ── hero ─────────────────────────────────────────────────────────── */ .sup-hero{ padding-block:74px 58px; text-align:center; } .sup-statement{ text-wrap:balance; margin:16px 0 0; } .sup-statement em{ font-style:italic; color:var(--wp--preset--color--brand); } /* ── the three ────────────────────────────────────────────────────── */ .sup-three{ padding-block:56px 74px; } .sup-three .wp-block-column{ text-align:center; } /* ── subscribe ────────────────────────────────────────────────────── */ .sup-subscribe{ padding-block:56px 60px; text-align:center; } /* An unwritten signup is not a grey box. Until there are words in it — or a form — the band is not there at all; it appears the moment he types. */ .sup-subscribe:not(:has(h2:not(:empty))):not(:has(p:not(:empty))):not(:has(form)){ display:none; } /* Kit's hosted form arrives as its own markup; give it room and a ceiling. */ .sup-subscribe .formkit-form{ margin-inline:auto !important; max-width:34rem; } .sup-subscribe form{ margin-top:22px; } /* ── the campaign post ────────────────────────────────────────────── */ .sup-post{ padding-block:56px 0; } .sup-portrait img{ display:block; margin-inline:auto; } .sup-note{ padding-block:34px; margin-top:8px; } /* ── footer ───────────────────────────────────────────────────────── */ .sup-footer{ border-top:1px solid var(--wp--preset--color--hairline); padding:26px max(24px, calc((100% - 1240px) / 2)) 34px; text-align:center; } .sup-footer p{ margin:0; line-height:1.9; } /* ── mechanics ────────────────────────────────────────────────────── */ .wp-block-separator{ border:0; border-top:1px solid currentColor; opacity:1; } img{ max-width:100%; height:auto; } :where(a):focus-visible{ outline:2px solid var(--wp--preset--color--brand); outline-offset:2px; } @media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }