@import url("https://fonts.googleapis.com/css2?family=Parisienne&display=swap");/* ============================================================================== TheRosary.online — Global Styles Bundle "The Mantle" design system v1.0 · applied 2026-07-25 Token-first. No hex is typed outside the:root token definitions below (Law 4). ============================================================================== */:root{--azure-50:#EFF6FE;--azure-100:#DBEAFD;--azure-200:#BBD6FB;--azure-300:#8FBBF5;--azure-400:#5E98EC;--azure-500:#3470D6;--azure-600:#2A5FC4;--azure-700:#244E9E;--azure-800:#21417C;--azure-900:#1F3A64;--slate-0:#FFFFFF;--slate-50:#F6F8FB;--slate-100:#EEF2F7;--slate-200:#E0E6EF;--slate-300:#CAD3DF;--slate-400:#A2AEBF;--slate-500:#74808F;--slate-600:#525C6B;--slate-700:#3B434F;--slate-800:#262C35;--slate-900:#161A20;--surface-page:#F7FAFE;--surface-card:#FFFFFF;--surface-alt:#F6F8FB;--surface-brand-tint:#EFF6FE;--surface-dark:#1F3A64;--text-heading:#1F3A64;--text-body:#1B2530;--text-muted:#525C6B;--text-caption:#74808F;--text-link:#2A5FC4;--text-link-hover:#244E9E;--text-on-action:#FFFFFF;--dark-heading:#FFFFFF;--dark-body:#DBEAFD;--dark-muted:#BBD6FB;--dark-link:#8FBBF5;--border-subtle:#EEF2F7;--border-default:#E3EAF3;--border-strong:#CAD3DF;--action-primary:#3470D6;--action-hover:#2A5FC4;--action-active:#244E9E;--action-disabled-bg:#E0E6EF;--action-disabled-text:#A2AEBF;--focus-ring:#3470D6;--selection-bg:#BBD6FB;--success:#14A37B;--success-tint:#E0F5EE;--success-text:#0F6E56;--warning:#EE7C1B;--warning-tint:#FDEEDD;--warning-text:#8A4A0B;--error:#E5484D;--error-tint:#FDE7E8;--error-text:#791F1F;--info:#3470D6;--info-tint:#DBEAFD;--info-text:#21417C;--joyful:#0E79C4;--joyful-soft:#E2F1FB;--joyful-deep:#185FA5;--sorrowful:#6C5BD2;--sorrowful-soft:#EDEAFB;--sorrowful-deep:#443199;--glorious:#F4B63C;--glorious-soft:#FCF4DB;--glorious-deep:#7A5606;--luminous:#C94277;--luminous-soft:#FBE9F0;--luminous-deep:#8F2450;--glorious-ink:#5E4004;--overlay-tint:rgba(31,58,100,.20);--overlay-scrim:rgba(31,58,100,.55);--shadow-color:rgba(31,58,100,.10);/* LAWS — non-negotiable 1. One color means act:azure only on CTAs and links. Mystery colors never on buttons. 2. Per-mystery pages:eyebrow = deep, section tints/cards = soft, icons/dots = vivid. Headings stay Marian ink on every page — the mantle runs through all four. 3. Gold never carries white and never draws on white alone:on white use --glorious-deep for strokes/text;vivid gold is for fills (with --glorious-ink text) and shines as-is only on --surface-dark. 4. Hex values never typed inline;every color in production maps to a token above. 5. All pairs above are recorded AA — do not invent new text/background pairings. 6. LOGO:".online" in the wordmark is --luminous #C94277 on EVERY surface — it never adapts by background. Name and beads flip ink/white;the rose does not. */}:root{--font-serif:"Lora",Georgia,"Times New Roman",serif;--font-sans:"Source Sans 3","Helvetica Neue",Arial,sans-serif;--font-script:"Parisienne",'Segoe Script',cursive;--font-display:var(--font-serif);--font-body:var(--font-sans);--type-display-size:56px;--type-display-lh:1.14;--type-display-weight:600;--type-display-ls:-0.01em;--type-h1-size:44px;--type-h1-lh:1.18;--type-h1-weight:600;--type-h1-ls:-0.01em;--type-h2-size:32px;--type-h2-lh:1.25;--type-h2-weight:600;--type-h2-ls:-0.005em;--type-h3-size:24px;--type-h3-lh:1.33;--type-h3-weight:600;--type-h3-ls:0;--type-h4-size:20px;--type-h4-lh:1.4;--type-h4-weight:600;--type-h4-ls:0;--type-prayer-size:20px;--type-prayer-lh:1.8;--type-prayer-weight:400;--type-prayer-lead-size:24px;--type-prayer-lead-lh:1.7;--type-lead-size:20px;--type-lead-lh:1.6;--type-body-size:17px;--type-body-lh:1.65;--type-small-size:15px;--type-small-lh:1.55;--type-caption-size:13px;--type-caption-lh:1.45;--type-eyebrow-size:12px;--type-eyebrow-lh:1.2;--type-eyebrow-ls:0.14em;--type-eyebrow-weight:600;--type-ui-size:16px;--type-ui-lh:1.2;--type-ui-weight:600;--measure-prose:68ch;--measure-prayer:34em}:root{--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;--section-y:96px;--section-y-tight:64px;--container-max:1120px;--container-narrow:720px;--gutter:24px;--radius-sm:6px;--radius-button:8px;--radius-card:12px;--radius-lg:16px;--radius-pill:999px;--border-width:1px;--focus-ring-width:2px;--focus-ring-offset:2px}:root{--glorious-lt:var(--glorious);--glorious-dk:var(--glorious-deep);--joyful-lt:var(--joyful);--joyful-dk:var(--joyful-deep);--sorrowful-lt:var(--sorrowful);--sorrowful-dk:var(--sorrowful-deep);--luminous-lt:var(--luminous);--luminous-dk:var(--luminous-deep);--rosary-faint:var(--border-default);--rosary-halo:var(--surface-brand-tint)}.wp-block-uagb-faq{margin-top:2.5rem !important;margin-bottom:2.5rem !important}.wp-block-button__link, .wp-block-button__link:visited{background-color:var(--action-primary);color:var(--text-on-action);border-radius:var(--radius-button);font-weight:600}.wp-block-button__link:hover, .wp-block-button__link:focus{background-color:var(--action-hover);color:var(--text-on-action)}.wp-block-buttons{margin-bottom:40px}/* Beaver Builder's global link style underlines EVERY <a> inside builder content via `.fl-builder-content a:not(.fl-builder-submenu-link)` (0,2,1). The DS wants links underlined IN PROSE only — never on buttons, card wrappers, icon links or menus. This is a de-underline reset, so it is marked !important rather than fought on specificity alone. */ .wp-block-button__link, .fl-builder-content a.fl-button, .fl-builder-content a.uabb-button, .fl-builder-content a.pp-post-link, .fl-builder-content .fl-icon a, .fl-builder-content .menu-item a, .fl-builder-content .fl-has-submenu-container a, .fl-builder-content .fl-menu a{text-decoration:none !important}.wp-block-separator{border:0;height:2px;width:120px;max-width:120px;margin:40px auto !important;border-radius:2px;background:var(--azure-300)}/* Mystery variants:vivid -> deep gradients. Glorious is SOLID --glorious-deep — Law 3:vivid gold never draws on white alone. */ .separator--joyful{background:linear-gradient(to right,var(--joyful) ,var(--joyful-deep))}.separator--sorrowful{background:linear-gradient(to right,var(--sorrowful),var(--sorrowful-deep))}.separator--luminous{background:linear-gradient(to right,var(--luminous) ,var(--luminous-deep))}.separator--glorious{background:var(--glorious-deep)}.wp-block-table{margin:2rem 0}.wp-block-table table{width:100%;border-collapse:collapse;font-size:90%}.wp-block-table th, .wp-block-table td{padding:0.75rem 1rem;border:1px solid var(--border-default)}.wp-block-table th{background:var(--surface-brand-tint);color:var(--text-heading);font-weight:600}.wp-block-table thead{border-bottom:5px solid var(--border-strong) !important}.wp-block-quote{margin:2rem 0;padding:1rem 1.5rem 1rem 1.25rem;position:relative;border-left:4px solid var(--joyful-deep);background:var(--joyful-soft);border-radius:4px;font-family:var(--font-serif);font-style:italic;font-size:110%;font-weight:500}.wp-block-quote p{margin:0}.wp-block-quote cite{display:block;margin-top:0.75rem;font-family:var(--font-sans);font-style:normal;font-weight:600;color:var(--joyful-deep)}.blockquote--joyful{border-left-color:var(--joyful-deep)}.blockquote--sorrowful{border-left-color:var(--sorrowful-deep)}.blockquote--luminous{border-left-color:var(--luminous-deep)}.blockquote--glorious{border-left-color:var(--glorious-deep)}figure.wp-block-image figcaption{font-size:0.9rem;color:var(--text-caption);font-style:italic;text-align:center;margin-top:0.5rem;padding:0 1rem;line-height:1.4}h2, h3, h4, h5, h6{margin-bottom:0.67em}#primary div.fl-module-content.fl-node-content p a, #primary .entry-content p a, .staff-links, .content-area ol li a, .content-area ul li a{font-weight:700;border-bottom:1px dotted}/* ============================================================================== 6. TRO COMPONENT LAYER v2 — Home v1.1 (verified spec, attempt 2) Token-referencing only (Law 4). All classes tro- prefixed, opt-in only. ============================================================================== */ .tro-pad-hero > .fl-row-content-wrap{padding:clamp(72px,11vw,128px) 24px clamp(88px,12vw,140px)}.tro-pad-idx > .fl-row-content-wrap{padding:0 24px clamp(56px,8vw,96px)}.tro-pad-wel > .fl-row-content-wrap{padding:clamp(48px,7vw,80px) 24px}.tro-pad-sec > .fl-row-content-wrap{padding:clamp(56px,8vw,96px) 24px}.tro-pad-foot > .fl-row-content-wrap{padding:clamp(56px,7vw,80px) 24px 32px}.tro-hero11 .fl-row-content-wrap{position:relative}.tro-hero11 .fl-row-content-wrap::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 46%, transparent 94%)}.tro-hero11 .fl-row-content{position:relative;z-index:2}.tro-hero11-quote, .tro-hero11-quote blockquote{margin:0;font-family:var(--font-serif);font-size:clamp(28px,3.7vw,48px);line-height:1.2;letter-spacing:-0.01em;font-weight:600;color:var(--dark-heading);text-wrap:pretty}.tro-hairline{width:44px;height:1px;background:var(--azure-400)}.tro-eyebrow, .tro-eyebrow p{margin:0;font-family:var(--font-sans);font-size:var(--type-eyebrow-size);font-weight:var(--type-eyebrow-weight);letter-spacing:var(--type-eyebrow-ls);line-height:var(--type-eyebrow-lh);text-transform:uppercase;color:var(--azure-700)}.tro-eyebrow--ondark, .tro-eyebrow--ondark p{color:var(--dark-muted)}.tro-eyebrow--joyful, .tro-eyebrow--joyful p{color:var(--joyful-deep)}.tro-eyebrow--sorrowful, .tro-eyebrow--sorrowful p{color:var(--sorrowful-deep)}.tro-eyebrow--glorious, .tro-eyebrow--glorious p{color:var(--glorious-deep)}.tro-eyebrow--luminous, .tro-eyebrow--luminous p{color:var(--luminous-deep)}.tro-index-grid{display:grid !important;grid-template-columns:repeat(auto-fit, minmax(226px, 1fr));gap:20px !important;margin-top:-72px !important;position:relative;z-index:3}.tro-idx-card{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-card);box-shadow:var(--shadow-card);transition:box-shadow var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out);cursor:pointer}.tro-idx-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.tro-chip44{width:44px;height:44px;border-radius:var(--radius-pill);display:flex;align-items:center;justify-content:center;flex:0 0 auto}.tro-chip44 .fl-photo-content img{width:26px;height:26px;display:block}.tro-idx-name, .tro-idx-name p{margin:0;font-family:var(--font-serif);font-size:20px;font-weight:600;line-height:1.3}.tro-idx-name{min-height:52px}.tro-deep--joyful, .tro-deep--joyful p{color:var(--joyful-deep)}.tro-deep--sorrowful, .tro-deep--sorrowful p{color:var(--sorrowful-deep)}.tro-deep--glorious, .tro-deep--glorious p{color:var(--glorious-deep)}.tro-deep--luminous, .tro-deep--luminous p{color:var(--luminous-deep)}.tro-idx-days, .tro-idx-days p{margin:0;font-size:14px;line-height:1.4;color:var(--text-muted)}.tro-beads118 .fl-photo-content img{width:118px;height:auto;display:block}.tro-beads200 .fl-photo-content img{width:200px;height:auto;display:block;margin-top:6px}.tro-welcome > .fl-row-content-wrap{border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}.tro-wel-quote, .tro-wel-quote blockquote{margin:0;font-family:var(--font-serif);font-size:clamp(24px,3vw,32px);line-height:1.35;letter-spacing:-0.005em;font-weight:600;color:var(--text-heading);text-wrap:pretty}.tro-btn-secondary a.fl-button, .tro-btn-secondary a.fl-button *{background:var(--surface-card) !important;color:var(--action-primary) !important;border:1px solid var(--azure-200) !important}.tro-btn-secondary a.fl-button:hover, .tro-btn-secondary a.fl-button:hover *{background:var(--azure-50) !important;color:var(--action-primary) !important}.tro-band-blurb, .tro-band-blurb p{margin:0;font-size:var(--type-body-size);line-height:var(--type-body-lh);color:var(--text-body);text-wrap:pretty}.tro-band-list ol{margin:0;padding:0;list-style:none}.tro-band-list li{display:flex;gap:14px;align-items:baseline;padding:9px 0}.tro-band-list li .n{flex:0 0 auto;min-width:16px;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}.tro-band-list li .t{font-family:var(--font-serif);font-size:19px;line-height:1.4;color:var(--text-heading)}.tro-list--joyful li .n{color:var(--joyful-deep)}.tro-list--sorrowful li .n{color:var(--sorrowful-deep)}.tro-list--glorious li .n{color:var(--glorious-deep)}.tro-list--luminous li .n{color:var(--luminous-deep)}.tro-video{border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-card)}.tro-video iframe{display:block}.tro-caption-sm, .tro-caption-sm p{margin:0;font-size:var(--type-small-size);line-height:1.5;color:var(--text-muted)}.tro-divider{}.tro-divider .tro-rule{flex:1 1 0;height:1px;background:var(--border-default)}.tro-divider .fl-photo-content img{width:32px;height:32px;opacity:.55;display:block}.tro-saints-card{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-card);box-shadow:var(--shadow-card);text-align:center}.tro-saints-mark .fl-photo-content img{width:88px;height:88px;display:block;margin:0 auto}.tro-blog-head a{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--text-link);text-decoration:none !important;border-bottom:none}.tro-blog-head a:hover{color:var(--text-link-hover)}.tro-blog-head p{margin:0}.tro-foot-grid{display:grid !important;grid-template-columns:repeat(auto-fit, minmax(226px, 1fr));gap:clamp(32px,5vw,64px) !important}.tro-foot-about, .tro-foot-about p{margin:0;font-size:var(--type-small-size);line-height:1.65;color:var(--dark-body);text-wrap:pretty}.tro-foot-about{max-width:34ch}.tro-foot-links p{margin:0 0 14px}.fl-builder-content .tro-foot-links a{font-size:var(--type-small-size);color:var(--dark-link);text-decoration:none !important;border-bottom:none;font-weight:400;display:inline-flex;align-items:center;gap:10px}.fl-builder-content .tro-foot-links a:hover{color:var(--dark-heading)}.tro-foot-links img{width:18px;height:18px;display:inline-block}.tro-foot-logo .fl-photo-content img{width:220px;height:auto}.tro-foot-sig{border-top:1px solid var(--azure-800)}.tro-signoff, .tro-signoff p{margin:0;font-family:var(--font-script);font-size:clamp(30px,4vw,38px);line-height:1.2;color:var(--dark-heading)}.tro-credit, .tro-credit p{margin:0;font-size:var(--type-caption-size);line-height:1.5;color:var(--dark-muted)}.fl-builder-content .tro-credit a{color:var(--dark-link);text-decoration:none !important;border-bottom:none}@media (max-width:768px){.tro-beads200 .fl-photo-content img{width:160px}.tro-beads118 .fl-photo-content img{width:104px}.tro-saints-mark .fl-photo-content img{width:72px;height:72px}}.tro-hero11 > .fl-row-content-wrap{background-position:26% 14% !important}.tro-hero11-quote blockquote, .tro-wel-quote blockquote{font-style:normal !important;border:0 !important;padding:0 !important;background:none !important;margin:0 !important;font-size:inherit;color:inherit;font-weight:inherit;font-family:inherit;line-height:inherit}.tro-hero11 .fl-row-content-wrap{position:relative !important}.tro-hero11 .fl-row-content-wrap::before{z-index:1 !important}.tro-hero11 .fl-row-content{position:relative !important;z-index:2 !important}.tro-beads118 .fl-photo, .tro-beads200 .fl-photo{text-align:left !important}.tro-beads118 .fl-photo-content, .tro-beads200 .fl-photo-content{display:inline-block}.tro-saints .uabb-testimonial-author-description, .tro-saints .uabb-testimonial-author-description p{margin:0 auto;max-width:30em;font-family:var(--font-serif);font-size:clamp(21px,2.4vw,28px);line-height:1.55;color:var(--text-heading);text-wrap:pretty}.tro-saints .uabb-testimonial-author-name{margin:16px 0 0;font-family:var(--font-sans);font-size:var(--type-small-size);font-weight:600;color:var(--text-heading)}.tro-saints .uabb-testimonials-wrap{text-align:center}.tro-saints .bx-pager{display:flex;justify-content:center;gap:4px;margin-top:12px}.tro-saints .bx-pager-item{display:block}.tro-saints button.bx-pager-link{width:36px;height:36px;font-size:0;color:transparent;background:transparent url('https://therosary.online/wp-content/uploads/2026/07/bead-open-160.png') center/12px 12px no-repeat !important;border:0;border-radius:var(--radius-pill);cursor:pointer}.tro-saints button.bx-pager-link.active{background-image:url('https://therosary.online/wp-content/uploads/2026/07/bead-160.png') !important}.tro-blog .pp-content-post{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden;transition:box-shadow var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out)}.tro-blog .pp-content-post:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.tro-blog .pp-content-grid-image{position:relative}.tro-blog .pp-content-grid-image img{aspect-ratio:16/10;object-fit:cover;width:100%;display:block}.tro-blog .pp-content-grid-image::after{content:'';position:absolute;inset:0;background:var(--overlay-tint);pointer-events:none}.tro-blog .pp-content-post-data{display:flex;flex-direction:column;gap:8px;padding:20px}.tro-blog .pp-content-post-meta{order:-1;margin:0;font-size:var(--type-eyebrow-size);font-weight:600;letter-spacing:var(--type-eyebrow-ls);text-transform:uppercase;color:var(--text-muted) !important;background:none !important;padding:0 !important}.tro-blog .pp-content-grid-title{margin:0;font-family:var(--font-serif);font-size:19px;line-height:1.35;font-weight:600}.tro-blog .pp-content-grid-title a, .tro-blog .pp-content-grid-title{color:var(--text-heading) !important}.tro-blog .pp-post-title-divider{display:none}.tro-blog .pp-content-grid-content{margin:0;font-size:var(--type-small-size);line-height:1.6;color:var(--text-muted)}.tro-blog-head{width:100%;display:flex !important;justify-content:space-between !important;align-items:flex-end !important;flex-wrap:wrap}/* ============================================================================== PUNCH RUN 1 — owner fixes. Token-referencing only (Law 4). ============================================================================== */ /* ITEM 2 — body 18/1.65 (design-system amendment v1.1.1, owner-ratified). --type-small / --type-caption deliberately untouched. */:root{--type-body-size:18px}/* ITEM 4 — the boxed outline around button labels. CAUSE:the v1.1 `.tro-btn-secondary a.fl-button *` rule carried `border` into every descendant, so span.fl-button-text drew its own 1px box. FIX:border + background on the ANCHOR only;colour may still cascade to descendants (BB's global button style colours them and must be beaten). */ .tro-btn-secondary a.fl-button{background:var(--surface-card) !important;border:1px solid var(--azure-200) !important}.tro-btn-secondary a.fl-button, .tro-btn-secondary a.fl-button *{color:var(--action-primary) !important}.tro-btn-secondary a.fl-button *{border:0 !important;background:none !important}.tro-btn-secondary a.fl-button:hover{background:var(--azure-50) !important}.tro-btn-secondary a.fl-button:hover, .tro-btn-secondary a.fl-button:hover *{color:var(--action-primary) !important}.tro-btn-ondark a.fl-button{background:var(--surface-card) !important;border:0 !important}.tro-btn-ondark a.fl-button, .tro-btn-ondark a.fl-button *{color:var(--azure-800) !important}.tro-btn-ondark a.fl-button *{border:0 !important;background:none !important}.fl-button .fl-button-text, .fl-button span, .wp-block-button__link span, .uabb-button .uabb-button-text{border:0 !important;box-shadow:none !important}/* ITEM 4 (partner) — designed focus ring. The DS mandates a visible ring on every focusable element and forbids removing it;run 1 punch-listed its absence. Never suppressed, only styled. */ .fl-builder-content a:focus-visible, .fl-builder-content button:focus-visible, .fl-button:focus-visible, .wp-block-button__link:focus-visible, .ast-builder-menu a:focus-visible, .main-header-menu a:focus-visible{outline:2px solid var(--azure-400) !important;outline-offset:2px !important;border-radius:var(--radius-sm)}.tro-saints-card{max-width:var(--container-max);margin-left:auto;margin-right:auto}.tro-saints .uabb-testimonial-author-description, .tro-saints .uabb-testimonial-author-description p{max-width:34em;font-size:clamp(24px, 3vw, 36px);line-height:1.5}.tro-saints .uabb-testimonial-author-name{font-size:var(--type-body-size)}.tro-saints .uabb-testimonial-author-designation{font-size:var(--type-small-size);color:var(--text-muted)}.tro-blog .pp-content-post-grid{grid-template-columns:repeat(3, 1fr) !important}@media (max-width:992px){.tro-blog .pp-content-post-grid{grid-template-columns:repeat(2, 1fr) !important}}@media (max-width:768px){.tro-blog .pp-content-post-grid{grid-template-columns:1fr !important}}.tro-foot-logo .fl-photo, .tro-foot-logo .fl-photo-content{text-align:left !important;display:block}.tro-foot-logo .fl-photo-content{display:inline-block}/* ITEM 9 — mystery button utilities. DEEP values only:gold never draws vivid on a light surface (LAW 3), and all four then share one weight. */ .tro-btn-joyful a.fl-button, .tro-btn-joyful a.fl-button *{background:var(--joyful-deep) !important;color:var(--text-on-action) !important;border:0 !important}.tro-btn-sorrowful a.fl-button, .tro-btn-sorrowful a.fl-button *{background:var(--sorrowful-deep) !important;color:var(--text-on-action) !important;border:0 !important}.tro-btn-glorious a.fl-button, .tro-btn-glorious a.fl-button *{background:var(--glorious-deep) !important;color:var(--text-on-action) !important;border:0 !important}.tro-btn-luminous a.fl-button, .tro-btn-luminous a.fl-button *{background:var(--luminous-deep) !important;color:var(--text-on-action) !important;border:0 !important}.tro-btn-joyful a.fl-button *, .tro-btn-sorrowful a.fl-button *, .tro-btn-glorious a.fl-button *, .tro-btn-luminous a.fl-button *{background:none !important}.tro-btn-joyful a.fl-button:hover, .tro-btn-sorrowful a.fl-button:hover, .tro-btn-glorious a.fl-button:hover, .tro-btn-luminous a.fl-button:hover{filter:brightness(.92)}.tro-saints-card{width:100%}/* item 6b:the module emits its own node-scoped description typography (0,3,0), which outranks a class selector - raise specificity and mark the sizing. */ .fl-builder-content .tro-saints .uabb-testimonial-author-description, .fl-builder-content .tro-saints .uabb-testimonial-author-description p{font-size:clamp(24px,3vw,36px) !important;line-height:1.5 !important;max-width:34em !important;margin-left:auto !important;margin-right:auto !important}.fl-builder-content .tro-saints .uabb-testimonial-author-name{font-size:var(--type-body-size) !important}.ast-primary-header-bar .site-primary-header-wrap{padding-top:0;padding-bottom:0}/* item 1 (cont.):Astra pads .ast-primary-header-bar 18px/18px on top of the 76px min-height wrap, giving 113px. Zero the block padding;the bar height is the wrap's min-height. Inline padding untouched. */ .ast-primary-header-bar{padding-top:0 !important;padding-bottom:0 !important}/* ITEM A:the mystery utilities must cover BOTH implementations found by the census - Beaver Builder button-groups AND Gutenberg core/button (reusable block 622, embedded on pages 24/182/600). Deep values only (LAW 3). */ .tro-btn-joyful a.fl-button, .tro-btn-joyful a.fl-button *, .tro-btn-joyful .wp-block-button__link, .tro-btn-joyful.wp-block-button .wp-block-button__link{background-color:var(--joyful-deep) !important;color:var(--text-on-action) !important;border-color:transparent !important}.tro-btn-joyful a.fl-button:hover, .tro-btn-joyful .wp-block-button__link:hover{filter:brightness(.92);background-color:var(--joyful-deep) !important}.tro-btn-sorrowful a.fl-button, .tro-btn-sorrowful a.fl-button *, .tro-btn-sorrowful .wp-block-button__link, .tro-btn-sorrowful.wp-block-button .wp-block-button__link{background-color:var(--sorrowful-deep) !important;color:var(--text-on-action) !important;border-color:transparent !important}.tro-btn-sorrowful a.fl-button:hover, .tro-btn-sorrowful .wp-block-button__link:hover{filter:brightness(.92);background-color:var(--sorrowful-deep) !important}.tro-btn-glorious a.fl-button, .tro-btn-glorious a.fl-button *, .tro-btn-glorious .wp-block-button__link, .tro-btn-glorious.wp-block-button .wp-block-button__link{background-color:var(--glorious-deep) !important;color:var(--text-on-action) !important;border-color:transparent !important}.tro-btn-glorious a.fl-button:hover, .tro-btn-glorious .wp-block-button__link:hover{filter:brightness(.92);background-color:var(--glorious-deep) !important}.tro-btn-luminous a.fl-button, .tro-btn-luminous a.fl-button *, .tro-btn-luminous .wp-block-button__link, .tro-btn-luminous.wp-block-button .wp-block-button__link{background-color:var(--luminous-deep) !important;color:var(--text-on-action) !important;border-color:transparent !important}.tro-btn-luminous a.fl-button:hover, .tro-btn-luminous .wp-block-button__link:hover{filter:brightness(.92);background-color:var(--luminous-deep) !important}.tro-hero11.tro-pad-hero > .fl-row-content-wrap{padding-top:clamp(90px,13.5vw,160px);padding-bottom:clamp(110px,15vw,176px)}.tro-hero11-col{max-width:60%}.tro-hero11 .fl-row-content-wrap::before{background:linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 58%, transparent 92%) !important}@media (max-width:768px){.tro-hero11-col{max-width:100%}.tro-hero11 .fl-row-content-wrap::before{background:var(--overlay-scrim) !important}}/* ITEM B (contrast):widening the text column to 60% pushed the 12px attribution eyebrow over brighter passages of the Magnificat - measured 2.75:1, below the 4.5 floor. Fix by STACKING the scrim token twice across the text zone (1-0.45^2 = 0.80 effective) and letting it fall to a single pass, then clear, toward the art. No new colour value is introduced - Law 4 holds. */ .tro-hero11 .fl-row-content-wrap::before{background:linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 46%, transparent 72%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 58%, transparent 92%) !important}@media (max-width:768px){.tro-hero11 .fl-row-content-wrap::before{background:var(--overlay-scrim), var(--overlay-scrim) !important}}/* ITEM B (contrast, final):three stacked passes of the scrim token across the text zone (1-0.45^3 = 0.909 effective), falling to a single pass and then clear before the art. NOTE:'background:<color>, <color>' is INVALID CSS - only the final background layer may be a colour - so each pass is expressed as a linear-gradient of the token. Still no new colour value (Law 4). */ .tro-hero11 .fl-row-content-wrap::before{background:linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 40%, transparent 62%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 46%, transparent 72%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 58%, transparent 92%) !important}@media (max-width:768px){.tro-hero11 .fl-row-content-wrap::before{background:linear-gradient(var(--overlay-scrim), var(--overlay-scrim)), linear-gradient(var(--overlay-scrim), var(--overlay-scrim)), linear-gradient(var(--overlay-scrim), var(--overlay-scrim)) !important}}/* ---- ITEM D-1:page/post title banner - second scrim pass ---- The banner background is the post's FEATURED IMAGE wherever one exists (header 329 has page-post-featured:enabled);header 329's own bg-image only shows on the 5 posts without a thumbnail. A single scrim pass left 16 of 24 banners between 3.1 and 3.5 against the 3.0 AA-large floor -- too thin for an image an editor picks per post. One extra token pass raises every banner at once, whatever image is chosen. ---- */ .ast-title-bar-wrap{position:relative}/* Astra ALREADY emits .ast-title-bar-wrap::after with background-color:var(--overlay-scrim) (punch-1 item 3). Targeting::after again only REPLACES that pass -- measured:zero contrast change across 24 banners. The second pass has to land on a free pseudo-element. */ .ast-title-bar-wrap::before{content:"";position:absolute;inset:0;pointer-events:none;background:var(--overlay-scrim)}.ast-title-bar-wrap > *{position:relative;z-index:1}/* ================= PUNCH-3 ITEM 1:hero scrim clears Our Lady's face ================= Measured on the shipped art (01-botticelli-madonna-del-magnificat, SQUARE):at 1440x600 'cover' renders the image exactly 1440 wide, so there is NO horizontal overflow and background-position-X had NO EFFECT. Her face sat at x 730-960 while the punch-2 scrim's third pass was solid to 58% (835px) - which is why the gradient covered it. Two changes, neither of which lightens the text zone:1. A 15% zoom with the image left-aligned creates 216px of horizontal overflow and shifts the composition right, moving her face clear. 2. The scrim gains a 4th pass but LOSES reach:deeper where the type is (1-0.45^4 = 0.959 effective), fully clear by 58% instead of 92%. Depth where the text is;reach that stops before the face. ---- */ @media (min-width:769px){.tro-hero11 > .fl-row-content-wrap{background-size:115% auto !important;background-position:0% 14% !important}.tro-hero11 .fl-row-content-wrap::before{background:linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 30%, transparent 46%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 34%, transparent 50%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 38%, transparent 54%), linear-gradient(90deg, var(--overlay-scrim) 0%, var(--overlay-scrim) 42%, transparent 58%) !important}}/* ============ PUNCH-3 ITEM 2:STANDING OWNER OVERRIDE (Craig, 2026-07-26) ============ Glorious buttons use VIVID gold --glorious (#F4B63C) with a Marian-ink label (--azure-900, #1F3A64). This DELIBERATELY SUPERSEDES LAW 3 ('gold never vivid on light') for this component only. It is an owner ruling, not a drift. DO NOT 'correct' this back to --glorious-deep in a future run. Ink on vivid gold measures ~5.5:1;white on vivid gold would be ~2.0:1, which is why the label flips to ink rather than staying white. Must beat BOTH earlier layers and BB's global rule that colours button descendants white - hence the descendant (*) selectors, same shape as the punch-1 descendant-border fix. ---- */ .tro-btn-glorious a.fl-button, .tro-btn-glorious a.fl-button *, .tro-btn-glorious .wp-block-button__link, .tro-btn-glorious.wp-block-button .wp-block-button__link, .tro-btn-glorious .wp-block-button__link *, .tro-btn-glorious.wp-block-button .wp-block-button__link *{background-color:var(--glorious) !important;color:var(--azure-900) !important;border-color:transparent !important}.tro-btn-glorious a.fl-button *, .tro-btn-glorious .wp-block-button__link *{background:none !important}.tro-btn-glorious a.fl-button:hover, .tro-btn-glorious .wp-block-button__link:hover{filter:brightness(.94);background-color:var(--glorious) !important;color:var(--azure-900) !important}/* ==== PUNCH-3 ITEMS 3+4:the standardized 'Pray the Rosary Today' block ==== The standard is the /why-pray-the-rosary/ (reusable block 622) layout and styling, with the blog posts' 'Listen on Spotify' fifth button. Pages carry it by REFERENCE to block 622 - one source of truth. The Beaver Themer part (687) cannot reference a Gutenberg reusable block natively, so it mirrors the same design in BB and takes this class to match 622's separator + rhythm. */ .tro-pray-block > .fl-row-content-wrap{border-top:1px solid var(--border-default);background:transparent !important;padding-top:48px !important;padding-bottom:56px !important}.tro-pray-block .fl-heading{text-align:center}.tro-pray-block .fl-button-group-buttons{margin-top:8px}/* ---- PUNCH-6:footer credit link hover ---- The credit line lives in .tro-credit, not .tro-foot-links, so it never picked up the footer's white hover. It had a base colour but NO:hover rule, so the owner-added mailto fell through to the GLOBAL light-surface link hover (--text-link-hover #244E9E) - dark navy on the ink footer, near invisible. Match .tro-foot-links exactly:--dark-link at rest, --dark-heading on hover. */ .fl-builder-content .tro-credit a:hover, .fl-builder-content .tro-credit a:focus-visible{color:var(--dark-heading)}/* ==== PUNCH 6 - day-of-week line under each mystery button ==== Canon:Design System/guidelines/mystery-index.html + ui_kits/website/data.js - the days sit under the set name at 14px in --text-muted with a 4px gap. docs/home-v1.1/change-log.md carries the standing ruling that Glorious reads "Sunday & Wednesday" everywhere ("liturgical order is not a design variable"), which is why it is not "Wednesday & Sunday" here. The site own [spm_todays_mysteries] map (snippet 12) assigns the same days to the same sets. MECHANISM. The line must sit under the button, OUTSIDE the anchor, and stay with its own button when the row wraps - i.e. inside the per-button flex item. Neither platform can carry real DOM there:Gutenberg core/buttons accepts only core/button children, and BB button-group has no sub-label field (it builds each item from the module frontend.php). Generated content on the wrapper is the one mechanism BOTH twins express identically, so 622 and 687 cannot drift. 622 (Gutenberg) keys off the per-set classes already on each .wp-block-button;the Spotify button carries none, so it is excluded structurally. 687 (Themer) keys off .tro-pray-sets, set on the mystery button-group ONLY, so the Spotify group in the same column is never matched. */ /* WP core emits .wp-block-buttons > .wp-block-button{display:inline-block}at (0,2,0), which outranks a bare .tro-btn-<set> (0,1,0) - so on the Gutenberg twin the column silently fell back to normal flow while the BB twin used the authored flex column. Same rendered result today, but two different layout mechanisms is precisely the 622/687 drift the twin note exists to prevent. Qualify the Gutenberg selectors to (0,3,0) so both twins are genuinely flex columns. align-items is CENTER, not stretch:a day line longer than its button must never be able to resize the button on either twin. */ .wp-block-buttons > .wp-block-button.tro-btn-joyful, .wp-block-buttons > .wp-block-button.tro-btn-sorrowful, .wp-block-buttons > .wp-block-button.tro-btn-glorious, .wp-block-buttons > .wp-block-button.tro-btn-luminous, .tro-pray-sets .fl-button-group-button{display:flex;flex-direction:column;align-items:center;align-self:flex-start}.tro-btn-joyful::after, .tro-btn-sorrowful::after, .tro-btn-glorious::after, .tro-btn-luminous::after, .tro-pray-sets .fl-button-group-button::after{display:block;margin-top:4px;font-family:var(--font-sans);font-size:14px;font-weight:400;font-style:normal;line-height:1.4;letter-spacing:normal;text-transform:none;text-decoration:none;text-align:center;color:var(--text-muted)}.tro-btn-joyful::after, .tro-pray-sets .fl-button-group-button:nth-child(1)::after{content:"Monday & Saturday"}.tro-btn-sorrowful::after, .tro-pray-sets .fl-button-group-button:nth-child(2)::after{content:"Tuesday & Friday"}.tro-btn-glorious::after, .tro-pray-sets .fl-button-group-button:nth-child(3)::after{content:"Sunday & Wednesday"}.tro-btn-luminous::after, .tro-pray-sets .fl-button-group-button:nth-child(4)::after{content:"Thursday"}.wp-block-file{margin:2rem auto 3rem;padding:1.5rem;max-width:100%;background:var(--surface-card, #FFFFFF);border:2px solid var(--border-default, #E3EAF3);border-radius:8px;box-shadow:0 4px 6px var(--shadow-color, rgba(31,58,100,.10));display:flex;flex-direction:column;align-items:center;gap:1rem;position:static !important}.wp-block-file__embed, .wp-block-file iframe.wp-block-file__embed{width:100% !important;min-height:70vh !important;height:auto !important;position:static !important;display:block !important;border-radius:4px}.wp-block-file > a:first-of-type{text-align:center;font-weight:600;color:var(--text-link, #2A5FC4);text-decoration:underline}.wp-block-file > a:first-of-type:hover{color:var(--text-link-hover, #244E9E)}.wp-block-file__button{align-self:center;background:var(--action-primary, #3470D6);color:var(--text-on-action, #FFFFFF);padding:0.6rem 1.25rem;border-radius:4px;font-weight:600;text-decoration:none;transition:background .2s ease-in-out}.wp-block-file__button:hover{background:var(--action-hover, #2A5FC4);color:var(--text-on-action, #FFFFFF)}.wp-block-file__button:active{background:var(--action-active, #244E9E)}.wp-block-file__button:focus-visible{outline:2px solid var(--focus-ring, #3470D6);outline-offset:2px}