/* ==========================================================================
   The Yahweh Mission — main stylesheet
   One source of truth for colour, type, spacing. Every page uses these tokens.
   Home page is the master: H1 60 / H2 32 / body 16 (lead 18).
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root {
  /* brand */
  --navy: #041935;
  --navy-deep: #030f20;
  --yellow: #f6e304;
  --yellow-hover: #ffee33;
  --teal: #2ec4c0;
  --teal-soft: #7ccac6;
  --lavender: #cdcffb;

  /* semantic (light) */
  --bg: #ffffff;
  --bg-soft: #f3f3f3;
  --surface: #ffffff;
  --heading: #041935;
  --text: #4e5c71;
  --line: rgba(4, 25, 53, .12);
  --on-navy: #ffffff;
  --on-navy-muted: rgba(255, 255, 255, .78);
  --panel: var(--lavender);
  --shadow: 0 10px 30px rgba(4, 25, 53, .10);

  /* type */
  --font-body: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-head: "Plus Jakarta Sans", "Public Sans", system-ui, sans-serif;
  --fs-h1: clamp(2.25rem, 1.4rem + 3.6vw, 3.75rem);   /* 60px desktop */
  --fs-display: clamp(1.75rem, 1.1rem + 2.6vw, 2.8125rem); /* 45px band heading */
  --fs-h2: clamp(1.625rem, 1.2rem + 1.5vw, 2rem);     /* 32px */
  --fs-h3: 1.375rem;                                  /* 22px */
  --fs-h4: 1.125rem;                                  /* 18px */
  --fs-lead: 1.125rem;                                /* 18px */
  --fs-body: 1rem;                                    /* 16px */
  --fs-small: .875rem;
  --fs-label: .75rem;                                 /* 12px */

  /* layout */
  --container: 1240px;
  --gutter: clamp(1rem, 4vw, 2rem);
  --section-y: clamp(3.5rem, 7vw, 6.5rem);
  --radius: 10px;
  --radius-lg: 16px;
  --header-h: 76px;
  --util-h: 34px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

:root[data-theme="dark"] {
  --bg: #071628;
  --bg-soft: #0b2140;
  --surface: #0f2a4d;
  --heading: #ffffff;
  --text: #b8c4d8;
  --line: rgba(255, 255, 255, .14);
  --panel: #12315c;
  --shadow: 0 10px 30px rgba(0, 0, 0, .45);
  --navy: #030f20;          /* sections that are "navy" go deeper in dark */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #071628; --bg-soft: #0b2140; --surface: #0f2a4d; --heading: #fff;
    --text: #b8c4d8; --line: rgba(255,255,255,.14); --panel: #12315c;
    --shadow: 0 10px 30px rgba(0,0,0,.45); --navy: #030f20;
  }
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--font-body); font-size: var(--fs-body); line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; border-radius: 4px; }
.skip-link { position: absolute; left: -9999px; top: 0; background: var(--yellow); color: var(--navy); padding: .75rem 1rem; z-index: 999; font-weight: 600; }
.skip-link:focus { left: 1rem; top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

h1, h2, h3, h4 { font-family: var(--font-head); font-weight: 600; color: var(--heading); margin: 0 0 .6em; letter-spacing: -.01em; }
h1 { font-size: var(--fs-h1); line-height: 1; }
h2 { font-size: var(--fs-h2); line-height: 1.1; }
h3 { font-size: var(--fs-h3); line-height: 1.25; }
h4 { font-size: var(--fs-h4); line-height: 1.3; }
p { margin: 0 0 1.1em; }
.lead { font-size: var(--fs-lead); line-height: 1.5; }
.eyebrow { display: inline-block; font-size: var(--fs-label); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--heading); margin-bottom: 1rem; }

.container { width: min(100% - var(--gutter) * 2, var(--container)); margin-inline: auto; }
.section { padding-block: var(--section-y); }
.section--soft { background: var(--bg-soft); }
.section--navy { background: var(--navy); color: var(--on-navy-muted); }
.section--navy h2, .section--navy h3 { color: var(--on-navy); }

/* ---------- 3. Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: .6rem;
  background: var(--yellow); color: #041935; border: 0; border-radius: 100px;
  padding: 15px 20px; font-size: 1rem; font-weight: 500; line-height: 1;
  transition: transform .25s var(--ease), background .2s, box-shadow .25s;
}
.btn:hover { background: var(--yellow-hover); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(246, 227, 4, .35); }
.btn__icon { width: 22px; height: 22px; border-radius: 50%; background: #041935; color: #fff; display: grid; place-items: center; transition: transform .25s var(--ease); }
.btn__icon svg { width: 11px; height: 11px; }
.btn:hover .btn__icon { transform: rotate(45deg); }
.btn--teal { background: var(--teal); color: #fff; }
.btn--teal:hover { background: #3dd5d1; box-shadow: 0 8px 20px rgba(46, 196, 192, .35); }
.btn--ghost { background: transparent; color: var(--heading); box-shadow: inset 0 0 0 2px var(--line); }
.btn--ghost:hover { background: var(--bg-soft); box-shadow: inset 0 0 0 2px var(--heading); }

/* ---------- 4. Header (clone of the live .tym-header) ---------- */
:root {
  --font-chrome: "DM Sans", Arial, Helvetica, sans-serif;   /* header + footer use DM Sans on the live site */
  --h-top: #1a2744; --h-bg: #ffffff; --h-text: #1a2744; --h-line: #e8e0d0;
  --mega-bg: #f5f5f5; --mega-item: #333333; --mega-sub: #888888; --mega-hover: #ffffff; --mega-div: #e0e0e0;
  --f-hero: #071628; --f-cols: #3d4757; --f-bottom: #0f1c36;
}
:root[data-theme="dark"] {
  --h-top: #030f20; --h-bg: #0a1b33; --h-text: #ffffff; --h-line: rgba(255,255,255,.12);
  --mega-bg: #0f2a4d; --mega-item: #d6deec; --mega-sub: #9fb0c9; --mega-hover: #16386a; --mega-div: rgba(255,255,255,.12);
  --f-hero: #030f20; --f-cols: #14213a; --f-bottom: #020a17;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --h-top: #030f20; --h-bg: #0a1b33; --h-text: #ffffff; --h-line: rgba(255,255,255,.12);
    --mega-bg: #0f2a4d; --mega-item: #d6deec; --mega-sub: #9fb0c9; --mega-hover: #16386a; --mega-div: rgba(255,255,255,.12);
    --f-hero: #030f20; --f-cols: #14213a; --f-bottom: #020a17;
  }
}

.tym-header { font-family: var(--font-chrome); width: 100%; z-index: 9999; position: sticky; top: 0; }
.tym-topbar { background: var(--h-top); display: flex; justify-content: flex-end; align-items: center; padding: 5px 28px; height: 44px; overflow: hidden; transition: height .3s, padding .3s; }
.tym-topbar.hidden { height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
.tym-top-right { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.tbtn { background: var(--yellow); color: #1a2744; font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 7px 16px; border-radius: 100px; white-space: nowrap; transition: background .2s; }
.tbtn:hover { background: var(--yellow-hover); }
.tym-top-social { display: flex; gap: 6px; margin-left: 8px; padding-left: 10px; border-left: 1px solid rgba(180,180,180,.3); }
.tym-top-social a { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: .2s; border: 1.5px solid rgba(160,160,160,.5); color: rgba(160,160,160,.8); }
.tym-top-social a:hover, .tym-top-social a:focus { background: rgba(180,180,180,.8); color: #1a2744; border-color: rgba(180,180,180,.8); }
.tym-top-social svg { width: 11px; height: 11px; display: block; }

.tym-navwrap { background: var(--h-bg); border-bottom: 2px solid var(--h-line); position: relative; overflow: visible; }
.tym-nav-row { display: flex; align-items: center; padding: 0 24px 0 265px; min-height: 64px; position: relative; }
.tym-logo { position: absolute; left: 20px; top: 50%; transform: translateY(calc(-50% + 18px)); z-index: 10000; }
.tym-logo a { display: block; line-height: 0; }
.tym-logo img { width: 155px; height: 155px; border-radius: 50%; object-fit: contain; background: #fff; border: 5px solid #fff; box-shadow: 0 6px 24px rgba(0,0,0,.2); display: block; transition: width .3s, height .3s, box-shadow .3s; max-width: none; }
.tym-logo.scrolled img { width: 110px; height: 110px; box-shadow: 0 3px 14px rgba(0,0,0,.16); }

.tym-nav-menus { display: flex; align-items: center; flex: 0 0 auto; margin: 0 0 0 auto; }
.tym-nav-item { position: relative; }
.tym-nav-item > a { display: flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 700; font-family: var(--font-chrome); text-transform: uppercase; letter-spacing: .45px; padding: 20px 8px; white-space: nowrap; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; color: var(--h-text); }
.tym-nav-item > a:hover, .tym-nav-item > a:focus-visible, .tym-nav-item:hover > a, .tym-nav-item:focus-within > a { color: var(--teal); border-bottom-color: var(--teal); outline: none; }
.tym-caret { width: 8px; height: 8px; color: #bbb; transition: transform .2s; flex-shrink: 0; display: inline-block; }
.tym-nav-item:hover > a .tym-caret, .tym-nav-item:focus-within > a .tym-caret { transform: rotate(180deg); color: var(--teal); }

.tym-tools { display: flex; align-items: center; gap: 0; margin-left: 8px; }
.tym-tool { position: relative; width: 34px; height: 34px; display: grid; place-items: center; background: none; border: 0; border-radius: 50%; color: var(--h-text); transition: color .2s, background .2s; }
.tym-tool:hover { color: var(--teal); background: rgba(46,196,192,.1); }
.theme-toggle .sun { display: none; } .theme-toggle .moon, .theme-toggle .sun { line-height: 0; }
:root[data-theme="dark"] .theme-toggle .sun { display: block; }
:root[data-theme="dark"] .theme-toggle .moon { display: none; }
.cart-count { position: absolute; top: 1px; right: -1px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--yellow); color: #1a2744; font-size: 10.5px; font-weight: 700; display: grid; place-items: center; transform: scale(0); transition: transform .25s var(--ease); }
.cart-count.has-items { transform: scale(1); }
.tym-nav-donate { background: var(--teal); padding: 9px 18px; font-size: 12.5px; font-weight: 700; border-radius: 3px; white-space: nowrap; margin-left: 6px; font-family: var(--font-chrome); text-transform: uppercase; letter-spacing: .8px; transition: opacity .2s; flex-shrink: 0; display: inline-block; color: #fff; }
.tym-nav-donate:hover, .tym-nav-donate:focus-visible { opacity: .88; color: #fff; }

.tym-mega { display: none; position: absolute; top: calc(100% + 2px); left: 0; background: var(--mega-bg); border-top: 3px solid var(--h-top); box-shadow: 0 16px 48px rgba(0,0,0,.13); z-index: 9999; padding: 20px 22px 18px; gap: 8px; min-width: 250px; }
.tym-mega.ar { left: auto; right: 0; }
.tym-nav-item:hover .tym-mega, .tym-nav-item:focus-within .tym-mega { display: flex; }
.tym-mega-col { flex: 1 1 0%; min-width: 210px; }
.tym-mega-label { font-size: 10.5px; font-weight: 600; color: var(--h-text); letter-spacing: 1.2px; text-transform: uppercase; padding: 0 8px 8px; margin-bottom: 8px; border-bottom: 1px solid var(--mega-div); display: block; }
.tym-mega-item { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 6px; transition: background .15s; margin-bottom: 2px; color: var(--mega-item); }
.tym-mega-item:hover, .tym-mega-item:focus-visible { outline: none; background: var(--mega-hover); color: var(--h-text); }
.tym-mega-item:hover .tym-mi, .tym-mega-item:focus-visible .tym-mi { background: var(--teal); }
.tym-mi { width: 28px; height: 28px; min-width: 28px; border-radius: 5px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s; background: var(--h-top); color: rgba(255,255,255,.85); }
.tym-mi svg { width: 13px; height: 13px; }
.tym-mt { line-height: 1.25; }
.tym-mt strong { display: block; font-weight: 600; font-size: 13px; white-space: nowrap; }
.tym-mt span { font-size: 11px; color: var(--mega-sub); font-weight: 400; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
.tym-mdiv { width: 1px; background: var(--mega-div); align-self: stretch; margin: 0 4px; }
.tym-tline { height: 3px; background: linear-gradient(90deg, transparent, var(--teal) 30%, var(--teal) 70%, transparent); }
#tym-spacer { height: 44px; transition: height .3s; }

.tym-hbg { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 40px; height: 40px; border-radius: 4px; background: transparent; border: 0; padding: 4px; margin-left: auto; }
.tym-hbg span { display: block; width: 22px; height: 2.5px; background: var(--h-text); border-radius: 2px; transition: .3s; }
.tym-hbg.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.tym-hbg.open span:nth-child(2) { opacity: 0; width: 0; }
.tym-hbg.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

.tym-mob { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--h-bg); box-shadow: 0 16px 40px rgba(0,0,0,.15); z-index: 9998; max-height: 80vh; overflow-y: auto; border-top: 3px solid var(--teal); }
.tym-mob.open { display: block; }
.tym-mob-top { display: flex; gap: 8px; padding: 14px 18px 12px; justify-content: center; flex-wrap: wrap; background: var(--h-top); }
.tym-mob-top .tbtn { font-size: 10.5px; padding: 7px 14px; }
.tym-mob-don { padding: 7px 16px; font-size: 11px; font-weight: 700; background: var(--teal); border-radius: 3px; text-transform: uppercase; letter-spacing: .8px; display: inline-block; color: #fff; }
.tym-mob-item { border-bottom: 1px solid var(--h-line); }
.tym-mob-item > a { display: flex; justify-content: space-between; align-items: center; padding: 13px 18px; color: var(--h-text); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; transition: background .15s; }
.tym-mob-item > a:hover { background: rgba(127,127,127,.08); }
.tym-mob-arr { width: 18px; height: 18px; flex-shrink: 0; color: #999; transition: transform .3s; }
.tym-mob-item.open .tym-mob-arr { transform: rotate(-90deg) !important; }
.tym-mob-sub { display: none; background: var(--mega-bg); border-top: 1px solid var(--h-line); }
.tym-mob-item.open .tym-mob-sub { display: block; }
.tym-mob-sub a { display: block; padding: 10px 22px; color: var(--mega-item); font-size: 13px; font-weight: 500; transition: .15s; border-left: 3px solid transparent; }
.tym-mob-sub a:hover { background: var(--mega-hover); border-left-color: var(--teal); color: var(--h-text); padding-left: 26px; }
.tym-mob-soc { display: flex; justify-content: center; gap: 10px; padding: 14px 18px 18px; border-top: 1px solid var(--h-line); }
.tym-mob-soc a { width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid #c0c0c0; display: flex; align-items: center; justify-content: center; color: #b0b0b0; transition: .2s; }
.tym-mob-soc a:hover { background: var(--teal); border-color: var(--teal); color: #fff; }

@media (max-width: 1400px) {
  .tym-nav-row { padding-left: 205px; padding-right: 16px; }
  .tym-nav-item > a { font-size: 12.5px; padding: 20px 6px; letter-spacing: .3px; }
  .tym-nav-donate { font-size: 11px; padding: 8px 12px; letter-spacing: .5px; }
}
@media (max-width: 1280px) { .tym-nav-item > a { font-size: 12px; padding: 20px 5px; letter-spacing: .2px; gap: 3px; } .tym-tool { width: 30px; } .tym-tools { margin-left: 4px; } }
@media (max-width: 1140px) {
  .tym-topbar { padding: 5px 18px; }
  .tym-nav-row { min-height: 60px; padding: 0 14px 0 100px; }
  .tym-nav-menus, .tym-nav-donate { display: none; }
  .tym-logo { left: 14px; }
  .tym-logo img { width: 80px; height: 80px; border-width: 3px; }
  .tym-tools { margin-left: auto; }
  .tym-hbg { display: flex; margin-left: 6px; }
  #tym-spacer { height: 16px; }
}
@media (max-width: 600px) {
  .tym-topbar { display: none; }
  .tym-logo img { width: 62px; height: 62px; }
  .tym-nav-row { min-height: 54px; padding: 0 12px 0 84px; }
  #tym-spacer { height: 0; }
}

/* ---------- 5. Search overlay + cart drawer ---------- */
.overlay { position: fixed; inset: 0; background: rgba(3,15,32,.6); backdrop-filter: blur(3px); z-index: 10001; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.overlay.is-open { opacity: 1; visibility: visible; }
.search-panel { position: fixed; top: 0; left: 0; right: 0; z-index: 10010; background: var(--bg); padding: 2rem 0 2.5rem; transform: translateY(-101%); transition: transform .35s var(--ease); box-shadow: var(--shadow); }
.search-panel.is-open { transform: none; }
.search-form { display: flex; gap: .75rem; align-items: center; border-bottom: 2px solid var(--heading); padding-bottom: .5rem; color: var(--heading); }
.search-form input { flex: 1; border: 0; background: none; font: 600 clamp(1.25rem, 3vw, 2rem)/1.2 var(--font-head); color: var(--heading); outline: none; min-width: 0; }
.search-form input::placeholder { color: var(--text); opacity: .6; }
.search-hints { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem; font-size: var(--fs-small); align-items: center; }
.search-hints a { padding: .35rem .8rem; border-radius: 100px; background: var(--bg-soft); color: var(--heading); font-weight: 500; }
.search-hints a:hover { background: var(--yellow); color: #041935; }
.icon-btn { position: relative; width: 40px; height: 40px; display: grid; place-items: center; background: none; border: 0; border-radius: 50%; color: var(--heading); transition: background .2s, color .2s; }
.icon-btn:hover { background: var(--bg-soft); color: var(--teal); }

.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100%); z-index: 10010; background: var(--bg); display: flex; flex-direction: column; transform: translateX(101%); transition: transform .35s var(--ease); box-shadow: var(--shadow); }
.drawer.is-open { transform: none; }
.drawer__head { display: flex; justify-content: space-between; align-items: center; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--line); }
.drawer__head h2 { margin: 0; font-size: 1.25rem; }
.drawer__body { flex: 1; overflow-y: auto; padding: 1rem 1.5rem; }
.drawer__foot { padding: 1.25rem 1.5rem; border-top: 1px solid var(--line); background: var(--bg-soft); }
.cart-empty { text-align: center; padding: 3rem 1rem; }
.cart-empty svg { width: 56px; height: 56px; margin: 0 auto 1rem; color: var(--teal); }
.cart-line { display: grid; grid-template-columns: 64px 1fr auto; gap: .9rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.cart-line img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; }
.cart-line strong { font-family: var(--font-head); color: var(--heading); font-size: .9375rem; display: block; line-height: 1.3; }
.cart-line button { background: none; border: 0; color: var(--text); font-size: var(--fs-small); text-decoration: underline; padding: 0; }
.cart-total { display: flex; justify-content: space-between; font: 600 1.125rem var(--font-head); color: var(--heading); margin-bottom: 1rem; }

/* ---------- 6. Hero ---------- */
.hero { position: relative; background: var(--bg-soft); overflow: hidden; isolation: isolate; }
.hero::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 30%; background: var(--panel); z-index: -1; }
.hero__grid { display: grid; grid-template-columns: 1.05fr 1fr .62fr; gap: clamp(1rem, 3vw, 3rem); align-items: stretch; padding-block: clamp(2.5rem, 5vw, 4.5rem); min-height: 620px; }
.hero__copy { display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; padding-top: .5rem; }
.hero__kicker { font-size: var(--fs-small); color: var(--text); margin: 0 0 1.25rem; }
.hero__copy h1 { max-width: 15ch; margin-bottom: 0; }
.hero__copy .lead { max-width: 46ch; margin: 0 0 1.75rem; }
.hero__media { position: relative; border-radius: var(--radius); overflow: visible; min-height: 420px; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius); }
.hero__media::after { content: ""; position: absolute; inset: 0; border-radius: var(--radius); background: linear-gradient(180deg, rgba(4,25,53,0) 45%, rgba(4,25,53,.35)); pointer-events: none; }
.tag { position: absolute; z-index: 2; background: var(--navy); color: #fff; font: 600 1rem/1.25 var(--font-head); padding: 10px; border-radius: var(--radius); max-width: 150px; }
.tag--a { left: -46px; top: 52%; }
.tag--b { right: -46px; bottom: 12%; }
.hero__side { display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; padding-top: .5rem; }
.quote { font-size: var(--fs-small); line-height: 1.55; color: var(--heading); }
.quote cite { display: block; font-style: normal; margin-top: 1rem; }
.quote cite b { display: block; font-weight: 600; font-size: var(--fs-small); }
.quote cite span { font-size: var(--fs-label); opacity: .8; }
.hero__side .btn { align-self: flex-start; }

@media (max-width: 1024px) {
  .hero::after { display: none; }
  .hero__grid { grid-template-columns: 1fr 1fr; }
  .hero__side { grid-column: 1 / -1; flex-direction: row; align-items: center; background: var(--panel); border-radius: var(--radius); padding: 1.25rem 1.5rem; }
  .tag--a { left: -16px; } .tag--b { right: -16px; }
}
@media (max-width: 720px) {
  .hero__grid { grid-template-columns: 1fr; min-height: 0; }
  .hero__copy h1 { max-width: none; }
  .hero__media { min-height: 320px; order: 2; }
  .hero__side { order: 3; flex-direction: column; align-items: flex-start; }
  .tag--a { left: 12px; top: 14px; } .tag--b { right: 12px; bottom: 14px; }
}

/* ---------- 7. Band ---------- */
.band { background: var(--navy); padding-block: clamp(2.5rem, 5vw, 4rem); text-align: center; }
.band h2 { color: var(--teal-soft); font-size: var(--fs-display); margin: 0; line-height: 1.1; }

/* ---------- 8. About ---------- */
.about__head { display: grid; grid-template-columns: 1fr 3fr; gap: 2rem; margin-bottom: 3rem; }
.about__head h2 { max-width: 26ch; }
.about__head p { max-width: 62ch; }
.duo { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1.25rem; }
.duo__photo { border-radius: var(--radius); overflow: hidden; min-height: 300px; }
.duo__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.duo__photo:hover img { transform: scale(1.05); }
.card { background: var(--surface); border-radius: var(--radius); padding: 24px; box-shadow: 0 1px 0 var(--line); }
.card h3 { font-size: 1.25rem; margin-bottom: .2rem; }
.card .sub { font-size: var(--fs-small); color: var(--text); margin-bottom: 1.5rem; }
.card p:last-child { margin: 0; font-size: var(--fs-small); }
@media (max-width: 1024px) { .duo { grid-template-columns: 1fr 1fr; } .about__head { grid-template-columns: 1fr; gap: 0; } }
@media (max-width: 560px) { .duo { grid-template-columns: 1fr; } .duo__photo { min-height: 240px; } }

/* ---------- 9. Trust ---------- */
.trust__head { text-align: center; max-width: 780px; margin: 0 auto 3rem; }
.trust__head .eyebrow { color: var(--teal-soft); }
.trust__head p { font-size: var(--fs-lead); color: var(--on-navy-muted); }
.trust__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.trust__grid .card { display: flex; flex-direction: column; gap: .75rem; }
.trust__grid .card--yellow { background: var(--yellow); }
.trust__grid .card--yellow, .trust__grid .card--yellow h3, .trust__grid .card--yellow p { color: #041935; }
.trust__grid .card h3 { color: var(--heading); font-size: 1.125rem; margin: 0; }
.trust__grid .card p { margin: 0; font-size: var(--fs-small); }
.trust__grid .card small { margin-top: auto; padding-top: 1rem; font-size: var(--fs-small); font-weight: 600; color: var(--heading); }
.card--yellow small { color: #041935 !important; }
.trust__icon { width: 36px; height: 36px; border-radius: 10px; background: var(--navy); color: var(--yellow); display: grid; place-items: center; }
.card--yellow .trust__icon { background: #041935; }
.trust__icon svg { width: 18px; height: 18px; }
.trust__photo { border-radius: var(--radius); overflow: hidden; min-height: 240px; }
.trust__photo img { width: 100%; height: 100%; object-fit: cover; }
.trust__cta { text-align: center; margin-top: 3rem; }
.trust__cta h3 { color: #fff; margin-bottom: 1.25rem; font-size: var(--fs-h3); }
@media (max-width: 900px) { .trust__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .trust__grid { grid-template-columns: 1fr; } }

/* ---------- 10. Services ---------- */
.services__head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.services__head h2 { max-width: 20ch; margin: 0; }
.services__head p { margin: 0; }
.service-list { list-style: none; margin: 0 0 2.5rem; padding: 0; border-top: 1px solid var(--line); }
.service-list li { display: grid; grid-template-columns: 90px 1fr; gap: 1rem; padding: 1.5rem 0; border-bottom: 1px solid var(--line); transition: background .25s, padding .25s var(--ease); }
.service-list li:hover { padding-left: .75rem; background: var(--bg-soft); }
.service-list .num { font-size: var(--fs-small); color: var(--text); padding-top: .25rem; }
.service-list h3 { font-size: 1.0625rem; margin-bottom: .35rem; }
.service-list p { margin: 0; font-size: var(--fs-small); max-width: 80ch; }
@media (max-width: 800px) { .services__head { grid-template-columns: 1fr; gap: 1rem; } .service-list li { grid-template-columns: 44px 1fr; } }

/* ---------- 11. CTA split ---------- */
.cta { position: relative; background: var(--bg); overflow: hidden; isolation: isolate; }
.cta::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 42%; background: var(--panel); z-index: -1; }
.cta__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-block: var(--section-y); }
.cta__copy h2 { font-size: 2.125rem; max-width: 16ch; }
.cta__copy p { max-width: 44ch; margin-bottom: 1.75rem; }
.cta__media { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.cta__media img { width: 100%; aspect-ratio: 4 / 3.1; object-fit: cover; }
@media (max-width: 860px) { .cta::after { display: none; } .cta__grid { grid-template-columns: 1fr; } .cta__media { order: -1; } }

/* ---------- 12. Footer (clone of the live #tym-footer) ---------- */
#tym-footer, #tym-footer * { box-sizing: border-box; }
#tym-footer { font-family: var(--font-chrome); }
.tf-hero { background: var(--f-hero); padding: 68px 24px 48px; text-align: center; }
.tf-hero-logo { width: 165px; height: 165px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(46,196,192,.35), 0 8px 32px rgba(0,0,0,.35); display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; overflow: hidden; padding: 10px; }
.tf-hero-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.tf-hero-name { font-size: 26px; font-weight: 800; color: #fff; margin-bottom: 8px; }
.tf-hero-tagline { font-size: 21px; color: var(--teal); margin: 0 0 30px; font-style: italic; font-weight: 500; letter-spacing: .3px; }
.tf-social { display: flex; gap: 10px; justify-content: center; }
.tf-social a { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.65); transition: .2s; }
.tf-social a:hover { background: var(--teal); color: #fff; border-color: var(--teal); transform: translateY(-3px); box-shadow: 0 6px 18px rgba(46,196,192,.35); }
.tf-wave { background: var(--f-hero); line-height: 0; margin-top: -1px; }
.tf-wave svg { display: block; width: 100%; }
.tf-cols { background: var(--f-cols); padding: 54px 24px 56px; }
.tf-cols-inner { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr) 1.5fr; gap: 26px; }
.tf-col .tf-h { font-family: var(--font-chrome); font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; color: var(--teal); margin: 0 0 18px; padding-bottom: 11px; border-bottom: 2px solid rgba(46,196,192,.3); }
.tf-col ul { list-style: none; display: flex; flex-direction: column; gap: 12px; padding: 0; margin: 0; }
.tf-col--contact ul { gap: 15px; }
.tf-col--contact ul li a { align-items: flex-start; line-height: 1.55; }
.tf-col--contact .tf-nowrap { white-space: nowrap; }
.tf-col--contact .tf-contact-ico { margin-top: 4px; }
.tf-col ul li a { font-size: 15.5px; color: rgba(255,255,255,.72); transition: color .15s; display: flex; align-items: center; gap: 7px; }
.tf-col ul li a:hover { color: var(--teal); }
.tf-contact-ico { color: var(--teal); flex-shrink: 0; }
.tf-nl { background: var(--f-hero); padding: 46px 24px; border-top: 3px solid var(--teal); position: relative; overflow: hidden; }
.tf-nl::before { content: ""; position: absolute; top: -40px; right: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(46,196,192,.07); pointer-events: none; }
.tf-nl-inner { max-width: 1240px; margin: 0 auto; display: flex; align-items: center; gap: 32px; flex-wrap: wrap; position: relative; }
.tf-nl-text { flex: 1 1 0%; min-width: 200px; }
.tf-nl-badge { display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; color: var(--teal); background: rgba(46,196,192,.12); border: 1px solid rgba(46,196,192,.25); padding: 3px 10px; border-radius: 20px; margin-bottom: 8px; }
.tf-nl-text strong { font-size: 21px; color: #fff; display: block; margin-bottom: 5px; font-weight: 800; letter-spacing: -.2px; }
.tf-nl-text span:not(.tf-nl-badge) { font-size: 14px; color: rgba(255,255,255,.5); line-height: 1.5; }
.tf-nl-form { display: flex; flex: 2 1 0%; min-width: 280px; max-width: 480px; }
#tym-nl-form { display: flex; flex: 1 1 0%; }
#tym-nl-form input { flex: 1 1 0%; min-width: 0; padding: 13px 16px; border: 1px solid rgba(255,255,255,.18); border-right: none; border-radius: 8px 0 0 8px; background: #fff; color: #1a2744; font: 16px var(--font-chrome); outline: none; transition: .2s; appearance: none; }
#tym-nl-form input::placeholder { color: #9ca3af; }
#tym-nl-form input:focus { border-color: var(--teal); }
#tym-nl-form button { background: var(--teal); color: #fff; border: 0; padding: 13px 24px; border-radius: 0 8px 8px 0; font: 700 12px var(--font-chrome); cursor: pointer; transition: .15s; white-space: nowrap; letter-spacing: 1px; text-transform: uppercase; }
#tym-nl-form button:hover { background: #25a8a5; }
.news-msg { flex-basis: 100%; margin: -14px 0 0; font-size: 14px; min-height: 1.4em; color: var(--teal-soft); }
.tf-policies { background: linear-gradient(135deg, #2ec4c0 0%, #25a8a5 100%); padding: 10px 24px; box-shadow: inset 0 4px 18px rgba(26,39,68,.18), inset 0 -2px 8px rgba(26,39,68,.1); position: relative; }
.tf-policies::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(26,39,68,.12) 0%, transparent 50%, rgba(26,39,68,.08) 100%); pointer-events: none; }
.tf-policies-inner { max-width: 1240px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 4px 18px; flex-wrap: wrap; position: relative; }
.tf-pol-group ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px 18px; }
.tf-pol-group ul li a { font-size: 12px; color: #fff; transition: color .15s; font-weight: 400; text-transform: uppercase; letter-spacing: .8px; }
.tf-pol-group ul li a:hover { color: rgba(26,39,68,.9); }
.tf-bottom { background: var(--f-bottom); padding: 18px 24px; }
.tf-bottom-inner { max-width: 1240px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.tf-bottom p { font-size: 12.5px; color: rgba(255,255,255,.25); margin: 0; }
.tf-bottom-right { font-size: 12.5px; color: rgba(46,196,192,.5); font-style: italic; }
@media (max-width: 1100px) { .tf-cols-inner { grid-template-columns: repeat(3, 1fr); gap: 26px; } }
@media (max-width: 760px) {
  .tf-cols-inner { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .tf-hero { padding: 40px 20px 28px; } .tf-hero-tagline { font-size: 16px; }
  .tf-nl-inner { flex-direction: column; align-items: stretch; gap: 20px; }
  .tf-nl-form, #tym-nl-form { max-width: 100%; min-width: 100%; }
  .tf-policies-inner { justify-content: flex-start; gap: 6px 14px; }
  .tf-bottom-inner { flex-direction: column; text-align: center; gap: 6px; }
  .tf-bottom p, .tf-bottom-right { font-size: 10.5px; }
}
@media (max-width: 440px) {
  .tf-cols-inner { grid-template-columns: 1fr; gap: 20px; } .tf-cols { padding: 30px 18px 26px; }
  .tf-hero-logo { width: 110px; height: 110px; } .tf-hero-name { font-size: 18px; } .tf-hero-tagline { font-size: 14px; }
  .tf-nl { padding: 24px 16px; } .tf-nl-text strong { font-size: 16px; }
}

/* ---------- 13. Motion ---------- */
.js-reveal .reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js-reveal .reveal.is-in { opacity: 1; transform: none; }
.no-js .reveal { opacity: 1; transform: none; }

/* ==========================================================================
   14. Inner pages — shared components (every page is built from these)
   Type scale: H1 60 · H2 32 · card title 20 · body 16 · lead 18 · label 12
   ========================================================================== */
:root { --fs-card: 1.25rem; }

/* ---- Page hero ---- */
.page-hero { position: relative; background: var(--bg-soft); overflow: hidden; isolation: isolate; }
.page-hero.has-media::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 34%; background: var(--panel); z-index: -1; }
.page-hero__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; padding-block: clamp(2.75rem, 6vw, 5rem); }
.page-hero:not(.has-media) .page-hero__grid { grid-template-columns: 1fr; max-width: 900px; }
.crumbs { font-size: var(--fs-small); color: var(--text); margin: 0 0 1.25rem; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.crumbs a:hover { color: var(--teal); }
.crumbs span[aria-hidden] { opacity: .5; }
.page-hero h1 { margin-bottom: 1.25rem; max-width: 16ch; overflow-wrap: break-word; }
.page-hero .lead { max-width: 52ch; margin-bottom: 1.75rem; }
.page-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; }
.page-hero__media { margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.page-hero__media img { width: 100%; aspect-ratio: 4 / 3.2; object-fit: cover; }
@media (max-width: 860px) { .page-hero.has-media::after { display: none; } .page-hero__grid { grid-template-columns: 1fr; } .page-hero h1 { max-width: none; } }

/* ---- Section heads ---- */
.sec-head { max-width: 760px; margin: 0 auto clamp(2rem, 4vw, 3.25rem); text-align: center; }
.sec-head--left { margin-inline: 0; text-align: left; }
.sec-head p { font-size: var(--fs-lead); margin-bottom: 0; }
.section--navy .eyebrow { color: var(--teal-soft); }
.section--navy p, .section--navy li { color: var(--on-navy-muted); }
.section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }

/* ---- Split (text + image) ---- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.split--rev .split__media { order: -1; }
.split__media { margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.split__media img { width: 100%; aspect-ratio: 4 / 3.3; object-fit: cover; transition: transform .8s var(--ease); }
.split__media:hover img { transform: scale(1.04); }
.split__copy h2 { margin-bottom: .8em; }
.split__copy p:last-of-type { margin-bottom: 1.5rem; }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; } .split--rev .split__media { order: 0; } }

/* ---- Card grids ---- */
.grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1000px) { .grid, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .grid, .grid--2, .grid--4 { grid-template-columns: 1fr; } }
.section--soft .card, .section--navy .card { box-shadow: none; }
.card--img { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.card--img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .8s var(--ease); }
.card--img:hover img { transform: scale(1.05); }
.card--img .card__body { padding: 24px; }
.card h3, .card h4 { font-size: var(--fs-card); line-height: 1.25; margin-bottom: .5rem; }
.card p { font-size: var(--fs-small); margin-bottom: 0; }
.card p + p { margin-top: .75rem; }
.card .card__link { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1rem; font-weight: 600; font-size: var(--fs-small); color: var(--heading); }
.card .card__link:hover { color: var(--teal); }
.card__icon { width: 44px; height: 44px; border-radius: 10px; background: var(--navy); color: var(--yellow); display: grid; place-items: center; margin-bottom: 1.1rem; }
.card__icon svg { width: 20px; height: 20px; }
.card--yellow { background: var(--yellow); }
.card--yellow, .card--yellow h3, .card--yellow h4, .card--yellow p { color: #041935; }
.card--outline { background: transparent; box-shadow: inset 0 0 0 1px var(--line); }
.section--navy .card { background: var(--surface); }
.section--navy .card p { color: var(--text); }
.section--navy .card h3, .section--navy .card h4 { color: var(--heading); }

/* ---- Steps ---- */
.steps { display: grid; gap: 1.25rem; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); counter-reset: step; list-style: none; margin: 0; padding: 0; }
.steps li { position: relative; padding: 24px; background: var(--surface); border-radius: var(--radius); box-shadow: 0 1px 0 var(--line); counter-increment: step; }
.steps li::before { content: counter(step, decimal-leading-zero); display: block; font: 600 .875rem var(--font-head); color: var(--teal); letter-spacing: .1em; margin-bottom: .9rem; }
.section--soft .steps li { box-shadow: none; }
.steps h3, .steps h4 { font-size: var(--fs-card); margin-bottom: .5rem; }
.steps p { font-size: var(--fs-small); margin: 0; }
@media (max-width: 900px) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .steps { grid-template-columns: 1fr; } }

/* ---- Checklist ---- */
.checks { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .7rem; }
.checks li { position: relative; padding-left: 2rem; }
.checks li::before { content: ""; position: absolute; left: 0; top: .25em; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 62% no-repeat; }
.checks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 2rem; }
@media (max-width: 640px) { .checks--2 { grid-template-columns: 1fr; } }

/* ---- Quote ---- */
.pullquote { margin: 0 auto; max-width: 820px; text-align: center; font: 600 clamp(1.25rem, 1rem + 1.2vw, 1.75rem)/1.4 var(--font-head); color: var(--heading); }
.pullquote cite { display: block; margin-top: 1rem; font: 500 var(--fs-small) var(--font-body); font-style: normal; color: var(--text); }
.section--navy .pullquote { color: #fff; }
.testimonial { background: var(--surface); border-radius: var(--radius); padding: 24px; margin: 0; }
.testimonial p { font-size: var(--fs-body); color: var(--heading); margin-bottom: 1rem; }
.testimonial b { display: block; font-family: var(--font-head); color: var(--heading); }
.testimonial span { font-size: var(--fs-small); }

/* ---- CTA band ---- */
.cta-band { background: var(--navy); text-align: center; padding-block: clamp(3rem, 6vw, 5rem); }
.cta-band h2 { color: #fff; max-width: 22ch; margin-inline: auto; }
.cta-band p { color: var(--on-navy-muted); max-width: 56ch; margin: 0 auto 1.75rem; font-size: var(--fs-lead); }
.cta-band .btn + .btn { margin-left: .5rem; }
.cta-band .btn--ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.35); }
.cta-band .btn--ghost:hover { background: rgba(255,255,255,.1); box-shadow: inset 0 0 0 2px #fff; }

/* ---- FAQ ---- */
.faq { max-width: 860px; margin-inline: auto; display: grid; gap: .75rem; }
.faq details { background: var(--surface); border-radius: var(--radius); box-shadow: inset 0 0 0 1px var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 1.15rem 3.25rem 1.15rem 1.35rem; font: 600 1.0625rem/1.4 var(--font-head); color: var(--heading); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--bg-soft); display: grid; place-items: center; font-size: 1.25rem; transition: background .2s; }
.faq details[open] summary::after { content: "–"; background: var(--yellow); color: #041935; }
.faq details > div { padding: 0 1.35rem 1.25rem; }
.faq details p:last-child { margin: 0; }

/* ---- Gallery ---- */
.gallery { columns: 3; column-gap: 1rem; }
.gallery figure { margin: 0 0 1rem; break-inside: avoid; border-radius: var(--radius); overflow: hidden; background: var(--bg-soft); }
.gallery img { width: 100%; height: auto; transition: transform .6s var(--ease); }
.gallery figure:hover img { transform: scale(1.04); }
@media (max-width: 900px) { .gallery { columns: 2; } }
@media (max-width: 520px) { .gallery { columns: 1; } }

/* ---- Stats ---- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.25rem; text-align: center; }
.stats b { display: block; font: 600 clamp(2rem, 1.4rem + 2vw, 3rem)/1 var(--font-head); color: var(--heading); }
.section--navy .stats b { color: var(--yellow); }
.stats span { font-size: var(--fs-small); }

/* ---- Forms ---- */
.form { background: var(--surface); border-radius: var(--radius-lg); padding: clamp(1.5rem, 3vw, 2.25rem); box-shadow: var(--shadow); display: grid; gap: 1rem; }
.form h2, .form h3 { margin: 0; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 560px) { .form__row { grid-template-columns: 1fr; } }
.form label { display: grid; gap: .4rem; font-size: var(--fs-small); font-weight: 600; color: var(--heading); }
.form input, .form select, .form textarea { width: 100%; font: inherit; font-weight: 400; color: var(--heading); background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: .8rem 1rem; transition: border-color .2s, box-shadow .2s; }
.form textarea { min-height: 130px; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(46,196,192,.25); }
.form .hp { position: absolute; left: -9999px; }
.form__msg { min-height: 1.4em; font-size: var(--fs-small); font-weight: 600; margin: 0; }
.form__msg.ok { color: #1c8f66; }
.form__msg.err { color: #c0392b; }
.form .btn { justify-self: start; }
.form-wrap { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 900px) { .form-wrap { grid-template-columns: 1fr; } }
.contact-list { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: 1rem; }
.contact-list li { display: flex; gap: .9rem; align-items: flex-start; }
.contact-list .card__icon { margin: 0; flex: none; width: 40px; height: 40px; }
.contact-list b { display: block; color: var(--heading); font-family: var(--font-head); }
.contact-list a:hover { color: var(--teal); }
.map { border: 0; width: 100%; height: 380px; border-radius: var(--radius); background: var(--bg-soft); }

/* ---- Prose (legal pages) ---- */
.prose { max-width: 820px; margin-inline: auto; }
.prose h2 { font-size: var(--fs-h3); margin: 2.25rem 0 .75rem; }
.prose h3 { font-size: var(--fs-h4); margin: 1.75rem 0 .5rem; }
.prose ul, .prose ol { padding-left: 1.4rem; margin: 0 0 1.1em; }
.prose li { margin-bottom: .4rem; }
.prose a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }

/* ---- Widgets (plugin shortcode output sits in these) ---- */
.widget { min-height: 4rem; }
.widget-note { border: 1px dashed var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; font-size: var(--fs-small); background: var(--bg-soft); }
.tags { display: flex; flex-wrap: wrap; gap: .5rem; }
.tags span { padding: .4rem .9rem; border-radius: 100px; background: var(--bg-soft); color: var(--heading); font-size: var(--fs-small); font-weight: 500; }
.mock-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.mock-tag { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .7; }
.price { font: 600 1.25rem var(--font-head); color: var(--heading); }
.event-row { display: grid; grid-template-columns: 80px 1fr; gap: 1.25rem; padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
.event-row .date { text-align: center; background: var(--navy); color: #fff; border-radius: 10px; padding: .6rem 0; font-family: var(--font-head); }
.event-row .date b { display: block; font-size: 1.5rem; line-height: 1; } .event-row .date span { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
.event-row h3 { font-size: var(--fs-card); margin-bottom: .25rem; } .event-row p { margin: 0; font-size: var(--fs-small); }

/* ==========================================================================
   15. Refinements from client review
   ========================================================================== */
:root {
  --fs-h1: clamp(1.625rem, 1.2rem + 1.5vw, 2rem);            /* 32px: hero headline, same as section H2 */
  --fs-title: clamp(2rem, 1.4rem + 2.6vw, 2.8125rem);        /* 45px: page-band titles on inner pages */
  --card-border: rgba(4, 25, 53, .14);
  --card-shadow: 0 8px 26px rgba(4, 25, 53, .10);
  --radius-img: 20px;
}
:root[data-theme="dark"] { --card-border: rgba(255, 255, 255, .16); --card-shadow: 0 8px 26px rgba(0, 0, 0, .45); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --card-border: rgba(255, 255, 255, .16); --card-shadow: 0 8px 26px rgba(0, 0, 0, .45); } }

h1 { line-height: 1.15; }

/* No white gap under the header: the hero (and page band) start right below it */
#tym-spacer { height: 0 !important; }
.hero__grid { padding-top: clamp(4rem, 8vw, 6.5rem); }
.hero__copy h1 { max-width: 22ch; }

/* Boxes: clear grey line + soft shadow so they read as boxes */
.card, .steps li, .testimonial, .faq details {
  border: 1px solid var(--card-border);
  box-shadow: var(--card-shadow);
}
.section--soft .card, .section--navy .card, .section--soft .steps li { box-shadow: var(--card-shadow); }
.card--outline { box-shadow: var(--card-shadow); background: var(--surface); }
.card--img { overflow: hidden; }

/* One button system: yellow primary, ghost for dark backgrounds. (Header "Donate Now" stays teal as on the live site.) */
.btn--teal { background: var(--yellow); color: #041935; }
.btn--teal:hover { background: var(--yellow-hover); box-shadow: 0 8px 20px rgba(246, 227, 4, .35); }
.form .btn, .cart-empty .btn { background: var(--yellow); color: #041935; }

/* ---- Page band: lavender header with the page title, as on the original site ---- */
.page-hero { background: var(--lavender); text-align: center; }
:root[data-theme="dark"] .page-hero { background: var(--panel); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .page-hero { background: var(--panel); } }
.page-hero::after, .page-hero.has-media::after { display: none; }
.page-hero__grid, .page-hero:not(.has-media) .page-hero__grid { grid-template-columns: 1fr; max-width: 900px; padding-block: clamp(4.5rem, 8vw, 6.5rem) clamp(2.5rem, 5vw, 4rem); }
.page-hero__media { display: none; }
.crumbs { justify-content: center; margin-bottom: 1rem; }
.page-hero h1 { font-size: var(--fs-title); max-width: none; margin: 0 auto 1rem; text-transform: capitalize; line-height: 1.1; }
.page-hero .lead { margin-inline: auto; max-width: 62ch; }
.page-hero__cta { justify-content: center; }

/* ---- Lavender content sections (from the original) ---- */
.section--lav { background: var(--lavender); }
:root[data-theme="dark"] .section--lav { background: var(--panel); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .section--lav { background: var(--panel); } }
.section--lav .card, .section--lav .steps li { background: var(--surface); }

/* Light text on every dark background; never dark-on-dark */
.section--navy h2, .section--navy h3, .section--navy h4 { color: var(--teal-soft); }
.section--navy .card h2, .section--navy .card h3, .section--navy .card h4 { color: var(--heading); }
.section--navy .eyebrow { color: #fff; opacity: .85; }

/* ---- Rounded navy call-to-action card (replaces the full-width band) ---- */
.cta-card { background: linear-gradient(135deg, #041935 0%, #0b2a55 100%); border-radius: 20px; padding: clamp(1.75rem, 4vw, 3rem); display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(1.25rem, 4vw, 3rem); align-items: center; box-shadow: var(--card-shadow); }
.cta-card h2 { color: #fff; margin: 0 0 1.25rem; }
.cta-card p { color: rgba(255,255,255,.82); margin: 0; font-size: var(--fs-lead); }
.cta-card .btn + .btn { margin-left: .5rem; }
.cta-card .btn--ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(255,255,255,.4); background: transparent; }
.cta-card .btn--ghost:hover { background: rgba(255,255,255,.12); box-shadow: inset 0 0 0 2px #fff; }
.cta-card__btns { display: flex; flex-wrap: wrap; gap: .5rem; }
@media (max-width: 860px) { .cta-card { grid-template-columns: 1fr; } }

/* ---- Image treatment (rounded, as on the original) ---- */
.split__media, .gallery figure { border-radius: var(--radius-img); }
.collage { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.collage figure { margin: 0; border-radius: var(--radius-img); overflow: hidden; }
.collage figure:first-child { grid-column: 1 / -1; }
.collage img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 10; }
.collage figure:not(:first-child) img { aspect-ratio: 1 / 1; }

/* Feature (collage/text, as on the original Get Involved page) */
.feature { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.feature__copy h2 { margin-bottom: .6em; }
.feature__items { display: grid; gap: 1.1rem; margin: 1.5rem 0; }
.feature__items h3 { font-size: var(--fs-card); margin: 0 0 .25rem; }
.feature__items p { margin: 0; font-size: var(--fs-small); }
@media (max-width: 860px) { .feature { grid-template-columns: 1fr; } }

/* Cutout portrait standing on a lavender corner block (volunteer page) */
.cutout { position: relative; min-height: 420px; display: flex; align-items: flex-end; justify-content: center; }
.cutout::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 78%; border-radius: var(--radius-img); background: var(--lavender); }
:root[data-theme="dark"] .cutout::before { background: var(--panel); }
.cutout::after { content: ""; position: absolute; right: -14px; bottom: -14px; width: 42%; height: 34%; border-radius: var(--radius-img); border: 3px solid var(--yellow); z-index: 0; }
.cutout img { position: relative; z-index: 1; width: auto; max-width: 88%; max-height: 520px; height: auto; object-fit: contain; }

/* ---- Contact page (original layout) ---- */
.page-hero .lead, .page-hero__cta { display: none; }   /* original band shows only the title */
.page-hero__grid, .page-hero:not(.has-media) .page-hero__grid { padding-block: clamp(4.5rem, 8vw, 6rem) clamp(2rem, 4vw, 3rem); }

.form--plain { background: none; box-shadow: none; padding: 0; border-radius: 0; gap: .9rem; }
.form--plain input, .form--plain textarea { background: var(--surface); border: 1px solid var(--card-border); border-radius: 4px; padding: 1rem; }
.form--plain textarea { min-height: 170px; }

.contact-card { background: var(--bg-soft); border: 1px solid var(--card-border); border-radius: 20px; padding: clamp(1.25rem, 3vw, 1.75rem); display: grid; gap: 1.5rem; margin-top: 1.75rem; }
.contact-card__row { display: flex; gap: 1rem; align-items: flex-start; }
.contact-card__ico { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--surface); color: var(--teal); display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--card-border); }
.contact-card__ico svg { width: 20px; height: 20px; }
.contact-card__row b { display: block; font-family: var(--font-head); color: var(--heading); margin-bottom: .25rem; }
.contact-card__row a, .contact-card__row span:not(.contact-card__ico) { display: block; font-size: var(--fs-body); line-height: 1.6; }
.contact-card__row a:hover { color: var(--teal); }

.contact-faq { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.contact-faq h2 { max-width: 18ch; }
.faq-box { background: linear-gradient(135deg, #041935 0%, #0b2a55 100%); border-radius: 20px; padding: clamp(1.5rem, 3vw, 2.5rem); box-shadow: var(--card-shadow); }
.faq-box__lead { color: #fff; font: 500 1.125rem/1.5 var(--font-head); margin: 0 0 1.5rem; }
.faq-box .faq { max-width: none; }
.faq-box .faq details { background: rgba(255,255,255,.06); border: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); }
.faq-box .faq summary { color: #fff; }
.faq-box .faq summary::after { background: rgba(255,255,255,.14); color: #fff; }
.faq-box .faq details[open] summary::after { background: var(--yellow); color: #041935; }
.faq-box .faq p { color: rgba(255,255,255,.8); }
@media (max-width: 860px) { .contact-faq { grid-template-columns: 1fr; } }

.map-full { display: block; border: 0; width: 100%; height: 400px; background: var(--bg-soft); }

/* ---- FAQ stage: overlapping photo + navy box, with gentle motion ---- */
.contact-faq { display: block; }                 /* replaced by .faq-stage */
.faq-stage { position: relative; overflow: hidden; }
.faq-stage__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; position: relative; }
.faq-stage__media { grid-column: 1 / span 7; grid-row: 1; position: relative; padding: 0 0 2.5rem 1.5rem; }
.faq-photo { margin: 0; position: relative; z-index: 1; border-radius: var(--radius-img); overflow: hidden; box-shadow: 0 30px 60px rgba(4, 25, 53, .22); transform: translateY(var(--py, 0px)); will-change: transform; }
.faq-photo img { width: 100%; aspect-ratio: 4 / 4.2; object-fit: cover; transform: scale(1.06); transition: transform 1.4s var(--ease); }
.faq-stage__media.is-in .faq-photo img { transform: scale(1); }
.faq-box { grid-column: 6 / -1; grid-row: 1; position: relative; z-index: 2; margin-top: 4.5rem; }
.faq-box::before { content: ""; position: absolute; inset: -1px; border-radius: 20px; padding: 1.5px; background: linear-gradient(135deg, rgba(46,196,192,.9), rgba(246,227,4,.7) 55%, rgba(255,255,255,0)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }

/* decorative shapes */
.faq-blob { position: absolute; z-index: 0; left: -40px; top: -30px; width: 58%; aspect-ratio: 1; border-radius: 50% 42% 55% 45%; background: var(--lavender); opacity: .9; animation: faq-morph 14s ease-in-out infinite alternate; }
:root[data-theme="dark"] .faq-blob { background: var(--panel); }
.faq-dots { position: absolute; z-index: 0; right: 4%; bottom: 0; width: 150px; height: 110px; background-image: radial-gradient(var(--teal) 2.2px, transparent 2.4px); background-size: 18px 18px; opacity: .7; animation: faq-drift 9s ease-in-out infinite alternate; }
.faq-badge { position: absolute; z-index: 3; left: 0; bottom: 0; background: var(--yellow); color: #041935; border-radius: 20px; padding: 1rem 1.25rem 1rem 1rem; display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: center; box-shadow: 0 16px 34px rgba(4, 25, 53, .25); animation: faq-float 5s ease-in-out infinite; }
.faq-badge span { grid-row: span 2; width: 46px; height: 46px; border-radius: 50%; background: #041935; color: var(--yellow); display: grid; place-items: center; font: 700 1.5rem var(--font-head); }
.faq-badge b { font: 700 1rem/1.2 var(--font-head); } .faq-badge small { font-size: .8125rem; opacity: .8; }

/* entrance directions */
.js-reveal .reveal--left { transform: translateX(-36px); } .js-reveal .reveal--right { transform: translateX(36px); }
.js-reveal .reveal--left.is-in, .js-reveal .reveal--right.is-in { transform: none; }

/* questions stagger in, then open smoothly */
.js-reveal .faq-box .faq details { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease), transform .6s var(--ease), background .25s, box-shadow .25s; }
.js-reveal .faq-box.is-in .faq details { opacity: 1; transform: none; }
.faq-box.is-in .faq details:nth-child(1) { transition-delay: .15s; } .faq-box.is-in .faq details:nth-child(2) { transition-delay: .25s; } .faq-box.is-in .faq details:nth-child(3) { transition-delay: .35s; } .faq-box.is-in .faq details:nth-child(4) { transition-delay: .45s; } .faq-box.is-in .faq details:nth-child(5) { transition-delay: .55s; } .faq-box.is-in .faq details:nth-child(6) { transition-delay: .65s; }
.faq-box .faq summary { counter-increment: q; display: flex; gap: .85rem; align-items: center; }
.faq-box .faq summary::before { content: counter(q, decimal-leading-zero); flex: none; font: 700 .75rem var(--font-head); letter-spacing: .08em; color: var(--teal-soft); }
.faq-box .faq { counter-reset: q; }
.faq-box .faq details:hover { background: rgba(255, 255, 255, .11); }
.faq-box .faq details[open] { background: rgba(46, 196, 192, .14); box-shadow: inset 3px 0 0 var(--teal), inset 0 0 0 1px rgba(255, 255, 255, .2); }
.faq-box .faq details[open] > div { animation: faq-open .45s var(--ease); }
.faq-box__more { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.5rem; color: var(--yellow); font-weight: 600; font-size: var(--fs-small); }
.faq-box__more:hover { gap: .8rem; }

@keyframes faq-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes faq-drift { from { transform: translate(0, 0); } to { transform: translate(-14px, -10px); } }
@keyframes faq-morph { 0% { border-radius: 50% 42% 55% 45%; transform: rotate(0deg); } 100% { border-radius: 42% 55% 45% 52%; transform: rotate(12deg); } }
@keyframes faq-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

@media (max-width: 960px) {
  .faq-stage__grid { display: block; }
  .faq-stage__media { padding: 0 0 0 0; }
  .faq-box { margin-top: -3.5rem; margin-inline: .75rem; }
  .faq-badge { left: .5rem; bottom: 2.5rem; padding: .7rem 1rem .7rem .7rem; }
  .faq-photo img { aspect-ratio: 16 / 11; }
}
@media (prefers-reduced-motion: reduce) {
  .faq-blob, .faq-dots, .faq-badge { animation: none !important; }
  .reveal--left, .reveal--right, .faq-box .faq details { transform: none !important; opacity: 1 !important; }
  .faq-photo, .faq-photo img { transform: none !important; }
}

/* Balanced heading wraps: no lonely last word */
h1, h2, h3, .sec-head h2 { text-wrap: balance; }
.faq-stage .sec-head h2 { max-width: 22ch; margin-inline: auto; }

/* ==========================================================================
   16. Client review, round 2: no circles, violet icons, glow, header stability, footer, justified text
   ========================================================================== */
:root { --violet: #041935; --violet-soft: #1d3f8f; --glow: 0 0 0 1px rgba(4, 25, 53, .5), 0 14px 44px rgba(36, 84, 217, .3); }
:root[data-theme="dark"] { --violet: #8fb4ff; --violet-soft: #b4ccff; --glow: 0 0 0 1px rgba(143, 180, 255, .6), 0 14px 44px rgba(36, 84, 217, .5); }
:root[data-theme="dark"] .chat__launcher, :root[data-theme="dark"] .chat__msg--me, :root[data-theme="dark"] .policy-all a[aria-current="page"], :root[data-theme="dark"] .chat__chips button:hover { color: #041935; }

/* Header: the top bar scrolls away on its own, so the page height never changes (fixes the shaking logo) */
.tym-header { top: -44px; }
@media (max-width: 600px) { .tym-header { top: 0; } }
.tym-logo img { transition: width .35s var(--ease), height .35s var(--ease), box-shadow .35s; }

/* Icons: navy tiles with yellow icons (as approved) */
.card__icon, .trust__icon, .contact-card__ico { background: #041935; color: var(--yellow); border-radius: 12px; box-shadow: none; }
.card__icon svg, .trust__icon svg { color: var(--yellow); }
:root[data-theme="dark"] .card__icon, :root[data-theme="dark"] .trust__icon, :root[data-theme="dark"] .contact-card__ico { background: #0b2a5c; }
.card--yellow .card__icon, .card--yellow .trust__icon { background: #041935; color: var(--yellow); }
.contact-card__ico { border-radius: 12px; }
.card__icon { transition: transform .35s var(--ease), background .25s; }
.card:hover .card__icon { transform: translateY(-3px) rotate(-4deg); }

/* Boxes glow on hover */
.card, .steps li, .testimonial, .contact-card { transition: box-shadow .35s var(--ease), transform .35s var(--ease), border-color .35s; }
.card:hover, .steps li:hover, .testimonial:hover { box-shadow: var(--glow); border-color: transparent; transform: translateY(-4px); }
.card--yellow:hover { box-shadow: 0 0 0 1px rgba(246, 227, 4, .9), 0 14px 44px rgba(246, 227, 4, .5); }
.section--navy .card:hover { box-shadow: 0 0 0 1px rgba(124, 202, 198, .7), 0 14px 44px rgba(124, 202, 198, .4); }

/* Shapes: rounded squares only (no circles) */
.checks li::before { border-radius: 6px; }
.faq summary::after { border-radius: 9px; }
.faq-blob { border-radius: 36px; animation: faq-tilt 12s ease-in-out infinite alternate; }
.faq-dots { width: 46%; height: 62%; background: none; border: 3px solid var(--teal); border-radius: 28px; right: -14px; bottom: 6px; opacity: .55; animation: faq-drift 9s ease-in-out infinite alternate; }
.faq-badge span { border-radius: 12px; }
@keyframes faq-tilt { 0% { transform: rotate(-3deg); } 100% { transform: rotate(3deg) translateY(-6px); } }

/* FAQ typography */
.faq-box .faq summary { font-weight: 500; }
.faq-box__lead { font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); font-weight: 500; line-height: 1.35; letter-spacing: -.005em; }

/* Justified body copy (long text only; headings and short card text stay left-aligned) */
.prose p, .split__copy > p, .feature__copy > p, .story p, .legal p { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.cta-card p { font-size: 1.25rem; line-height: 1.55; }

/* Footer: no line under the wavy edge; larger, lighter newsletter text */
.tf-wave { background: var(--f-cols); margin-top: -1px; line-height: 0; }
.tf-wave svg { margin-bottom: -1px; }
.tf-cols { margin-top: -1px; position: relative; }
.tf-hero { margin-bottom: -1px; }
.tf-nl-text strong { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2rem); font-weight: 600; letter-spacing: -.01em; }
.tf-nl-text span:not(.tf-nl-badge) { font-size: 1.0625rem; line-height: 1.6; color: rgba(255, 255, 255, .62); }

/* ==========================================================================
   17. About / Vision / Leadership components
   ========================================================================== */

/* Our Story: full-width, justified, bigger headings */
.story-block .sec-head h2, .story-block h2 { font-size: var(--fs-title); }
.story-block h3 { font-size: clamp(1.4rem, 1.1rem + 1vw, 1.875rem); margin: 0 0 1.25rem; }
.story-block .prose { max-width: none; }
.story-block .prose p { font-size: 1.0625rem; line-height: 1.75; }

/* Support Us: lavender rounded panel with a cutout family standing on it */
.support-card { position: relative; background: var(--lavender); border-radius: 24px; display: grid; grid-template-columns: 1.3fr 1fr; gap: 1rem; align-items: end; margin-top: 3rem; }
:root[data-theme="dark"] .support-card { background: var(--panel); }
.support-card__copy { padding: clamp(2rem, 5vw, 4rem); align-self: center; }
.support-card__copy h2 { font-size: var(--fs-title); }
.support-card__copy p { text-align: justify; font-size: 1.125rem; line-height: 1.7; }
.support-card__art { align-self: end; text-align: center; margin-top: -3.5rem; padding-right: clamp(1rem, 4vw, 3rem); }
.support-card__art img { display: inline-block; width: auto; max-width: 100%; max-height: 430px; filter: drop-shadow(0 18px 24px rgba(4, 25, 53, .25)); }
@media (max-width: 860px) { .support-card { grid-template-columns: 1fr; } .support-card__art { margin-top: 0; padding: 0 1rem; } .support-card__art img { max-height: 320px; } }

/* Vision / Mission: text with two tall images side by side */
.vm-row { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.vm-copy h2 { font-size: var(--fs-title); }
.vm-copy p { text-align: justify; font-size: 1.0625rem; line-height: 1.75; }
.vm-images { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vm-images figure { margin: 0; border-radius: var(--radius-img); overflow: hidden; }
.vm-images figure:nth-child(2) { margin-top: 2.75rem; }
.vm-images img { width: 100%; aspect-ratio: 4 / 5.2; object-fit: cover; }
.vm-mission { margin-top: clamp(2rem, 4vw, 3.5rem); max-width: none; }
.vm-mission h2 { font-size: var(--fs-title); }
.vm-mission p { text-align: justify; font-size: 1.0625rem; line-height: 1.75; }
@media (max-width: 860px) { .vm-row { grid-template-columns: 1fr; } .vm-images figure:nth-child(2) { margin-top: 1.5rem; } }

/* Programme panels that expand on hover */
.pillars { display: flex; gap: .9rem; height: 440px; }
.pillar { position: relative; flex: 1 1 0; min-width: 0; border-radius: var(--radius-img); overflow: hidden; color: #fff; isolation: isolate; transition: flex-grow .65s var(--ease), box-shadow .35s; }
.pillar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1s var(--ease); }
.pillar::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4,25,53,.05) 30%, rgba(4,25,53,.88)); }
.pillar__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.25rem; }
.pillar .card__icon { margin-bottom: .75rem; }
.pillar h3 { color: #fff; font-size: 1.25rem; margin: 0 0 .35rem; }
.pillar p { margin: 0; font-size: .9375rem; line-height: 1.5; color: rgba(255,255,255,.9); max-height: 0; opacity: 0; overflow: hidden; transition: max-height .5s var(--ease), opacity .5s .1s; }
.pillar:hover, .pillar:focus-visible { flex-grow: 3.4; box-shadow: var(--glow); }
.pillar:hover img { transform: scale(1.06); }
.pillar:hover p, .pillar:focus-visible p { max-height: 8rem; opacity: 1; }
@media (max-width: 860px) { .pillars { flex-direction: column; height: auto; } .pillar { min-height: 190px; } .pillar p { max-height: none; opacity: 1; } }
@media (hover: none) { .pillar p { max-height: none; opacity: 1; } }

/* Leader stories: text one side, portrait the other, alternating */
.leader { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.leader--rev .leader__photo, .leader--rev .leader__tile { order: -1; }
.leader__copy h2 { font-size: var(--fs-title); margin-bottom: .6em; }
.leader__copy p { text-align: justify; font-size: 1.0625rem; line-height: 1.75; }
.leader__photo { margin: 0; border-radius: var(--radius-img); overflow: hidden; }
.leader__photo img { width: 100%; aspect-ratio: 4 / 4.6; object-fit: cover; }
.leader__tile { aspect-ratio: 4 / 4.6; border-radius: var(--radius-img); background: linear-gradient(140deg, #041935, #1d3f8f); color: #fff; display: grid; place-content: center; text-align: center; gap: .5rem; }
.leader__tile span { font: 700 clamp(3.5rem, 8vw, 6rem)/1 var(--font-head); letter-spacing: .02em; }
.leader__tile small { font-size: .8125rem; letter-spacing: .18em; text-transform: uppercase; opacity: .85; }
@media (max-width: 860px) { .leader { grid-template-columns: 1fr; } .leader--rev .leader__photo, .leader--rev .leader__tile { order: 0; } .leader__tile, .leader__photo img { aspect-ratio: 16 / 10; } }

/* Call-to-action card with a cutout standing in it */
.cta-card--art { grid-template-columns: 1fr 1.1fr auto; }
.cta-card__art { align-self: end; margin: -3rem 0 calc(-1 * clamp(1.75rem, 4vw, 3rem)) 0; }
.cta-card__art img { display: block; height: clamp(190px, 22vw, 300px); width: auto; }
@media (max-width: 860px) { .cta-card--art { grid-template-columns: 1fr; } .cta-card__art { margin: 0 0 calc(-1 * clamp(1.75rem, 4vw, 3rem)); } .cta-card__art img { margin-inline: auto; } }

.cta-card--art-wide { grid-template-columns: 1fr 1.1fr; }
.cta-card--art-wide .cta-card__art { grid-column: 1 / -1; justify-self: center; margin: 1.25rem 0 calc(-1 * clamp(1.75rem, 4vw, 3rem)); }
.cta-card--art-wide .cta-card__art img { height: clamp(140px, 17vw, 220px); width: auto; max-width: 100%; }
@media (max-width: 860px) { .cta-card--art-wide { grid-template-columns: 1fr; } }

/* ==========================================================================
   18. Policy centre: content with a sticky side panel (contents + all policies)
   ========================================================================== */
.policy-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.policy-main { min-width: 0; }
.policy-note { font-size: var(--fs-small); padding: .75rem 1rem; border-radius: 12px; background: var(--bg-soft); border: 1px solid var(--card-border); margin: 0 0 2rem; }
.policy-main h2 { font-size: var(--fs-h2); font-weight: 700; margin: 2.75rem 0 1rem; scroll-margin-top: 130px; }
.policy-main h2:first-of-type { margin-top: 0; }
.policy-main h3 { font-size: var(--fs-h3); margin: 1.75rem 0 .5rem; }
.policy-main p, .policy-main li { text-align: justify; hyphens: auto; -webkit-hyphens: auto; line-height: 1.8; }
.policy-main ul, .policy-main ol { padding-left: 1.4rem; margin: 0 0 1.2em; }
.policy-main li { margin-bottom: .5rem; }
.policy-main a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }

.policy-side { position: sticky; top: 124px; display: grid; gap: 1.25rem; max-height: calc(100vh - 150px); overflow-y: auto; padding: 2px; scrollbar-width: thin; }
.policy-toc, .policy-all { background: var(--surface); border: 1px solid var(--card-border); border-radius: 20px; padding: 1.25rem; box-shadow: var(--card-shadow); }
.policy-side__title { margin: 0 0 .75rem; font: 700 .75rem var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--heading); }
.policy-toc ol, .policy-all ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.policy-toc a { display: block; padding: .45rem .7rem; border-radius: 10px; border-left: 3px solid transparent; font-size: .9rem; line-height: 1.35; transition: background .2s, border-color .2s, color .2s; }
.policy-toc a:hover { background: var(--bg-soft); color: var(--heading); }
.policy-toc a.is-active { background: var(--lavender); color: #041935; border-left-color: var(--violet); font-weight: 600; }
:root[data-theme="dark"] .policy-toc a.is-active { background: var(--panel); color: #fff; }
.policy-all a { display: flex; align-items: center; gap: .65rem; padding: .55rem .7rem; border-radius: 12px; font-size: .9rem; font-weight: 500; color: var(--heading); transition: background .2s, transform .2s; }
.policy-all a svg { flex: none; color: var(--violet); }
.policy-all a:hover { background: var(--bg-soft); transform: translateX(3px); }
.policy-all a[aria-current="page"] { background: var(--violet); color: #fff; }
.policy-all a[aria-current="page"] svg { color: #fff; }

@media (max-width: 960px) {
  .policy-layout { grid-template-columns: 1fr; }
  .policy-side { position: static; order: -1; max-height: none; overflow: visible; }
}
@media print { .policy-side, .tym-header, .site-footer, #tym-footer { display: none !important; } .policy-layout { display: block; } }

/* ==========================================================================
   19. Mission statement, timeline, registration facts, trust strip
   ========================================================================== */
.statement { max-width: 980px; margin-inline: auto; text-align: center; }
.statement blockquote { margin: 0; }
.statement p { font: 600 clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem)/1.35 var(--font-head); color: var(--heading); letter-spacing: -.01em; margin: 0; }

/* Timeline */
.timeline { list-style: none; margin: 0 auto; padding: 0; max-width: 900px; position: relative; }
.timeline::before { content: ""; position: absolute; left: 148px; top: 8px; bottom: 8px; width: 3px; background: linear-gradient(var(--violet), var(--teal)); border-radius: 2px; }
.timeline li { display: grid; grid-template-columns: 130px 1fr; gap: 0 2.25rem; padding: 0 0 2rem; position: relative; }
.timeline li::before { content: ""; position: absolute; left: 141px; top: 6px; width: 17px; height: 17px; border-radius: 5px; background: var(--surface); border: 3px solid var(--violet); }
.timeline li.is-next::before { border-color: var(--teal); background: var(--yellow); }
.timeline time { grid-row: 1 / span 2; font: 700 .875rem/1.4 var(--font-head); color: var(--violet); text-align: right; padding-top: 3px; }
.timeline h3 { font-size: var(--fs-card); margin: 0 0 .35rem; padding-left: 1.5rem; }
.timeline p { margin: 0; padding-left: 1.5rem; max-width: 60ch; }
@media (max-width: 640px) {
  .timeline::before { left: 8px; }
  .timeline li { grid-template-columns: 1fr; padding-left: 2rem; }
  .timeline li::before { left: 0; }
  .timeline time { grid-row: auto; text-align: left; margin-bottom: .25rem; }
  .timeline h3, .timeline p { padding-left: 0; }
}

/* Registration facts */
.facts { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.facts__list { margin: 0; background: var(--surface); border: 1px solid var(--card-border); border-radius: 20px; box-shadow: var(--card-shadow); padding: .5rem 1.5rem; }
.facts__list > div { display: grid; grid-template-columns: 210px 1fr; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.facts__list > div:last-child { border-bottom: 0; }
.facts dt { font-weight: 700; color: var(--heading); font-size: var(--fs-small); text-transform: uppercase; letter-spacing: .06em; }
.facts dd { margin: 0; }
.facts__side { background: var(--surface); border: 1px solid var(--card-border); border-radius: 20px; box-shadow: var(--card-shadow); padding: 1.5rem; }
.facts__side h3 { font-size: var(--fs-card); margin: 0 0 1rem; }
.facts__side ul { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .8rem; }
.facts__side li b { display: block; color: var(--heading); font-family: var(--font-head); }
.facts__side li span { font-size: var(--fs-small); }
.facts__side p { font-size: var(--fs-small); }
.facts__side a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.facts__fb { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--violet) !important; text-decoration: none !important; }
.facts__fb:hover { text-decoration: underline !important; }
@media (max-width: 900px) { .facts { grid-template-columns: 1fr; } .facts__list > div { grid-template-columns: 1fr; gap: .15rem; } }

/* Home trust strip (registered charity details right under the hero band) */
.trust-strip { background: var(--surface); border-bottom: 1px solid var(--line); }
.trust-strip ul { list-style: none; margin: 0; padding: .9rem 0; display: flex; flex-wrap: wrap; gap: .35rem 2rem; justify-content: center; font-size: var(--fs-small); }
.trust-strip li { position: relative; }
.trust-strip li + li::before { content: ""; position: absolute; left: -1.1rem; top: .45em; width: 5px; height: 5px; border-radius: 2px; background: var(--teal); }
.trust-strip b { color: var(--heading); font-family: var(--font-head); }

/* ==========================================================================
   20. Photo gallery by project
   ========================================================================== */
.gallery-head { max-width: 760px; margin: 0 0 1.5rem; }
.gallery-head p { margin: .35rem 0 0; }
.gallery-nav { justify-content: center; }
.gallery-nav a { padding: .45rem 1rem; border-radius: 100px; background: var(--bg-soft); color: var(--heading); font-size: var(--fs-small); font-weight: 600; border: 1px solid var(--card-border); transition: box-shadow .2s, transform .2s; }
.gallery-nav a:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(4, 25, 53, .25); }
html { scroll-padding-top: 120px; }

/* Monthly giving amount picker (preview stand-in; the live one is the plugin's) */
.amounts { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.amounts .chip { min-width: 96px; text-align: center; padding: .85rem 1.25rem; border-radius: 14px; border: 2px solid var(--card-border); background: var(--surface); color: var(--heading); font: 700 1.125rem var(--font-head); }
.amounts .chip.is-on { border-color: var(--violet); box-shadow: 0 8px 22px rgba(4, 25, 53, .25); }

/* ==========================================================================
   21. Language select + chat widget
   ========================================================================== */
.tym-lang { display: inline-flex; align-items: center; gap: .35rem; color: inherit; margin-right: .5rem; }
.tym-lang select { background: transparent; color: inherit; border: 0; font: inherit; font-size: 12px; cursor: pointer; max-width: 110px; }
.tym-lang select option { color: #041935; }
.chat { position: fixed; right: 18px; bottom: 18px; z-index: 90; font-family: var(--font-body); }
.chat__launcher { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.1rem; border: 0; border-radius: 16px; background: var(--violet); color: #fff; font-weight: 700; cursor: pointer; box-shadow: 0 10px 28px rgba(4, 25, 53, .4); }
.chat__launcher:hover { box-shadow: 0 12px 34px rgba(36, 84, 217, .55); }
.chat__panel { position: absolute; right: 0; bottom: 64px; width: min(360px, calc(100vw - 36px)); max-height: min(560px, 75vh); display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--card-border); border-radius: 20px; box-shadow: 0 18px 50px rgba(4, 25, 53, .28); overflow: hidden; }
.chat__panel[hidden] { display: none; }
.chat__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.1rem; background: var(--navy, #041935); color: #fff; }
.chat__head b { display: block; font-family: var(--font-head); }
.chat__head span { font-size: 12px; opacity: .8; }
.chat__head .icon-btn { color: #fff; }
.chat__log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .6rem; min-height: 160px; }
.chat__msg { max-width: 86%; padding: .6rem .85rem; border-radius: 14px; font-size: .9375rem; line-height: 1.45; }
.chat__msg--bot { background: var(--bg-soft); color: var(--text); align-self: flex-start; }
.chat__msg--me { background: var(--violet); color: #fff; align-self: flex-end; }
.chat__msg a { color: var(--violet); text-decoration: underline; }
.chat__chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chat__chips button { border: 1px solid var(--violet); background: transparent; color: var(--violet); border-radius: 100px; padding: .3rem .8rem; font: 600 .8125rem var(--font-body); cursor: pointer; }
.chat__chips button:hover { background: var(--violet); color: #fff; }
.chat__form { padding: .75rem; border-top: 1px solid var(--line); display: grid; gap: .5rem; }
.chat__who { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.chat__form input:not(.hp) { width: 100%; padding: .6rem .75rem; border: 1px solid var(--card-border); border-radius: 10px; background: var(--surface); color: var(--text); font: inherit; font-size: .875rem; }
.chat__row { display: flex; gap: .5rem; }
.chat__row .btn { padding: .55rem 1rem; }
@media (max-width: 480px) { .chat__who { grid-template-columns: 1fr; } }

/* ==========================================================================
   22. Prayer request page: exact clone of the live layout and the plugin form
   ========================================================================== */
.pr-layout { display: grid; grid-template-columns: minmax(0, 448px) minmax(0, 720px); gap: 56px; justify-content: center; align-items: start; }
.pr-photo { margin: 0; }
.pr-photo img { display: block; width: 100%; height: auto; border-radius: 15px; box-shadow: -1px 0 10px rgba(0, 0, 0, .5); }
.ymi-request { max-width: 720px; margin: 24px 0; padding: 24px 26px; background: var(--surface); border: .8px solid var(--card-border); border-radius: 12px; color: var(--text); }
.ymi-request__form { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.ymi-request__row { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 0 16px; }
.ymi-request__row--split { grid-template-columns: 1fr 1fr; }
.ymi-request label { display: block; font: 700 12.48px/12.48px var(--font-body); text-transform: uppercase; letter-spacing: .03em; color: var(--text); }
.ymi-request input[type=text], .ymi-request input[type=email], .ymi-request input[type=tel] { display: inline-block; width: 100%; margin: 6px 0 0; padding: 11px 14px; border: .8px solid #d7d9dc; border-radius: 9px; background: var(--surface); color: var(--heading); font: 400 16px/24px var(--font-body); text-transform: none; letter-spacing: normal; }
.ymi-request textarea { display: inline-block; width: 100%; margin: 6px 0 0; padding: 11px 14px; border: .8px solid var(--card-border); border-radius: 9px; background: var(--surface); color: var(--heading); font: 400 15.52px/24.8px var(--font-body); text-transform: none; letter-spacing: normal; resize: vertical; }
.ymi-request__gift { margin: 22px 0; padding: 18px 20px; border-radius: 11px; background: #e4ecfc; }
[data-theme="dark"] .ymi-request__gift { background: #16284a; }
.ymi-request__gift-label { margin: 0; font: 700 16px/24px var(--font-body); color: var(--heading); }
.ymi-request__gift-note { margin: 4px 0 14px; font-size: 13.6px; line-height: 1.55; }
.ymi-request__gift-amounts { display: flex; flex-wrap: wrap; gap: 9px; }
.ymi-request__amount { padding: 10px 18px; border: .8px solid #2454d9; border-radius: 100px; background: #fff; color: #2454d9; font: 500 16px/24px var(--font-body); cursor: pointer; }
.ymi-request__amount.is-active { background: #2454d9; color: #fff; }
.ymi-request__amount-other { display: flex; align-items: center; gap: 4px; padding: 0 14px; border: .8px solid #fff; border-radius: 9px; background: #fff; color: #041935; font-weight: 700; }
.ymi-request__other-input { width: 100px; padding: 10px 0; border: 0; background: transparent; color: #041935; font: 700 16px/24px var(--font-body); }
.ymi-btn--confirm { display: flex; justify-content: center; align-items: center; width: 100%; margin-top: 4px; padding: 12px 24px; border: 0; border-radius: 100px; background: var(--yellow); color: #041935; font: 500 16px/16px var(--font-body); box-shadow: 0 0 30px rgba(0, 0, 0, .09); cursor: pointer; }
.ymi-btn--confirm:hover { box-shadow: 0 0 30px rgba(246, 227, 4, .7); }
.ymi-request__privacy { margin: 12px 0 0; text-align: center; font-size: 13.12px; line-height: 24px; }
@media (max-width: 900px) { .pr-layout { grid-template-columns: 1fr; } .pr-photo { max-width: 448px; margin-inline: auto; } .ymi-request__row--split { grid-template-columns: 1fr; } }

/* ==========================================================================
   23. Prayer partner page: clone of the live layout
   ========================================================================== */
.pp-eyebrow { text-transform: uppercase; letter-spacing: .02em; }
.pp-why { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.pp-why__copy h2 { max-width: 14ch; }
.pp-why__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.pp-card { padding: 1.5rem; border: 1.5px solid #6f78d9; border-radius: 16px; background: transparent; }
.pp-card h3 { font-size: var(--fs-card); margin: 0 0 .6rem; }
.pp-card p { margin: 0; font-size: var(--fs-small); }
.pp-topics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 2rem; }
.pp-topic { background: var(--surface); border: 1px solid var(--card-border); border-radius: 16px; box-shadow: var(--card-shadow); padding: 1rem 1rem 1.5rem; display: flex; flex-direction: column; gap: .75rem; }
.pp-topic figure { margin: 0; }
.pp-topic img { width: 100%; height: 240px; object-fit: cover; border-radius: 12px; display: block; }
.pp-topic h3 { font-size: var(--fs-card); margin: .25rem 0 0; }
.pp-topic p { margin: 0; flex: 1; }
.pp-topic .btn { align-self: flex-start; }
.pp-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.pp-form__card { background: var(--surface); border: 1px solid var(--card-border); border-radius: 14px; box-shadow: 0 6px 24px rgba(0, 0, 0, .18); padding: 1.5rem; }
.pp-check { display: flex; gap: .5rem; align-items: flex-start; text-transform: none; font-weight: 400; }
.pp-check input { width: auto; margin-top: .3rem; }
.pp-check a { text-decoration: underline; }
@media (max-width: 900px) { .pp-why, .pp-form { grid-template-columns: 1fr; } .pp-topics { grid-template-columns: 1fr; } .pp-why__cards { grid-template-columns: 1fr; } }

/* Ticks: navy, as on the live site; bare cutouts (no backing box) for the prayer partner page */
.checks li::before { background-color: #041935; }
:root[data-theme="dark"] .checks li::before { background-color: #0b2a5c; }
.cutout-bare .cutout::before, .cutout-bare .cutout::after { display: none; }
.cutout-bare .cutout img { max-width: 100%; max-height: 600px; }
.tym-lang, .tym-lang select { color: #fff; opacity: 1; }

/* ==========================================================================
   24. Events: plugin event rows (same class names the plugin prints) + the grey "Our events" block
   ========================================================================== */
.ymi-events-list { display: flex; flex-direction: column; gap: 26px; max-width: 1137px; margin-inline: auto; }
.ymi-event-row { display: flex; align-items: center; gap: 26px; padding: 22px 30px; background: var(--surface); border-radius: 11px; box-shadow: 0 15px 15px -10px rgba(0, 0, 0, .15); }
.ymi-event-row__date { flex: none; min-width: 84px; padding: 14px 10px; border-radius: 10px; background: var(--yellow); text-align: center; line-height: 1; }
.ymi-event-row__day { display: block; font: 700 36.8px/36.8px var(--font-body); letter-spacing: -.02em; color: #041935; }
.ymi-event-row__month { display: block; margin-top: 4px; font: 700 11.52px/11.52px var(--font-body); text-transform: uppercase; letter-spacing: .08em; color: #041935; }
.ymi-event-row__photo { flex: none; width: 118px; height: 118px; border-radius: 50%; background: #e4ecfc; display: flex; align-items: center; justify-content: center; }
.ymi-event-row__initial { font: 600 38.4px/24px var(--font-body); color: #2454d9; }
.ymi-event-row__body { flex: 1; padding-left: 26px; border-left: 1px solid var(--line); min-width: 0; }
.ymi-event-row__title { margin: 0 0 8px; font: 700 23.2px/29px var(--font-head); color: var(--heading); }
.ymi-event-row__desc { margin: 0; font-size: 15.68px; line-height: 1.6; }
.ymi-event-row__meta { margin: 8px 0 0; font: 600 13.6px/24px var(--font-body); color: #1fa6c9; }
.ymi-event-row__cta { flex: none; padding: 12px 24px; border: 0; border-radius: 100px; background: #2454d9; color: #fff; font: 500 16px/16px var(--font-body); text-transform: uppercase; letter-spacing: .03em; box-shadow: 0 0 30px rgba(0, 0, 0, .09); cursor: pointer; }
.ymi-event-row__cta:hover { box-shadow: 0 0 30px rgba(246, 227, 4, .6); }
:root[data-theme="dark"] .ymi-event-row__photo { background: #16284a; }
.section--grey { background: #f3f3f3; }
:root[data-theme="dark"] .section--grey { background: var(--bg-soft); }
.ev-head { max-width: 1100px; margin-bottom: 2rem; }
.ev-head h2 { margin: .25rem 0 1rem; }
.ev-grid { display: grid; grid-template-columns: minmax(0, 375px) minmax(0, 341px) minmax(0, 341px); gap: 1.5rem; justify-content: start; }
.ev-photo { position: relative; border-radius: 20px; overflow: hidden; min-height: 461px; }
.ev-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ev-photo span { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; padding: .7rem 1rem; border-radius: 10px; background: rgba(4, 25, 53, .85); color: #fff; font: 700 1.125rem var(--font-head); }
.ev-col { display: grid; gap: 1.5rem; align-content: stretch; }
.ev-card { padding: 1.5rem; border-radius: 10px; background: var(--surface); }
.ev-card__cat { margin: 0 0 .4rem; font: 700 .8125rem/1.2 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: #1fa6c9; }
.ev-card__t { margin: 0 0 .5rem; font: 700 1.125rem/1.35 var(--font-head); color: var(--heading); }
.ev-card p:last-child { margin: 0; font-size: var(--fs-small); }
@media (max-width: 1000px) { .ev-grid { grid-template-columns: 1fr 1fr; } .ev-photo { grid-column: 1 / -1; min-height: 320px; } }
@media (max-width: 640px) { .ev-grid { grid-template-columns: 1fr; } .ymi-event-row { flex-wrap: wrap; padding: 18px; } .ymi-event-row__photo { display: none; } .ymi-event-row__body { border-left: 0; padding-left: 0; flex-basis: 100%; } }

/* ==========================================================================
   25. Fundraiser page: clone of the live layout
   ========================================================================== */
.fr-intro { max-width: 1121px; }
.fr-intro h2 { margin: .25rem 0 1rem; }
.fr-intro .btn { margin-top: .5rem; }
.fr-work { display: grid; gap: 2rem; }
.fr-work__head h2 { margin: .25rem 0 0; }
.fr-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.fr-steps li { display: flex; flex-direction: column; gap: .75rem; padding: 1.5rem; border-radius: 16px; background: var(--surface); border: 1px solid var(--card-border); }
.fr-steps li:hover { box-shadow: var(--glow); border-color: transparent; }
.fr-steps__n { display: flex; align-items: center; gap: .75rem; }
.fr-steps__n b { font: 700 1.5rem var(--font-head); color: var(--heading); }
.fr-steps__n hr { flex: 1; border: 0; border-top: 2px solid var(--line); margin: 0; }
.fr-steps h3 { font-size: var(--fs-card); margin: 0; }
.fr-steps p { margin: 0; font-size: var(--fs-small); }
.fr-left { text-align: left; margin-inline: 0; max-width: none; }
.fr-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.fr-photo { position: relative; min-height: 500px; border-radius: 20px; overflow: hidden; display: flex; align-items: flex-end; }
.fr-photo--wide { grid-column: 1 / -1; }
.fr-photo > picture, .fr-photo > img { position: absolute; inset: 0; }
.fr-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fr-photo__box { position: relative; margin: 1.25rem; max-width: 360px; padding: 1.25rem; border-radius: 12px; background: var(--surface); box-shadow: 0 10px 30px rgba(0, 0, 0, .2); display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.fr-photo__box h3 { font-size: 1.375rem; margin: 0; }
.fr-photo__box p { margin: 0; font-size: var(--fs-small); }
.fr-trust { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.fr-trust__media figure { margin: 0; }
.fr-trust__media img { width: 100%; display: block; border-radius: 20px; object-fit: cover; }
.fr-trust__media > figure img { aspect-ratio: 536 / 400; }
.fr-trust__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
.fr-trust__pair img { aspect-ratio: 256 / 200; }
.fr-values { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1.5rem; }
.fr-values li { display: flex; gap: 1rem; align-items: flex-start; }
.fr-values h3 { font-size: var(--fs-card); margin: 0 0 .25rem; }
.fr-values p { margin: 0; font-size: var(--fs-small); }
@media (max-width: 1000px) { .fr-steps { grid-template-columns: 1fr 1fr; } .fr-trust { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .fr-steps, .fr-photos { grid-template-columns: 1fr; } .fr-photo { min-height: 420px; } }

/* ==========================================================================
   26. Partner With Us: clone of the live layout
   ========================================================================== */
.pw-start { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.pw-start h2 { margin: 0; max-width: 12ch; }
.pw-start__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.pw-start__list li { display: flex; gap: .9rem; align-items: flex-start; }
.pw-start__list figure { margin: 0; flex: none; width: 96px; }
.pw-start__list img { width: 96px; height: 54px; object-fit: cover; border-radius: 8px; display: block; }
.pw-start__list h3 { font-size: 1rem; margin: 0 0 .4rem; }
.pw-start__list p { margin: 0; font-size: var(--fs-small); }
.pw-ways-head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; margin-bottom: 2.5rem; }
.pw-ways-head h2 { margin: .25rem 0 0; }
.pw-ways { display: grid; grid-template-columns: 1fr 1.1fr 1fr; gap: 1.5rem; align-items: stretch; }
.pw-col { display: grid; gap: 1.5rem; align-content: start; }
.pw-card { padding: 1.25rem 1.5rem; border-radius: 10px; background: var(--surface); border: 1px solid var(--card-border); }
.pw-card h3 { display: flex; align-items: center; gap: .6rem; font-size: 1rem; margin: 0 0 .5rem; }
.pw-card--c h3 { justify-content: center; }
.pw-card p { margin: 0; font-size: var(--fs-small); }
.pw-av { flex: none; width: 47px; height: 47px; border-radius: 12px; overflow: hidden; }
.pw-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pw-prayer { position: relative; display: flex; align-items: flex-end; min-height: 380px; border-radius: 20px; overflow: hidden; color: #fff; text-decoration: none; }
.pw-prayer picture, .pw-prayer img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pw-prayer::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 20%, rgba(4, 25, 53, .88)); }
.pw-prayer__txt { position: relative; z-index: 1; padding: 1.5rem; display: grid; gap: .6rem; }
.pw-prayer__txt b { font: 600 1.125rem/1.45 var(--font-head); }
.pw-prayer__txt em { font-style: normal; font-weight: 700; color: var(--yellow); }
.pw-focus { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.pw-focus figure { position: relative; margin: 0; border-radius: 12px; overflow: hidden; aspect-ratio: 364 / 520; }
.pw-focus img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pw-focus figcaption { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; padding: .6rem .9rem; border-radius: 10px; background: rgba(4, 25, 53, .85); color: #fff; font: 700 1rem var(--font-head); }
.pw-focus__tags { margin-top: 1.5rem; }
.pw-more { display: grid; grid-template-columns: minmax(0, 592px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.pw-more figure { margin: 0; }
.pw-more img { width: 100%; height: auto; border-radius: 20px; display: block; }
@media (max-width: 1000px) { .pw-start, .pw-ways-head, .pw-more { grid-template-columns: 1fr; } .pw-start__list { grid-template-columns: 1fr; } .pw-ways { grid-template-columns: 1fr; } .pw-focus { grid-template-columns: 1fr; } .pw-focus figure { aspect-ratio: 4 / 3; } }

/* ==========================================================================
   27. Programs page: plugin programme cards (same class names the plugin prints)
   ========================================================================== */
.ymi-programs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(279px, 1fr)); gap: 38px 30px; margin: 24px 0; }
.ymi-program-card { display: flex; flex-direction: column; padding: 14px 14px 24px; border-radius: 11px; background: var(--surface); box-shadow: 0 15px 15px -10px rgba(0, 0, 0, .15); }
.ymi-program-card__photo { position: relative; display: flex; align-items: center; justify-content: center; min-height: 168px; margin: 0 0 22px; border-radius: 18px; background: #e4ecfc; }
:root[data-theme="dark"] .ymi-program-card__photo { background: #16284a; }
.ymi-program-card__initial { font: 600 41.6px/24px var(--font-body); color: #2454d9; }
.ymi-program-card__date { position: absolute; top: 12px; left: 12px; width: 56px; height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 11px; background: var(--yellow); color: #041935; }
.ymi-program-card__day { font: 700 22.4px/22.4px var(--font-body); }
.ymi-program-card__month { font: 700 10.88px/24px var(--font-body); text-transform: uppercase; letter-spacing: .05em; }
.ymi-program-card__cta { position: absolute; right: 14px; bottom: -18px; padding: 12px 24px; border: 0; border-radius: 100px; background: var(--yellow); color: #fff; font: 500 16px/16px var(--font-body); text-transform: uppercase; letter-spacing: .03em; box-shadow: 0 0 30px rgba(0, 0, 0, .09); cursor: pointer; }
.ymi-program-card__body { display: flex; flex-direction: column; padding: 0 8px; }
.ymi-program-card__title { margin: 0 0 6px; font: 700 17.92px/24.2px var(--font-head); color: var(--heading); }
.ymi-program-card__desc { margin: 0 0 18px; font-size: 15.2px; line-height: 1.55; }
.ymi-readmore { align-self: flex-start; margin: 10px 0 0; padding: 0; border: 0; background: none; color: #2454d9; font: 700 12.48px/17.5px var(--font-body); text-transform: uppercase; letter-spacing: .06em; cursor: pointer; }
.ymi-program-card__meta { margin: 0; font: 600 13.6px/24px var(--font-body); color: #1fa6c9; }

/* ==========================================================================
   28. Programme pages: clone of the live layout (article + sticky sidebar)
   ========================================================================== */
.prog-tag { padding-block: 2.5rem; }
.prog-tag h2 { margin: 0 0 .5rem; }
.prog-tag p { margin: 0; font: 500 1.125rem/1.5 var(--font-head); color: var(--text); }
.prog-layout { display: grid; grid-template-columns: minmax(0, 680px) minmax(0, 345px); gap: clamp(1.5rem, 5vw, 4.5rem); justify-content: center; align-items: start; }
.prog-main > * + * { margin-top: 1.25rem; }
.prog-hero { margin: 0; }
.prog-hero img, .prog-strip img { width: 100%; display: block; border-radius: 12px; object-fit: cover; }
.prog-hero img { aspect-ratio: 680 / 383; }
.prog-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.prog-strip figure { margin: 0; }
.prog-strip img { aspect-ratio: 330 / 200; }
.prog-main h2 { margin-top: 2rem; }
.prog-side { display: grid; gap: 1.25rem; position: sticky; top: 130px; }
.prog-card { padding: 1.5rem; border-radius: 12px; background: var(--surface); border: 1px solid var(--card-border); box-shadow: var(--card-shadow); text-align: center; }
.prog-card h2 { font-size: 1.375rem; margin: 0 0 .75rem; }
.prog-card p { font-size: var(--fs-small); }
.prog-pill { padding: .8rem 1rem; border-radius: 10px; background: #041935; color: #fff !important; font-size: 1.125rem !important; }
.prog-more { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: 1.25rem; text-align: left; }
.prog-more li { display: flex; gap: .9rem; align-items: flex-start; }
.prog-more figure { margin: 0; flex: none; width: 96px; }
.prog-more img { width: 96px; height: 60px; object-fit: cover; border-radius: 8px; display: block; }
.prog-more h3 { font-size: 1.0625rem; margin: 0 0 .3rem; }
.prog-more p { margin: 0; font-size: var(--fs-small); text-align: left; }
.prog-faq-title { margin: 0 0 1.5rem; max-width: 16ch; }
@media (max-width: 1000px) { .prog-layout { grid-template-columns: 1fr; } .prog-side { position: static; } }

/* ==========================================================================
   29. How sponsorship works: clone of the live layout
   ========================================================================== */
.hs-return { max-width: 1121px; }
.hs-return h2 { margin: 0 0 .75rem; }
.hs-return__list { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.hs-return__list h3 { font-size: var(--fs-card); margin: 0 0 .5rem; }
.hs-return__list p { margin: 0; }
.hs-return__note { margin-top: 2rem; font-size: var(--fs-small); font-style: italic; }
.hs-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: start; margin-top: 2rem; }
.hs-types__col { display: grid; gap: 1.5rem; }
.hs-type { padding: 1.5rem; border-radius: 10px; background: #f3f3f3; color: #4e5c71; display: grid; gap: .75rem; align-content: start; }
.hs-type h3 { margin: 0; font-size: 1.125rem; color: #041935; }
.hs-type p { margin: 0; font-size: var(--fs-small); }
.hs-type--yellow { background: var(--yellow); color: #041935; }
:root[data-theme="dark"] .hs-type:not(.hs-type--yellow) { background: #10284a; color: var(--text); }
:root[data-theme="dark"] .hs-type:not(.hs-type--yellow) h3 { color: var(--heading); }
.hs-types__foot { margin-top: 2.5rem; text-align: center; display: grid; gap: 1.25rem; justify-items: center; color: #fff; }
.hs-types__foot p { margin: 0; max-width: 60ch; font: 600 1.125rem/1.5 var(--font-head); }
.hs-ready { padding: clamp(1.5rem, 4vw, 3rem); border-radius: 20px; background: #667085; color: #fff; display: grid; gap: 1.25rem; }
.hs-ready h2, .hs-ready p { color: #fff; margin: 0; }
.hs-ready__bar { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; padding: 1.25rem 1.75rem; border-radius: 20px; background: var(--yellow); color: #041935; }
.hs-ready__bar b { font: 600 1.25rem var(--font-head); }
@media (max-width: 900px) { .hs-return__list, .hs-types { grid-template-columns: 1fr; } }

/* ==========================================================================
   30. Preview stand-ins for the calendar, booking and projects shortcodes
   ========================================================================== */
.book-mock { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 2rem; max-width: 900px; margin-inline: auto; padding: 1.5rem; background: var(--surface); border: 1px solid var(--card-border); border-radius: 16px; box-shadow: var(--card-shadow); }
.book-mock__head, .pcal-mock__head { margin-bottom: .75rem; font: 700 1.125rem var(--font-head); color: var(--heading); }
.book-mock__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.book-mock__grid span { display: grid; place-items: center; aspect-ratio: 1; border-radius: 10px; font-size: .9375rem; }
.book-mock__grid .dow { aspect-ratio: auto; font-weight: 700; font-size: .75rem; color: var(--text); }
.book-mock__grid .day { background: var(--bg-soft); color: var(--heading); }
.book-mock__grid .day.off { opacity: .35; }
.book-mock__grid .day.on { background: #2454d9; color: #fff; }
.book-mock__grid .day.pray { background: var(--yellow); color: #041935; font-weight: 700; }
.book-mock__times { display: grid; gap: .6rem; align-content: start; }
.book-mock__times b { font-family: var(--font-head); color: var(--heading); }
.slot { padding: .65rem 1rem; border: 1.5px solid #2454d9; border-radius: 10px; color: #2454d9; font-weight: 600; text-align: center; }
.pcal-mock { max-width: 640px; margin-inline: auto; padding: 1.5rem; background: var(--surface); border: 1px solid var(--card-border); border-radius: 16px; box-shadow: var(--card-shadow); }
.pcal-mock__key { margin: 1rem 0 0; display: flex; align-items: center; gap: .5rem; font-size: var(--fs-small); }
.pcal-mock__key i { width: 14px; height: 14px; border-radius: 4px; background: var(--yellow); }
.proj-mock { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem; }
.proj-mock__card { padding: 1.5rem; background: var(--surface); border: 1px solid var(--card-border); border-radius: 12px; box-shadow: var(--card-shadow); display: grid; gap: .6rem; align-content: start; }
.proj-mock__card h3 { margin: 0; font-size: var(--fs-card); }
.proj-mock__card p { margin: 0; }
.proj-mock__bar { height: 10px; border-radius: 6px; background: var(--bg-soft); overflow: hidden; }
.proj-mock__bar span { display: block; height: 100%; background: #2454d9; }
.proj-mock__meta { font-size: var(--fs-small); }
.proj-mock__card .ymi-request__amount { justify-self: start; }
@media (max-width: 800px) { .book-mock { grid-template-columns: 1fr; } }

/* Footer wave: one shape over a matching background, and the columns overlap it, so no seam line can show */
.tf-wave { background: var(--f-cols); margin-bottom: -3px; line-height: 0; }
.tf-wave svg { display: block; width: 100%; margin: 0; }
.tf-cols { margin-top: 0; position: relative; z-index: 1; box-shadow: 0 -2px 0 var(--f-cols); }

/* Meet the children: clone of the live layout */
.mt-how { max-width: 1121px; }
.mt-how__list { list-style: none; margin: 2rem 0; padding: 0; display: grid; gap: 1.25rem; }
.mt-how__list li { display: flex; gap: 1.25rem; align-items: flex-start; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); }
.mt-how__list b { flex: none; font: 700 1.5rem var(--font-head); color: var(--heading); min-width: 3rem; }
.mt-how__list h3 { margin: 0 0 .35rem; font-size: var(--fs-card); }
.mt-how__list p { margin: 0; }
.mt-ready { max-width: 1025px; margin-inline: auto; }
.mt-ready .hs-ready__bar { margin-top: 1.5rem; }

/* Sponsorship impact: clone of the live layout */
.im-head { max-width: 760px; margin-bottom: 2rem; }
.im-head h2 { margin: 0 0 .5rem; }
.im-cards { columns: 3 300px; column-gap: 1.5rem; }
.im-card { break-inside: avoid; margin: 0 0 1.5rem; padding: 1rem 1rem 1.5rem; background: var(--surface); border: 1px solid var(--card-border); border-radius: 16px; box-shadow: var(--card-shadow); }
.im-card figure { margin: 0 0 1rem; }
.im-card img { width: 100%; height: auto; display: block; border-radius: 12px; }
.im-card h3 { font-size: var(--fs-card); margin: 0 0 .5rem; padding-inline: .5rem; }
.im-card p { margin: 0; font-size: var(--fs-small); padding-inline: .5rem; }
.im-work { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; margin-top: 1.5rem; }
.im-work__card { padding: 1.75rem; border-radius: 20px; background: #f3f3f3; display: grid; gap: .75rem; align-content: start; justify-items: start; }
:root[data-theme="dark"] .im-work__card { background: var(--bg-soft); }
.im-work__card h3 { margin: 0; font-size: 1.25rem; }
.im-work__card p { margin: 0; }
@media (max-width: 800px) { .im-work { grid-template-columns: 1fr; } }

/* ==========================================================================
   31. Home page edits (client review): larger type, taller hero image over the violet panel, full-width About
   ========================================================================== */
/* Hero: three columns, tall image sitting on top of the violet panel */
.hero::after { left: 61%; right: 0; width: auto; }
.hero__grid { grid-template-columns: 1.35fr 1fr .8fr; gap: clamp(1.5rem, 3.5vw, 3.5rem); min-height: 780px; padding-block: clamp(3rem, 6vw, 5.5rem); }
.hero__kicker { font-size: 1.0625rem; margin-bottom: 1.5rem; }
.hero__copy h1 { font-size: clamp(2.5rem, 1.2rem + 3.6vw, 3.75rem); line-height: 1.04; max-width: 11.5ch; }
.hero__copy .lead { font-size: 1.3125rem; line-height: 1.55; max-width: 34ch; }
.hero__media { min-height: 0; }
.hero__media img { height: 100%; min-height: 560px; }
.tag { font-size: 1.0625rem; max-width: 165px; padding: 12px 14px; }
.quote { font-size: 1.3125rem; line-height: 1.5; }
.quote cite b { font-size: 1.0625rem; }
.quote cite span { font-size: .9375rem; }
.hero__side .btn { align-self: flex-start; }

/* About: full-width heading and lead, larger cards that fill their boxes */
.about__head { display: block; margin-bottom: 3.5rem; }
.about__head .eyebrow { display: block; margin-bottom: 1rem; }
.about__head h2 { font-size: clamp(1.9rem, 1.1rem + 2.2vw, 2.75rem); line-height: 1.12; max-width: none; margin-bottom: 1.25rem; }
.about__head p, .about__head .lead { font-size: 1.3125rem; line-height: 1.6; max-width: none; margin-bottom: 1.75rem; }
.duo__photo { min-height: 420px; }
.duo .card { display: flex; flex-direction: column; justify-content: center; gap: .35rem; padding: 2rem 1.75rem; }
.duo .card h3 { font-size: 1.625rem; line-height: 1.2; margin-bottom: .25rem; }
.duo .card .sub { font-size: 1.125rem; font-weight: 600; margin-bottom: 1.25rem; }
.duo .card p:last-child { font-size: 1.1875rem; line-height: 1.6; }

/* Trust (navy) */
.trust__head { max-width: 900px; }
.trust__head h2 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.125rem); line-height: 1.1; }
.trust__head p { font-size: 1.3125rem; line-height: 1.55; }
.trust__grid .card { padding: 1.75rem; }
.trust__grid .card h3 { font-size: 1.5rem; line-height: 1.2; }
.trust__grid .card p { font-size: 1.125rem; line-height: 1.55; }
.trust__grid .card small { font-size: 1.0625rem; }
.trust__grid .card--yellow { background: var(--yellow) !important; }
.trust__grid .card--yellow, .trust__grid .card--yellow h3, .trust__grid .card--yellow p, .trust__grid .card--yellow small { color: #041935 !important; }
.trust__cta h3 { font-size: 1.625rem; }

/* Services: larger type, text runs the full width, no divider lines */
.services__head h2 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.125rem); line-height: 1.1; max-width: 17ch; }
.services__head p { font-size: 1.3125rem; line-height: 1.55; }
.service-list { border-top: 0; }
.service-list li { border-bottom: 0; grid-template-columns: 110px 1fr; padding: 1.75rem 1rem; border-radius: 16px; }
.service-list li:hover { padding-left: 1.5rem; }
.service-list .num { font: 700 1.25rem var(--font-head); color: var(--heading); padding-top: .2rem; }
.service-list h3 { font-size: 1.625rem; line-height: 1.2; margin-bottom: .5rem; }
.service-list p { font-size: 1.1875rem; line-height: 1.6; max-width: none; }

/* Kindness / CTA: larger heading and text, bigger image */
.cta::after { width: 46%; }
.cta__grid { grid-template-columns: 1fr 1.25fr; }
.cta__copy h2 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.125rem); line-height: 1.1; max-width: 14ch; }
.cta__copy p { font-size: 1.25rem; line-height: 1.6; max-width: 40ch; }
.cta__media img { aspect-ratio: 715 / 553; }

@media (max-width: 1024px) { .hero__grid { min-height: 0; } .hero__media img { min-height: 420px; } .quote { font-size: 1.125rem; } }
@media (max-width: 720px) { .hero__copy h1 { max-width: none; } .hero__copy .lead { max-width: none; } .duo__photo { min-height: 260px; } }

/* ==========================================================================
   32. Home page: type brought back to the live site's sizes (section 31 was too large)
   ========================================================================== */
.hero__kicker { font-size: 1rem; }
.hero__copy h1 { font-size: clamp(2.25rem, 1.2rem + 3.6vw, 3.75rem); }
.hero__copy .lead { font-size: 1.1875rem; line-height: 1.55; max-width: 36ch; }
.tag { font-size: 1rem; max-width: 150px; padding: 10px 12px; }
.quote { font-size: 1.0625rem; line-height: 1.55; }
.quote cite b { font-size: .9375rem; }
.quote cite span { font-size: .8125rem; }

.about__head h2 { font-size: clamp(1.75rem, 1rem + 2vw, 2.75rem); }
.about__head p, .about__head .lead { font-size: clamp(1.0625rem, .9rem + .6vw, 1.3125rem); line-height: 1.55; }
.duo__photo { min-height: 360px; }
.duo .card { padding: 1.75rem 1.5rem; }
.duo .card h3 { font-size: 1.375rem; }
.duo .card .sub { font-size: 1rem; margin-bottom: 1rem; }
.duo .card p:last-child { font-size: 1.0625rem; line-height: 1.6; }

.trust__head h2 { font-size: clamp(1.75rem, 1rem + 2.4vw, 3.125rem); }
.trust__head p { font-size: 1.0625rem; line-height: 1.6; }
.trust__grid .card { padding: 1.5rem; }
.trust__grid .card h3 { font-size: 1.3125rem; }
.trust__grid .card p { font-size: 1rem; line-height: 1.6; }
.trust__grid .card small { font-size: .9375rem; }
.trust__cta h3 { font-size: 1.3125rem; }

.services__head h2 { font-size: clamp(1.75rem, 1rem + 2.4vw, 3.125rem); }
.services__head p { font-size: clamp(1.0625rem, .9rem + .6vw, 1.3125rem); line-height: 1.55; }
.service-list li { padding: 1.5rem 1rem; grid-template-columns: 90px 1fr; }
.service-list .num { font-size: 1rem; }
.service-list h3 { font-size: 1.3125rem; }
.service-list p { font-size: 1.0625rem; line-height: 1.6; }

.cta__copy h2 { font-size: clamp(1.75rem, 1rem + 2.4vw, 3.125rem); }
.cta__copy p { font-size: 1.0625rem; line-height: 1.6; max-width: 42ch; }

/* ==========================================================================
   33. About Us edits: body copy size for the whole site, Support Us, staggered vision/mission, community photo
   ========================================================================== */
/* One reading size site-wide (the size of the story text) */
:root { --fs-body: 1.0625rem; --fs-small: 1rem; }
body { font-size: var(--fs-body); line-height: 1.7; }
.prose p, .split__copy > p, .feature__copy > p, .story p, .legal p, .story-block .prose p, .vm-copy p, .vm-mission p, .support-card__copy p { font-size: 1.0625rem; line-height: 1.75; }

/* Support Us: the photo stands on the bottom edge of the card; the grey area behind it carries a design */
.support-sec { position: relative; overflow: hidden; background: var(--bg-soft); padding-block: clamp(3.5rem, 7vw, 6rem); isolation: isolate; }
.support-sec::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .7;
  background-image: linear-gradient(rgba(4, 25, 53, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(4, 25, 53, .07) 1px, transparent 1px);
  background-size: 44px 44px; -webkit-mask-image: linear-gradient(90deg, #000, transparent 45%, transparent 55%, #000); mask-image: linear-gradient(90deg, #000, transparent 45%, transparent 55%, #000); }
.support-sec::after { content: ""; position: absolute; z-index: -1; right: -70px; top: -70px; width: 240px; height: 240px; border-radius: 40px; transform: rotate(18deg); background: var(--yellow); opacity: .9; }
.support-sec .container { position: relative; }
.support-sec .container::before { content: ""; position: absolute; z-index: -1; left: -48px; bottom: -44px; width: 150px; height: 150px; border-radius: 28px; border: 6px solid var(--navy); opacity: .9; transform: rotate(-12deg); }
:root[data-theme="dark"] .support-sec .container::before { border-color: var(--yellow); }
.support-card { margin-top: 0; overflow: visible; box-shadow: 0 24px 60px rgba(4, 25, 53, .18); }
.support-card__art { margin-bottom: 0; padding-bottom: 0; line-height: 0; }
.support-card__art img { display: block; margin-inline: auto; vertical-align: bottom; filter: drop-shadow(0 10px 14px rgba(4, 25, 53, .22)); }

/* Our Vision / Our Mission, staggered like the live site */
.vm-stagger { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; max-width: 1080px; margin-inline: auto; }
.vm-col { display: grid; gap: clamp(1.75rem, 3vw, 2.5rem); align-content: start; }
.vm-col h2 { font-size: clamp(1.9rem, 1rem + 2.4vw, 3.125rem); line-height: 1.1; margin: 0 0 1rem; }
.vm-fig { margin: 0; border-radius: var(--radius-img); overflow: hidden; }
.vm-fig img { width: 100%; aspect-ratio: 486 / 608; object-fit: cover; display: block; }
.vm-mission { margin-top: 0; }
@media (max-width: 860px) { .vm-stagger { grid-template-columns: 1fr; } .vm-col--r { grid-template-columns: 1fr; } .vm-col--r .vm-fig { order: 2; } }

/* Closing call to action over the community photo */
.cta-photo { position: relative; isolation: isolate; overflow: hidden; color: #fff; text-align: center; padding-block: clamp(4rem, 9vw, 8rem); background: var(--navy); }
.cta-photo__img { position: absolute; inset: 0; margin: 0; z-index: -2; }
.cta-photo__img img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.cta-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4, 25, 53, .62), rgba(4, 25, 53, .82)); }
.cta-photo__inner { max-width: 820px; }
.cta-photo h2 { color: #fff; margin: 0 0 1rem; font-size: clamp(1.9rem, 1rem + 2.4vw, 3.125rem); }
.cta-photo p { color: rgba(255, 255, 255, .92); font-size: 1.25rem; line-height: 1.6; margin: 0 auto 1.75rem; max-width: 46ch; }
.cta-photo__btns { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.cta-photo .btn--ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .6); background: transparent; }
.cta-photo .btn--ghost:hover { background: rgba(255, 255, 255, .14); box-shadow: inset 0 0 0 2px #fff; }

/* ==========================================================================
   34. Reading text matched to the live About Us story: 16px, left-aligned, no hyphenation, normal letter spacing
   ========================================================================== */
:root { --fs-body: 1rem; }
body { font-size: 1rem; line-height: 1.6; }
p, li, .prose p, .split__copy > p, .feature__copy > p, .story p, .legal p { hyphens: manual; -webkit-hyphens: manual; }

/* The story block, exactly like the live page */
.story-block h2 { font-size: clamp(2rem, 1rem + 2.6vw, 3.125rem); line-height: 1.1; letter-spacing: normal; margin-bottom: .75rem; }
.story-block h3 { font-size: clamp(1.375rem, 1rem + 1vw, 1.75rem); line-height: 1.3; letter-spacing: normal; margin-bottom: 1rem; }
.story-block .prose p { font-size: 1rem; line-height: 1.5; text-align: left; hyphens: manual; -webkit-hyphens: manual; letter-spacing: normal; word-spacing: normal; margin: 0 0 1rem; }

/* Other long text: same size, same line spacing, no hyphenation */
.vm-copy p, .vm-mission p, .support-card__copy p, .prose p, .split__copy > p, .feature__copy > p, .story p, .legal p { font-size: 1rem; line-height: 1.6; }
.vm-copy p, .vm-mission p, .support-card__copy p { text-align: left; }

/* ==========================================================================
   35. Vision & Mission: four distinct layouts (staggered values, open list, bento goals, staircase plan)
   ========================================================================== */
/* Values: three cards at different heights and colours */
.vals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: start; margin-top: 2.5rem; padding-bottom: 5rem; }
.val { border-radius: 24px; padding: 2rem 1.75rem 2.25rem; display: grid; gap: .75rem; align-content: start; min-height: 250px; box-shadow: 0 18px 40px rgba(4, 25, 53, .12); }
.val:nth-child(2) { margin-top: 2.75rem; } .val:nth-child(3) { margin-top: 5.5rem; }
.val h3 { font-size: 1.5rem; margin: 0; }
.val p { margin: 0; font-size: 1.0625rem; }
.val__icon { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: var(--yellow); color: #041935; }
.val__icon svg { width: 26px; height: 26px; }
.val--navy { background: #041935; color: rgba(255, 255, 255, .88); } .val--navy h3 { color: #fff; }
.val--yellow { background: var(--yellow); color: #041935; } .val--yellow h3, .val--yellow p { color: #041935; }
.val--yellow .val__icon { background: #041935; color: var(--yellow); }
.val--white { background: var(--surface); } .val--white .val__icon { background: #041935; color: var(--yellow); }
:root[data-theme="dark"] .val--white { background: #12213f; }
@media (max-width: 900px) { .vals { grid-template-columns: 1fr; padding-bottom: 0; } .val:nth-child(2), .val:nth-child(3) { margin-top: 0; } .val { min-height: 0; } }

/* What we support: photos, then an open list with no boxes */
.sup-photos { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1rem; margin: 2.5rem 0 3rem; }
.sup-photos figure { margin: 0; border-radius: 20px; overflow: hidden; }
.sup-photos img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.sup { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 3rem; }
.sup li { display: flex; gap: 1.1rem; align-items: flex-start; padding: 1.75rem 0; border-top: 2px solid #041935; }
:root[data-theme="dark"] .sup li { border-top-color: var(--yellow); }
.sup__icon { flex: none; width: 46px; height: 46px; border-radius: 12px; background: #041935; color: var(--yellow); display: grid; place-items: center; }
.sup__icon svg { width: 22px; height: 22px; }
.sup h3 { font-size: 1.3125rem; margin: 0 0 .4rem; }
.sup p { margin: 0 0 .75rem; }
.sup a { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; color: var(--heading); }
.sup a:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 980px) { .sup { grid-template-columns: 1fr 1fr; } .sup-photos { grid-template-columns: 1fr 1fr; } .sup-photos figure:first-child { grid-column: 1 / -1; } }
@media (max-width: 640px) { .sup { grid-template-columns: 1fr; } }

/* Goals: a bento board with one lead goal */
.bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(170px, auto); gap: 1.25rem; margin-top: 2.5rem; }
.bento__big { grid-column: 1 / 3; grid-row: 1 / 3; background: #041935; color: rgba(255, 255, 255, .9); border-radius: 28px; padding: clamp(1.75rem, 4vw, 3rem); display: flex; flex-direction: column; justify-content: flex-end; gap: .9rem; }
.bento__big h3 { color: #fff; font-size: clamp(1.75rem, 1.1rem + 1.6vw, 2.5rem); line-height: 1.12; margin: 0; }
.bento__big p { margin: 0; font-size: 1.125rem; max-width: 40ch; }
.bento__c { background: var(--bg-soft); border-radius: 22px; padding: 1.5rem; display: flex; flex-direction: column; gap: .5rem; justify-content: flex-end; }
.bento__c h3 { font-size: 1.25rem; margin: 0; line-height: 1.2; }
.bento__c p { margin: 0; }
.bento__c--wide { grid-column: span 2; }
.bento__c--yellow { background: var(--yellow); } .bento__c--yellow h3, .bento__c--yellow p { color: #041935; }
.bento__c--lav { background: var(--lavender); } .bento__c--lav h3, .bento__c--lav p { color: #041935; }
:root[data-theme="dark"] .bento__c--lav { background: var(--panel); } :root[data-theme="dark"] .bento__c--lav h3, :root[data-theme="dark"] .bento__c--lav p { color: var(--text); }
.bento__c--navy { background: #0b2a5c; } .bento__c--navy h3 { color: #fff; } .bento__c--navy p { color: rgba(255, 255, 255, .88); }
.bento__icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--yellow); color: #041935; margin-bottom: auto; }
.bento__c:not(.bento__c--navy) .bento__icon { background: #041935; color: var(--yellow); }
.bento__icon svg { width: 22px; height: 22px; }
@media (max-width: 900px) { .bento { grid-template-columns: 1fr 1fr; } .bento__big { grid-column: 1 / -1; grid-row: auto; min-height: 280px; } .bento__c--wide { grid-column: 1 / -1; } }
@media (max-width: 560px) { .bento { grid-template-columns: 1fr; } }

/* Plan: a staircase that rises with each step */
.stair { list-style: none; margin: 3rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; align-items: end; }
.stair li { padding: 1.5rem 1.25rem 1.75rem; display: flex; flex-direction: column; gap: .6rem; justify-content: flex-end; border-radius: 20px 20px 0 0; }
.stair b { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; font: 800 1.125rem var(--font-head); background: #041935; color: var(--yellow); }
.stair h3 { font-size: 1.1875rem; margin: 0; line-height: 1.25; }
.stair p { margin: 0; font-size: .9375rem; }
.stair__s1 { min-height: 250px; background: #e4e7fd; } .stair__s2 { min-height: 300px; background: #c6cbf7; }
.stair__s3 { min-height: 350px; background: #8f9ae8; } .stair__s4 { min-height: 400px; background: #2f4a9e; } .stair__s5 { min-height: 450px; background: #041935; }
.stair__s1, .stair__s2, .stair__s3 { color: #041935; } .stair__s1 h3, .stair__s2 h3, .stair__s3 h3 { color: #041935; }
.stair__s4, .stair__s5 { color: rgba(255, 255, 255, .9); } .stair__s4 h3, .stair__s5 h3 { color: #fff; }
.stair__s4 b { background: var(--yellow); color: #041935; } .stair__s5 b { background: var(--yellow); color: #041935; }
@media (max-width: 900px) { .stair { grid-template-columns: 1fr; gap: .75rem; } .stair li { min-height: 0 !important; border-radius: 16px; } }

/* ==========================================================================
   36. Vision & Mission, round 2: straight values, interactive program showcase, editorial plan
   ========================================================================== */
/* Values: one straight row, equal height */
.vals { align-items: stretch; padding-bottom: 0; margin-top: 2.5rem; }
.val:nth-child(2), .val:nth-child(3) { margin-top: 0; }
.val { min-height: 0; height: 100%; }
.val--lav { background: var(--lavender); color: #041935; } .val--lav h3, .val--lav p { color: #041935; }
.val--lav .val__icon { background: #041935; color: var(--yellow); }
:root[data-theme="dark"] .val--lav { background: var(--panel); } :root[data-theme="dark"] .val--lav h3, :root[data-theme="dark"] .val--lav p { color: var(--text); }

/* Program showcase: a list on the left, the selected program on the right */
.ptabs { display: grid; grid-template-columns: minmax(280px, 4fr) 8fr; gap: clamp(1.25rem, 3vw, 2.5rem); margin-top: 2.5rem; align-items: stretch; }
.ptabs__list { display: grid; gap: .5rem; align-content: start; }
.ptabs__list button { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: .9rem; text-align: left; padding: .85rem 1rem; border: 1px solid var(--card-border); border-radius: 16px; background: var(--surface); color: var(--heading); font: 600 1.0625rem/1.3 var(--font-head); cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s; }
.ptabs__icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #041935; color: var(--yellow); }
.ptabs__icon svg { width: 22px; height: 22px; }
.ptabs__arrow { opacity: 0; transform: translateX(-6px); transition: opacity .2s, transform .2s; }
.ptabs__list button:hover { border-color: #041935; }
.ptabs__list button[aria-selected="true"] { background: #041935; color: #fff; border-color: #041935; transform: translateX(6px); }
.ptabs__list button[aria-selected="true"] .ptabs__icon { background: var(--yellow); color: #041935; }
.ptabs__list button[aria-selected="true"] .ptabs__arrow { opacity: 1; transform: none; color: var(--yellow); }
:root[data-theme="dark"] .ptabs__list button[aria-selected="true"] { background: #0b2a5c; border-color: #0b2a5c; }
.ptabs__stage { position: relative; min-height: 460px; border-radius: 24px; overflow: hidden; background: #041935; }
.ptabs__panel { position: absolute; inset: 0; }
.ptabs__panel figure { margin: 0; position: absolute; inset: 0; }
.ptabs__panel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ptabs__panel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4, 25, 53, 0) 35%, rgba(4, 25, 53, .9)); pointer-events: none; }
.ptabs__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: clamp(1.25rem, 3vw, 2.25rem); display: grid; gap: .6rem; justify-items: start; }
.ptabs__body h3 { color: #fff; font-size: clamp(1.5rem, 1rem + 1.2vw, 2.125rem); margin: 0; line-height: 1.15; }
.ptabs__body p { color: rgba(255, 255, 255, .92); margin: 0; max-width: 52ch; font-size: 1.0625rem; }
.js-tabs .ptabs__panel { opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s; }
.js-tabs .ptabs__panel.is-on { opacity: 1; visibility: visible; }
html:not(.js-tabs) .ptabs__stage { min-height: 0; background: none; display: grid; gap: 1.5rem; }
html:not(.js-tabs) .ptabs__panel { position: relative; min-height: 360px; border-radius: 20px; overflow: hidden; }
@media (max-width: 900px) { .ptabs { grid-template-columns: 1fr; } .ptabs__list { grid-template-columns: 1fr 1fr; } .ptabs__list button { grid-template-columns: 36px 1fr; padding: .7rem; font-size: .9375rem; } .ptabs__icon { width: 36px; height: 36px; } .ptabs__arrow { display: none; } .ptabs__list button[aria-selected="true"] { transform: none; } .ptabs__stage { min-height: 420px; } }
@media (max-width: 520px) { .ptabs__list { grid-template-columns: 1fr; } }

/* Plan: editorial rows beside a sticky intro */
.plan { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.plan__side { position: sticky; top: 130px; display: grid; gap: 1.25rem; }
.plan__side h2 { font-size: clamp(2rem, 1.1rem + 2.4vw, 3.125rem); line-height: 1.08; margin: 0; }
.plan__side p { margin: 0; font-size: 1.0625rem; }
.plan__side figure { margin: .5rem 0 0; border-radius: 24px; overflow: hidden; }
.plan__side img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; display: block; }
.plan__list { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.plan__list li { display: grid; grid-template-columns: 110px 1fr; gap: 0 1.25rem; align-items: start; padding: 2rem 1.5rem; border-top: 1px solid var(--line); border-radius: 0; transition: background .25s ease, color .25s ease; }
.plan__n { font: 300 3.75rem/.95 var(--font-head); color: transparent; -webkit-text-stroke: 1.5px var(--heading); letter-spacing: -.02em; transition: color .25s, -webkit-text-stroke-color .25s; }
.plan__list h3 { font-size: 1.5rem; line-height: 1.2; margin: 0 0 .5rem; transition: color .25s; }
.plan__list p { margin: 0; font-size: 1.0625rem; transition: color .25s; }
.plan__list li:hover { background: #041935; }
.plan__list li:hover h3 { color: #fff; } .plan__list li:hover p { color: rgba(255, 255, 255, .88); }
.plan__list li:hover .plan__n { color: var(--yellow); -webkit-text-stroke-color: var(--yellow); }
@media (max-width: 900px) { .plan { grid-template-columns: 1fr; } .plan__side { position: static; } .plan__list li { grid-template-columns: 72px 1fr; padding: 1.5rem 1rem; } .plan__n { font-size: 2.75rem; } }

/* Light grey band (as used on the live site) */
.section--gray { background: #f3f3f3; }
:root[data-theme="dark"] .section--gray { background: var(--bg-soft); }

/* ==========================================================================
   37. Leadership: equal portraits, fuller stories, redesigned "Built on love"
   ========================================================================== */
.leader { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }
.leader--rev { grid-template-columns: 380px minmax(0, 1fr); }
.leader__photo, .leader__tile { width: 380px; max-width: 100%; margin-inline: auto; position: sticky; top: 140px; }
.leader__photo img, .leader__tile { aspect-ratio: 4 / 5; }
.leader__photo img { object-position: center top; height: auto; }
.leader__copy p { text-align: left; font-size: 1rem; line-height: 1.7; hyphens: manual; }
.leader__where { display: flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--heading); margin: 0 0 1.25rem; }
.leader__where svg { color: var(--teal); flex: none; }
.leader__bring { list-style: none; margin: 1.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.leader__bring li { padding: .45rem .95rem; border-radius: 10px; background: var(--lavender); color: #041935; font-weight: 600; font-size: .9375rem; }
:root[data-theme="dark"] .leader__bring li { background: var(--panel); color: var(--text); }
@media (max-width: 860px) { .leader, .leader--rev { grid-template-columns: 1fr; } .leader__photo, .leader__tile { position: static; } .leader--rev .leader__photo, .leader--rev .leader__tile { order: -1; } }

/* Built on love: navy, warm and full */
.love { position: relative; isolation: isolate; overflow: hidden; background: #041935; color: rgba(255, 255, 255, .9); padding-block: clamp(4rem, 8vw, 7rem); }
.love__bg { position: absolute; inset: 0; margin: 0; z-index: -2; }
.love__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.love::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4, 25, 53, .9), rgba(4, 25, 53, .96)); }
.love__head { max-width: 860px; margin-inline: auto; text-align: center; }
.love__head .eyebrow { color: var(--yellow); }
.love__head h2 { color: #fff; font-size: clamp(2.25rem, 1.2rem + 3.4vw, 4rem); margin: 0 0 1.5rem; }
.love__head p { font-size: 1.125rem; line-height: 1.7; color: rgba(255, 255, 255, .9); margin: 0 0 1.25rem; text-align: center; }
.love__places { list-style: none; margin: 3rem auto 0; padding: 0; max-width: 1040px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; position: relative; }
.love__places::before { content: ""; position: absolute; left: 16%; right: 16%; top: 38px; border-top: 2px dashed rgba(246, 227, 4, .55); }
.love__places li { position: relative; display: grid; gap: .2rem; justify-items: center; text-align: center; padding: 1.25rem 1rem 1.5rem; border-radius: 20px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(2px); }
.love__places span { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: var(--yellow); color: #041935; margin-bottom: .5rem; position: relative; z-index: 1; }
.love__places span svg { width: 24px; height: 24px; }
.love__places b { color: #fff; font: 700 1.25rem var(--font-head); }
.love__places em { font-style: normal; color: var(--yellow); font-weight: 600; font-size: .9375rem; }
.love__places p { margin: .5rem 0 0; color: rgba(255, 255, 255, .85); font-size: 1rem; }
.love__close { margin: 3rem 0 0; text-align: center; color: #fff; font: 700 clamp(1.25rem, 1rem + 1vw, 1.75rem) var(--font-head); }
@media (max-width: 800px) { .love__places { grid-template-columns: 1fr; } .love__places::before { display: none; } }

/* ==========================================================================
   38. FAQ: the live layout, with the heading top-left, the photo overlapping the navy box
   ========================================================================== */
.faq-live { padding-block: clamp(3.5rem, 6vw, 5.6rem); overflow: visible; }
.faq-live__grid { display: grid; grid-template-columns: minmax(0, 614fr) minmax(0, 634fr); column-gap: clamp(1.25rem, 2.3vw, 2.1rem); align-items: start; }
.faq-live__left { position: relative; z-index: 3; padding-top: 2.3rem; }
.faq-live__left h2 { font-size: clamp(2rem, 1.1rem + 2.6vw, 3.125rem); line-height: 1.1; margin: 0; letter-spacing: normal; text-wrap: balance; }
.faq-live__img { margin: 2.9rem 0 0 14.7%; width: 93.5%; position: relative; }
.faq-live__img img { width: 100%; aspect-ratio: 574 / 384; object-fit: cover; border-radius: 10px; display: block; box-shadow: 0 22px 50px rgba(4, 25, 53, .28); }
.faq-live .faq-box.faq-live__box { grid-column: auto; grid-row: auto; margin-top: 2.7rem; position: relative; z-index: 2; background: #041935; border-radius: 20px; padding: clamp(1.5rem, 3.3vw, 3rem); }
.faq-live .faq-box.faq-live__box::before { display: none; }
@media (max-width: 900px) {
  .faq-live__grid { grid-template-columns: 1fr; row-gap: 1.5rem; }
  .faq-live__left { padding-top: 0; }
  .faq-live__img { margin: 1.75rem 0 0; width: 100%; }
  .faq-live .faq-box.faq-live__box { margin-top: 0; }
}
.faq-live .faq-box__lead { font-size: clamp(1.125rem, 1rem + .5vw, 1.3125rem); line-height: 1.5; margin: 0 0 1.5rem; }
.faq-live .faq-box__more { display: none; }
.faq-live .faq-box.faq-live__box { padding: clamp(1.5rem, 2.8vw, 2.5rem); }
.faq-live .faq-box .faq summary { padding-block: .9rem; }
/* FAQ photo a little larger: wider, and overlapping the navy box a little more */
.faq-live__img { margin-left: 8%; width: 106%; }
@media (max-width: 900px) { .faq-live__img { margin: 1.75rem 0 0; width: 100%; } }

/* ==========================================================================
   39. Volunteer page: clone of the live layout
   ========================================================================== */
.vol-hero { display: grid; grid-template-columns: minmax(0, 624fr) minmax(0, 624fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.vol-hero figure { margin: 0; }
.vol-hero img { width: 100%; aspect-ratio: 624 / 450; object-fit: cover; border-radius: 10px; display: block; }
.vol-hero h2, .vol-about h2, .vol-remote h2, .vol-why h2, .vol-form__copy h2 { font-size: clamp(2rem, 1.1rem + 2.6vw, 3.0625rem); line-height: 1.1; margin: 0 0 1.25rem; letter-spacing: normal; }
.vol-hero p, .vol-about p, .vol-remote p, .vol-form__copy p { text-align: left; }
.vol-hero .btn, .vol-about .btn, .vol-remote .btn { margin-top: .5rem; }
.vol-about { max-width: 1200px; }
.vol-about h3 { font-size: 1.1875rem; margin: 0 0 1.25rem; }
.vol-how { display: grid; gap: 2.5rem; }
.vol-how__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.vol-how__head h2 { font-size: clamp(1.75rem, 1rem + 2vw, 2.8125rem); line-height: 1.1; margin: 0; letter-spacing: normal; }
.vol-how__head p { margin: 0; }
.vol-how__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.vol-how__steps li { padding: 0 .5rem; }
.vol-how__steps b { display: block; font: 600 1.125rem/1.4 var(--font-head); color: var(--heading); margin-bottom: .5rem; }
.vol-how__steps p { margin: 0; }
.vol-remote { display: grid; grid-template-columns: minmax(0, 512px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.vol-remote__img { margin: 0; }
.vol-remote__img img { width: 100%; height: auto; display: block; }
.vol-remote h3 { font-size: 1.375rem; margin: 0 0 1.5rem; }
.vol-remote__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 2rem; }
.vol-remote__cols p { margin: 0 0 1rem; }
.vol-why { text-align: center; max-width: 1000px; margin: 0 auto 2.5rem; }
.vol-why h2 { margin-bottom: .75rem; }
.vol-why p { margin: 0; }
.vol-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.vol-card { display: flex; flex-direction: column; border-radius: 11px; overflow: hidden; background: #f9fafa; box-shadow: 0 15px 15px -10px rgba(0, 0, 0, .15); }
:root[data-theme="dark"] .vol-card { background: var(--surface); }
.vol-card figure { margin: 0; }
.vol-card img { width: 100%; height: 250px; object-fit: cover; display: block; }
.vol-card__body { padding: 30px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .9rem; flex: 1; }
.vol-card h3 { font-size: 1.3125rem; margin: 0; }
.vol-card p { margin: 0; flex: 1; }
.vol-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; max-width: 1120px; margin-inline: auto; }
.vol-form__card { background: var(--surface); border: 1px solid var(--card-border); border-radius: 12px; padding: clamp(1.25rem, 3vw, 2rem); box-shadow: var(--card-shadow); display: grid; gap: 1rem; }
.vol-form__card label { font-size: .875rem; font-weight: 500; text-transform: none; }
.vol-form__copy p { margin: 0 0 1.25rem; }
.vol-form__link { color: var(--heading); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 900px) { .vol-hero, .vol-how__head, .vol-remote, .vol-form { grid-template-columns: 1fr; } .vol-how__steps, .vol-cards { grid-template-columns: 1fr 1fr; } .vol-remote__img { max-width: 420px; margin-inline: auto; } .vol-remote__cols { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .vol-how__steps, .vol-cards { grid-template-columns: 1fr; } }
.vol-remote__img img { aspect-ratio: 2 / 3; object-fit: contain; }
/* FAQ: the photo only just touches the navy box, and the questions start clear of it */
.faq-live__img { margin-left: 2%; width: 105%; }
.faq-live .faq-box.faq-live__box { padding-left: clamp(2rem, 3.6vw, 3.5rem); }
@media (max-width: 900px) { .faq-live__img { margin: 1.75rem 0 0; width: 100%; } .faq-live .faq-box.faq-live__box { padding-left: clamp(1.5rem, 3vw, 2rem); } }

/* ==========================================================================
   40. Volunteer page, second pass: the layered original (plus-pattern About, dashed-box journey, Clara standing on the blue box,
       overlapping cards, form card overlapping the footer). Text is justified, as asked.
   ========================================================================== */
.vl-hero p, .vl-about p, .vl-journey__head p, .vl-remote p, .vl-form__copy p { text-align: justify; hyphens: manual; -webkit-hyphens: manual; text-justify: inter-word; }
.vl-hero h2, .vl-about h2, .vl-remote h2, .vl-why h2, .vl-form__copy h2 { font-size: clamp(2rem, 1.1rem + 2.6vw, 3.0625rem); line-height: 1.1; margin: 0 0 1.25rem; letter-spacing: normal; }
.vl-rule { width: 50px; height: 3px; border: 0; background: var(--yellow); margin: 1.25rem 0; }

/* 1. Hero */
.vl-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.vl-hero figure { margin: 0; }
.vl-hero img { width: 100%; aspect-ratio: 624 / 450; object-fit: cover; border-radius: 10px; display: block; }
.vl-hero .btn, .vl-about .btn { margin-top: .75rem; }

/* 2. About: faint plus pattern fading toward the text */
.vl-about { position: relative; isolation: isolate; padding-top: 7rem; padding-bottom: 5rem; background: var(--bg) url("../img/plus-pattern.png") 0 0 / 40px 40px repeat; }
.vl-about::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 20% 30%, color-mix(in srgb, var(--bg) 62%, transparent) 0%, var(--bg) 82%); }
.vl-about .container { max-width: 1240px; }
.vl-about h3 { font-size: 1.1875rem; margin: 0 0 1.25rem; }
:root[data-theme="dark"] .vl-about { background-image: none; }

/* 3. Journey: lavender band with dashed boxes */
.vl-journey { background: #f1f2ff; margin-top: 30px; padding-block: 7rem; }
:root[data-theme="dark"] .vl-journey { background: var(--panel); }
.vl-journey .container { max-width: 1300px; }
.vl-journey__head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 4rem); align-items: end; margin-bottom: 3rem; }
.vl-journey__head h2 { font-size: clamp(1.9rem, 1.1rem + 2.2vw, 2.8125rem); line-height: 1.1; margin: 0; letter-spacing: normal; }
.vl-journey__head p { margin: 0; }
.vl-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.vl-step { padding: 25px; border: 2px dashed rgba(4, 25, 53, .5); border-radius: 12px; }
:root[data-theme="dark"] .vl-step { border-color: rgba(255, 255, 255, .45); }
.vl-step--solid { background: var(--surface); border: 2px solid rgba(4, 25, 53, .12); box-shadow: 0 5px 30px -10px rgba(0, 0, 0, .25); }
.vl-step b { display: block; font: 700 1.1875rem/1.3 var(--font-head); color: var(--heading); margin-bottom: .6rem; }
.vl-step p { margin: 0; }

/* 4. Remote: Clara rises over the journey boxes and stands on the blue band below */
.vl-remote { background: #f6f6f6; padding: 0; position: relative; z-index: 4; }
:root[data-theme="dark"] .vl-remote { background: var(--bg-soft); }
.vl-remote__grid { display: grid; grid-template-columns: minmax(0, 512px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: end; }
.vl-remote__img { margin: -7.5rem 0 0; position: relative; z-index: 5; align-self: end; line-height: 0; }
.vl-remote__img img { width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: contain; display: block; }
.vl-remote__copy { padding-block: 7rem; }
.vl-remote h3 { font-size: 1.375rem; margin: 0 0 1.5rem; }
.vl-remote__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; align-items: stretch; }
.vl-remote__cols p { margin: 0 0 1rem; }
.vl-remote__col2 { display: flex; flex-direction: column; }
.vl-remote__col2 .btn { margin-top: auto; align-self: flex-start; }

/* 5. Blue band with the girl photo, and 6. cards overlapping its lower edge */
.vl-why { position: relative; isolation: isolate; overflow: hidden; padding: 9rem 1rem 16rem; color: #fff; text-align: center; background: #041935; }
.vl-why__bg { position: absolute; inset: 0; margin: 0; z-index: -2; }
.vl-why__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; display: block; }
.vl-why::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(4, 25, 53, .74); }
.vl-why__head { max-width: 1000px; margin-inline: auto; }
.vl-why h2 { color: #fff; margin-bottom: .75rem; }
.vl-why .eyebrow { color: var(--yellow); }
.vl-why p { color: rgba(255, 255, 255, .92); margin: 0; }
.vl-cards-sec { position: relative; z-index: 3; margin-top: -16rem; padding: 0 1rem 5rem; }
.vl-cards-sec .container { max-width: 1300px; }
.vl-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.vl-card { display: flex; flex-direction: column; border-radius: 11px; overflow: hidden; background: #f9fafa; box-shadow: 0 10px 40px -5px rgba(0, 0, 0, .3); }
:root[data-theme="dark"] .vl-card { background: var(--surface); }
.vl-card figure { margin: 0; }
.vl-card img { width: 100%; height: 250px; object-fit: cover; display: block; }
.vl-card__body { padding: 30px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .9rem; flex: 1; }
.vl-card h3 { font-size: 1.3125rem; margin: 0; }
.vl-card p { margin: 0; flex: 1; text-align: center; }

/* 7. Form card overlapping the footer */
.vl-form-sec { position: relative; z-index: 3; background: var(--f-hero); padding: 7rem 1rem 0; }
.vl-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; max-width: 1240px; margin-inline: auto; }
.vl-form__copy { color: rgba(255, 255, 255, .92); padding-bottom: 8rem; }
.vl-form__copy h2 { color: #fff; }
.vl-form__copy .eyebrow { color: var(--yellow); }
.vl-form__copy p { color: rgba(255, 255, 255, .92); margin: 0 0 1.5rem; }
.vl-form__link { color: var(--yellow); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.vl-form__card { background: #fff; border-top: 7px solid var(--yellow); border-radius: 12px; padding: 3.5rem 3rem 4rem; box-shadow: 0 10px 40px -5px rgba(0, 0, 0, .35); margin-bottom: -2.5rem; display: grid; gap: 1rem; position: relative; z-index: 2; color: #4e5c71; }
.vl-form__card label { font-size: .875rem; font-weight: 500; text-transform: none; color: #041935; }
.vl-form__card input, .vl-form__card textarea { background: #fff; color: #041935; }
.form__row--4060 { grid-template-columns: 2fr 3fr; }

@media (max-width: 900px) {
  .vl-hero__grid, .vl-journey__head, .vl-remote__grid, .vl-form { grid-template-columns: 1fr; }
  .vl-steps, .vl-cards { grid-template-columns: 1fr 1fr; }
  .vl-remote__img { max-width: 420px; margin-inline: auto; }
  .vl-remote__copy { padding-block: 3rem; }
  .vl-remote__cols { grid-template-columns: 1fr; }
  .vl-why { padding-bottom: 12rem; } .vl-cards-sec { margin-top: -12rem; }
  .vl-form__copy { padding-bottom: 2rem; } .vl-form__card { padding: 2rem 1.5rem 2.5rem; }
}
@media (max-width: 560px) { .vl-steps, .vl-cards { grid-template-columns: 1fr; } .form__row--4060 { grid-template-columns: 1fr; } }
/* Clara: taller stage overlap so her head rises over the journey boxes */
.vl-remote__copy { padding-block: 3rem 2.5rem; }
.vl-remote__img { margin-top: 0; }
@media (max-width: 900px) { .vl-remote__copy { padding-block: 3rem; } }
.vl-remote__img { margin-top: -9rem; }
@media (max-width: 900px) { .vl-remote__img { margin-top: 0; } }

/* ==========================================================================
   41. Volunteer page, third pass: left-aligned text, white backgrounds, Clara below the boxes, white form section
   ========================================================================== */
.vl-hero p, .vl-about p, .vl-journey__head p, .vl-remote p, .vl-form__copy p { text-align: left; text-justify: auto; }
.vl-remote { background: transparent; }
.vl-remote__grid { align-items: end; }
.vl-remote__img { margin-top: 0; }
.vl-remote__copy { align-self: center; padding-block: 5rem; }
.vl-remote__col2 .btn { margin-top: .5rem; }
.vl-form-sec { background: var(--bg); color: var(--text); padding-bottom: 0; }
.vl-form__copy { color: var(--text); padding-top: 3rem; padding-bottom: 8rem; }
.vl-form__copy h2 { color: var(--heading); }
.vl-form__copy .eyebrow { color: var(--teal); }
.vl-form__copy p { color: var(--text); }
.vl-form__link { color: var(--heading); }
.vl-form__card { border: 1px solid var(--card-border); border-top: 7px solid var(--yellow); }
:root[data-theme="dark"] .vl-form__card { background: var(--surface); color: var(--text); }
:root[data-theme="dark"] .vl-form__card label { color: var(--heading); }
:root[data-theme="dark"] .vl-form__card input, :root[data-theme="dark"] .vl-form__card textarea { background: var(--bg); color: var(--heading); }
@media (max-width: 900px) { .vl-remote__copy { padding-block: 3rem; } }

/* ==========================================================================
   42. Volunteer page, fourth pass: room under the intro line, child's face centred, justified copy again
   ========================================================================== */
.vl-why { padding-bottom: 21rem; }
.vl-cards-sec { margin-top: -16rem; }
.vl-card:nth-child(2) img { object-position: 50% 8%; }
.vl-hero p, .vl-about p, .vl-remote p { text-align: justify; text-justify: inter-word; }
.vl-remote__cols p { hyphens: auto; -webkit-hyphens: auto; }
@media (max-width: 900px) { .vl-why { padding-bottom: 16rem; } .vl-cards-sec { margin-top: -12rem; } .vl-hero p, .vl-about p, .vl-remote p { text-align: left; } }

/* Volunteer form card: navy top line instead of yellow */
.vl-form__card { border-top: 7px solid #041935; }
:root[data-theme="dark"] .vl-form__card { border-top-color: #8fb4ff; }

/* ==========================================================================
   43. Book an appointment: a tinted stage that makes the calendar prominent, plus supporting content
   ========================================================================== */
.book-stage { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(180deg, #e6e8ff 0%, #d3d6fc 100%); padding-block: clamp(3rem, 6vw, 5rem); }
.book-stage::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .55;
  background-image: linear-gradient(rgba(4, 25, 53, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(4, 25, 53, .06) 1px, transparent 1px); background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse at center, transparent 35%, #000 100%); mask-image: radial-gradient(ellipse at center, transparent 35%, #000 100%); }
:root[data-theme="dark"] .book-stage { background: linear-gradient(180deg, #14213a, #0f1c36); }
.book-stage__head { text-align: center; max-width: 720px; margin: 0 auto 2rem; }
.book-stage__head h2 { margin: .25rem 0 .75rem; }
.book-stage__head p { margin: 0; }
.book-stage .widget { max-width: 1100px; margin-inline: auto; }
.book-stage .ymi-booking { margin: 0; border-radius: 20px; box-shadow: 0 34px 80px -24px rgba(4, 25, 53, .45), 0 0 0 1px rgba(4, 25, 53, .08); padding: clamp(1.25rem, 3vw, 2.5rem); }
.book-facts { list-style: none; margin: 2rem auto 0; padding: 0; max-width: 1100px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.book-facts li { display: grid; gap: .15rem; padding: 1rem 1.25rem; border-radius: 14px; background: rgba(255, 255, 255, .75); border: 1px solid rgba(4, 25, 53, .08); }
:root[data-theme="dark"] .book-facts li { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); }
.book-facts b { font: 700 1.125rem var(--font-head); color: var(--heading); }
.book-facts span { font-size: .9375rem; }
.book-steps { list-style: none; margin: 2.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.book-steps li { display: grid; gap: .6rem; align-content: start; }
.book-steps__icon { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: #041935; color: var(--yellow); }
.book-steps__icon svg { width: 26px; height: 26px; }
.book-steps h3 { font-size: 1.25rem; margin: .25rem 0 0; }
.book-steps p { margin: 0; }
.book-topics { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(1.5rem, 5vw, 4rem); align-items: start; }
.book-topics__copy h2 { margin: .25rem 0 1rem; }
.book-topics__copy p { margin: 0 0 1.5rem; }
.book-topics__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem 2rem; }
.book-topics__list li { display: flex; gap: 1rem; align-items: flex-start; padding-top: 1.25rem; border-top: 2px solid #041935; }
:root[data-theme="dark"] .book-topics__list li { border-top-color: var(--yellow); }
.book-topics__icon { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #041935; color: var(--yellow); }
.book-topics__icon svg { width: 22px; height: 22px; }
.book-topics__list h3 { font-size: 1.1875rem; margin: 0 0 .25rem; }
.book-topics__list h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.book-topics__list p { margin: 0; }
.book-good { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(1.5rem, 5vw, 4rem); align-items: center; }
.book-good figure { margin: 0; border-radius: 20px; overflow: hidden; }
.book-good img { width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; display: block; }
.book-good h2 { margin: .25rem 0 1.25rem; }
@media (max-width: 900px) { .book-facts, .book-steps { grid-template-columns: 1fr 1fr; } .book-topics, .book-good { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .book-facts, .book-steps, .book-topics__list { grid-template-columns: 1fr; } }

/* ==========================================================================
   44. Book an appointment, second pass: beige stage, stepper, navy "heart" section, overlapping note card
   ========================================================================== */
.page-hero h1 .sw { text-transform: none; }

/* Calendar stage: warm beige, so it separates from the lavender page band */
.book-stage { background: linear-gradient(180deg, #f8f2e6 0%, #efe5d0 100%); }
.book-stage::before { background-image: linear-gradient(rgba(90, 64, 20, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(90, 64, 20, .07) 1px, transparent 1px); }
:root[data-theme="dark"] .book-stage { background: linear-gradient(180deg, #14213a, #0f1c36); }
.book-facts li { background: rgba(255, 255, 255, .8); border-color: rgba(90, 64, 20, .14); }

/* Stepper: a track with four nodes, no boxes */
.book-track-head { max-width: 640px; margin-bottom: 3.25rem; }
.book-track-head h2 { margin: .25rem 0 .75rem; }
.book-track-head p { margin: 0; }
.book-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; position: relative; counter-reset: none; }
.book-track::before { content: ""; position: absolute; left: 28px; right: calc(25% - 28px); top: 27px; height: 3px; background: repeating-linear-gradient(90deg, #041935 0 10px, transparent 10px 18px); opacity: .5; }
:root[data-theme="dark"] .book-track::before { background: repeating-linear-gradient(90deg, var(--yellow) 0 10px, transparent 10px 18px); }
.book-track li { position: relative; display: grid; gap: .6rem; align-content: start; }
.book-track__node { position: relative; z-index: 1; width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: #041935; color: var(--yellow); font: 800 1.5rem var(--font-head); box-shadow: 0 0 0 8px var(--bg); }
.book-track__node svg { width: 26px; height: 26px; }
.book-track .is-last .book-track__node { background: var(--yellow); color: #041935; }
.book-track h3 { font-size: 1.3125rem; margin: .75rem 0 0; }
.book-track p { margin: 0; padding-right: 1rem; }
@media (max-width: 900px) { .book-track { grid-template-columns: 1fr; gap: 1.75rem; } .book-track::before { left: 27px; right: auto; top: 28px; bottom: 28px; width: 3px; height: auto; background: repeating-linear-gradient(180deg, #041935 0 10px, transparent 10px 18px); } .book-track li { padding-left: 84px; } .book-track__node { position: absolute; left: 0; top: 0; } .book-track h3 { margin-top: 0; } }

/* Whatever is on your heart: navy, warm and full */
.book-heart { position: relative; isolation: isolate; overflow: hidden; background: #041935; color: rgba(255, 255, 255, .9); padding-block: clamp(3.5rem, 7vw, 6rem); }
.book-heart__bg { position: absolute; inset: 0; margin: 0; z-index: -2; }
.book-heart__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; display: block; }
.book-heart::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(4, 25, 53, .96) 0%, rgba(4, 25, 53, .9) 45%, rgba(4, 25, 53, .82) 100%); }
.book-heart__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(1.5rem, 5vw, 4.5rem); align-items: start; }
.book-heart__copy h2 { color: #fff; font-size: clamp(2rem, 1.1rem + 2.4vw, 3rem); line-height: 1.1; margin: .25rem 0 1rem; }
.book-heart__copy .eyebrow { color: var(--yellow); }
.book-heart__copy p { color: rgba(255, 255, 255, .9); margin: 0 0 1.5rem; }
.book-heart .btn--ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55); background: transparent; }
.book-heart .btn--ghost:hover { background: rgba(255, 255, 255, .14); box-shadow: inset 0 0 0 2px #fff; }
.book-heart__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.book-heart__list li { display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem; border-radius: 18px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .16); transition: background .25s, border-color .25s, transform .25s; }
.book-heart__list li:hover { background: rgba(255, 255, 255, .13); border-color: var(--yellow); transform: translateY(-3px); }
.book-heart__icon { flex: none; width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--yellow); color: #041935; }
.book-heart__icon svg { width: 22px; height: 22px; }
.book-heart__list h3 { font-size: 1.1875rem; margin: 0 0 .25rem; }
.book-heart__list h3 a { color: #fff; }
.book-heart__list h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.book-heart__list p { margin: 0; color: rgba(255, 255, 255, .85); font-size: 1rem; }
@media (max-width: 900px) { .book-heart__grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .book-heart__list { grid-template-columns: 1fr; } }

/* Before you book: a photo with a note card resting over its edge */
.book-note { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; }
.book-note__img { margin: 0; grid-column: 1 / span 7; grid-row: 1; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 60px -24px rgba(4, 25, 53, .4); }
.book-note__img img { width: 100%; aspect-ratio: 4 / 3.3; object-fit: cover; display: block; }
.book-note__card { grid-column: 6 / -1; grid-row: 1; position: relative; z-index: 2; background: var(--surface); border-top: 7px solid #041935; border-radius: 16px; padding: clamp(1.5rem, 3vw, 2.5rem); box-shadow: 0 24px 60px -20px rgba(4, 25, 53, .35); }
:root[data-theme="dark"] .book-note__card { border-top-color: var(--yellow); }
.book-note__card h2 { margin: .25rem 0 1.25rem; font-size: clamp(1.75rem, 1.1rem + 1.6vw, 2.5rem); }
.book-note__card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.book-note__card li { display: flex; gap: .75rem; align-items: flex-start; }
.book-note__card li span { flex: none; width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; background: #041935; color: var(--yellow); margin-top: .1rem; }
.book-note__card li span svg { width: 14px; height: 14px; }
@media (max-width: 900px) { .book-note { grid-template-columns: 1fr; } .book-note__img, .book-note__card { grid-column: 1; grid-row: auto; } .book-note__card { margin: -3rem 1rem 0; } }
/* Note card: 12-column grid, resting 5rem over the photo's edge */
.book-note { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.book-note__img { grid-column: 1 / span 7; }
.book-note__card { grid-column: 7 / -1; margin-left: -5rem; }
@media (max-width: 900px) { .book-note { grid-template-columns: 1fr; } .book-note__img, .book-note__card { grid-column: 1; grid-row: auto; } .book-note__card { margin: -3rem 1rem 0; } }
.book-note__card { grid-column: 8 / -1; margin-left: -5rem; }
@media (max-width: 900px) { .book-note__card { grid-column: 1; margin: -3rem 1rem 0; } }
/* Link under a shortened FAQ list */
.faq-live .faq-box__all { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.25rem; color: var(--yellow); font-weight: 600; }
.faq-live .faq-box__all:hover { gap: .8rem; text-decoration: underline; text-underline-offset: 4px; }

/* ==========================================================================
   45. Policies: headings brought into proportion with the text, and a short "in brief" summary on each policy
   ========================================================================== */
.policy-main h2 { font-size: clamp(1.3125rem, 1.1rem + .6vw, 1.5rem); font-weight: 600; line-height: 1.25; margin: 2.25rem 0 .75rem; letter-spacing: normal; }
.policy-main h3 { font-size: 1.125rem; font-weight: 600; margin: 1.5rem 0 .4rem; }
.policy-main p, .policy-main li { line-height: 1.75; }
.policy-brief { margin: 0 0 2rem; padding: 1.1rem 1.4rem; border-radius: 14px; background: var(--lavender); color: #041935; border-left: 5px solid #041935; }
.policy-brief b { display: block; font: 700 .75rem var(--font-body); letter-spacing: .14em; text-transform: uppercase; margin-bottom: .35rem; }
.policy-brief p { margin: 0; text-align: left; hyphens: manual; font-size: 1.0625rem; line-height: 1.6; color: #041935; }
:root[data-theme="dark"] .policy-brief { background: var(--panel); color: var(--text); border-left-color: var(--yellow); }
:root[data-theme="dark"] .policy-brief p { color: var(--text); }

/* ==========================================================================
   46. Photo gallery: albums rail + stage + lightbox
   ========================================================================== */
.gal-sec { background: #f3f3f3; padding-block: clamp(2.5rem, 5vw, 4.5rem); }
:root[data-theme="dark"] .gal-sec { background: var(--bg-soft); }
.gal-sec .container { max-width: 1320px; }
.gal__layout { display: grid; grid-template-columns: 350px minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.5rem); align-items: start; }
.gal__rail { position: sticky; top: 130px; display: grid; gap: 1rem; }
.gal__chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.gal__chip { border: 1px solid var(--card-border); background: var(--surface); color: var(--heading); border-radius: 999px; padding: .4rem .9rem; font: 600 .875rem var(--font-body); cursor: pointer; transition: background .2s, color .2s; }
.gal__chip:hover { border-color: #041935; }
.gal__chip[aria-pressed="true"] { background: #041935; color: #fff; border-color: #041935; }
:root[data-theme="dark"] .gal__chip[aria-pressed="true"] { background: var(--yellow); color: #041935; border-color: var(--yellow); }
.gal__list { display: grid; gap: .5rem; max-height: min(74vh, 720px); overflow-y: auto; padding: 2px 6px 2px 2px; scrollbar-width: thin; }
.gal__album { display: grid; grid-template-columns: 76px 1fr; gap: .9rem; align-items: center; text-align: left; padding: .55rem; border: 1px solid var(--card-border); border-radius: 16px; background: var(--surface); color: var(--heading); cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s; }
.gal__album:hover { border-color: #041935; transform: translateX(3px); }
.gal__album[aria-selected="true"] { background: #041935; color: #fff; border-color: #041935; box-shadow: 0 14px 30px -14px rgba(4, 25, 53, .6); transform: translateX(6px); }
:root[data-theme="dark"] .gal__album[aria-selected="true"] { background: #0b2a5c; border-color: #0b2a5c; }
.gal__thumb { width: 76px; height: 76px; border-radius: 12px; overflow: hidden; background: #dfe3ee; }
.gal__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal__meta { display: grid; gap: .15rem; min-width: 0; }
.gal__meta b { font: 700 1rem/1.25 var(--font-head); }
.gal__meta em { font-style: normal; font-size: .8125rem; opacity: .8; }
.gal__album[aria-selected="true"] .gal__meta em { color: var(--yellow); opacity: 1; }
.gal__stage { min-width: 0; display: grid; gap: 1.25rem; }
.gal__head { display: grid; gap: .5rem; max-width: 62ch; }
.gal__cat { justify-self: start; padding: .25rem .7rem; border-radius: 8px; background: var(--yellow); color: #041935; font: 700 .75rem var(--font-body); letter-spacing: .08em; text-transform: uppercase; }
.gal__head h2 { font-size: clamp(1.75rem, 1.1rem + 1.8vw, 2.75rem); line-height: 1.1; margin: 0; letter-spacing: normal; }
.gal__head p { margin: 0; }
.gal__mosaic { display: grid; gap: .75rem; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, minmax(150px, 22vw)); max-height: 560px; }
.gal__tile { position: relative; padding: 0; border: 0; border-radius: 16px; overflow: hidden; cursor: zoom-in; background: #dfe3ee; }
.gal__tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease); }
.gal__tile:hover img, .gal__tile:focus-visible img { transform: scale(1.06); }
.gal__tile--0 { grid-column: span 2; grid-row: span 2; }
.gal__more { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; background: rgba(4, 25, 53, .72); color: #fff; }
.gal__more b { font: 800 2rem var(--font-head); color: var(--yellow); }
.gal__more span { font-size: .875rem; }
.gal__mosaic--1 { grid-template-columns: 1fr; grid-template-rows: minmax(300px, 40vw); } .gal__mosaic--1 .gal__tile--0 { grid-column: auto; grid-row: auto; }
.gal__mosaic--2 { grid-template-columns: 2fr 1fr; grid-template-rows: minmax(300px, 34vw); } .gal__mosaic--2 .gal__tile--0 { grid-column: auto; grid-row: auto; }
.gal__mosaic--3 { grid-template-columns: 2fr 1fr; } .gal__mosaic--3 .gal__tile--0 { grid-column: 1; grid-row: span 2; }
.gal__actions { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; }
.gal__next { border: 0; background: none; padding: 0; color: var(--heading); font-weight: 600; cursor: pointer; }
.gal__next:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 960px) {
  .gal__layout { grid-template-columns: 1fr; }
  .gal__rail { position: static; }
  .gal__list { display: flex; overflow-x: auto; overflow-y: hidden; max-height: none; gap: .6rem; padding-bottom: .6rem; scroll-snap-type: x proximity; }
  .gal__album { flex: 0 0 240px; scroll-snap-align: start; transform: none !important; }
  .gal__mosaic { grid-template-rows: repeat(2, minmax(120px, 28vw)); }
}
@media (max-width: 560px) { .gal__mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: minmax(220px, 60vw) repeat(2, minmax(110px, 30vw)); } .gal__tile--0 { grid-column: 1 / -1; grid-row: 1; } }

/* Lightbox */
.gal-lb-open { overflow: hidden; }
.gal-lb { position: fixed; inset: 0; z-index: 10000; background: rgba(3, 12, 26, .96); display: grid; grid-template-columns: 64px minmax(0, 1fr) 64px; grid-template-rows: auto minmax(0, 1fr) auto; color: #fff; }
.gal-lb[hidden] { display: none; }
.gal-lb__top { grid-column: 1 / -1; display: flex; align-items: center; gap: 1rem; padding: .9rem 1.25rem; }
.gal-lb__title { font: 700 1.125rem var(--font-head); flex: 1; }
.gal-lb__count { font-variant-numeric: tabular-nums; opacity: .8; }
.gal-lb__close { width: 44px; height: 44px; border-radius: 12px; border: 0; background: rgba(255, 255, 255, .12); color: #fff; font-size: 1.75rem; line-height: 1; cursor: pointer; }
.gal-lb__close:hover, .gal-lb__nav:hover { background: var(--yellow); color: #041935; }
.gal-lb__fig { grid-column: 2; grid-row: 2; margin: 0; display: grid; place-items: center; min-height: 0; }
.gal-lb__fig img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 10px; }
.gal-lb__nav { align-self: center; justify-self: center; width: 48px; height: 64px; border-radius: 14px; border: 0; background: rgba(255, 255, 255, .12); color: #fff; font-size: 2.25rem; line-height: 1; cursor: pointer; }
.gal-lb__nav--prev { grid-column: 1; grid-row: 2; } .gal-lb__nav--next { grid-column: 3; grid-row: 2; }
.gal-lb__strip { grid-column: 1 / -1; display: flex; gap: .4rem; overflow-x: auto; padding: .75rem 1.25rem 1rem; scrollbar-width: thin; }
.gal-lb__strip button { flex: none; width: 72px; height: 54px; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; opacity: .55; cursor: pointer; background: #1b2b47; }
.gal-lb__strip button.is-on { opacity: 1; border-color: var(--yellow); }
.gal-lb__strip img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) { .gal-lb { grid-template-columns: 44px minmax(0, 1fr) 44px; } .gal-lb__nav { width: 38px; height: 54px; font-size: 1.75rem; } }

/* 47. Newsroom (Impact & Stories) and story pages */
.nr-sec { padding-top: clamp(2rem, 4vw, 3.5rem); }
.nr__feat:empty { display: none; }
.nr-feat { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); background: var(--navy); color: var(--on-navy); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 2.5rem; }
.nr-feat__img { display: block; min-height: 340px; }
.nr-feat__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nr-feat__body { padding: clamp(1.5rem, 3vw, 2.75rem); display: flex; flex-direction: column; justify-content: center; gap: .9rem; }
.nr-feat__flag { font-size: var(--fs-label); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--yellow); }
.nr-feat__meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; font-size: var(--fs-small); color: var(--on-navy-muted); }
.nr-feat h2 { color: #fff; font-size: var(--fs-h2); line-height: 1.2; margin: 0; }
.nr-feat h2 a { color: inherit; text-decoration: none; }
.nr-feat p { color: var(--on-navy-muted); margin: 0; }
.nr-feat .btn { align-self: flex-start; margin-top: .4rem; }
.nr__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 2.5rem; align-items: start; }
.nr__side, .story__side { position: sticky; top: calc(var(--header-h) + 1.25rem); display: grid; gap: 1.25rem; }
.nr-bar { display: flex; gap: .75rem; margin-bottom: 1rem; }
.nr-search { flex: 1; }
.nr-bar input, .nr-year { width: 100%; height: 48px; padding: 0 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--heading); font: inherit; }
.nr-year { width: auto; min-width: 140px; }
.nr-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.nr-chip { border: 1px solid var(--line); background: var(--surface); color: var(--heading); border-radius: 999px; padding: .45rem .95rem; font: inherit; font-size: var(--fs-small); font-weight: 600; cursor: pointer; }
.nr-chip span { opacity: .6; font-weight: 500; margin-left: .2rem; }
.nr-chip:hover { border-color: var(--navy); }
.nr-chip.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.nr-status { min-height: 1.2em; font-size: var(--fs-small); margin: 0 0 .75rem; }
.nr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.5rem; }
.nr-empty { grid-column: 1 / -1; }
.nr-more { text-align: center; margin: 2rem 0 0; }
.nr-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column; }
.nr-card__img { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.nr-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.nr-card:hover .nr-card__img img { transform: scale(1.04); }
.nr-card__date { position: absolute; left: .75rem; top: .75rem; background: var(--navy); color: #fff; border-radius: 8px; padding: .35rem .6rem; text-align: center; line-height: 1.1; display: grid; }
.nr-card__date b { font-size: 1.25rem; color: var(--yellow); }
.nr-card__date span { font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; }
.nr-card__body { padding: 1.15rem 1.25rem 1.35rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.nr-card__cat { font-size: var(--fs-label); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--heading); }
.nr-feat .nr-card__cat { color: #fff; }
.nr-card h3 { font-size: 1.125rem; line-height: 1.3; margin: 0; }
.nr-card h3 a { color: var(--heading); text-decoration: none; }
.nr-card h3 a:hover { text-decoration: underline; }
.nr-card p { margin: 0; font-size: var(--fs-small); }
.nr-card__meta { margin-top: auto; font-size: var(--fs-label); opacity: .8; }
.story__card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.25rem; }
.story__card--navy { background: var(--navy); color: var(--on-navy-muted); border-color: var(--navy); }
.story__card--navy p { color: var(--on-navy-muted); font-size: var(--fs-small); }
.story__side-title { font-family: var(--font-head); font-weight: 700; color: var(--heading); margin: 0 0 .75rem; font-size: 1rem; }
.story__card--navy .story__side-title { color: #fff; }
.nr-arch__y { margin-bottom: .75rem; }
.nr-arch__y b { display: block; color: var(--heading); margin-bottom: .25rem; }
.nr-arch__y button { display: flex; justify-content: space-between; width: 100%; border: 0; background: none; padding: .3rem .5rem; border-radius: 6px; font: inherit; font-size: var(--fs-small); color: var(--text); cursor: pointer; text-align: left; }
.nr-arch__y button:hover, .nr-arch__y button.is-on { background: var(--bg-soft); color: var(--heading); }
.nr-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.nr-tag { border: 1px solid var(--line); background: none; border-radius: 999px; padding: .25rem .7rem; font: inherit; font-size: .8125rem; color: var(--text); cursor: pointer; }
.nr-tag:hover, .nr-tag.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.story__sub { display: grid; gap: .6rem; margin-top: .75rem; }
.story__sub input { height: 46px; padding: 0 .9rem; border: 0; border-radius: var(--radius); font: inherit; color: #041935; }
.story__sub-msg { margin: 0; min-height: 1.2em; }
.nr-photos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 3rem; align-items: center; }
.nr-photos__strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.nr-photos__strip figure { margin: 0; aspect-ratio: 3 / 4; border-radius: var(--radius); overflow: hidden; }
.nr-photos__strip img { width: 100%; height: 100%; object-fit: cover; display: block; }

.story__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 3rem; align-items: start; }
.story__meta { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; align-items: center; font-size: var(--fs-small); margin-bottom: 1.25rem; }
.story__type { background: var(--navy); color: #fff; border-radius: 999px; padding: .2rem .8rem; font-weight: 600; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }
.story__cover { margin: 0 0 2rem; }
.story__cover img { width: 100%; height: auto; border-radius: var(--radius-lg); display: block; max-height: 560px; object-fit: cover; }
.story__cover figcaption { font-size: var(--fs-small); margin-top: .5rem; opacity: .8; }
.story__body { font-size: var(--fs-body); line-height: 1.75; }
.story__body h2 { font-size: var(--fs-h3); margin: 2.25rem 0 .75rem; }
.story__body h3 { font-size: var(--fs-h4); margin: 1.75rem 0 .5rem; }
.story__body p, .story__body ul { margin: 0 0 1.15em; }
.story__body ul { padding-left: 1.4rem; }
.story__body blockquote { margin: 1.75rem 0; padding: .5rem 0 .5rem 1.5rem; border-left: 4px solid var(--yellow); font-size: 1.25rem; line-height: 1.5; color: var(--heading); font-family: var(--font-head); }
.story__body blockquote p { margin: 0; }
.story__tags { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.story__tags > span:first-child { font-weight: 700; color: var(--heading); margin-right: .25rem; }
.story__tags span + span { border: 1px solid var(--line); border-radius: 999px; padding: .2rem .75rem; font-size: .8125rem; }
.story__share { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-top: 1.25rem; }
.story__share > span { font-weight: 700; color: var(--heading); margin-right: .25rem; }
.story__share a, .story__share button { display: inline-flex; gap: .4rem; align-items: center; border: 1px solid var(--line); background: var(--surface); color: var(--heading); border-radius: 999px; padding: .4rem .9rem; font: inherit; font-size: var(--fs-small); font-weight: 600; text-decoration: none; cursor: pointer; }
.story__share a:hover, .story__share button:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.story__give { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; background: var(--navy); color: var(--on-navy-muted); border-radius: var(--radius-lg); padding: 1.5rem 1.75rem; margin-top: 2.5rem; }
.story__give b { color: #fff; font-family: var(--font-head); font-size: 1.125rem; }
.story__give p { margin: .25rem 0 0; color: var(--on-navy-muted); }
.story__give-btns { display: flex; gap: .6rem; flex-wrap: wrap; }
.story__mini { display: block; padding: .65rem 0; border-top: 1px solid var(--line); text-decoration: none; }
.story__mini:first-of-type { border-top: 0; padding-top: 0; }
.story__mini span { display: block; font-size: .75rem; opacity: .8; }
.story__mini b { color: var(--heading); font-size: var(--fs-small); line-height: 1.35; }
.story__mini:hover b { text-decoration: underline; }
.story-related .nr-cards { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.story-related__all { text-align: center; margin: 2rem 0 0; }
@media (max-width: 980px) {
  .nr__layout, .story__grid { grid-template-columns: minmax(0, 1fr); }
  .nr__side, .story__side { position: static; }
  .nr-feat { grid-template-columns: minmax(0, 1fr); }
  .nr-feat__img { min-height: 220px; }
  .nr-photos { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
}
@media (max-width: 560px) { .nr-bar { flex-direction: column; } .nr-year { width: 100%; } .nr-cards { grid-template-columns: minmax(0, 1fr); } }

/* 47b. Newsroom: violet band behind the story list, stronger shadow on the upcoming-event boxes */
.nr__layout { position: relative; isolation: isolate; }
.nr__layout::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #ebeafc; box-shadow: 0 0 0 100vmax #ebeafc; clip-path: inset(-3rem -100vmax); }
:root[data-theme="dark"] .nr__layout::before { background: #14224a; box-shadow: 0 0 0 100vmax #14224a; }
/* 47c. Newsroom: "Coming up" as a navy calendar band with ticket-style cards */
.nr-next { background: var(--navy); }
.nr-next .sec-head h2, .nr-next .sec-head p { color: #fff; }
.nr-next .sec-head p { color: var(--on-navy-muted); }
.nr-next .eyebrow { color: var(--yellow); }
.nr-next .ymi-events-list { max-width: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; }
.nr-next .ymi-event-row { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; overflow: hidden; border-radius: var(--radius-lg); box-shadow: 0 22px 40px -14px rgba(0, 0, 0, .55); transition: transform .25s; }
.nr-next .ymi-event-row:hover { transform: translateY(-4px); }
.nr-next .ymi-event-row__photo { display: none; }
.nr-next .ymi-event-row__date { min-width: 0; border-radius: 0; padding: 1.1rem 1.5rem; display: flex; align-items: baseline; gap: .6rem; text-align: left; background: var(--yellow); }
.nr-next .ymi-event-row__day { font-size: 3rem; line-height: 1; }
.nr-next .ymi-event-row__month { margin: 0; font-size: .8125rem; line-height: 1.1; }
.nr-next .ymi-event-row__body { flex: 1; padding: 1.25rem 1.5rem 0; border-left: 0; }
.nr-next .ymi-event-row__title { font-size: 1.25rem; line-height: 1.3; }
.nr-next .ymi-event-row__desc { font-size: var(--fs-small); }
.nr-next .ymi-event-row__cta { margin: 1.25rem 1.5rem 1.5rem; align-self: flex-start; }
@media (max-width: 980px) { .nr-next .ymi-events-list { grid-template-columns: minmax(0, 1fr); } }

/* 48. Bangladesh Mission landing page (.bm) and its deep-dive pages */
.bm { --bm-top: 112px; --bm-violet: #ebeafc; }
.bm [id], .bm-art [id] { scroll-margin-top: calc(var(--bm-top) + 64px); }
.bm-cite { font-size: .65em; line-height: 0; margin-left: .1em; }
.bm-cite a { color: var(--heading); font-weight: 700; text-decoration: none; padding: 0 .1em; border-radius: 3px; }
.bm-cite a:hover { background: var(--yellow); }
.btn--onphoto { color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .5); background: transparent; }
.btn--onphoto:hover { background: rgba(255, 255, 255, .12); box-shadow: inset 0 0 0 2px #fff; color: #fff; }

/* opening */
.bm-open { position: relative; color: #fff; background: var(--navy-deep); overflow: hidden; }
.bm-open__bg { position: absolute; inset: 0; }
.bm-open__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.bm-open__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 15, 32, .45), rgba(3, 15, 32, .9)); }
.bm-open__in { position: relative; padding-block: clamp(4rem, 9vw, 7.5rem); }
.bm-open__kicker { font-size: var(--fs-label); font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--yellow); margin: 0 0 1rem; }
.bm-open h2 { color: #fff; font-size: var(--fs-display); line-height: 1.12; max-width: 17ch; margin: 0 0 1.25rem; }
.bm-open h2 em { color: var(--yellow); font-style: normal; }
.bm-open__lead { max-width: 60ch; font-size: var(--fs-lead); color: rgba(255, 255, 255, .86); margin: 0 0 2.25rem; }
.bm-open__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem 2rem; max-width: 860px; padding: 1.5rem 0; border-block: 1px solid rgba(255, 255, 255, .25); margin-bottom: 2.25rem; }
.bm-open__stats b { display: block; font: 800 clamp(1.75rem, 3.2vw, 2.75rem)/1.1 var(--font-head); color: var(--yellow); }
.bm-open__stats span { font-size: var(--fs-small); color: rgba(255, 255, 255, .8); }
.bm-open__cta { display: flex; flex-wrap: wrap; gap: .75rem; }

/* sticky chapter navigation */
.bm-nav { position: sticky; top: var(--bm-top); z-index: 60; background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: 0 6px 16px rgba(4, 25, 53, .06); }
.bm-nav__in { display: flex; align-items: center; gap: 1rem; }
.bm-nav ol { display: flex; gap: .25rem; list-style: none; margin: 0; padding: 0; overflow-x: auto; flex: 1; scrollbar-width: none; }
.bm-nav ol::-webkit-scrollbar { display: none; }
.bm-nav a[data-spy] { display: block; padding: .95rem .8rem; font-size: var(--fs-small); font-weight: 600; color: var(--text); text-decoration: none; white-space: nowrap; border-bottom: 3px solid transparent; }
.bm-nav a[data-spy]:hover { color: var(--heading); }
.bm-nav a[data-spy].is-on { color: var(--heading); border-bottom-color: var(--yellow); }
.bm-nav__give { padding: .5rem 1.1rem; font-size: var(--fs-small); flex: none; }
.bm-progress { position: absolute; left: 0; bottom: -1px; height: 3px; width: 100%; background: var(--navy); transform-origin: left; transform: scaleX(var(--bm-p, 0)); }

/* shared chapter furniture */
.bm-ch { position: relative; }
.bm-num { display: block; font: 800 clamp(3.5rem, 7vw, 6rem)/1 var(--font-head); color: rgba(4, 25, 53, .09); margin-bottom: .25rem; letter-spacing: -.03em; }
.bm-water .bm-num, .bm-faith .bm-num { color: rgba(255, 255, 255, .12); }
.bm-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.bm-two--rev .bm-photo { order: -1; }
.bm-two--tight { margin-top: 3rem; }
.bm-copy p, .bm-wide p { font-size: var(--fs-body); line-height: 1.75; }
.bm-copy h2, .bm-wide h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1.25rem; }
.bm-photo { margin: 0; }
.bm-photo img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-lg); display: block; box-shadow: var(--shadow); }
.bm-wide { max-width: 980px; }
.bm-cols { columns: 2; column-gap: 3rem; }
.bm-cols p { break-inside: avoid-column; margin-top: 0; }
.bm-lede { font-size: var(--fs-lead); max-width: 62ch; }
.bm-more { margin: 2rem 0 0; }
.bm-h3 { font-size: var(--fs-h3); margin: 2.5rem 0 1rem; }
.bm-btnrow { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.bm-line { font: 700 1.25rem/1.4 var(--font-head); color: var(--heading); border-left: 4px solid var(--yellow); padding-left: 1rem; margin: 1.5rem 0; }

/* 1 village: zoom */
.bm-zoom { margin-top: 3.5rem; padding: 1.75rem clamp(1rem, 3vw, 2.5rem) 2rem; background: var(--bg-soft); border-radius: var(--radius-lg); }
.bm-zoom__hint { margin: 0 0 1.25rem; font-size: var(--fs-label); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--heading); }
.bm-zoom__track { display: flex; position: relative; justify-content: space-between; }
.bm-zoom__track::before { content: ""; position: absolute; left: 6%; right: 6%; top: 11px; height: 2px; background: rgba(4, 25, 53, .18); }
.bm-zoom__node { position: relative; flex: 1; display: grid; justify-items: center; gap: .6rem; border: 0; background: none; font: inherit; font-size: var(--fs-small); font-weight: 600; color: var(--text); cursor: pointer; padding: 0 .25rem; }
.bm-zoom__node i { width: 24px; height: 24px; border-radius: 6px; background: var(--surface); border: 3px solid rgba(4, 25, 53, .25); transition: all .25s; }
.bm-zoom__node:hover i { border-color: var(--navy); }
.bm-zoom__node.is-on { color: var(--heading); }
.bm-zoom__node.is-on i { background: var(--yellow); border-color: var(--navy); transform: scale(1.25) rotate(45deg); }
.bm-zoom__panel { margin-top: 1.5rem; min-height: 4.5rem; max-width: 72ch; }
.bm-zoom__panel p { margin: 0; font-size: var(--fs-lead); color: var(--heading); }

/* 2 people */
.bm-people { background: var(--bg-soft); }
.bm-quote { margin: 2.5rem 0; }
.bm-quote blockquote { margin: 0; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--navy); color: #fff; border-radius: var(--radius-lg); }
.bm-quote p { font: 700 clamp(1.25rem, 2.2vw, 1.75rem)/1.4 var(--font-head); margin: 0 0 1rem; color: #fff; }
.bm-quote cite { font-style: normal; font-size: var(--fs-small); color: var(--yellow); }
.bm-tabs__list { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.bm-tab { border: 1px solid var(--line); background: var(--surface); color: var(--heading); border-radius: 999px; padding: .55rem 1.2rem; font: inherit; font-weight: 600; cursor: pointer; }
.bm-tab:hover { border-color: var(--navy); }
.bm-tab.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.bm-panel { display: none; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.25rem, 3vw, 2.25rem); box-shadow: var(--shadow); }
.bm-panel.is-on { display: block; animation: bm-in .35s ease; }
.bm-panel h3 { font-size: var(--fs-h3); margin: 0 0 .75rem; }
.bm-panel p { max-width: 70ch; }
@keyframes bm-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* 3 life: rail */
.bm-rail { display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: 1rem max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter))) 1.5rem; scrollbar-width: thin; outline-offset: -4px; cursor: grab; }
.bm-rail.is-drag { cursor: grabbing; scroll-snap-type: none; }
.bm-rail__card { flex: none; width: min(420px, 82vw); scroll-snap-align: start; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.bm-rail__card figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
.bm-rail__card img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.bm-rail__card > div { padding: 1.25rem 1.5rem 1.6rem; }
.bm-rail__card span { font-size: var(--fs-label); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--heading); }
.bm-rail__card h3 { font-size: 1.25rem; margin: .3rem 0 .5rem; }
.bm-rail__card p { margin: 0; font-size: var(--fs-small); }

/* 4 water, 7 faith: navy chapters */
.bm-water, .bm-faith { background: var(--navy); color: var(--on-navy-muted); }
.bm-water h2, .bm-faith h2, .bm-water .bm-line { color: #fff; }
.bm-water .eyebrow, .bm-faith .eyebrow { color: var(--yellow); }
.bm-water .btn--ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .4); }
.bm-water .btn--ghost:hover { background: rgba(255, 255, 255, .1); }
.bm-water .bm-cite a, .bm-faith .bm-cite a { color: var(--yellow); }
.bm-water p, .bm-faith p { color: var(--on-navy-muted); }

/* 5 education: versus */
.bm-versus { margin: 2.5rem 0 0; padding: clamp(1.25rem, 3vw, 2.25rem); background: var(--bm-violet); border-radius: var(--radius-lg); }
.bm-versus__switch { display: inline-flex; padding: .3rem; background: var(--surface); border-radius: 999px; box-shadow: var(--shadow); }
.bm-versus__switch button { border: 0; background: none; padding: .6rem 1.4rem; border-radius: 999px; font: inherit; font-weight: 700; color: var(--heading); cursor: pointer; }
.bm-versus__switch button.is-on { background: var(--navy); color: #fff; }
.bm-versus__bar { position: relative; height: 44px; margin: 1.75rem 0 1rem; background: rgba(4, 25, 53, .1); border-radius: 10px; overflow: hidden; }
.bm-versus__fill { position: absolute; inset: 0 auto 0 0; width: 100%; background: var(--yellow); border-radius: 10px; transition: width .8s cubic-bezier(.2, .7, .2, 1); }
.bm-versus[data-mode="food"] .bm-versus__fill { width: 4%; }
.bm-versus__lab { position: absolute; top: 50%; transform: translateY(-50%); font-size: var(--fs-small); font-weight: 700; color: var(--heading); }
.bm-versus__lab--l { left: 1rem; }
.bm-versus__lab--r { right: 1rem; }
.bm-versus[data-mode="food"] .bm-versus__lab--l { left: calc(4% + .75rem); }
.bm-versus__txt { margin: 0; max-width: 70ch; font-size: var(--fs-lead); color: var(--heading); }
.bm-facts { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 1.5rem; }
.bm-facts b { display: block; font: 800 2.25rem/1 var(--font-head); color: var(--heading); }
.bm-facts span { font-size: var(--fs-small); }
.bm-copy h3 { font-size: var(--fs-h3); margin: 0 0 .75rem; }

/* 6 work: expanding panels */
.bm-work { background: var(--bg-soft); }
.bm-panels { display: flex; height: 520px; gap: .5rem; padding-inline: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter))); margin-top: 1rem; }
.bm-pan { position: relative; flex: 1; overflow: hidden; border-radius: var(--radius-lg); color: #fff; text-decoration: none; transition: flex .5s cubic-bezier(.2, .7, .2, 1); }
.bm-pan.is-on { flex: 4; }
.bm-pan figure { position: absolute; inset: 0; margin: 0; }
.bm-pan img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bm-pan::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 15, 32, .1) 30%, rgba(3, 15, 32, .88)); }
.bm-pan__n { position: absolute; z-index: 2; left: 1.25rem; top: 1rem; font: 800 1.5rem var(--font-head); color: var(--yellow); }
.bm-pan__t { position: absolute; z-index: 2; left: 1.25rem; right: 1.25rem; bottom: 1.25rem; display: grid; gap: .3rem; opacity: 0; transform: translateY(10px); transition: all .4s .1s; }
.bm-pan.is-on .bm-pan__t { opacity: 1; transform: none; }
.bm-pan__t b { font: 700 1.5rem/1.2 var(--font-head); }
.bm-pan__t em { font-style: normal; font-size: var(--fs-small); color: rgba(255, 255, 255, .85); }

/* 7 faith */
.bm-faith__in { max-width: 980px; }
.bm-verse { margin: 2rem 0; padding: 0 0 0 1.5rem; border-left: 4px solid var(--yellow); }
.bm-verse p { font: 600 clamp(1.4rem, 2.6vw, 2rem)/1.4 var(--font-head); color: #fff; margin: 0 0 .75rem; }
.bm-verse cite { font-style: normal; color: var(--yellow); font-weight: 700; }
.bm-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 2.5rem; }
.bm-values div { padding: 1.25rem 0; border-top: 3px solid var(--yellow); }
.bm-values b { display: block; font: 800 1.75rem var(--font-head); color: #fff; }
.bm-values span { font-size: var(--fs-small); color: var(--on-navy-muted); }

/* 8 change */
.bm-change { background: var(--bm-violet); }
.bm-ripple { margin-top: 2rem; max-width: 980px; }
.bm-ripple__track { height: 8px; background: rgba(4, 25, 53, .12); border-radius: 4px; overflow: hidden; }
.bm-ripple__fill { display: block; height: 100%; width: 25%; background: var(--navy); border-radius: 4px; transition: width .6s cubic-bezier(.2, .7, .2, 1); }
.bm-ripple__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: 1rem; }
.bm-ripple__steps button { display: grid; gap: .4rem; justify-items: start; border: 0; background: none; padding: .5rem 0; font: inherit; font-weight: 700; color: var(--text); cursor: pointer; text-align: left; }
.bm-ripple__steps i { font-style: normal; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--surface); color: var(--heading); font-size: var(--fs-small); box-shadow: var(--shadow); }
.bm-ripple__steps button.is-on { color: var(--heading); }
.bm-ripple__steps button.is-on i { background: var(--navy); color: var(--yellow); }
.bm-ripple__txt { font: 500 clamp(1.15rem, 2vw, 1.5rem)/1.5 var(--font-head); color: var(--heading); margin: 1.5rem 0 0; max-width: 60ch; min-height: 5.5em; }
.bm-stories { margin-top: 3rem; }
.bm-stories .nr-cards { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

/* 9 give */
.bm-give { background: var(--navy-deep); color: #fff; }
.bm-give__panel { max-width: 860px; margin-inline: auto; text-align: center; }
.bm-give__panel h2 { color: #fff; font-size: var(--fs-display); margin: .5rem 0 1rem; }
.bm-give__panel .eyebrow { color: var(--yellow); }
.bm-give__panel p { color: rgba(255, 255, 255, .85); font-size: var(--fs-lead); }
.bm-give__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 2rem 0; }
.bm-share { justify-content: center; }
.bm-share > span { color: #fff; }
.bm-share a, .bm-share button { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }

/* floating give bar */
.bm-float { position: fixed; left: 50%; bottom: 1rem; z-index: 80; display: flex; align-items: center; gap: 1rem; padding: .5rem .5rem .5rem 1.25rem; background: var(--navy); color: #fff; border-radius: 999px; box-shadow: 0 12px 30px rgba(0, 0, 0, .35); transform: translate(-50%, 140%); transition: transform .35s; font-weight: 600; font-size: var(--fs-small); }
.bm-float.is-on { transform: translate(-50%, 0); }
.bm-float .btn { padding: .55rem 1.2rem; }

/* sources */
.bm-sources { background: var(--bg-soft); }
.bm-sources__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 3rem; }
.bm-sources__list { margin: 0; padding-left: 1.4rem; font-size: var(--fs-small); display: grid; gap: .6rem; }
.bm-sources__list a { color: var(--heading); overflow-wrap: anywhere; }
.bm-sources__list li:target { background: var(--yellow); }

/* deep-dive pages */
.bm-art__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 3.5rem; align-items: start; }
.bm-art__toc { position: sticky; top: calc(var(--bm-top, 112px) + 1rem); }
.bm-art__toc ol { list-style: none; margin: 0 0 1.25rem; padding: 0; border-left: 2px solid var(--line); }
.bm-art__toc a { display: block; padding: .4rem 0 .4rem 1rem; font-size: var(--fs-small); color: var(--text); text-decoration: none; }
.bm-art__toc a:hover { color: var(--heading); }
.bm-art__body { max-width: 760px; }
.bm-backrow { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; align-items: center; justify-content: space-between; }
.bm-backrow h2 { margin: .3rem 0 .5rem; }

@media (max-width: 980px) {
  .bm-two { grid-template-columns: minmax(0, 1fr); }
  .bm-two--rev .bm-photo { order: 0; }
  .bm-cols { columns: 1; }
  .bm-open__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bm-panels { flex-direction: column; height: auto; }
  .bm-pan, .bm-pan.is-on { flex: none; height: 240px; }
  .bm-pan__t { opacity: 1; transform: none; }
  .bm-sources__grid, .bm-art__grid { grid-template-columns: minmax(0, 1fr); }
  .bm-art__toc { position: static; }
  .bm-nav__give { display: none; }
}
@media (max-width: 640px) {
  .bm-zoom__node span { font-size: .6875rem; }
  .bm-values, .bm-ripple__steps { grid-template-columns: minmax(0, 1fr); }
  .bm-versus__lab { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) { .bm-panel.is-on { animation: none; } .bm-pan, .bm-versus__fill, .bm-ripple__fill, .bm-float { transition: none; } }

/* 48b. Bangladesh Mission: unseen facts, trades, glass photo, sources */
.bm-inline { margin: 1.25rem 0; }
.bm-inline img { width: 100%; height: auto; max-height: 360px; object-fit: cover; border-radius: var(--radius); display: block; }
.bm-inline figcaption { font-size: var(--fs-small); margin-top: .4rem; opacity: .85; }
#trades .bm-tabs__panels { margin-top: .25rem; }
.bm-srcstrip { background: var(--bg-soft); padding-block: clamp(1.75rem, 3vw, 2.5rem); }
.bm-srcstrip__in { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; }
.bm-srcstrip p { margin: .25rem 0 0; font-size: var(--fs-lead); color: var(--heading); }
.bm-srcpage { max-width: 900px; }
.bm-srcpage h2 { font-size: var(--fs-h3); margin: 2.5rem 0 1rem; padding-bottom: .5rem; border-bottom: 2px solid var(--yellow); }
.bm-src { margin: 0; padding-left: 2.25rem; display: grid; gap: 1rem; }
.bm-src li { padding-left: .25rem; }
.bm-src li:target { background: var(--yellow); border-radius: 6px; }
.bm-src--plain { list-style: disc; padding-left: 1.4rem; gap: .6rem; }
.bm-src__t { display: block; font-weight: 600; }
.bm-src__t a { color: var(--heading); overflow-wrap: anywhere; }
.bm-src__u { display: block; font-size: var(--fs-small); margin-top: .15rem; }
@media (min-width: 900px) { .bm-nav__in { padding-left: calc(var(--gutter) + 100px); } }

/* 48c. Unseen facts as an editorial ledger; water chapter with a second row */
@media (max-width: 980px) { .bm-br { display: none; } }

/* 48d. Water chapter: divider + inset panel for the bottles; steadier numbers in the ledger */
.bm-water__divider { display: flex; align-items: center; gap: 1.25rem; margin: clamp(3rem, 6vw, 5rem) 0 2rem; }
.bm-water__divider::before, .bm-water__divider::after { content: ""; flex: 1; height: 1px; background: rgba(255, 255, 255, .3); }
.bm-water__divider span { font-size: var(--fs-label); font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--yellow); }
.bm-water__row2 { padding: clamp(1.5rem, 3vw, 2.5rem); background: #0d2a52; border: 1px solid rgba(255, 255, 255, .14); border-top: 4px solid var(--yellow); border-radius: var(--radius-lg); }
.bm-water__row2 h3 { color: #fff; font-size: var(--fs-h2); margin: 0 0 1rem; }
.bm-water__row2 .bm-photo img { aspect-ratio: 16 / 10; box-shadow: none; }
.bm-photo--tag { position: relative; }
.bm-tag { position: absolute; left: 46%; bottom: 7%; transform: translateX(-50%); background: var(--yellow); color: var(--navy); font-size: .8125rem; font-weight: 700; padding: .3rem .7rem; border-radius: 6px; white-space: nowrap; box-shadow: 0 6px 16px rgba(0, 0, 0, .35); }
.bm-tag::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: var(--yellow); }

/* 48e. Unseen facts as a scroll story: sticky photo on the left, one fact at a time on the right */
.bm-unseen { background: #fff8d6; }
:root[data-theme="dark"] .bm-unseen { background: var(--bg-soft); }
.bm-story { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); margin-top: 2rem; align-items: start; }
.bm-story__stage { position: sticky; top: calc(var(--bm-top, 112px) + 4.5rem); height: min(72vh, 620px); }
.bm-story__fig { position: absolute; inset: 0; margin: 0; border-radius: var(--radius-lg); overflow: hidden; opacity: 0; transition: opacity .6s ease; background: var(--navy); }
.bm-story__fig.is-on { opacity: 1; }
.bm-story__fig img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bm-story__fig::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 15, 32, 0) 35%, rgba(3, 15, 32, .88)); }
.bm-story__fig figcaption { position: absolute; z-index: 2; left: 1.75rem; right: 1.75rem; bottom: 1.5rem; color: #fff; display: grid; gap: .4rem; }
.bm-story__fig b { font: 800 clamp(3.5rem, 6.5vw, 6rem)/1 var(--font-head); letter-spacing: -.03em; color: var(--yellow); }
.bm-story__fig span { font-weight: 600; font-size: 1.125rem; line-height: 1.35; max-width: 26ch; }
.bm-story__ticks { position: absolute; z-index: 3; top: 1rem; right: 1rem; display: grid; gap: .5rem; }
.bm-story__ticks button { width: 8px; height: 24px; border: 0; padding: 0; border-radius: 4px; background: rgba(255, 255, 255, .45); transition: all .3s; }
.bm-story__ticks button.is-on { background: var(--yellow); height: 40px; }
.bm-story__steps { list-style: none; margin: 0; padding: 0; }
.bm-step { min-height: min(72vh, 620px); display: flex; flex-direction: column; justify-content: center; padding: 2rem 0; opacity: .3; transition: opacity .4s; border-top: 1px solid rgba(4, 25, 53, .2); }
.bm-step:first-child { border-top: 0; }
.bm-step.is-on { opacity: 1; }
.bm-step__img, .bm-step__n { display: none; }
.bm-step__k { font-size: var(--fs-label); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--heading); }
.bm-step h3 { font-size: clamp(1.5rem, 2.6vw, 2.125rem); line-height: 1.25; margin: .6rem 0 1rem; }
.bm-step p { font-size: var(--fs-lead); line-height: 1.75; margin: 0; max-width: 52ch; }
.bm-step .bm-cite a { color: var(--heading); }
@media (max-width: 980px) {
  .bm-story { grid-template-columns: minmax(0, 1fr); }
  .bm-story__stage { display: none; }
  .bm-step { min-height: 0; opacity: 1; padding: 2rem 0; }
  .bm-step__img { display: block; margin: 0 0 1rem; }
  .bm-step__img img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--radius-lg); display: block; }
  .bm-step__n { display: block; font: 800 3rem/1 var(--font-head); color: var(--heading); margin: .5rem 0 0; background: linear-gradient(transparent 62%, var(--yellow) 62%); align-self: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .bm-story__fig, .bm-step { transition: none; } }

/* 49. Programme pages: full-width, clean and crisp */
.pg-lead { padding-block: clamp(3rem, 6vw, 5rem) 0; }
.pg-lead__t { max-width: 1000px; margin: 0 auto; text-align: center; font: 700 clamp(1.5rem, 2.8vw, 2.25rem)/1.35 var(--font-head); color: var(--heading); }
.pg-why .bm-copy h2 { font-size: var(--fs-display); }
.pg-why .bm-photo img { aspect-ratio: 4 / 3; }
.pg-verse { margin: 1.5rem 0; padding-left: 1.25rem; border-left: 4px solid var(--yellow); }
.pg-verse p { font: 600 1.25rem/1.5 var(--font-head); color: var(--heading); margin: 0 0 .4rem; }
.pg-verse cite { font-style: normal; font-weight: 700; font-size: var(--fs-small); }
.pg-do__head { max-width: 760px; margin-bottom: 2rem; }
.pg-do__head h2 { font-size: var(--fs-h2); margin: .35rem 0 .75rem; }
.pg-do__head p { font-size: var(--fs-lead); margin: 0; }
.pg-list { list-style: none; counter-reset: pg; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 6vw, 6rem); }
.pg-list li { counter-increment: pg; display: flex; gap: 1.25rem; align-items: baseline; padding: 1.15rem 0; border-top: 1px solid rgba(4, 25, 53, .18); font: 600 1.125rem/1.4 var(--font-head); color: var(--heading); }
.pg-list li::before { content: counter(pg, decimal-leading-zero); flex: none; min-width: 2.25rem; font: 800 1.125rem var(--font-head); background: linear-gradient(transparent 62%, var(--yellow) 62%); }
.pg-do__after { max-width: 760px; margin: 1.5rem 0 0; }
.pg-do__cta { margin: 2rem 0 0; }
.pg-band { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); height: clamp(220px, 28vw, 400px); }
.pg-band figure { margin: 0; overflow: hidden; }
.pg-band img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s; }
.pg-band figure:hover img { transform: scale(1.05); }
.pg-ways__list { border-bottom: 1px solid rgba(4, 25, 53, .18); }
.pg-way { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 6fr) auto; gap: 1.5rem 3rem; align-items: center; padding: 1.75rem .5rem; border-top: 1px solid rgba(4, 25, 53, .18); text-decoration: none; color: inherit; transition: background .25s, padding .25s; }
.pg-way:hover { background: #fff8d6; padding-inline: 1.25rem; }
.pg-way h3 { font-size: 1.375rem; margin: 0; }
.pg-way p { margin: 0; }
.pg-way__go { display: inline-flex; gap: .5rem; align-items: center; font-weight: 700; color: var(--heading); white-space: nowrap; }
.pg-way__go i { display: inline-flex; width: 1.25rem; }
.pg-more { background: var(--bg-soft); }
.pg-more__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
.pg-tile { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: var(--radius-lg); overflow: hidden; color: #fff; text-decoration: none; }
.pg-tile figure { position: absolute; inset: 0; margin: 0; }
.pg-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.pg-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 15, 32, 0) 45%, rgba(3, 15, 32, .88)); }
.pg-tile:hover img { transform: scale(1.06); }
.pg-tile span { position: absolute; z-index: 2; left: 1.1rem; right: 1.1rem; bottom: 1rem; font: 700 1.125rem/1.25 var(--font-head); }
@media (max-width: 980px) {
  .pg-list { grid-template-columns: minmax(0, 1fr); }
  .pg-way { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .pg-more__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) { .pg-band { grid-template-columns: minmax(0, 1fr); height: auto; } .pg-band figure { height: 200px; } }

/* 49b. Programme pages: the need, how it works */
.pg-need .bm-copy h2, .pg-local .bm-copy h2 { font-size: var(--fs-h2); }
.pg-facts { list-style: none; margin: 0; padding: 0; border-bottom: 2px solid var(--heading); }
.pg-facts li { display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 1.25rem; align-items: baseline; padding: 1.4rem 0; border-top: 2px solid var(--heading); }
.pg-facts b { font: 800 clamp(1.75rem, 2.6vw, 2.4rem)/1.05 var(--font-head); color: var(--heading); white-space: nowrap; background: linear-gradient(transparent 62%, var(--yellow) 62%); justify-self: start; }
.pg-facts span { font-weight: 600; color: var(--heading); line-height: 1.45; }
.pg-facts .bm-cite a { color: var(--heading); }
.pg-need .bm-copy .bm-cite a, .pg-need .bm-cite a { color: var(--heading); }
.pg-steps { list-style: none; counter-reset: st; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
.pg-steps li { counter-increment: st; border-top: 3px solid var(--heading); padding-top: 1.25rem; }
.pg-steps li::before { content: counter(st); display: inline-block; font: 800 2.5rem/1 var(--font-head); color: var(--heading); background: linear-gradient(transparent 62%, var(--yellow) 62%); margin-bottom: .75rem; }
.pg-steps h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.pg-steps p { margin: 0; font-size: var(--fs-small); line-height: 1.7; }
@media (max-width: 980px) { .pg-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pg-facts li { grid-template-columns: minmax(0, 1fr); gap: .25rem; } }
@media (max-width: 560px) { .pg-steps { grid-template-columns: minmax(0, 1fr); } }

/* 49c. Programme pages as a guided flow (chapters), with a two-pane FAQ */
.pg .pg-lead { padding-block: clamp(2.5rem, 5vw, 4rem); }
.pg-head { max-width: 820px; margin-bottom: 2.25rem; }
.pg-head h2 { font-size: var(--fs-h2); margin: .35rem 0 0; }
.pg-need { background: var(--navy); color: var(--on-navy-muted); }
.pg-need .bm-num { color: rgba(255, 255, 255, .12); }
.pg-need .eyebrow { color: var(--yellow); }
.pg-need__top h2 { color: #fff; font-size: var(--fs-display); line-height: 1.12; max-width: 24ch; margin: .35rem 0 0; }
.pg-need__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); margin-top: 2.5rem; align-items: start; }
.pg-need__copy p { color: var(--on-navy-muted); font-size: var(--fs-lead); line-height: 1.75; margin: 0 0 1.25rem; }
.pg-need .bm-cite a { color: var(--yellow); }
.pg-need .pg-facts, .pg-need .pg-facts li { border-color: rgba(255, 255, 255, .3); }
.pg-need .pg-facts b { color: var(--yellow); background: none; }
.pg-need .pg-facts span { color: #fff; }
.pg-need .pg-verse { border-color: var(--yellow); }
.pg-need .pg-verse p { color: #fff; font-size: 1.5rem; }
.pg-need .pg-verse cite { color: var(--yellow); }
.pg-do__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.pg-do__photo { margin: 0; position: sticky; top: calc(var(--bm-top, 112px) + 4.5rem); height: min(70vh, 560px); }
.pg-do__photo img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-lg); display: block; }
.pg-do__main h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.pg-do__lead { font-size: var(--fs-lead); margin: 0 0 1.5rem; }
.pg-do__main .pg-list { grid-template-columns: minmax(0, 1fr); }
.pg-do__main .pg-list li { font-size: 1.25rem; padding: 1.1rem 0; }
.pg-do__main .pg-list li:last-child { border-bottom: 1px solid rgba(4, 25, 53, .18); }
.pg-how { background: #fff8d6; }
:root[data-theme="dark"] .pg-how { background: var(--bg-soft); }
.pg-flow { list-style: none; counter-reset: fl; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; position: relative; }
.pg-flow::before { content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 3px; background: var(--heading); }
.pg-flow li { counter-increment: fl; position: relative; padding-top: 4rem; }
.pg-flow li::before { content: counter(fl); position: absolute; left: 0; top: 0; width: 46px; height: 46px; border-radius: 10px; background: var(--navy); color: var(--yellow); display: grid; place-items: center; font: 800 1.25rem var(--font-head); }
.pg-flow h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.pg-flow p { margin: 0; font-size: var(--fs-body); line-height: 1.7; }
.pg-local { background: var(--surface); }
.pg-ways { background: var(--bg-soft); }
.pg-faq__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.pg-faq__list { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid rgba(4, 25, 53, .18); }
.pg-faq__list li { border-top: 1px solid rgba(4, 25, 53, .18); }
.pg-faq__list button { display: block; width: 100%; text-align: left; border: 0; background: none; font: 600 1.0625rem/1.4 var(--font-head); color: var(--text); padding: 1.1rem 1rem 1.1rem 1.25rem; cursor: pointer; position: relative; transition: background .2s, color .2s; }
.pg-faq__list button:hover { color: var(--heading); background: var(--bg-soft); }
.pg-faq__list li.is-on button { color: var(--heading); background: #fff8d6; box-shadow: inset 4px 0 0 var(--navy); }
.pg-faq__panel { position: sticky; top: calc(var(--bm-top, 112px) + 4.5rem); border-left: 4px solid var(--yellow); padding: .5rem 0 .5rem 2rem; }
.pg-faq__a h3 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); line-height: 1.3; margin: 0 0 1rem; }
.pg-faq__a p { font-size: var(--fs-lead); line-height: 1.75; margin: 0; max-width: 60ch; }
.pg-faq__more { margin: 2rem 0 0; font-size: var(--fs-small); }
.pg-faq__more a { font-weight: 700; color: var(--heading); }
@media (max-width: 980px) {
  .pg-need__grid, .pg-do__grid, .pg-faq__grid { grid-template-columns: minmax(0, 1fr); }
  .pg-do__photo { position: static; height: 280px; }
  .pg-flow { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .pg-flow::before { left: 22px; right: auto; top: 0; bottom: 0; width: 3px; height: auto; }
  .pg-flow li { padding: 0 0 0 4rem; min-height: 46px; }
  .pg-faq__panel { position: static; margin: .5rem 0 1rem 1rem; padding-left: 1.25rem; }
  .pg-faq__list li > .pg-faq__panel .pg-faq__more { display: none; }
}

/* 49d. Programme pages: no numbering, light need band, markers instead of numbers */
.pg-need { background: #ebeafc; color: var(--text); }
:root[data-theme="dark"] .pg-need { background: var(--bg-soft); }
.pg-need .eyebrow { color: var(--heading); }
.pg-need__top h2 { color: var(--heading); }
.pg-need__copy p { color: var(--text); }
.pg-need .bm-cite a { color: var(--heading); }
.pg-need .pg-facts, .pg-need .pg-facts li { border-color: var(--heading); }
.pg-need .pg-facts b { color: var(--heading); background: linear-gradient(transparent 62%, var(--yellow) 62%); }
.pg-need .pg-facts span { color: var(--heading); }
.pg-need .pg-verse p { color: var(--heading); }
.pg-need .pg-verse cite { color: var(--heading); }
.pg-list li::before { content: ""; flex: none; align-self: center; min-width: 0; width: 14px; height: 14px; border-radius: 3px; background: var(--yellow); box-shadow: 0 0 0 2px var(--navy); }
.pg-flow li::before { content: ""; width: 22px; height: 22px; border-radius: 5px; background: var(--yellow); box-shadow: 0 0 0 3px var(--navy); top: 11px; }
.pg-flow li { padding-top: 3.25rem; }
@media (max-width: 980px) { .pg-flow li { padding: 0 0 0 3.25rem; } .pg-flow li::before { top: 4px; } .pg-flow::before { left: 10px; } }

/* 49e. Programme pages: white need section, statement strip over a children photo */
.pg-need { background: var(--surface); }
:root[data-theme="dark"] .pg-need { background: var(--bg); }
.pg-do { background: var(--bg-soft); }
.pg-ways { background: var(--surface); }
.pg-more { background: var(--surface); }
.pg-strip { position: relative; display: grid; align-items: center; min-height: clamp(280px, 34vw, 420px); overflow: hidden; background: var(--navy-deep); }
.pg-strip > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.pg-strip::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3, 15, 32, .8), rgba(3, 15, 32, .45)); }
.pg-strip .container { position: relative; z-index: 2; padding-block: 3rem; }
.pg-strip__t { max-width: 34ch; margin: 0; font: 700 clamp(1.5rem, 3vw, 2.5rem)/1.25 var(--font-head); color: #fff; }

/* 50. Prayer partner: bigger child, filled rectangles, white form section overlapping the footer */
.cutout-bare .cutout { min-height: 660px; }
.cutout-bare .cutout img { max-width: 118%; max-height: 780px; margin-right: -8%; }
.pp-card { background: #fff; border: 0; border-radius: 4px; box-shadow: 0 6px 20px rgba(4, 25, 53, .10); padding: 1.75rem; }
:root[data-theme="dark"] .pp-card { background: var(--surface); }
.pp-topic { border-radius: 4px; }
.pp-topic img { border-radius: 2px; }
.pp-form-sec .pp-check { display: flex; gap: .5rem; align-items: flex-start; font-size: .875rem; }
.pp-form-sec .vl-form__card textarea { min-height: 110px; }
@media (max-width: 860px) { .cutout-bare .cutout img { max-width: 100%; margin-right: 0; } .cutout-bare .cutout { min-height: 0; } }

/* 50b. Prayer partner: copy higher up, rounded boxes as on the rest of the site */
.pp-intro { padding-top: clamp(1.5rem, 3vw, 3rem); }
.pp-intro .split { align-items: start; }
.pp-intro .split__copy { padding-top: clamp(0rem, 1vw, 1rem); }
.pp-card { border-radius: 16px; }
.pp-topic { border-radius: 16px; }
.pp-topic img { border-radius: 12px; }

/* 51. Prayer request page: prominent form stage, how we pray, verse, partner band */
.pr-stage { background: var(--navy); color: rgba(255, 255, 255, .88); padding-block: clamp(3rem, 6vw, 5.5rem); }
.pr-stage__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.pr-stage__copy h2 { color: #fff; font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.pr-stage__copy .eyebrow { color: var(--yellow); }
.pr-stage__copy p { color: rgba(255, 255, 255, .88); font-size: var(--fs-lead); line-height: 1.7; }
.pr-promises { list-style: none; margin: 1.5rem 0 2rem; padding: 0; display: grid; gap: .75rem; }
.pr-promises li { position: relative; padding-left: 1.75rem; color: rgba(255, 255, 255, .88); }
.pr-promises li::before { content: ""; position: absolute; left: 0; top: .5em; width: 12px; height: 12px; border-radius: 3px; background: var(--yellow); }
.pr-promises b { color: #fff; }
.pr-stage__photo { margin: 0; }
.pr-stage__photo img { width: 100%; height: auto; max-height: 560px; aspect-ratio: 4 / 3; object-fit: cover; object-position: center 30%; border-radius: var(--radius-lg); display: block; box-shadow: 0 24px 50px rgba(0, 0, 0, .4); }
.pr-stage__form { position: static; }
.pr-formcard { background: #fff; border-top: 7px solid var(--yellow); border-radius: 14px; padding: clamp(1.25rem, 3vw, 2.25rem); box-shadow: 0 24px 60px rgba(0, 0, 0, .45); color: #4e5c71; }
:root[data-theme="dark"] .pr-formcard { background: var(--surface); }
.pr-formcard h3 { font-size: var(--fs-h3); margin: 0 0 .25rem; color: #041935; }
:root[data-theme="dark"] .pr-formcard h3 { color: var(--heading); }
.pr-formcard__note { margin: 0 0 .5rem; font-size: var(--fs-small); }
.pr-formcard .ymi-request { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; max-width: none; }
.pr-how { background: var(--surface); }
.pr-verse { background: #ebeafc; text-align: center; }
:root[data-theme="dark"] .pr-verse { background: var(--bg-soft); }
.pr-verse blockquote { max-width: 900px; margin: 0 auto; }
.pr-verse p { font: 600 clamp(1.5rem, 3vw, 2.4rem)/1.35 var(--font-head); color: var(--heading); margin: 0 0 1rem; }
.pr-verse cite { font-style: normal; font-weight: 700; color: var(--heading); }
.pr-partner { background: var(--surface); }
.pr-partner .bm-photo img { aspect-ratio: 4 / 5; object-position: center 30%; }
.pr-faq .faq { max-width: 900px; }
@media (max-width: 980px) { .pr-stage__grid { grid-template-columns: minmax(0, 1fr); } .pr-stage__form { position: static; } .pr-stage__photo img { max-height: 380px; } }
.pr-how .pg-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 980px) { .pr-how .pg-flow { grid-template-columns: minmax(0, 1fr); } }

/* 52. Start a mission: values as editorial rows, richer "grow" section, form overlapping the footer */
.sm-values__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.sm-values__intro { position: sticky; top: calc(var(--bm-top, 100px) + 2rem); }
.sm-values__intro h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.sm-values__intro p { font-size: var(--fs-lead); }
.sm-values__list { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid rgba(4, 25, 53, .18); }
.sm-values__list li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 1.5rem; align-items: start; padding: 1.75rem 0; border-top: 1px solid rgba(4, 25, 53, .18); }
.sm-values__list .card__icon { margin: 0; }
.sm-values__list h3 { font-size: 1.375rem; margin: 0 0 .4rem; }
.sm-values__list p { margin: 0; }
.sm-grow__lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 6vw, 6rem); margin-top: clamp(2.5rem, 5vw, 4rem); }
.sm-grow__lists h3 { font-size: var(--fs-h3); margin: 0 0 1rem; }
.sm-grow__lists .pg-list { grid-template-columns: minmax(0, 1fr); }
.sm-grow__lists .pg-list li { font-size: 1.0625rem; }
.sm-form-sec .pp-check { font-size: .875rem; }
@media (max-width: 980px) { .sm-values__grid, .sm-grow__lists { grid-template-columns: minmax(0, 1fr); } .sm-values__intro { position: static; } }

/* 53. Partner with us: bigger "ways" layout without the small avatars, and a cleaner "start" section */
.pw-ways { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.75rem; }
.pw-col { grid-auto-rows: 1fr; align-content: stretch; }
.pw-card { padding: 2rem 1.75rem; border-radius: 16px; display: flex; flex-direction: column; justify-content: center; box-shadow: var(--shadow); border: 0; }
.pw-card h3 { font-size: 1.375rem; margin: 0 0 .75rem; }
.pw-card p { font-size: var(--fs-body); line-height: 1.65; }
.pw-card--c h3 { justify-content: flex-start; }
.pw-prayer { min-height: 620px; border-radius: 20px; }
.pw-prayer__txt { padding: 2rem; }
.pw-prayer__txt b { font-size: 1.375rem; }
.pw-start2__head { text-align: center; max-width: 720px; margin: 0 auto clamp(2rem, 4vw, 3.5rem); }
.pw-start2__head h2 { margin: .35rem 0 .75rem; }
.pw-start2__head p { margin: 0; font-size: var(--fs-lead); }
.pw-start2__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 2.5rem); position: relative; }
.pw-start2__steps li { position: relative; }
.pw-start2__steps figure { margin: 0 0 1.5rem; border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--shadow); }
.pw-start2__steps img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.pw-start2__steps li:hover img { transform: scale(1.05); }
.pw-start2__steps li::before { content: ""; position: absolute; left: 1rem; top: calc(75% * 0.75 - 1rem); }
.pw-start2__steps h3 { font-size: 1.375rem; margin: 0 0 .5rem; padding-top: 1rem; border-top: 3px solid var(--heading); position: relative; }
.pw-start2__steps h3::before { content: ""; position: absolute; left: 0; top: -12px; width: 22px; height: 22px; border-radius: 5px; background: var(--yellow); box-shadow: 0 0 0 3px var(--navy); }
.pw-start2__steps p { margin: 0; line-height: 1.7; }
.pw-start2__cta { text-align: center; margin: clamp(2rem, 4vw, 3rem) 0 0; }
@media (max-width: 1000px) { .pw-start2__steps { grid-template-columns: minmax(0, 1fr); } .pw-prayer { min-height: 420px; } }

/* 53b. Partner with us: "start" section as heading + icon rows (no photos) */
.pw-start3 { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.pw-start3__head h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.pw-start3__head p { font-size: var(--fs-lead); margin: 0 0 1.75rem; }
.pw-start3__list { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid rgba(4, 25, 53, .25); }
.pw-start3__list li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 1.5rem; align-items: start; padding: 1.75rem 0; border-top: 1px solid rgba(4, 25, 53, .25); }
.pw-start3__list .card__icon { margin: 0; }
.pw-start3__list h3 { font-size: 1.375rem; margin: 0 0 .4rem; }
.pw-start3__list p { margin: 0; line-height: 1.65; }
@media (max-width: 980px) { .pw-start3 { grid-template-columns: minmax(0, 1fr); } }

/* 54. Come pray with us: the calendar sits on a raised white card so the dates always stand out */
.pc-sec { background: #ebeafc; }
:root[data-theme="dark"] .pc-sec { background: var(--bg-soft); }
.pc-frame { max-width: 1100px; margin: 0 auto; background: #fff; color: #041935; border: 1px solid rgba(4, 25, 53, .12); border-top: 7px solid var(--navy); border-radius: 16px; padding: clamp(1rem, 3vw, 2.25rem); box-shadow: 0 24px 60px -12px rgba(4, 25, 53, .35), 0 6px 16px rgba(4, 25, 53, .12); color-scheme: light; }
:root[data-theme="dark"] .pc-frame { border-top-color: var(--yellow); box-shadow: 0 24px 60px rgba(0, 0, 0, .6); }
.pc-frame .widget { margin: 0; }

/* 54b. Come pray with us: a short "how to join" column beside the calendar (no repeat of the page heading) */
.pc-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.pc-side { position: sticky; top: calc(var(--bm-top, 100px) + 2rem); }
.pc-side h2 { font-size: var(--fs-h2); line-height: 1.2; margin: .35rem 0 1.5rem; }
.pc-steps { list-style: none; margin: 0 0 1.5rem; padding: 0; }
.pc-steps li { position: relative; padding: 1rem 0 1rem 2rem; border-top: 1px solid rgba(4, 25, 53, .2); display: grid; gap: .2rem; }
.pc-steps li:last-child { border-bottom: 1px solid rgba(4, 25, 53, .2); }
.pc-steps li::before { content: ""; position: absolute; left: 0; top: 1.4rem; width: 14px; height: 14px; border-radius: 3px; background: var(--yellow); box-shadow: 0 0 0 2px var(--navy); }
.pc-steps b { color: var(--heading); font-size: 1.0625rem; }
.pc-side__note { margin: 0 0 1.25rem; font-weight: 600; color: var(--heading); }
.pc-frame { max-width: none; margin: 0; }
@media (max-width: 980px) { .pc-grid { grid-template-columns: minmax(0, 1fr); } .pc-side { position: static; } }

/* 55. Meet the children: "spend a day" and "ready to meet" redesigned */
.mt-day { background: var(--surface); }
.mt-day__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.mt-day__photo { margin: 0; }
.mt-day__photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-lg); display: block; box-shadow: var(--shadow); }
.mt-day__copy h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.mt-day__lead { font-size: var(--fs-lead); color: var(--heading); }
.mt-day__copy .pg-list { grid-template-columns: minmax(0, 1fr); margin: 1rem 0 1.5rem; }
.mt-day__copy .pg-list li { padding: .85rem 0; font-size: 1.0625rem; }
.mt-day__cta { margin: 0; }
.mt-care { margin-top: clamp(2.5rem, 5vw, 4rem); padding: clamp(1.5rem, 3vw, 2.5rem); border-left: 6px solid var(--yellow); background: #ebeafc; border-radius: 0 var(--radius-lg) var(--radius-lg) 0; }
:root[data-theme="dark"] .mt-care { background: var(--bg-soft); }
.mt-care h3 { font-size: var(--fs-h3); margin: 0 0 1rem; }
.mt-care__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem clamp(1.5rem, 4vw, 3rem); }
.mt-care__cols p { margin: 0; line-height: 1.7; }
.mt-ready2 { background: var(--bg-soft); }
.mt-ready2__head { max-width: 820px; margin-bottom: 2.5rem; }
.mt-ready2__head h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.mt-ready2__head p { font-size: var(--fs-lead); margin: 0; }
.mt-ready2__opts { list-style: none; margin: 0 0 2.5rem; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mt-ready2__opts li { padding: 0 clamp(1.25rem, 3vw, 2.5rem); border-left: 1px solid rgba(4, 25, 53, .25); }
.mt-ready2__opts li:first-child { padding-left: 0; border-left: 0; }
.mt-ready2__opts .card__icon { margin: 0 0 1.25rem; }
.mt-ready2__opts h3 { font-size: 1.25rem; margin: 0 0 .6rem; }
.mt-ready2__opts p { margin: 0; line-height: 1.7; }
.mt-ready2 .hs-ready__bar { border-radius: var(--radius-lg); }
@media (max-width: 980px) { .mt-day__grid, .mt-care__cols { grid-template-columns: minmax(0, 1fr); } .mt-day__photo img { aspect-ratio: 16 / 10; } .mt-ready2__opts { grid-template-columns: minmax(0, 1fr); gap: 2rem; } .mt-ready2__opts li, .mt-ready2__opts li:first-child { padding: 0; border-left: 0; } }

/* 56. How sponsorship works: trust-led flow */
.hw2-head { max-width: 820px; margin-bottom: 2.25rem; }
.hw2-head h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.hw2-head p { font-size: var(--fs-lead); margin: 0; }
.hw2-trust { background: #ebeafc; padding-block: clamp(1.75rem, 3vw, 2.5rem); }
:root[data-theme="dark"] .hw2-trust { background: var(--bg-soft); }
.hw2-trust__row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hw2-trust__row li { display: flex; gap: 1rem; align-items: center; padding: .5rem 1.5rem; border-left: 1px solid rgba(4, 25, 53, .25); }
.hw2-trust__row li:first-child { padding-left: 0; border-left: 0; }
.hw2-trust__row .card__icon { margin: 0; flex: none; }
.hw2-trust__row b { display: block; color: var(--heading); font-size: 1rem; line-height: 1.3; }
.hw2-trust__row span span { display: block; font-size: var(--fs-small); line-height: 1.45; margin-top: .15rem; }
.hw2-intro { background: var(--surface); }
.hw2-split { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.hw2-copy h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1.25rem; }
.hw2-lead { font-size: var(--fs-lead); color: var(--heading); }
.hw2-btns { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.hw2-photo { margin: 0; }
.hw2-photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-lg); display: block; box-shadow: var(--shadow); }
.hw2-gift { background: var(--bg-soft); }
.hw2-tags { list-style: none; margin: 0 0 clamp(2.5rem, 5vw, 4rem); padding: 0; display: flex; flex-wrap: wrap; gap: .75rem; }
.hw2-tags li { padding: .6rem 1.15rem; background: var(--surface); border: 2px solid var(--navy); border-radius: 12px; font-weight: 700; color: var(--heading); }
:root[data-theme="dark"] .hw2-tags li { border-color: var(--yellow); }
.hw2-return { background: #fff8d6; }
:root[data-theme="dark"] .hw2-return { background: var(--bg); }
.hw2-recv { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hw2-recv li { padding: 0 clamp(1.25rem, 3vw, 2.5rem); border-left: 1px solid rgba(4, 25, 53, .25); }
.hw2-recv li:first-child { padding-left: 0; border-left: 0; }
.hw2-recv .card__icon { margin: 0 0 1.25rem; }
.hw2-recv h3 { font-size: 1.375rem; margin: 0 0 .6rem; }
.hw2-recv p { margin: 0; line-height: 1.7; }
.hw2-note { margin: 0; padding: 1.25rem 1.5rem; border-left: 6px solid var(--navy); background: rgba(255, 255, 255, .7); font-weight: 600; color: var(--heading); border-radius: 0 var(--radius) var(--radius) 0; }
.hw2-types { background: var(--surface); }
.hw2-proof { background: var(--navy); color: rgba(255, 255, 255, .85); }
.hw2-head--light h2 { color: #fff; }
.hw2-head--light p { color: rgba(255, 255, 255, .85); }
.hw2-proof .eyebrow { color: var(--yellow); }
.hw2-proof__list { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid rgba(255, 255, 255, .25); }
.hw2-proof__list li { border-top: 1px solid rgba(255, 255, 255, .25); }
.hw2-proof__list a { display: flex; gap: 1.5rem; align-items: center; justify-content: space-between; padding: 1.5rem .5rem; text-decoration: none; transition: background .2s, padding .2s; }
.hw2-proof__list a:hover { background: rgba(255, 255, 255, .06); padding-inline: 1.25rem; }
.hw2-proof__list b { display: block; color: #fff; font: 700 1.375rem var(--font-head); }
.hw2-proof__list em { display: block; font-style: normal; margin-top: .25rem; color: rgba(255, 255, 255, .8); }
.hw2-proof__list i { display: inline-flex; width: 1.5rem; color: var(--yellow); flex: none; }
.hw2-ready { background: var(--surface); }
.hw2-ready__in { max-width: 900px; margin: 0 auto; text-align: center; }
.hw2-ready__in h2 { font-size: var(--fs-display); line-height: 1.12; margin: 0 0 1rem; }
.hw2-ready__in > p { font-size: var(--fs-lead); margin: 0 0 2rem; }
.hw2-ready .hs-ready__bar { text-align: left; border-radius: var(--radius-lg); }
@media (max-width: 980px) {
  .hw2-trust__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 0; }
  .hw2-trust__row li:nth-child(3) { padding-left: 0; border-left: 0; }
  .hw2-split { grid-template-columns: minmax(0, 1fr); }
  .hw2-photo img { aspect-ratio: 16 / 10; }
  .hw2-recv { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .hw2-recv li, .hw2-recv li:first-child { padding: 0; border-left: 0; }
}
@media (max-width: 560px) { .hw2-trust__row { grid-template-columns: minmax(0, 1fr); } .hw2-trust__row li { padding-left: 0; border-left: 0; } }

/* 57. Events: the list on a strong band with stand-out rows, and the live "Gather. Serve. Make an impact." section cloned to its measurements */
.ev-sec { background: var(--navy); padding-block: clamp(3rem, 6vw, 5rem); }
.ev-sec__head { max-width: 760px; margin-bottom: 2.25rem; }
.ev-sec__head .eyebrow { color: var(--yellow); }
.ev-sec__head h2 { color: #fff; font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 .75rem; }
.ev-sec__head p { color: rgba(255, 255, 255, .85); font-size: var(--fs-lead); margin: 0; }
.ev-sec .ymi-events-list { max-width: none; gap: 1.5rem; }
.ev-sec .ymi-event-row { position: relative; gap: 0; padding: 0; overflow: hidden; align-items: stretch; border-radius: 16px; background: #fff; box-shadow: 0 22px 50px -14px rgba(0, 0, 0, .6); transition: transform .25s, box-shadow .25s; }
.ev-sec .ymi-event-row:hover { transform: translateY(-4px); box-shadow: 0 30px 60px -14px rgba(0, 0, 0, .7); }
.ev-sec .ymi-event-row__photo { display: none; }
.ev-sec .ymi-event-row__date { min-width: 130px; border-radius: 0; padding: 1.5rem 1rem; display: grid; align-content: center; background: var(--yellow); }
.ev-sec .ymi-event-row__day { font-size: 3.25rem; line-height: 1; }
.ev-sec .ymi-event-row__month { margin-top: .4rem; font-size: .8125rem; line-height: 1.1; }
.ev-sec .ymi-event-row__body { padding: 1.5rem 2rem; border-left: 0; align-self: center; }
.ev-sec .ymi-event-row__title { font-size: 1.5rem; line-height: 1.3; color: #041935; }
.ev-sec .ymi-event-row__desc { color: #4e5c71; }
.ev-sec .ymi-event-row__meta { color: #041935; font-weight: 700; }
.ev-sec .ymi-event-row__cta { align-self: center; margin-right: 2rem; }
.ev2 { background: #f3f3f3; padding-block: 90px 100px; }
:root[data-theme="dark"] .ev2 { background: var(--bg-soft); }
.ev2 .container { width: min(1344px, 100%); max-width: none; padding-inline: 32px; }
.ev2__head { display: flex; gap: 32px; align-items: flex-start; justify-content: space-between; margin-bottom: 56px; }
.ev2__head > div { max-width: 558px; }
.ev2__head h2 { font-size: 50px; line-height: 55px; font-weight: 600; margin: .25rem 0 0; }
.ev2__head > p { margin: 0; max-width: 648px; font-size: 21px; line-height: 31.5px; }
.ev2__row { display: flex; gap: 32px; align-items: stretch; min-height: 450px; }
.ev2__photo { position: relative; flex: 0 0 427px; margin: 0; border-radius: 20px; overflow: hidden; padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; min-height: 450px; color: #fff; }
.ev2__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ev2__photo::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(rgba(2, 1, 1, 0) 51%, #060c15 97%); opacity: .86; }
.ev2__photo-txt { position: relative; z-index: 2; display: grid; gap: 16px; }
.ev2__photo-txt p { margin: 0; color: #fff; font-size: 21px; line-height: 31.5px; }
.ev2__photo-txt .ev2__cap { margin: 0; color: var(--yellow); font: 600 16px/24px var(--font-head); text-transform: capitalize; }
.ev2__col { flex: 0 0 394px; display: flex; flex-direction: column; gap: 32px; }
.ev2__card { background: #fff; border-radius: 10px; padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.ev2__card h3 { margin: 0 0 -11px; font: 600 16px/24px var(--font-head); color: #041935; text-transform: capitalize; }
.ev2__t { margin: 0; font: 500 12px/12px var(--font-body); color: #041935; }
.ev2__d { margin: 0; font-size: 16px; line-height: 24px; color: #4e5c71; }
:root[data-theme="dark"] .ev2__card { background: var(--surface); }
:root[data-theme="dark"] .ev2__card h3, :root[data-theme="dark"] .ev2__t { color: var(--heading); }
@media (max-width: 1000px) {
  .ev2__head { flex-direction: column; gap: 1rem; }
  .ev2__head h2 { font-size: clamp(2rem, 6vw, 3rem); line-height: 1.15; }
  .ev2__head > p { font-size: 1.125rem; line-height: 1.6; }
  .ev2__row { flex-wrap: wrap; }
  .ev2__photo { flex: 1 1 100%; min-height: 380px; }
  .ev2__col { flex: 1 1 calc(50% - 16px); }
  .ev-sec .ymi-event-row { flex-wrap: wrap; }
  .ev-sec .ymi-event-row__date { min-width: 100%; display: flex; gap: .75rem; align-items: baseline; justify-content: flex-start; padding: 1rem 1.5rem; }
  .ev-sec .ymi-event-row__day { font-size: 2.25rem; }
  .ev-sec .ymi-event-row__body { padding: 1.25rem 1.5rem; }
  .ev-sec .ymi-event-row__cta { margin: 0 1.5rem 1.5rem; }
}
@media (max-width: 640px) { .ev2__col { flex: 1 1 100%; } }

/* 57b. Events list: warm cream band instead of navy, navy date tiles, white rows with a clear shadow */
.ev-sec { background: #fff3c4; }
:root[data-theme="dark"] .ev-sec { background: var(--bg-soft); }
.ev-sec__head .eyebrow { color: var(--heading); }
.ev-sec__head h2 { color: var(--heading); }
.ev-sec__head p { color: var(--text); }
.ev-sec .ymi-event-row { border: 1px solid rgba(4, 25, 53, .12); box-shadow: 0 18px 40px -14px rgba(4, 25, 53, .35), 0 3px 8px rgba(4, 25, 53, .08); }
.ev-sec .ymi-event-row:hover { box-shadow: 0 26px 50px -14px rgba(4, 25, 53, .45), 0 3px 8px rgba(4, 25, 53, .1); }
.ev-sec .ymi-event-row__date { background: var(--navy); }
.ev-sec .ymi-event-row__day { color: var(--yellow); }
.ev-sec .ymi-event-row__month { color: #fff; }
:root[data-theme="dark"] .ev-sec .ymi-event-row { background: var(--surface); }
:root[data-theme="dark"] .ev-sec .ymi-event-row__title, :root[data-theme="dark"] .ev-sec .ymi-event-row__meta { color: var(--heading); }
:root[data-theme="dark"] .ev-sec .ymi-event-row__desc { color: var(--text); }

/* 58. Widget buttons: the dashboard plugin's royal-blue buttons use the site's yellow with navy text (only the buttons; everything else keeps the approved colours). */
:root { --tone: #f4f6f9; }
body .ymi-event-row__cta, body .ymi-program-card__cta, body .ymi-btn:not([class*="--"]) { background: var(--yellow) !important; color: #041935 !important; }
body .ymi-event-row__cta:hover, body .ymi-program-card__cta:hover, body .ymi-btn:not([class*="--"]):hover { background: var(--yellow-hover) !important; color: #041935 !important; }

/* 59. FAQ: one calm accordion everywhere (hairline rows, no boxes), and the two-column FAQ section */
.faq { gap: 0; border-bottom: 1px solid var(--line); }
.faq details { background: transparent; border-radius: 0; box-shadow: none; border-top: 1px solid var(--line); }
.faq summary { padding: 1.3rem 3.25rem 1.3rem 0; font-size: 1.125rem; }
.faq summary:hover { color: var(--heading); text-decoration: underline; text-underline-offset: 4px; }
.faq summary::after { right: 0; border-radius: 8px; width: 30px; height: 30px; background: transparent; border: 1.5px solid var(--heading); color: var(--heading); }
.faq details[open] summary::after { background: var(--navy); border-color: var(--navy); color: var(--yellow); }
:root[data-theme="dark"] .faq details[open] summary::after { background: var(--yellow); border-color: var(--yellow); color: #041935; }
.faq details > div { padding: 0 3.25rem 1.5rem 0; }
.faq details p { line-height: 1.75; }
.faq2 { background: var(--tone); }
.faq2--white { background: var(--surface); }
.faq2__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.faq2__side { position: sticky; top: calc(var(--bm-top, 100px) + 2rem); }
.faq2__side h2 { font-size: var(--fs-h2); line-height: 1.2; margin: .35rem 0 1rem; }
.faq2__side > p { margin: 0 0 1.75rem; }
.faq2__help { border-top: 1px solid var(--line); padding-top: 1.5rem; display: grid; gap: 1rem; justify-items: start; }
.faq2__help b { color: var(--heading); font-family: var(--font-head); }
.faq2__list .faq { max-width: none; margin: 0; }
@media (max-width: 980px) { .faq2__grid { grid-template-columns: minmax(0, 1fr); } .faq2__side { position: static; } }

/* 60. Giving pages: rows, hairline cells, form card, project cards, catalog band, FAQ hub */
:root { --tone-strong: #e8ecf2; }
.gv-tone { background: var(--tone); }
.gv-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.gv-split--photo { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; }
.gv-intro { position: sticky; top: calc(var(--bm-top, 100px) + 2rem); }
.gv-intro h2, .gv-copy h2, .gv-head h2, .gv-bar h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.gv-intro p { font-size: var(--fs-lead); margin: 0 0 1.75rem; }
.gv-lead { font-size: var(--fs-lead); color: var(--heading); }
.gv-copy .gv-btns, .gv-faith__copy .gv-btns, .gv-give__copy .gv-btns { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.gv-head { max-width: 820px; margin-bottom: 2.5rem; }
.gv-head p { font-size: var(--fs-lead); margin: 0; }
.gv-bar { display: flex; flex-wrap: wrap; gap: 1rem 3rem; align-items: flex-end; justify-content: space-between; margin-bottom: 2.25rem; }
.gv-bar h2 { margin-bottom: 0; }
.gv-bar p { margin: 0; max-width: 40ch; }
.gv-note { margin: 2rem 0 0; font-size: var(--fs-lead); color: var(--heading); max-width: 900px; }
.gv-note a { font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.gv-photo, .gv-faith__photo, .gv-give__photo { margin: 0; }
.gv-photo img, .gv-faith__photo img, .gv-give__photo img { width: 100%; height: auto; border-radius: var(--radius-lg); display: block; box-shadow: var(--shadow); object-fit: cover; }
.gv-photo img { aspect-ratio: 4 / 5; }
.gv-rows { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.gv-rows li { border-top: 1px solid var(--line); }
.gv-rows a { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 1.5rem; align-items: center; padding: 1.5rem .5rem; text-decoration: none; transition: background .2s, padding .2s; }
.gv-rows a:hover { background: var(--tone); padding-inline: 1.25rem; }
.gv-rows .card__icon { margin: 0; }
.gv-rows__t b { display: block; color: var(--heading); font: 700 1.25rem var(--font-head); }
.gv-rows__t em { display: block; font-style: normal; margin-top: .25rem; color: var(--text); }
.gv-rows__go { display: inline-flex; width: 1.5rem; color: var(--heading); }
.gv-cells { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--c, 3), minmax(0, 1fr)); border-top: 1px solid var(--line); }
.gv-cells li { padding: 2rem clamp(1.25rem, 2.5vw, 2.25rem) 2rem 0; border-bottom: 1px solid var(--line); }
.gv-cells--3 li:not(:nth-child(3n+1)), .gv-cells--4 li:not(:nth-child(4n+1)) { padding-left: clamp(1.25rem, 2.5vw, 2.25rem); border-left: 1px solid var(--line); }
.gv-cells .card__icon { margin: 0 0 1.1rem; }
.gv-cells__big { display: block; font: 800 clamp(2rem, 3.4vw, 3rem)/1.05 var(--font-head); color: var(--heading); margin-bottom: .6rem; background: linear-gradient(transparent 62%, var(--yellow) 62%); width: fit-content; }
.gv-cells h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.gv-cells p { margin: 0; line-height: 1.7; }
.gv-cells__link { display: inline-flex; gap: .5rem; align-items: center; margin-top: 1rem; font-weight: 700; color: var(--heading); text-decoration: none; }
.gv-cells__link:hover { text-decoration: underline; text-underline-offset: 4px; }
.gv-chips { list-style: none; margin: 0 0 1.75rem; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.gv-chips li { position: relative; padding-left: 1.4rem; font-weight: 600; color: var(--heading); }
.gv-chips li::before { content: ""; position: absolute; left: 0; top: .5em; width: 11px; height: 11px; border-radius: 3px; background: var(--yellow); box-shadow: 0 0 0 2px var(--navy); }
/* catalog / project bands: darker neutral behind bright white cards */
.gv-catalog { background: var(--tone-strong); }
.gv-catalog--page { padding-top: clamp(2rem, 4vw, 3rem); }
.gv-catalog .mock-grid { gap: 1.5rem; }
.gv-catalog .card, .gv-catalog .ymi-gift-card, .gv-catalog .ymi-project-card { background: #fff; border: 1px solid rgba(4, 25, 53, .08); border-radius: 16px; box-shadow: 0 14px 34px -14px rgba(4, 25, 53, .3), 0 2px 6px rgba(4, 25, 53, .06); transition: transform .25s, box-shadow .25s; }
.gv-catalog .card:hover, .gv-catalog .ymi-gift-card:hover, .gv-catalog .ymi-project-card:hover { transform: translateY(-5px); box-shadow: 0 24px 46px -14px rgba(4, 25, 53, .38), 0 2px 6px rgba(4, 25, 53, .08); }
.gv-catalog .ymi-gift-card__price { color: var(--heading); font-weight: 800; }
/* donate page */
.gv-give__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.gv-give__copy h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.gv-give__copy > p { font-size: var(--fs-lead); }
.gv-give__photo { position: relative; }
.gv-give__photo img { aspect-ratio: 4 / 5; }
.gv-give__photo figcaption { margin-top: .6rem; font-size: var(--fs-small); }
/* monthly page */
.gv-setup { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.gv-setup__copy h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
.gv-setup__copy > p { font-size: var(--fs-lead); }
.gv-formcard { background: #fff; border-top: 7px solid var(--navy); border-radius: 14px; padding: clamp(1.5rem, 3vw, 2.5rem); box-shadow: 0 22px 54px -14px rgba(4, 25, 53, .32), 0 3px 8px rgba(4, 25, 53, .08); color: #4e5c71; }
:root[data-theme="dark"] .gv-formcard { background: var(--surface); border-top-color: var(--yellow); }
.gv-formcard h3 { font-size: var(--fs-h3); margin: 0 0 .25rem; color: #041935; }
:root[data-theme="dark"] .gv-formcard h3 { color: var(--heading); }
.gv-formcard__note { margin: 0 0 1.25rem; font-size: var(--fs-small); }
.gv-formcard .ymi-giving { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; max-width: none; }
.gv-formcard .ymi-giving__toggle { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; padding: .3rem; background: var(--tone); border-radius: 12px; margin-bottom: 1.25rem; }
.gv-formcard .ymi-giving__freq { padding: .8rem 1rem; border: 0; border-radius: 9px; background: transparent; font: 700 1rem var(--font-body); color: #041935; cursor: pointer; }
.gv-formcard .ymi-giving__freq.is-active { background: #041935; color: #fff; }
.gv-formcard .ymi-giving__amounts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.gv-formcard .ymi-giving__amount { padding: 1rem .5rem; border: 2px solid rgba(4, 25, 53, .2); border-radius: 12px; background: #fff; color: #041935; font: 800 1.25rem var(--font-head); cursor: pointer; }
.gv-formcard .ymi-giving__amount:hover { border-color: #041935; }
.gv-formcard .ymi-giving__amount.is-active { background: #041935; border-color: #041935; color: #fff; }
.gv-formcard .ymi-giving__other { grid-column: 1 / -1; display: flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border: 2px solid rgba(4, 25, 53, .2); border-radius: 12px; color: #041935; font-weight: 700; }
.gv-formcard .ymi-giving__other-input { flex: 1; border: 0; background: transparent; font: 700 1.125rem var(--font-body); color: #041935; }
.gv-formcard .ymi-giving__note { margin: 1rem 0; font-size: var(--fs-small); }
.gv-formcard .ymi-btn { width: 100%; justify-content: center; padding: 1rem 1.5rem; font-size: 1.0625rem; }
/* faith / accountability split */
.gv-faith { background: var(--tone); }
.gv-faith__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.gv-faith__photo img { aspect-ratio: 4 / 5; }
.gv-faith__copy h2 { font-size: var(--fs-display); line-height: 1.12; margin: .35rem 0 1rem; }
/* special projects: lively idea cards */
.gv-ideas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; }
.gv-idea { background: #fff; border: 1px solid rgba(4, 25, 53, .08); border-radius: 16px; overflow: hidden; box-shadow: 0 14px 34px -14px rgba(4, 25, 53, .3); display: flex; flex-direction: column; transition: transform .25s, box-shadow .25s; }
.gv-idea:hover { transform: translateY(-5px); box-shadow: 0 26px 48px -14px rgba(4, 25, 53, .4); }
.gv-idea figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
.gv-idea img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; transition: transform .6s; }
.gv-idea:hover img { transform: scale(1.06); }
.gv-idea > div { padding: 1.5rem 1.5rem 1.6rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.gv-idea h3 { font-size: 1.25rem; margin: 0; }
.gv-idea p { margin: 0; flex: 1; }
.gv-idea__go { display: inline-flex; gap: .5rem; align-items: center; margin-top: .75rem; font-weight: 700; color: var(--heading); text-decoration: none; }
.gv-idea__go:hover { text-decoration: underline; text-underline-offset: 4px; }
:root[data-theme="dark"] .gv-idea, :root[data-theme="dark"] .gv-catalog .card { background: var(--surface); }
/* FAQ hub */
.fh { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.fh__side { position: sticky; top: calc(var(--bm-top, 100px) + 2rem); display: grid; gap: 1.5rem; }
.fh__search input { width: 100%; height: 52px; padding: 0 1rem; border: 2px solid rgba(4, 25, 53, .2); border-radius: 12px; background: var(--surface); color: var(--heading); font: inherit; }
.fh__search input:focus { outline: none; border-color: var(--navy); }
.fh__cats { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.fh__cats li { border-bottom: 1px solid var(--line); }
.fh__cats a { display: flex; justify-content: space-between; padding: .85rem .25rem; text-decoration: none; color: var(--text); font-weight: 600; }
.fh__cats a:hover, .fh__cats a.is-on { color: var(--heading); background: var(--tone); padding-inline: .75rem; }
.fh__cats span { opacity: .7; }
.fh__help { padding: 1.25rem 1.5rem; background: var(--tone); border-left: 5px solid var(--navy); border-radius: 0 12px 12px 0; display: grid; gap: .6rem; justify-items: start; }
.fh__help b { color: var(--heading); font-family: var(--font-head); }
.fh__help p { margin: 0; font-size: var(--fs-small); }
.fh__group { margin-bottom: 3rem; scroll-margin-top: calc(var(--bm-top, 100px) + 2rem); }
.fh__group h2 { font-size: var(--fs-h3); margin: 0 0 1rem; }
.fh__group .faq { max-width: none; margin: 0; }
.fh__empty { padding: 2rem 0; font-weight: 600; color: var(--heading); }
@media (max-width: 980px) {
  .gv-split, .gv-split--photo, .gv-give__grid, .gv-setup, .gv-faith__grid, .fh { grid-template-columns: minmax(0, 1fr); }
  .gv-intro, .fh__side { position: static; }
  .gv-cells { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gv-cells li, .gv-cells--3 li:not(:nth-child(3n+1)), .gv-cells--4 li:not(:nth-child(4n+1)) { padding: 1.5rem 1rem 1.5rem 0; border-left: 0; }
  .gv-cells li:nth-child(2n) { padding-left: 1rem; border-left: 1px solid var(--line); }
  .gv-ideas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gv-rows a { grid-template-columns: 52px minmax(0, 1fr) auto; gap: 1rem; }
}
@media (max-width: 560px) { .gv-cells { grid-template-columns: minmax(0, 1fr); } .gv-cells li:nth-child(2n) { padding-left: 0; border-left: 0; } .gv-ideas { grid-template-columns: minmax(0, 1fr); } .gv-formcard .ymi-giving__amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* impact page: five cards, balanced (three over two) */
.im-cards { columns: auto; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.5rem; }
.im-card { margin: 0; }
.im-card:nth-child(-n+3) { grid-column: span 2; }
.im-card:nth-child(n+4) { grid-column: span 3; }
.im-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 860px) { .im-cards { grid-template-columns: minmax(0, 1fr); } .im-card:nth-child(n) { grid-column: auto; } }
.gv-more { text-align: center; margin: 2rem 0 0; }

/* 61. FAQ: one lively accordion for the whole site. No boxes and no side lines, only a line between questions; a yellow bar slides in and the toggle turns from yellow to navy when a question is open. */
@keyframes faqIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.faq { display: block; max-width: none; margin-inline: 0; }
.faq details { background: transparent; border: 0; border-bottom: 1px solid rgba(4, 25, 53, .16); border-radius: 0; box-shadow: none; position: relative; }
.faq details:first-child { border-top: 1px solid rgba(4, 25, 53, .16); }
:root[data-theme="dark"] .faq details { border-bottom-color: var(--line); }
.faq summary { padding: 1.5rem 4.25rem 1.5rem 0; font: 700 1.1875rem/1.4 var(--font-head); color: var(--heading); transition: padding .25s; }
.faq summary::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 0; background: var(--yellow); border-radius: 3px; transform: translateY(-50%); transition: height .25s; }
.faq summary:hover::before, .faq details[open] summary::before { height: 58%; }
.faq summary:hover, .faq details[open] summary { padding-left: 1.25rem; text-decoration: none; }
.faq summary::after { content: "+"; right: 0; width: 40px; height: 40px; border-radius: 10px; background: var(--yellow); border: 0; color: #041935; font: 700 1.5rem/1 var(--font-body); transition: transform .25s, background .25s, color .25s; }
.faq details[open] summary::after { content: "+"; transform: translateY(-50%) rotate(45deg); background: var(--navy); color: var(--yellow); }
:root[data-theme="dark"] .faq details[open] summary::after { background: var(--yellow); color: #041935; }
.faq details > div { padding: 0 4.25rem 1.75rem 1.25rem; animation: faqIn .35s ease; }
.faq details p { font-size: 1.0625rem; line-height: 1.75; }
.faq2 { background: #ebeafc; }
:root[data-theme="dark"] .faq2 { background: var(--bg-soft); }
.faq2--white { background: var(--surface); }
.faq2__mark { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 16px; background: var(--navy); color: var(--yellow); font: 800 2rem/1 var(--font-head); margin-bottom: 1.25rem; }

/* 62. Gift catalog band in white with shadowed cards; corporate tabs and staircase; violet band for projects */
.gv-catalog { background: var(--surface); border-top: 1px solid var(--line); }
.gv-catalog .card, .gv-catalog .ymi-gift-card, .gv-catalog .ymi-project-card { border: 1px solid rgba(4, 25, 53, .1); box-shadow: 0 18px 40px -12px rgba(4, 25, 53, .38), 0 3px 8px rgba(4, 25, 53, .1); }
.gv-catalog .card:hover, .gv-catalog .ymi-gift-card:hover, .gv-catalog .ymi-project-card:hover { box-shadow: 0 28px 54px -12px rgba(4, 25, 53, .46), 0 3px 8px rgba(4, 25, 53, .12); }
.gv-violet { background: #ebeafc !important; border-top: 0; }
:root[data-theme="dark"] .gv-violet { background: var(--bg-soft) !important; }
.gv-faith { background: var(--surface); }
.gv-fit { background: var(--surface); }
.gv-tabs { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; }
.gv-tabs__list { display: grid; gap: .5rem; }
.gv-tab { display: flex; align-items: center; gap: 1rem; width: 100%; text-align: left; padding: .9rem 1.1rem; border: 2px solid transparent; border-radius: 14px; background: transparent; font: inherit; cursor: pointer; transition: background .2s, border-color .2s; }
.gv-tab b { font: 700 1.125rem var(--font-head); color: var(--heading); }
.gv-tab .card__icon { margin: 0; flex: none; }
.gv-tab:hover { background: #ebeafc; }
.gv-tab.is-on { background: #fff; border-color: var(--navy); box-shadow: 0 14px 32px -12px rgba(4, 25, 53, .3); }
.gv-tabs__panels { position: relative; }
.gv-panel { display: none; padding: clamp(1.5rem, 3vw, 2.5rem); background: #ebeafc; border-radius: 20px; animation: bm-in .35s ease; }
.gv-panel.is-on { display: block; }
.gv-panel h3 { font-size: var(--fs-h2); margin: 0 0 .75rem; }
.gv-panel > p { font-size: var(--fs-lead); margin: 0 0 1.25rem; color: var(--heading); }
.gv-panel__list { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .75rem; }
.gv-panel__list li { position: relative; padding-left: 1.75rem; }
.gv-panel__list li::before { content: ""; position: absolute; left: 0; top: .55em; width: 12px; height: 12px; border-radius: 3px; background: var(--yellow); box-shadow: 0 0 0 2px var(--navy); }
:root[data-theme="dark"] .gv-panel, :root[data-theme="dark"] .gv-tab:hover { background: var(--bg-soft); }
:root[data-theme="dark"] .gv-tab.is-on { background: var(--surface); border-color: var(--yellow); }
.gv-journey { overflow: hidden; }
.gv-stairs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; align-items: end; counter-reset: gs; }
.gv-stairs li { background: #fff; border-radius: 16px; padding: 1.75rem 1.5rem 2rem; box-shadow: 0 16px 36px -14px rgba(4, 25, 53, .3); border-top: 6px solid var(--yellow); }
.gv-stairs li:nth-child(1) { min-height: 250px; }
.gv-stairs li:nth-child(2) { min-height: 300px; }
.gv-stairs li:nth-child(3) { min-height: 350px; }
.gv-stairs li:nth-child(4) { min-height: 400px; }
.gv-stairs .card__icon { margin: 0 0 1.25rem; }
.gv-stairs h3 { font-size: 1.25rem; margin: 0 0 .6rem; }
.gv-stairs p { margin: 0; line-height: 1.7; }
:root[data-theme="dark"] .gv-stairs li { background: var(--surface); }
@media (max-width: 980px) { .gv-tabs { grid-template-columns: minmax(0, 1fr); } .gv-tabs__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gv-stairs { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; } .gv-stairs li:nth-child(n) { min-height: 0; } }
@media (max-width: 560px) { .gv-tabs__list, .gv-stairs { grid-template-columns: minmax(0, 1fr); } }

/* 64. Giving widget: selected states in the site's navy instead of the plugin's royal blue */
body .ymi-giving { --ymi-blue: #041935; --ymi-blue-soft: #f4f6f9; }
body .ymi-giving__freq.is-active, body .ymi-giving__amount.is-active { background: #041935 !important; border-color: #041935 !important; color: #fff !important; }
body .ymi-giving__amount:hover, body .ymi-giving__freq:hover { border-color: #041935; }
body .ymi-giving__other:focus-within { border-color: #041935; box-shadow: 0 0 0 3px rgba(4, 25, 53, .15); }
:root[data-theme="dark"] body .ymi-giving__freq.is-active, :root[data-theme="dark"] body .ymi-giving__amount.is-active { background: var(--yellow) !important; border-color: var(--yellow) !important; color: #041935 !important; }

/* 65. Events list on white, rows lifted by a clear shadow */
.ev-sec { background: var(--surface); }
.ev-sec .ymi-event-row { border: 1px solid rgba(4, 25, 53, .1); box-shadow: 0 18px 42px -12px rgba(4, 25, 53, .34), 0 3px 8px rgba(4, 25, 53, .1); }
.ev-sec .ymi-event-row:hover { box-shadow: 0 28px 56px -12px rgba(4, 25, 53, .42), 0 3px 8px rgba(4, 25, 53, .12); }