/* Heritage — reverent, classic, warm. Libre Caslon + Barlow on parchment, paper and walnut.
   Brand colours come ONLY from the canonical tokens generated by shared/theme.mjs (inlined :root in <head>);
   the aliases below are defined from them. Warm neutrals are fixed by the template. */

/* ------------------------------------------------------------------ fonts (self-hosted OFL, see fonts/OFL.txt) */
@font-face { font-family: "Libre Caslon Display"; src: url(/theme/fonts/libre-caslon-display-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Libre Caslon Text"; src: url(/theme/fonts/libre-caslon-text-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Libre Caslon Text"; src: url(/theme/fonts/libre-caslon-text-400i.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Libre Caslon Text"; src: url(/theme/fonts/libre-caslon-text-700.woff2) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(/theme/fonts/barlow-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url(/theme/fonts/barlow-600.woff2) format("woff2"); font-weight: 500 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url(/theme/fonts/barlow-condensed-600.woff2) format("woff2"); font-weight: 500 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url(/theme/fonts/barlow-condensed-700.woff2) format("woff2"); font-weight: 700 800; font-style: normal; font-display: swap; }
/* metric-adjusted fallbacks (limit layout shift while the webfonts load) */
@font-face { font-family: "Caslon Fallback"; src: local("Georgia"); size-adjust: 97%; ascent-override: 88%; descent-override: 26%; }
@font-face { font-family: "Barlow Fallback"; src: local("Arial"); size-adjust: 91%; ascent-override: 100%; descent-override: 20%; }
@font-face { font-family: "Condensed Fallback"; src: local("Arial Narrow"), local("Arial"); size-adjust: 88%; }

/* ------------------------------------------------------------------ tokens */
:root {
  /* fixed warm neutrals */
  --parchment: #F7F2E8; --paper: #FFFDF8; --linen: #EFE6D6; --white: #FFFFFF;
  --ink: #2A231E; --ink-2: #4A4038; --muted: #6A5E54;
  --line: rgba(42, 35, 30, .16); --line-strong: rgba(42, 35, 30, .32);
  --walnut: #2B211B; --walnut-2: #3A2D25;
  --cream: #F7F2E8; --on-dark: rgba(247, 242, 232, .84); --on-dark-2: rgba(247, 242, 232, .7); --line-dark: rgba(247, 242, 232, .16);
  --walnut-rgb: 43, 33, 27; --ink-rgb: 42, 35, 30; --cream-rgb: 247, 242, 232; --paper-rgb: 255, 253, 248; --night-rgb: 20, 15, 12; --black-rgb: 0, 0, 0; --white-rgb: 255, 255, 255;
  --placeholder: #8A7E73; --print-ink: #000000; --print-paper: #FFFFFF;
  --ok: #2F7D52; --ok-bg: #EAF3EC; --err: #A3302A; --err-bg: #FBEEED;
  /* brand aliases (canonical tokens from theme.mjs) */
  --p: var(--brand); --p-fill: var(--brand-fill); --on-p: var(--on-brand); --p-deep: var(--brand-deep);
  --p-ink: var(--brand-ink); --p-soft: var(--brand-soft); --p-tint: var(--brand-tint); --p-pale: var(--brand-pale);
  --a: var(--accent); --a-mark: var(--accent-mark); --a-ink: var(--accent-ink); --a-dark: var(--accent-on-dark); --on-a: var(--on-accent);
  /* type */
  --display: "Libre Caslon Display", "Libre Caslon Text", "Caslon Fallback", Georgia, "Times New Roman", serif;
  --serif: "Libre Caslon Text", "Caslon Fallback", Georgia, serif;
  --sans: "Barlow", "Barlow Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --label: "Barlow Condensed", "Condensed Fallback", "Arial Narrow", sans-serif;
  /* layout */
  --gut: 16px;
  --wrap: min(1140px, 100% - 2 * var(--gut));
  --narrow: min(760px, 100% - 2 * var(--gut));
  --mid: min(880px, 100% - 2 * var(--gut));
  --sec-y: clamp(64px, 9vw, 120px);
  --gap: clamp(16px, 2.5vw, 32px);
  --r: 6px;
  --shadow: 0 18px 40px -28px rgba(43, 33, 27, .45);
  --shadow-lift: 0 26px 50px -26px rgba(43, 33, 27, .5);
  --shadow-sm: 0 6px 16px -10px rgba(43, 33, 27, .35);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --linen-img: url(/theme/linen.png);
  --tex-light: .045;   /* linen texture strength on light grounds (4–6%) */
  --tex-dark: .06;    /* … and on walnut / brand grounds */
  --hdr-h: 76px;
}
@media (min-width: 600px) { :root { --gut: 24px; } }
@media (min-width: 1040px) { :root { --gut: 32px; } }

/* ------------------------------------------------------------------ base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 96px; }
body { margin: 0; background: var(--parchment); color: var(--ink); font: 400 1.125rem/1.65 var(--sans); font-kerning: normal; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
img, svg, video { max-width: 100%; }
img { height: auto; display: block; }
svg { width: 1em; height: 1em; flex: none; }
svg:not([fill]) { fill: currentColor; }
h1, h2, h3, h4 { margin: 0; font-weight: 400; color: inherit; text-wrap: balance; }
p { margin: 0; }
em, i, cite, blockquote, figcaption { font-variant-ligatures: common-ligatures no-discretionary-ligatures no-historical-ligatures; font-feature-settings: "dlig" 0, "hlig" 0; }
a { color: var(--p-ink); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
ul, ol { margin: 0; padding: 0; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 2px; }
.dark :focus-visible, .ftr :focus-visible, .svcbar :focus-visible, .hero-photo :focus-visible, .hero-plain :focus-visible,
.phero-photo :focus-visible, .sec-cta :focus-visible, .board :focus-visible, .live-banner:focus-visible { outline-color: var(--focus-on-dark); }
::selection { background: var(--p-soft); color: var(--ink); }
[hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 200; background: var(--p-fill); color: var(--on-p); padding: 12px 18px; border-radius: 4px; font: 700 1rem var(--label); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; }
.skip:focus { top: 12px; }
.wrap { width: var(--wrap); margin-inline: auto; }
.wrap-hdr { width: min(1240px, 100% - 2 * var(--gut)); margin-inline: auto; }
.narrow { width: var(--narrow); margin-inline: auto; }
.mid { width: var(--mid); margin-inline: auto; }
.tnum, time { font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ type helpers */
.kicker { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 14px; font: 700 .85rem/1.2 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--p-ink); }
.kicker::before { content: ""; width: 28px; height: 2px; background: currentColor; flex: none; }
.kicker-muted { color: var(--muted); }
.kicker-c { justify-content: center; }
.dark .kicker, .hero-photo .kicker { color: var(--a-dark); }
.lede { font-size: clamp(1.125rem, 1.6vw, 1.25rem); line-height: 1.55; color: var(--ink-2); max-width: 62ch; }
.textlink { display: inline-flex; align-items: center; gap: 8px; font: 700 .95rem/1.2 var(--label); letter-spacing: .1em; text-transform: uppercase; color: var(--p-ink); text-decoration: none; padding: 10px 0; }
.textlink:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.textlink svg { width: 1.05em; height: 1.05em; }

/* ornament rule: line · diamond · line */
.orn { display: flex; align-items: center; gap: 10px; width: 120px; color: var(--a); }
.orn::before, .orn::after { content: ""; height: 1px; background: currentColor; flex: 1; }
.orn i { width: 7px; height: 7px; background: currentColor; transform: rotate(45deg); flex: none; }
.orn-c { margin-inline: auto; }
.sec-head .orn { margin: 18px 0 0; width: 104px; }
.sec-head .orn::before { flex: 0 0 28px; }
.sec-head.center .orn { margin-inline: auto; width: 120px; }
.sec-head.center .orn::before { flex: 1; }

/* ------------------------------------------------------------------ buttons */
.btn { --bg: transparent; --fg: var(--ink); --bd: transparent; display: inline-flex; align-items: center; justify-content: center; gap: .55em; min-height: 48px; padding: .8rem 1.4rem; border: 1.5px solid var(--bd); border-radius: 4px; background: var(--bg); color: var(--fg); font: 700 1.02rem/1.1 var(--label); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; text-align: center; transition: background-color .2s, color .2s, border-color .2s, transform .2s var(--ease), box-shadow .2s; }
.btn:hover { transform: translateY(-1px); text-decoration: none; }
.btn:active { transform: none; }
.btn svg { width: 1.15em; height: 1.15em; }
.btn-solid { --bg: var(--p-fill); --fg: var(--on-p); --bd: var(--p-fill); box-shadow: 0 8px 18px -12px rgba(var(--walnut-rgb), .6); }
.btn-solid:hover { --bg: var(--p-deep); --bd: var(--p-deep); }
.btn-outline { --fg: var(--ink); --bd: var(--ink); }
.btn-outline:hover { --bg: var(--ink); --fg: var(--cream); }
.btn-ghost { --fg: var(--cream); --bd: rgba(var(--cream-rgb), .7); }
.btn-ghost:hover { --bg: var(--cream); --fg: var(--walnut); --bd: var(--cream); }
.btn-paper { --bg: var(--paper); --fg: var(--p-ink); --bd: var(--paper); box-shadow: 0 10px 22px -14px rgba(var(--black-rgb), .55); }
.btn-paper:hover { --bg: var(--white); --bd: var(--white); }
.btn-live { --bg: var(--live); --fg: var(--white); --bd: var(--live); }
.btn-live .live-dot { background: var(--white); }
.dark .btn-outline, .hero-photo .btn-outline, .hero-plain .btn-outline, .phero-photo .btn-outline { --fg: var(--cream); --bd: rgba(var(--cream-rgb), .7); }
.dark .btn-outline:hover { --bg: var(--cream); --fg: var(--walnut); }
.btn-sm { min-height: 44px; padding: .55rem 1rem; font-size: .92rem; }
.btn-lg { min-height: 54px; padding: 1rem 1.7rem; font-size: 1.05rem; }
.ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ctas-c { justify-content: center; }
.icon-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-strong); border-radius: 4px; background: transparent; color: var(--ink); transition: background-color .2s, border-color .2s; }
.icon-btn:hover { background: var(--p-soft); border-color: var(--p-ink); }
.icon-btn svg { width: 20px; height: 20px; }

/* ------------------------------------------------------------------ live dot (the only infinite animation) */
.live-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--live); flex: none; box-shadow: 0 0 0 0 color-mix(in srgb, var(--live) 55%, transparent); animation: hpulse 1.8s ease-out infinite; }
@keyframes hpulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--live) 55%, transparent); } 70% { box-shadow: 0 0 0 9px color-mix(in srgb, var(--live) 0%, transparent); } 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--live) 0%, transparent); } }

/* ------------------------------------------------------------------ service bar + header */
.svcbar { display: none; background: var(--walnut); color: var(--on-dark); font: 600 .8rem/1 var(--label); letter-spacing: .16em; text-transform: uppercase; }
.svcbar-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 36px; }
.svcbar p { display: flex; align-items: center; gap: 14px; }
.svcbar-r { gap: 22px !important; }
.svcbar a { color: var(--on-dark); text-decoration: none; display: inline-flex; align-items: center; gap: 7px; padding: 8px 0; }
.svcbar a:hover { color: var(--a-dark); }
.svcbar svg { width: 13px; height: 13px; }
.svcbar .sep { width: 5px; height: 5px; background: var(--a-dark); transform: rotate(45deg); flex: none; }
.svcbar-l span:first-child { color: var(--cream); }
.hdr-sentinel { height: 1px; margin-bottom: -1px; }
.hdr { position: sticky; top: 0; z-index: 60; background: rgba(var(--paper-rgb), .96); border-top: 3px solid var(--p); border-bottom: 1px solid var(--line); -webkit-backdrop-filter: saturate(1.2) blur(8px); backdrop-filter: saturate(1.2) blur(8px); transition: box-shadow .2s; }
.hdr-in { display: flex; align-items: center; gap: 20px; height: 64px; transition: height .2s var(--ease); }
.brand { display: inline-flex; align-items: center; text-decoration: none; color: var(--ink); flex: none; min-height: 44px; }
.brand img { height: 38px; width: auto; transition: height .2s var(--ease); }
.wordmark { display: inline-flex; flex-direction: column; line-height: 1.05; }
.wm-name { font: 700 clamp(1.15rem, 2.4vw, 1.45rem)/1.1 var(--serif); color: var(--ink); }
.wm-sub { font: 600 .72rem/1.2 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-top: 3px; }
.nav { display: none; margin-left: auto; }
.nav ul { list-style: none; display: flex; align-items: center; gap: clamp(12px, 1.35vw, 26px); }
.nav a { position: relative; display: block; padding: 12px 0; font: 600 .98rem/1 var(--label); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-2); text-decoration: none; white-space: nowrap; transition: color .2s; }
.nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px; background: var(--p-ink); transform: scaleX(0); transform-origin: center; transition: transform .25s var(--ease); }
.nav a:hover, .nav a[aria-current="page"] { color: var(--ink); }
.nav a:hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav a[aria-current="page"]::before { content: ""; position: absolute; left: 50%; top: -3px; width: 5px; height: 5px; margin-left: -2.5px; background: var(--a-mark); transform: rotate(45deg); }
.hdr-tools { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.hdr-visit { display: none; min-height: 44px; padding: .6rem 1.1rem; font-size: .95rem; }
html.hdr-compact .hdr { box-shadow: 0 8px 24px -18px rgba(var(--walnut-rgb), .5); }
@media (min-width: 600px) {
  .hdr-in { height: 72px; }
  .brand img { height: 44px; }
  .hdr-visit { display: inline-flex; }
}
@media (min-width: 1040px) {
  .svcbar { display: block; }
  .hdr-in { height: var(--hdr-h); gap: 28px; }
  .brand img { height: 48px; }
  .nav { display: block; }
  .hdr-tools { margin-left: 0; }
  .burger { display: none; }
  html.hdr-compact .hdr-in { height: 60px; }
  html.hdr-compact .brand img { height: 40px; }
}
@media (min-width: 1040px) and (max-width: 1239px) {
  .nav ul { gap: 14px; }
  .nav a { font-size: .9rem; letter-spacing: .06em; }
  .hdr-visit { padding: .55rem .85rem; font-size: .88rem; letter-spacing: .06em; }
  .hdr-in { gap: 18px; }
  .brand img, html.hdr-compact .brand img { height: 38px; }
}
/* no JS: the nav wraps under the logo */
@media (max-width: 1039px) {
  html.no-js .nav { display: block; width: 100%; margin: 0; order: 3; }
  html.no-js .nav ul { flex-wrap: wrap; gap: 0 18px; }
  html.no-js .hdr-in { flex-wrap: wrap; height: auto; padding-block: 8px; }
}
html.no-js .burger, html.no-js .pagebar { display: none !important; }

/* "Go to page" bar (below 1040px) */
.pagebar { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 var(--gut); background: var(--paper); border-left: 4px solid var(--p-fill); border-bottom: 1px solid var(--line); }
.pagebar label { font: 700 .8rem/1 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--muted); flex: none; }
.pagebar-sel { position: relative; flex: 1; }
.pagebar select { width: 100%; min-height: 44px; appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: 0 32px 0 0; font: 700 1rem/1 var(--label); letter-spacing: .08em; text-transform: uppercase; color: var(--ink); cursor: pointer; }
.pagebar-sel svg { position: absolute; right: 4px; top: 50%; width: 18px; height: 18px; margin-top: -9px; pointer-events: none; color: var(--p-ink); }
@media (min-width: 1040px) { .pagebar { display: none; } }

/* drawer */
.drawer { position: fixed; z-index: 90; top: 0; right: 0; bottom: 0; width: min(460px, 100%); overflow-y: auto; overscroll-behavior: contain; background: var(--parchment); box-shadow: -30px 0 60px -30px rgba(var(--walnut-rgb), .6); transform: translateX(100%); transition: transform .35s var(--ease), visibility 0s .35s; visibility: hidden; padding: 0 clamp(20px, 6vw, 36px) calc(32px + env(safe-area-inset-bottom)); }
.drawer::before { content: ""; position: fixed; inset: 0; background: var(--linen-img); opacity: var(--tex-light); pointer-events: none; z-index: -1; }
.drawer.open { transform: none; visibility: visible; transition: transform .35s var(--ease); }
html.no-js .drawer { display: none; }
.drawer-top { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; background: var(--parchment); border-bottom: 1px solid var(--line); }
.drawer-top .brand img { height: 40px; }
.drawer-list { list-style: none; margin: 8px 0 24px; }
.drawer-list li { border-bottom: 1px solid var(--line); }
.drawer-list a { display: flex; flex-direction: column; gap: 4px; padding: 14px 0 15px; text-decoration: none; color: var(--ink); }
.drawer-list small { font: 600 .78rem/1 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.drawer-list span { font: 700 clamp(1.55rem, 6.4vw, 2rem)/1.1 var(--serif); transition: color .2s, transform .25s var(--ease); }
.drawer-list a:hover span { color: var(--p-ink); transform: translateX(4px); }
.drawer-list a[aria-current="page"] span { color: var(--p-ink); }
.drawer-list a[aria-current="page"] small { color: var(--p-ink); }
.drawer-list a[aria-current="page"] span::after { content: ""; display: inline-block; width: 8px; height: 8px; margin-left: 12px; vertical-align: middle; background: var(--a-mark); transform: rotate(45deg); }
.drawer-ctas { display: grid; gap: 10px; }
.drawer-foot { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 6px 18px; font: 600 .85rem/1.4 var(--label); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.drawer-foot a { color: var(--p-ink); }
.drawer-scrim { position: fixed; inset: 0; z-index: 85; background: rgba(var(--walnut-rgb), .55); opacity: 0; transition: opacity .35s; }
.drawer-scrim.open { opacity: 1; }
html.drawer-open { overflow: hidden; }

/* ------------------------------------------------------------------ heroes */
.grade { filter: saturate(.86) sepia(.14) contrast(1.04) brightness(1.01); }
.hero, .phero { position: relative; isolation: isolate; }
.hero-media { position: absolute; inset: 0; z-index: -2; overflow: hidden; background: var(--walnut); }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(var(--walnut-rgb), .84) 0%, rgba(var(--walnut-rgb), .62) 42%, rgba(var(--walnut-rgb), .22) 100%), linear-gradient(0deg, rgba(var(--walnut-rgb), .72) 0%, rgba(var(--walnut-rgb), 0) 50%); }
.hero h1 { font: 400 clamp(2.3rem, 7.5vw, 5.4rem)/1.02 var(--display); letter-spacing: -.01em; }
.hero h1 em { font-family: var(--serif); font-style: italic; letter-spacing: -.02em; }
.hero-lede { margin-top: 22px; font-size: clamp(1.125rem, 1.7vw, 1.35rem); line-height: 1.55; max-width: 40ch; }
.hero .ctas, .phero .ctas { margin-top: 32px; }
@media (max-width: 559px) { .hero .ctas .btn { width: 100%; max-width: 320px; } .hero-plain .ctas { flex-direction: column; } }
.hero-est { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 0 4px; font: 600 .82rem/1.4 var(--label); letter-spacing: .22em; text-transform: uppercase; }
/* photo */
.hero-photo { display: flex; align-items: flex-end; min-height: min(86vh, 820px); color: var(--cream); background: var(--walnut); }
.hero-photo .hero-grid { padding-block: clamp(120px, 18vh, 200px) clamp(56px, 9vw, 104px); }
.hero-photo .hero-text { max-width: 780px; border-left: 6px solid var(--a); padding-left: clamp(20px, 3vw, 40px); }
.hero-photo h1 em, .hero-plain h1 em { color: var(--a-dark); }
.hero-photo .hero-lede, .hero-plain .hero-lede { color: var(--on-dark); }
.hero-photo .hero-est, .hero-plain .hero-est { color: var(--on-dark-2); }
.hero-overlap .hero-grid { padding-bottom: calc(clamp(56px, 9vw, 104px) + 56px); }
/* plain */
.hero-plain { color: var(--cream); background: var(--walnut); text-align: center; overflow: hidden; }
.hero-plain::before, .sec-cta::before, .ftr::before, .board::after, .dark::before, .phero-plain.err404::before, .card-noimg::before { content: ""; position: absolute; inset: 0; background: var(--linen-img); opacity: var(--tex-dark); pointer-events: none; z-index: -1; }
.phero-plain.err404::before { opacity: var(--tex-light); }
.hero-plain .hero-grid { padding-block: clamp(88px, 12vw, 148px) clamp(72px, 10vw, 120px); }
.hero-plain .hero-text { max-width: 860px; margin-inline: auto; }
.hero-plain .orn { margin-bottom: 30px; width: 140px; color: var(--a-dark); }
.hero-plain .hero-lede { margin-inline: auto; }
.hero-plain .ctas, .hero-plain .hero-est { justify-content: center; }
.hero-plain.hero-overlap .hero-grid { padding-bottom: calc(clamp(72px, 10vw, 120px) + 56px); }
/* framed */
.hero-framed { background: var(--parchment); color: var(--ink); overflow: hidden; }
.hero-framed .hero-grid { display: grid; gap: clamp(32px, 5vw, 72px); align-items: center; padding-block: clamp(48px, 7vw, 96px); }
.hero-framed h1 { font-size: clamp(2.3rem, 5.4vw, 4.4rem); }
.hero-framed h1 em { color: var(--a-ink); }
.hero-framed .hero-lede { color: var(--ink-2); }
.hero-framed .hero-est { color: var(--muted); }
.hero-framed .hero-text { border-left: 6px solid var(--a); padding-left: clamp(20px, 3vw, 36px); }
.hero-arch { margin: 0; aspect-ratio: 4 / 5; max-height: 640px; width: 100%; max-width: 520px; justify-self: center; }
.hero-framed.hero-overlap .hero-grid { padding-bottom: calc(clamp(48px, 7vw, 96px) + 56px); }
@media (min-width: 860px) { .hero-framed .hero-grid { grid-template-columns: 1.1fr .9fr; } }

/* page hero */
.phero-photo { display: flex; align-items: flex-end; min-height: clamp(360px, 42vw, 560px); color: var(--cream); background: var(--walnut); }
.phero-photo .hero-media::after { background: linear-gradient(90deg, rgba(var(--walnut-rgb), .86) 0%, rgba(var(--walnut-rgb), .72) 34%, rgba(var(--walnut-rgb), .34) 62%, rgba(var(--walnut-rgb), .1) 100%), linear-gradient(0deg, rgba(var(--walnut-rgb), .72) 0%, rgba(var(--walnut-rgb), .2) 45%, rgba(var(--walnut-rgb), 0) 70%); }
.phero-in { padding-block: clamp(72px, 10vw, 120px) clamp(44px, 6vw, 72px); }
.phero .hero-lede { max-width: 52ch; }
.phero-photo .phero-text { max-width: 760px; border-left: 6px solid var(--a); padding-left: clamp(20px, 3vw, 40px); }
.phero-photo .phero-in { padding-block: clamp(120px, 14vw, 200px) clamp(48px, 6vw, 76px); }
.phero h1 { font: 400 clamp(2.5rem, 6.2vw, 4.4rem)/1.04 var(--display); letter-spacing: -.01em; }
.phero-photo .hero-lede { color: var(--on-dark); }
/* phones: the lede runs full width, so the scrim runs bottom-to-top instead of left-to-right (>=4.5:1 under every glyph) */
@media (max-width: 700px) {
  .hero-media::after, .phero-photo .hero-media::after { background: linear-gradient(0deg, rgba(var(--walnut-rgb), .92) 0%, rgba(var(--walnut-rgb), .82) 40%, rgba(var(--walnut-rgb), .68) 70%, rgba(var(--walnut-rgb), .5) 100%); }
  .phero-photo .hero-media::after { background: linear-gradient(0deg, rgba(var(--walnut-rgb), .92) 0%, rgba(var(--walnut-rgb), .84) 50%, rgba(var(--walnut-rgb), .78) 100%); }
  .hero-photo .hero-lede, .phero-photo .hero-lede, .hero-photo h1, .phero-photo h1 { text-shadow: 0 1px 14px rgba(var(--walnut-rgb), .6); }
}

/* framed: text + arch photo (narrow or portrait sources) */
.phero-framed { background: var(--parchment); color: var(--ink); border-bottom: 1px solid var(--line); overflow: hidden; }
.phero-framed .phero-grid { display: grid; gap: clamp(28px, 5vw, 72px); align-items: center; padding-block: clamp(40px, 6vw, 80px); }
.phero-framed .phero-text { border-left: 6px solid var(--a); padding-left: clamp(20px, 3vw, 36px); }
.phero-framed .hero-lede { color: var(--ink-2); }
.phero-arch { margin: 0; width: min(100%, 400px); aspect-ratio: 4 / 5; justify-self: center; }
@media (max-width: 859px) { .phero-arch { width: min(100%, 520px); aspect-ratio: 4 / 3; border-radius: 260px 260px 4px 4px / 200px 200px 4px 4px; } .phero-arch::after { border-radius: 254px 254px 2px 2px / 194px 194px 2px 2px; } }
@media (min-width: 860px) { .phero-framed .phero-grid { grid-template-columns: minmax(0, 1fr) 400px; } }
/* plain */
.phero-plain { background: var(--parchment); text-align: center; border-bottom: 1px solid var(--line); overflow: hidden; }
.phero-plain .phero-in { padding-block: clamp(64px, 9vw, 112px); }
.phero-plain .orn { margin-bottom: 26px; }
.phero-plain .hero-lede { margin-inline: auto; color: var(--ink-2); }
.phero-plain .ctas { justify-content: center; }
.phero-plain.err404 { background: var(--paper); }
.err404 h1 { font-size: clamp(2.8rem, 8vw, 5.4rem); }
.err404 .orn { margin: 22px auto 0; }
.err404 .hero-lede { margin-top: 22px; }

/* ------------------------------------------------------------------ sections + tones */
.sec { position: relative; isolation: isolate; padding-block: var(--sec-y); background: var(--parchment); }
main > section.sec:nth-of-type(odd) { background: var(--paper); }
.sec.dark { background: var(--walnut) !important; color: var(--on-dark); }
.sec.dark h2, .sec.dark h3 { color: var(--cream); }
.sec.dark a:not(.btn) { color: var(--a-dark); }
.sec.dark .orn { color: var(--a-dark); }
.sec-head { margin-bottom: clamp(28px, 4vw, 52px); }
.sec-head h2 { font: 400 clamp(2rem, 4.4vw, 3.2rem)/1.08 var(--display); letter-spacing: -.005em; }
.sec-head .lede { margin-top: 18px; }
.sec-head.center { text-align: center; }
.sec-head.center .lede { margin-inline: auto; }
.sec-more { margin-top: clamp(32px, 4vw, 48px); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 24px; }
.empty { max-width: 640px; margin-inline: auto; padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 48px); text-align: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); color: var(--ink-2); }
main > section.sec:nth-of-type(odd) .empty { background: var(--white); }
.empty .orn { margin-bottom: 22px; }
.empty-t { font: 400 clamp(1.5rem, 3vw, 1.9rem)/1.25 var(--display); color: var(--ink); text-wrap: balance; }
.empty-s { max-width: 46ch; margin: 12px auto 0; }
.empty .ctas { margin-top: 26px; }
.sec-head:not(.center) + .empty { margin-top: 8px; }

/* prose */
.prose > * + * { margin-top: 1em; }
.prose em { font-family: var(--serif); font-style: italic; font-size: .88em; letter-spacing: .01em; }
.qc { margin-left: -.06em; margin-right: .14em; }
.qc-out { margin-left: .06em; margin-right: 0; }
.prose strong { font-weight: 600; color: var(--ink); }
.dark .prose strong { color: var(--cream); }
.prose ul { list-style: none; }
.prose ul li { position: relative; padding-left: 1.5em; }
.prose ul li + li { margin-top: .45em; }
.prose ul li::before { content: ""; position: absolute; left: .2em; top: .62em; width: 6px; height: 6px; background: var(--a-mark); transform: rotate(45deg); }
.prose ol { padding-left: 1.4em; }
.prose ol li::marker { color: var(--p-ink); font-weight: 600; }
.prose blockquote { margin: 1.6em 0; padding: .1em 0 .1em 1.4em; border-left: 3px solid var(--a); font: italic 400 1.3rem/1.55 var(--serif); color: var(--ink-2); }
.prose blockquote p + p { margin-top: .6em; }
.prose blockquote em { font-size: 1em; }
.prose blockquote .bq-cite { display: block; margin-top: .5rem; font: 600 .78rem/1.4 var(--label); font-style: normal; letter-spacing: .14em; text-transform: uppercase; color: var(--a-ink); white-space: nowrap; }
.dark .prose blockquote .bq-cite { color: var(--a-dark); }
.dark .prose blockquote { color: var(--cream); }
.prose h3 { font: 700 1.35rem/1.25 var(--serif); margin-top: 1.4em; }
.prose a { color: var(--p-ink); }
.dark .prose a { color: var(--a-dark); }
.dropcap > p:first-child::first-letter { float: left; margin: .06em .08em 0 0; font: 400 4.4em/.78 var(--display); color: var(--p-ink); }
@supports (initial-letter: 3) or (-webkit-initial-letter: 3) {
  .dropcap > p:first-child::first-letter { float: none; margin: 0 .1em 0 0; font-size: 1em; line-height: 1; -webkit-initial-letter: 3; initial-letter: 3; }
}

/* text */
.sec-text .prose { font-size: 1.125rem; }
.sec-text + .sec-text { padding-top: 0; }
.sec-text-lede { padding-block: clamp(56px, 8vw, 96px); }
.sec-text-lede .lede-text { max-width: 52ch; margin: 26px auto; text-align: center; font: italic 400 clamp(1.3rem, 2.4vw, 1.6rem)/1.5 var(--serif); color: var(--ink-2); }

/* text + image */
.ti-grid { display: grid; gap: clamp(36px, 6vw, 80px); align-items: center; }
.ti-fig { margin: 0; width: 100%; max-width: 480px; justify-self: center; }
.ti-fig figcaption { margin-top: 16px; text-align: center; font: italic 400 .98rem/1.4 var(--serif); color: var(--muted); }
.dark .ti-fig figcaption { color: var(--on-dark-2); }
.ti-text .prose { color: var(--ink-2); }
.dark .ti-text .prose { color: var(--on-dark); }
@media (min-width: 860px) {
  .ti-grid { grid-template-columns: 7fr 5fr; }
  .img-left .ti-grid { grid-template-columns: 5fr 7fr; }
  .img-left .ti-fig { order: -1; }
}
.arch { position: relative; overflow: hidden; aspect-ratio: 4 / 5; border-radius: 999px 999px 4px 4px; background: var(--linen); box-shadow: var(--shadow); }
.arch img { width: 100%; height: 100%; object-fit: cover; }
.arch::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--a); border-radius: 999px 999px 2px 2px; pointer-events: none; opacity: .9; }
.dark .arch { background: var(--walnut-2); box-shadow: 0 30px 60px -30px rgba(var(--black-rgb), .7); }
.dark .arch::after { border-color: var(--a-dark); }
@media (max-width: 859px) { .ti-fig .arch { aspect-ratio: 1 / 1; } }

/* cards */
.cards { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap); }
.cards > li { flex: 1 1 100%; min-width: 0; }
.cards.n1 { max-width: 760px; margin-inline: auto; }
@media (min-width: 640px) { .cards.n2 > li, .cards.n3 > li, .cards.n4 > li { flex: 0 1 calc((100% - var(--gap)) / 2); } .cards.n2 { max-width: 980px; margin-inline: auto; } }
@media (min-width: 980px) { .cards.n3 > li { flex-basis: calc((100% - 2 * var(--gap)) / 3); } .cards.n4 > li { flex-basis: calc((100% - 3 * var(--gap)) / 4); } }
.card { position: relative; display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
main > section.sec:nth-of-type(odd) .card { background: var(--white); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .card.has-link:hover, .mcards .card:hover, .event:hover, .videos .video-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
  .mcards .card:hover .card-img img, .event:hover .event-img img { transform: scale(1.03); }
}
.event, .videos .video-card { transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.event-img img { transition: transform .7s var(--ease); }
.card h3, .event h3, .vc-body h3 { transition: color .25s; }
.card.has-link:hover h3, .mcards .card:hover h3, .event:hover h3, .videos .video-card:hover h3 { color: var(--p-ink); }
.card-img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--linen); }
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.card.has-link:hover .card-img img { transform: scale(1.03); }
.card-noimg { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 28px; background: var(--walnut); isolation: isolate; text-align: center; }
.card-noimg::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--a-dark); border-radius: 3px; opacity: .55; }
.card-noimg { gap: 10px; }
.card-noimg .orn { width: 96px; color: var(--a-dark); }
.noimg-init { font: 400 clamp(4.2rem, 7vw, 5.4rem)/.9 var(--display); color: var(--a-dark); text-shadow: 0 2px 0 rgba(var(--black-rgb), .25); }
.card-body { display: flex; flex-direction: column; flex: 1; padding: 24px 26px 26px; }
.card h3 { font: 700 1.42rem/1.22 var(--serif); color: var(--ink); }
.card h3 a { color: inherit; text-decoration: none; }
.card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--r); }
.card h3 a:focus-visible { outline: none; }
.card h3 a:focus-visible::after { outline: 3px solid var(--focus); outline-offset: -3px; }
.card .prose { margin-top: 12px; font-size: 1.02rem; line-height: 1.6; color: var(--ink-2); }
.card-more { margin-top: auto; padding-top: 18px; font: 700 .95rem/1.2 var(--label); letter-spacing: .1em; text-transform: uppercase; color: var(--p-ink); }
.card-more span { display: inline-block; transition: transform .25s var(--ease); }
.card.has-link:hover .card-more span { transform: translateX(4px); }
.medal { display: grid; place-items: center; width: 60px; height: 60px; margin: 28px 26px 0; border-radius: 50%; border: 1px solid var(--a); box-shadow: inset 0 0 0 4px var(--paper), inset 0 0 0 5px var(--line); background: var(--parchment); }
.medal span { font: 400 1.7rem/1 var(--display); color: var(--p-ink); }
.cards-text .card { border-top: 3px solid var(--p-fill); }
@media (min-width: 640px) { .cards.t2 .card h3 { min-height: 2.44em; } }
.cards-text .card-body { padding-top: 18px; }

/* ministries ledger */
.ledger-meta { margin: 16px 0 4px; display: grid; gap: 0; }
.ledger-meta > div { display: grid; grid-template-columns: 5.6em minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px dotted var(--line-strong); }
.ledger-meta > div:first-child { border-top: 1px dotted var(--line-strong); }
.ledger-meta dt { font: 700 .78rem/1.7 var(--label); letter-spacing: .16em; text-transform: uppercase; color: var(--p-ink); }
.ledger-meta dd { margin: 0; font-size: .98rem; line-height: 1.45; color: var(--ink); }
@media (max-width: 400px) { .ledger-meta > div, .mcard .ledger-meta > div { grid-template-columns: 1fr; gap: 2px; } }
.mcards .card .prose { margin-top: 16px; }
@media (min-width: 980px) { .mcards .card h3 { min-height: 2.44em; } }
.card-ask { margin-top: auto; padding-top: 10px; }
.card-ask .textlink { padding-bottom: 0; }
.card-ask svg { transition: transform .25s var(--ease); }
.card-ask a:hover svg { transform: translateX(4px); }
.mcards .card { scroll-margin-top: 110px; }
.mcards .card:target { box-shadow: 0 0 0 3px var(--p-ink), var(--shadow-lift); }

/* gallery + past prints */
.pgrid, .prints { list-style: none; display: grid; gap: clamp(12px, 2vw, 24px); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 600px) { .pgrid.g3, .prints.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 980px) { .pgrid.g4, .prints.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pgrid.g1, .prints.g1 { grid-template-columns: minmax(0, 560px); justify-content: center; }
.pitem { display: block; overflow: hidden; background: var(--paper); padding: 5px; border-radius: 4px; box-shadow: var(--shadow); }
.pgrid .pitem { aspect-ratio: 1; }
.pitem img { width: 100%; height: 100%; object-fit: cover; border-radius: 2px; filter: saturate(.95); transition: transform .7s var(--ease); }
.pitem:hover img, .pitem:focus-visible img { transform: scale(1.03); }
.pcap { margin-top: 22px; text-align: center; font: italic 400 .98rem/1.45 var(--serif); color: var(--muted); }
.prints { --pg: clamp(12px, 2vw, 24px); display: flex; flex-wrap: wrap; justify-content: center; gap: var(--pg); }
.prints > li { flex: 0 0 calc((100% - var(--pg)) / 2); min-width: 0; }
.prints.g1 > li { flex-basis: min(100%, 560px); }
@media (min-width: 600px) { .prints.g3 > li { flex-basis: calc((100% - 2 * var(--pg)) / 3); } }
@media (min-width: 980px) { .prints.g4 > li { flex-basis: calc((100% - 3 * var(--pg)) / 4); } }
.print { margin: 0; }
.prints .pitem { aspect-ratio: 4 / 3; padding: 6px; }
.print figcaption { margin-top: 12px; text-align: center; text-wrap: balance; font: italic 400 .95rem/1.4 var(--serif); color: var(--muted); }
.print figcaption span { color: var(--ink); }
.print .pdate { white-space: nowrap; }

/* cta band */
.sec-cta { background: var(--p-fill) !important; color: var(--on-p); padding-block: clamp(48px, 7vw, 96px); }
.cta-frame { width: var(--wrap); max-width: 1000px; margin-inline: auto; border: 1px solid var(--a-dark); padding: 10px; border-radius: 3px; }
.cta-in { width: auto; border: 1px solid rgba(var(--white-rgb), .25); padding: clamp(40px, 6vw, 72px) clamp(20px, 5vw, 72px); text-align: center; border-radius: 2px; }
.sec-cta .orn { color: var(--a-dark); margin-bottom: 24px; }
.sec-cta h2 { font: 400 clamp(2rem, 4.4vw, 3.2rem)/1.08 var(--display); color: var(--on-p); }
.sec-cta .prose { margin: 16px auto 0; max-width: 54ch; font-size: clamp(1.08rem, 1.5vw, 1.2rem); opacity: .9; }
.sec-cta .prose a { color: inherit; }
.sec-cta .ctas { margin-top: 30px; }
.sec-cta .btn-ghost { --fg: var(--on-p); --bd: currentColor; }
.sec-cta .btn-ghost:hover { --bg: var(--on-p); --fg: var(--p-fill); --bd: var(--on-p); }

/* faq + beliefs ledger */
.ledger { list-style: none; border-top: 1px solid var(--line-strong); }
.ledger details { border-bottom: 1px solid var(--line); }
.ledger summary { display: flex; align-items: center; gap: 16px; padding: 20px 2px; list-style: none; cursor: pointer; font: 700 1.2rem/1.35 var(--serif); color: var(--ink); transition: color .2s; }
.ledger summary::-webkit-details-marker { display: none; }
.ledger summary > span:not(.num) { flex: 1; }
.ledger summary:hover { color: var(--p-ink); }
.tog { position: relative; flex: none; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--a-mark); background: var(--paper); transition: background-color .2s, transform .2s; }
.tog::before, .tog::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: var(--p-ink); border-radius: 1px; transition: transform .2s var(--ease); }
.tog::after { transform: rotate(90deg); }
details[open] > summary .tog::after { transform: rotate(0deg); }
details[open] > summary .tog { background: var(--p-soft); }
.ledger details > .prose, .ledger .art-body { padding: 0 2px 26px; max-width: 68ch; color: var(--ink-2); }
.sec-faq .sec-head { margin-bottom: 28px; }
.articles .num { flex: none; min-width: 2.7em; font: 400 1.4rem/1 var(--display); color: var(--a-ink); }
.articles .art-body { padding-left: calc(2.7em * 1.4 / 1.125 + 16px); }
.articles .refs { margin-top: 12px; font: italic 400 .95rem/1.5 var(--serif); color: var(--muted); }
.sec-beliefs .intro { margin-bottom: 30px; color: var(--ink-2); max-width: 68ch; }
.sec-beliefs .source { margin-top: 24px; font: italic 400 .95rem/1.5 var(--serif); color: var(--muted); }
@media (max-width: 599px) { .articles .num { min-width: 2.2em; font-size: 1.2rem; } .articles .art-body { padding-left: 0; } }

/* schedule: the hymn board */
.sec-schedule { background: var(--linen) !important; }
.sec-schedule::before { content: ""; position: absolute; inset: 0; background: var(--linen-img); opacity: var(--tex-light); z-index: -1; pointer-events: none; }
.board { position: relative; isolation: isolate; max-width: 700px; margin-inline: auto; padding: clamp(30px, 5vw, 52px) clamp(22px, 5vw, 56px); background: var(--walnut); color: var(--on-dark); border-radius: var(--r); box-shadow: 0 34px 60px -34px rgba(var(--walnut-rgb), .8), 0 2px 0 rgba(var(--white-rgb), .04) inset; }
.board::before { content: ""; position: absolute; inset: 8px; border: 2px solid var(--a); border-radius: 3px; opacity: .85; pointer-events: none; }
.board::after { border-radius: var(--r); }
.board-day + .board-day { margin-top: 30px; }
.board-h { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; font: 700 .9rem/1 var(--label); letter-spacing: .3em; text-transform: uppercase; color: var(--a-dark); }
.board-h::before, .board-h::after { content: ""; flex: 1; height: 1px; background: var(--line-dark); }
.sched { list-style: none; }
.sched li { display: grid; grid-template-columns: minmax(0, max-content) minmax(24px, 1fr) auto; column-gap: 12px; align-items: end; padding: 14px 0; }
.sched li + li { border-top: 1px solid rgba(var(--cream-rgb), .08); }
.sched-name { font: 700 clamp(1.15rem, 2.4vw, 1.3rem)/1.25 var(--serif); color: var(--cream); text-wrap: balance; hyphens: manual; }
.sched-dots { align-self: end; margin-bottom: .5em; border-bottom: 2px dotted rgba(var(--cream-rgb), .32); }
.sched-time { font: 700 clamp(1.35rem, 3vw, 1.6rem)/1 var(--label); letter-spacing: .04em; color: var(--a-dark); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sched-note { grid-column: 1 / 3; margin-top: 6px; font-size: .92rem; line-height: 1.5; color: var(--on-dark-2); }
.board-note { max-width: 56ch; margin: 34px auto 0; text-align: center; font: italic 400 1.12rem/1.6 var(--serif); color: var(--ink-2); }
@media (max-width: 419px) {
  .sched li { grid-template-columns: minmax(0, 1fr) auto; }
  .sched-dots { display: none; }
  .sched-note { grid-column: 1 / -1; }
}

/* people */
.bio { display: grid; gap: clamp(28px, 5vw, 64px); align-items: start; }
.bio + .bio { margin-top: clamp(48px, 6vw, 72px); }
.bio-pic { max-width: 340px; width: 100%; }
.bio-text h3 { font: 400 clamp(2rem, 3.6vw, 2.5rem)/1.1 var(--display); }
.bio-text .kicker { margin-bottom: 10px; }
.bio-text .prose { margin-top: 20px; color: var(--ink-2); max-width: 64ch; }
@media (min-width: 800px) {
  .bio { grid-template-columns: 320px minmax(0, 1fr); }
  .bio-pic { position: sticky; top: 110px; }
  .bio-text { padding-top: 24px; }
}
.mono-ring { display: grid; place-items: center; width: 120px; height: 120px; border-radius: 50%; background: var(--parchment); box-shadow: inset 0 0 0 4px var(--paper), inset 0 0 0 5px var(--a-mark); border: 1px solid var(--a-mark); font: 400 2.4rem/1 var(--display); color: var(--p-ink); letter-spacing: .02em; }
.mono-lg { width: 168px; height: 168px; font-size: 3.2rem; margin-inline: auto; }
.mono { display: grid; place-items: center; width: 100%; height: 100%; font: 400 clamp(3rem, 8vw, 4.6rem)/1 var(--display); color: var(--p-ink); background: var(--linen); }
.staff { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap); margin-top: clamp(48px, 6vw, 80px); padding-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--line); }
.staff > li { flex: 1 1 100%; }
@media (min-width: 600px) { .staff > li { flex: 0 1 calc((100% - var(--gap)) / 2); } }
@media (min-width: 980px) { .staff > li { flex-basis: calc((100% - 2 * var(--gap)) / 3); } }
.staff-card { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 28px 24px 22px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
main > section.sec:nth-of-type(odd) .staff-card { background: var(--white); }
.arch-sm { width: min(200px, 70%); }
.arch-sm::after { inset: 7px; }
.staff-card h3 { margin-top: 20px; font: 700 1.3rem/1.25 var(--serif); }
.staff-card .role { margin-top: 6px; font: 700 .82rem/1.3 var(--label); letter-spacing: .16em; text-transform: uppercase; color: var(--p-ink); }
.staff-card .prose, .staff-card .excerpt { max-width: 34ch; margin: 14px auto 0; font-size: 1rem; line-height: 1.6; color: var(--ink-2); text-align: center; }
.staff-card .more { width: 100%; margin-top: 6px; }
.staff-card .more summary { display: inline-flex; align-items: center; gap: 10px; list-style: none; cursor: pointer; padding: 10px 0; font: 700 .9rem/1 var(--label); letter-spacing: .12em; text-transform: uppercase; color: var(--p-ink); }
.staff-card .more summary::-webkit-details-marker { display: none; }
.staff-card .more .tog { width: 24px; height: 24px; }
.staff-card .more .tog::before, .staff-card .more .tog::after { width: 10px; margin-left: -5px; }
.staff-card .more[open] .prose { margin-top: 4px; }
.staff-card:has(.more[open]) .excerpt { display: none; }

/* missions */
.mgrid { list-style: none; display: grid; gap: clamp(28px, 4vw, 44px); }
.mcard { display: grid; overflow: hidden; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); scroll-margin-top: 110px; }
main > section.sec:nth-of-type(odd) .mcard { background: var(--white); }
.mcard-img { position: relative; aspect-ratio: 16 / 10; background: var(--linen); }
.mcard-img img { width: 100%; height: 100%; object-fit: cover; }
.mcard-img.contain { display: grid; place-items: center; padding: 28px; }
.mcard-img.contain img { object-fit: contain; max-height: 260px; }
.mcard-body { padding: clamp(24px, 4vw, 44px); }
.mcard h3 { font: 700 clamp(1.5rem, 2.2vw, 1.85rem)/1.2 var(--serif); }
.mquote { margin: 18px 0 0; padding-left: 16px; border-left: 2px solid var(--a); font: italic 400 1.15rem/1.5 var(--serif); color: var(--ink-2); }
.mcard .prose { margin-top: 18px; color: var(--ink-2); }
.mcard .ledger-meta { margin-top: 20px; }
.mcard .ledger-meta > div { grid-template-columns: 9.5em minmax(0, 1fr); }
.mpanels { display: grid; gap: 14px; margin-top: 22px; }
.mpanel { padding: 18px 20px; border-radius: var(--r); }
.mpanel h4 { margin-bottom: 10px; font: 700 .8rem/1.2 var(--label); letter-spacing: .18em; text-transform: uppercase; color: var(--p-ink); }
.mpanel-pray { background: var(--linen); }
.mpanel-support { background: var(--p-soft); }
.mpanel .prose, .diamonds { font-size: 1rem; line-height: 1.55; color: var(--ink); }
.diamonds { list-style: none; }
.diamonds li { position: relative; padding-left: 1.4em; }
.diamonds li + li { margin-top: 6px; }
.diamonds li::before { content: ""; position: absolute; left: .15em; top: .6em; width: 6px; height: 6px; background: var(--a-mark); transform: rotate(45deg); }
.mcard .links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
@media (min-width: 640px) { .mpanels { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) {
  .mcard:not(.no-img) { grid-template-columns: 5fr 7fr; }
  .mcard-img { aspect-ratio: auto; min-height: 100%; }
  .mcard-img:not(.contain) img { position: absolute; inset: 0; }
  .mgrid > li:nth-child(even):not(.no-img) { grid-template-columns: 7fr 5fr; }
  .mgrid > li:nth-child(even):not(.no-img) .mcard-img { order: 2; }
}
.mcard .prose, .mquote { max-width: 68ch; }
@media (min-width: 1024px) {
  .mcard.no-img .mcard-body { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 0 48px; align-items: start; }
  .mcard.no-img .mcard-body > .mpanels { grid-column: 2; grid-row: 1 / span 12; grid-template-columns: 1fr; margin-top: 4px; }
  .mcard.no-img .mcard-body > :not(.mpanels) { grid-column: 1; }
}
.note-card { max-width: 820px; margin: clamp(36px, 5vw, 56px) auto 0; padding: 26px 30px; background: var(--paper); border: 1px solid var(--line); border-left: 4px solid var(--p-fill); border-radius: var(--r); box-shadow: var(--shadow); }
.note-card h3 { font: 700 1.3rem/1.3 var(--serif); margin-bottom: 8px; }
.note-card .prose { color: var(--ink-2); }

/* events: calendar leaves */
.events { list-style: none; display: grid; gap: clamp(20px, 3vw, 28px); }
.event { position: relative; display: grid; grid-template-areas: "img" "leaf" "body"; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; scroll-margin-top: 110px; }
main > section.sec:nth-of-type(odd) .event { background: var(--white); }
.event:target { box-shadow: 0 0 0 3px var(--p-ink), var(--shadow-lift); }
.event.featured { border-top: 3px solid var(--p-fill); }
.leaf { grid-area: leaf; display: flex; align-items: baseline; gap: 10px; margin: 20px 22px 0; }
.leaf-m { font: 700 .85rem/1 var(--label); letter-spacing: .25em; text-transform: uppercase; color: var(--on-p); background: var(--p-fill); padding: 7px 10px 6px; border-radius: 3px; align-self: center; }
.leaf-d { font: 400 2rem/1 var(--display); color: var(--ink); font-variant-numeric: lining-nums tabular-nums; }
.leaf-dash { margin: 0 .05em; }
.leaf-y { font: 600 .8rem/1 var(--label); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.event-body { grid-area: body; padding: 16px 22px 24px; min-width: 0; }
.event h3 { font: 700 clamp(1.3rem, 2.4vw, 1.55rem)/1.22 var(--serif); }
.event .tag { margin-bottom: 10px; }
.event .meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; font-size: .98rem; color: var(--muted); }
.event .meta span { display: inline-flex; align-items: flex-start; gap: 8px; }
.event .meta svg { width: 17px; height: 17px; margin-top: .22em; color: var(--p-ink); }
.event .prose { margin-top: 14px; font-size: 1.02rem; color: var(--ink-2); max-width: 70ch; }
.ctas-sm { margin-top: 20px; gap: 12px 16px; }
.event-img { grid-area: img; aspect-ratio: 16 / 9; overflow: hidden; background: var(--linen); }
.event-img img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 640px) {
  .event { grid-template-columns: 124px minmax(0, 1fr); grid-template-areas: "leaf body" "leaf img"; }
  .event-img { margin: 0 24px 24px 0; border-radius: 4px; max-height: 280px; aspect-ratio: 21 / 9; }
  .leaf { flex-direction: column; align-items: stretch; gap: 0; margin: 24px 0 24px 24px; align-self: start; text-align: center; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; box-shadow: var(--shadow-sm); overflow: hidden; }
  .leaf-m { border-radius: 0; padding: 8px 4px 7px; color: var(--on-p); }
  .leaf-d { padding: 12px 4px 4px; font-size: 3.1rem; }
  .leaf-dash { display: block; height: 0; overflow: hidden; }
  .leaf-y { padding: 2px 4px 12px; letter-spacing: .12em; }
  .event-body { padding: 24px 26px 26px 26px; }
  .event.no-img .event-body { padding-bottom: 28px; }
  .event:has(.leaf-dash) .leaf-d { font-size: 2.3rem; letter-spacing: -.02em; }
  .event:has(.leaf-dash) .leaf-dash { display: inline; height: auto; }
}
@media (min-width: 980px) {
  .event { grid-template-columns: 132px minmax(0, 1fr) 300px; grid-template-areas: "leaf body img"; }
  .event-img { margin: 0; border-radius: 0; max-height: none; aspect-ratio: auto; min-height: 100%; position: relative; }
  .event-img img { position: absolute; inset: 0; }
  .event.featured { grid-template-columns: 132px minmax(0, 1fr) minmax(0, .78fr); }
  .event.featured h3 { font-size: 1.9rem; }
  .leaf-d { font-size: 3.6rem; }
}
.tag { display: inline-flex; align-items: center; padding: 5px 9px 4px; border-radius: 3px; font: 700 .74rem/1 var(--label); letter-spacing: .14em; text-transform: uppercase; }
.tag-kind { background: var(--p-fill); color: var(--on-p); }
.tag-feat { background: var(--linen); color: var(--ink-2); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; }

/* sermons */
.live-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 36px; padding: 16px 22px; border-radius: var(--r); background: var(--live); color: var(--white); text-decoration: none; font-size: 1.05rem; }
.live-banner .live-dot { background: var(--white); }
.live-banner .lb-title { font-family: var(--serif); font-style: italic; }
.live-banner svg { margin-left: auto; width: 20px; height: 20px; }
.live-soft { display: flex; align-items: center; gap: 12px; margin-bottom: 32px; padding: 14px 20px; background: var(--p-soft); border-left: 3px solid var(--p-fill); border-radius: 4px; }
.yt { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--walnut); border-radius: 4px; }
.yt-poster { position: absolute; inset: 0; display: block; }
.yt-poster img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.95); transition: transform .7s var(--ease), filter .3s; }
.yt-poster::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(var(--walnut-rgb), .35), rgba(var(--walnut-rgb), 0) 55%); }
.yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.play { position: absolute; z-index: 1; right: 18px; bottom: 18px; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: var(--p-fill); color: var(--on-p); box-shadow: 0 10px 26px -10px rgba(var(--black-rgb), .6), 0 0 0 4px rgba(var(--paper-rgb), .35); transition: transform .25s var(--ease); }
.play svg { width: 24px; height: 24px; margin-left: 3px; fill: currentColor; }
.yt-poster:hover .play, .yt-poster:focus-visible .play { transform: scale(1.06); }
.yt-poster:hover img { transform: scale(1.03); }
.sermon-lead { display: grid; gap: clamp(24px, 4vw, 48px); align-items: center; scroll-margin-top: 110px; }
.sermon-lead .yt { padding: 0; box-shadow: 0 0 0 6px var(--paper), var(--shadow-lift); margin: 6px; }
.sermon-lead h3 { margin-top: 14px; font: 700 clamp(1.45rem, 2.6vw, 1.8rem)/1.22 var(--serif); }
.passage { margin-top: 8px; font: italic 400 1.1rem/1.4 var(--serif); color: var(--a-ink); }
.summary { margin-top: 14px; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.video-card .meta { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 4px 0; font: 600 .82rem/1.4 var(--label); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.video-card .meta > * + *::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 11px; vertical-align: .2em; background: var(--a-mark); transform: rotate(45deg); }
@media (min-width: 860px) { .sermon-lead { grid-template-columns: 7fr 5fr; } }
.videos { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap); margin-top: clamp(36px, 5vw, 56px); }
.videos > li { flex: 1 1 100%; min-width: 0; }
@media (min-width: 600px) { .videos > li { flex: 0 1 calc((100% - var(--gap)) / 2); } }
@media (min-width: 900px) { .videos.n3 > li { flex-basis: calc((100% - 2 * var(--gap)) / 3); } }
.videos .video-card { display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; scroll-margin-top: 110px; transition: box-shadow .3s; }
main > section.sec:nth-of-type(odd) .videos .video-card { background: var(--white); }
.videos .video-card:hover { box-shadow: var(--shadow-lift); }
.videos .yt { border-radius: 0; }
.videos .play { width: 50px; height: 50px; right: 14px; bottom: 14px; }
.vc-body { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.vc-body h3 { margin-top: 12px; font: 700 1.14rem/1.3 var(--serif); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vc-body .passage { font-size: 1rem; }
.vc-body .meta { margin-top: auto; padding-top: 12px; }
.video-card:target { outline: 3px solid var(--p-ink); outline-offset: 4px; }

/* video */
.vframe { position: relative; padding: 10px; background: var(--paper); border-radius: var(--r); box-shadow: var(--shadow-lift); }
.vframe::after { content: ""; position: absolute; inset: 4px; border: 1px solid var(--a); border-radius: 4px; pointer-events: none; opacity: .8; }
.vplay { position: absolute; z-index: 2; inset: 10px; display: grid; place-items: center; border: 0; padding: 0; border-radius: 3px; background: linear-gradient(0deg, rgba(var(--walnut-rgb), .45), rgba(var(--walnut-rgb), .05) 60%); cursor: pointer; }
.vplay-disc { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: var(--p-fill); color: var(--on-p); box-shadow: 0 0 0 5px color-mix(in srgb, var(--a) 85%, transparent), 0 16px 34px -12px rgba(var(--black-rgb), .7); transition: transform .25s var(--ease); }
.vplay-disc svg { width: 28px; height: 28px; margin-left: 4px; }
.vplay:hover .vplay-disc, .vplay:focus-visible .vplay-disc { transform: scale(1.06); }
.vplay:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
.vframe video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: var(--walnut); border-radius: 3px; position: relative; z-index: 1; }

/* forms */
.form-grid { display: grid; gap: clamp(28px, 5vw, 64px); align-items: start; }
@media (min-width: 980px) { .form-grid { grid-template-columns: 5fr 7fr; } .form-side { position: sticky; top: 110px; } }
.form-side .sec-head { margin-bottom: 24px; }
@media (min-width: 980px) { .flip .form-grid { grid-template-columns: 7fr 5fr; } .flip .form-side { order: 2; } }
.verse-card { position: relative; margin: 6px 0 0; padding: 26px 28px 22px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
main > section.sec:nth-of-type(odd) .verse-card { background: var(--parchment); }
.verse-card blockquote { margin: 0; padding-left: 16px; border-left: 3px solid var(--a); font: italic 400 1.18rem/1.55 var(--serif); color: var(--ink); }
.verse-card figcaption { margin-top: 12px; padding-left: 19px; font: 700 .8rem/1.3 var(--label); font-style: normal; letter-spacing: .18em; text-transform: uppercase; color: var(--p-ink); }
.assure { display: flex; gap: 12px; align-items: flex-start; margin-top: 22px; font-size: 1rem; line-height: 1.55; color: var(--ink-2); }
.assure svg { width: 20px; height: 20px; margin-top: .2em; color: var(--p-ink); }
.form-side .sec-head h2 { font-size: clamp(2rem, 3.6vw, 2.8rem); }
.contact-list, .checks { list-style: none; display: grid; gap: 14px; }
.contact-list li, .checks li { display: flex; gap: 14px; align-items: flex-start; line-height: 1.5; }
.contact-list svg, .checks svg { width: 20px; height: 20px; margin-top: .2em; color: var(--p-ink); }
.contact-list a { color: var(--ink); text-decoration-color: var(--line-strong); }
.contact-list a:hover { color: var(--p-ink); }
.checks { padding: 22px 24px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); }
.checks li { font-size: 1.02rem; color: var(--ink-2); }
.form { position: relative; padding: clamp(20px, 3.5vw, 36px); background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--p-fill); border-radius: var(--r); box-shadow: var(--shadow-lift); }
main > section.sec:nth-of-type(odd) .form { background: var(--white); }
.form > * + * { margin-top: 18px; }
.row2 { display: grid; gap: 18px; }
@media (min-width: 560px) { .row2 { grid-template-columns: 1fr 1fr; } }
.field label { display: block; margin-bottom: 7px; font: 600 1rem/1.3 var(--sans); color: var(--ink); }
.field input, .field textarea { display: block; width: 100%; min-height: 50px; padding: 11px 14px; font: 400 1.125rem/1.4 var(--sans); color: var(--ink); background: var(--white); border: 1.5px solid var(--line-strong); border-radius: var(--r); transition: border-color .2s, box-shadow .2s; }
.field textarea { resize: vertical; min-height: 120px; }
.field input:hover, .field textarea:hover { border-color: rgba(var(--ink-rgb), .5); }
.field input:focus, .field textarea:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--p-ink); box-shadow: 0 0 0 5px color-mix(in oklab, var(--p-ink) 14%, transparent); }
.field input::placeholder, .field textarea::placeholder { color: var(--placeholder); }
.check label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; line-height: 1.45; font-size: 1rem; color: var(--ink-2); }
.check input { appearance: none; -webkit-appearance: none; display: grid; place-content: center; width: 22px; height: 22px; margin: 1px 0 0; flex: none; background: var(--white); border: 1.5px solid var(--a-mark); border-radius: 4px; cursor: pointer; transition: background-color .15s, border-color .15s; }
.check input::before { content: ""; width: 12px; height: 12px; background: var(--on-p); clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); transform: scale(0); transition: transform .15s var(--ease); }
.check input:checked { background: var(--p-fill); border-color: var(--p-fill); }
.check input:checked::before { transform: scale(1); }
.check input:hover { border-color: var(--p-ink); }
.form-actions { margin-top: 24px !important; }
@media (max-width: 559px) { .form-actions .btn { width: 100%; } }
.form-status:empty { display: none; }
.form-status { padding: 12px 16px; border-radius: 4px; border-left: 6px solid var(--line-strong); background: var(--parchment); }
.form-status.ok { color: var(--ok); background: var(--ok-bg); border-left-color: var(--ok); }
.form-status.err { color: var(--err); background: var(--err-bg); border-left-color: var(--err); }
.form.sent .field, .form.sent .row2, .form.sent .check, .form.sent .form-actions { opacity: .55; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* map */
.map-card { overflow: hidden; background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--p-fill); border-radius: var(--r); box-shadow: var(--shadow-lift); }
main > section.sec:nth-of-type(odd) .map-card { background: var(--white); }
.map-frame { position: relative; isolation: isolate; height: clamp(240px, 24vw, 300px); background-color: var(--linen); background-image: linear-gradient(90deg, rgba(var(--ink-rgb), .06) 1px, transparent 1px), linear-gradient(0deg, rgba(var(--ink-rgb), .06) 1px, transparent 1px), linear-gradient(32deg, transparent 47%, rgba(var(--paper-rgb), .9) 47%, rgba(var(--paper-rgb), .9) 53%, transparent 53%), linear-gradient(-58deg, transparent 48%, rgba(var(--paper-rgb), .75) 48%, rgba(var(--paper-rgb), .75) 51%, transparent 51%); background-size: 48px 48px, 48px 48px, 100% 100%, 100% 100%; }
.map-frame::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--linen-img); opacity: .08; pointer-events: none; }
.map-frame::after { content: ""; position: absolute; inset: 10px; z-index: -1; border: 1px solid rgba(var(--ink-rgb), .12); border-radius: 3px; pointer-events: none; }
.map-frame:has(iframe) { height: clamp(320px, 40vw, 480px); }
.map-frame:has(iframe)::after { display: none; }
.map-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.map-facade { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 20px 16px; text-align: center; }
.map-mark { display: flex; align-items: center; gap: 16px; text-align: left; }
.map-label { display: flex; flex-direction: column; gap: 2px; padding: 10px 16px; background: rgba(var(--paper-rgb), .94); border: 1px solid var(--line); border-radius: 4px; box-shadow: var(--shadow-sm); }
.map-label b { font: 400 clamp(1.15rem, 2vw, 1.4rem)/1.2 var(--display); color: var(--ink); }
.map-label span { font: 600 .78rem/1.4 var(--label); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.map-act { display: flex; flex-direction: column; align-items: center; gap: 8px; }
@media (max-width: 479px) { .map-mark { flex-direction: column; text-align: center; gap: 12px; } .map-pin { width: 44px; height: 44px; } }
.map-pin { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50% 50% 50% 4px; transform: rotate(-45deg); background: var(--p-fill); color: var(--on-p); box-shadow: var(--shadow-lift); }
.map-pin svg { width: 24px; height: 24px; transform: rotate(45deg); }
.map-facade small { font: italic 400 .9rem/1.3 var(--serif); color: var(--ink-2); }
.map-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding: 22px clamp(20px, 3vw, 30px); border-top: 1px solid var(--line); }
.map-foot address { font-style: normal; display: flex; flex-direction: column; gap: 4px; }
.map-foot b { font: 700 1.25rem/1.3 var(--serif); }
.map-foot span { color: var(--muted); }

/* this sunday */
.sec-sunday { display: flow-root; padding-block: clamp(36px, 5vw, 56px); }
.sec-sunday.overlap { padding-top: 0; background: var(--parchment) !important; }
.sunday-card { position: relative; z-index: 2; display: grid; background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--p-fill); border-radius: var(--r); box-shadow: 0 30px 60px -34px rgba(var(--walnut-rgb), .6); }
.overlap .sunday-card { margin-top: -56px; }
.ts-zone { padding: 22px clamp(20px, 3vw, 32px); }
.ts-zone + .ts-zone { border-top: 1px solid var(--line); }
.ts-next .kicker { margin-bottom: 8px; }
.ts-name { font: 700 clamp(1.35rem, 2.4vw, 1.6rem)/1.2 var(--serif); text-wrap: balance; }
.ts-last a, .card h3, .event h3, .story h3, .vc-body h3, .sermon-lead h3, .mcard h3 { text-wrap: balance; }
.ts-when { margin-top: 6px; font: 600 .9rem/1.4 var(--label); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ts-when time { color: var(--p-ink); font-weight: 700; }
.ts-last { list-style: none; display: grid; gap: 14px; }
.ts-last li { display: flex; flex-direction: column; gap: 2px; }
.ts-last small { font: 700 .76rem/1.3 var(--label); letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.ts-last a { font: 700 1.06rem/1.35 var(--serif); color: var(--ink); text-decoration: none; }
.ts-last a:hover { color: var(--p-ink); text-decoration: underline; }
.ts-pass { font: italic 400 .95rem/1.4 var(--serif); color: var(--a-ink); }
.ts-where { display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.ts-wl { font: 700 .76rem/1.3 var(--label); letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.ts-addr { font: 400 1.15rem/1.4 var(--serif); color: var(--ink); }
.ts-addr a { color: inherit; text-decoration-color: var(--line-strong); }
.ts-addr a:hover { color: var(--p-ink); }
.ts-watch { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px; }
.ts-watch p[hidden] { display: none; }
.ts-link .textlink svg { width: 14px; height: 14px; }
.live-pill { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 18px; border-radius: 999px; background: var(--live); color: var(--white); font: 700 .95rem/1 var(--label); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; }
.live-pill .live-dot { background: var(--white); }
@media (min-width: 860px) {
  .sunday-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) auto; }
  .sunday-card:not(:has(.ts-last)):not(:has(.ts-where)) { grid-template-columns: minmax(0, 1fr) auto; }
  .sunday-card:not(:has(.ts-next)) { grid-template-columns: minmax(0, 1fr) auto; }
  .ts-zone { padding: 28px clamp(24px, 3vw, 36px); }
  .ts-zone + .ts-zone { border-top: 0; border-left: 1px solid var(--line); }
  .ts-watch { align-items: center; text-align: center; }
}

/* stories */
.sec-stories .intro { max-width: 680px; margin: -12px auto clamp(32px, 4vw, 48px); text-align: center; color: var(--ink-2); }
.stories { display: flex; flex-direction: column; gap: var(--gap); }
.st-col { display: contents; }
@media (min-width: 860px) {
  .stories { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
  .st-col { display: flex; flex-direction: column; gap: var(--gap); }
  .st-col > * { order: 0 !important; }
  .stories.pair .story { flex: 1; }
  .stories.single { grid-template-columns: minmax(0, 1fr); max-width: 760px; margin-inline: auto; }
}
.story-prompt { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: clamp(28px, 4vw, 44px) 24px; text-align: center; border: 1px dashed var(--line-strong); border-radius: var(--r); background: rgba(var(--paper-rgb), .5); }
.sp-q { font: 400 clamp(1.5rem, 2.6vw, 1.9rem)/1.2 var(--display); color: var(--ink); text-wrap: balance; }
.story { display: block; overflow: hidden; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); scroll-margin-top: 110px; }
main > section.sec:nth-of-type(odd) .story { background: var(--white); }
.story:target { box-shadow: 0 0 0 3px var(--p-ink), var(--shadow-lift); }
.story-img { aspect-ratio: 16 / 9; overflow: hidden; background: var(--linen); }
.story-img img { width: 100%; height: 100%; object-fit: cover; }
.story-body { position: relative; padding: clamp(24px, 3.5vw, 36px); }
.story h3 { font: 700 clamp(1.3rem, 2.2vw, 1.5rem)/1.25 var(--serif); }
.byline { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; font: 600 .82rem/1.4 var(--label); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.byline b { color: var(--p-ink); font-weight: 700; }
.byline > * + *::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 11px; vertical-align: .2em; background: var(--a-mark); transform: rotate(45deg); }
.story .prose { margin-top: 18px; font-size: 1.04rem; color: var(--ink-2); }
.story.no-img { border-top: 3px solid var(--a); }
.pull { position: relative; margin: 0 0 22px; padding-top: 22px; font: italic 400 clamp(1.35rem, 2.3vw, 1.6rem)/1.42 var(--serif); color: var(--ink); text-wrap: pretty; }
.pull::before { content: ""; position: absolute; top: 0; left: 0; width: 56px; height: 2px; background: var(--a); }
.story.has-pull h3 { font-size: 1.15rem; }
.story .more { margin-top: 10px; }
.story .more summary { display: inline-flex; align-items: center; gap: 10px; padding: 8px 0; list-style: none; cursor: pointer; font: 700 .9rem/1 var(--label); letter-spacing: .12em; text-transform: uppercase; color: var(--p-ink); }
.story .more summary::-webkit-details-marker { display: none; }
.story .more .tog { width: 24px; height: 24px; }
.story .more .tog::before, .story .more .tog::after { width: 10px; margin-left: -5px; }
.story .more .more-o, .story .more[open] .more-c { display: none; }
.story .more[open] .more-o { display: inline; }
.story .more .prose { margin-top: 0; }
.story .more .prose > :first-child { margin-top: 1em; }

/* 404 signposts */
.signposts { list-style: none; display: grid; gap: 14px; }
@media (min-width: 600px) { .signposts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 980px) { .signposts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.signposts a, .signposts button { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 20px 56px 20px 22px; text-align: left; text-decoration: none; color: var(--ink); background: var(--white); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); transition: transform .25s var(--ease), box-shadow .25s; }
.signposts a:hover, .signposts button:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.signposts small { font: 600 .78rem/1.2 var(--label); letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.signposts span { font: 700 1.3rem/1.25 var(--serif); }
.signposts svg { position: absolute; right: 22px; top: 50%; width: 20px; height: 20px; margin-top: -10px; color: var(--p-ink); transition: transform .25s var(--ease); }
.signposts a:hover svg { transform: translateX(4px); }
.err-join { margin-top: 32px; text-align: center; color: var(--ink-2); }

/* ------------------------------------------------------------------ footer */
.ftr { position: relative; isolation: isolate; background: var(--walnut); color: var(--on-dark); padding: 56px 0 28px; font-size: 1rem; }
.ftr > .orn { margin-bottom: 44px; color: var(--a-dark); }
.ftr-cols { display: grid; gap: 40px 32px; }
@media (min-width: 520px) { .ftr-cols { grid-template-columns: 1fr 1fr; } .ftr-about { grid-column: 1 / -1; } }
@media (min-width: 900px) { .ftr-cols { grid-template-columns: 1.35fr 1fr 1.25fr .95fr; } .ftr-about { grid-column: auto; } }
.ftr-links.ftr-explore { columns: 2; column-gap: 20px; display: block; }
.ftr-explore li { break-inside: avoid; }
.ftr-about img { height: 56px; width: auto; margin-bottom: 18px; }
.ftr-wordmark { font: 400 1.8rem/1.1 var(--display); color: var(--cream); margin-bottom: 14px; }
.ftr-about > p { max-width: 42ch; line-height: 1.6; }
.ftr-verse { margin: 20px 0 0; padding-left: 14px; border-left: 2px solid var(--a-dark); font: italic 400 .98rem/1.55 var(--serif); color: var(--on-dark); max-width: 44ch; }
.ftr-verse cite { display: block; margin-top: 6px; font: 600 .78rem/1.3 var(--label); font-style: normal; letter-spacing: .16em; text-transform: uppercase; color: var(--a-dark); }
.ftr h2 { margin-bottom: 16px; font: 700 .85rem/1 var(--label); letter-spacing: .22em; text-transform: uppercase; color: var(--a-dark); }
.ftr a { color: var(--on-dark); text-decoration: none; }
.ftr a:hover { color: var(--cream); text-decoration: underline; text-decoration-thickness: 1px; }
.ftr-links { list-style: none; display: grid; gap: 2px; }
.ftr-links a { display: inline-flex; align-items: center; gap: 10px; padding: 5px 0; min-height: 32px; }
.ftr-links svg { width: 16px; height: 16px; color: var(--a-dark); }
.ftr-addr { line-height: 1.55; margin-bottom: 18px; }
.ftr-board { margin: 0; display: grid; gap: 8px; }
.ftr-board > div { display: grid; grid-template-columns: minmax(0, max-content) minmax(12px, 1fr) auto; align-items: end; gap: 8px; font-size: .95rem; line-height: 1.35; }
.ftr-board dt { text-wrap: balance; }
.ftr-board > div::after { content: ""; order: 2; border-bottom: 1px dotted rgba(var(--cream-rgb), .3); margin-bottom: .4em; }
.ftr-board dt { order: 1; }
.ftr-board dd { order: 3; margin: 0; font: 700 1rem/1.3 var(--label); letter-spacing: .06em; color: var(--cream); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ftr-board .d { margin-right: 6px; font-weight: 600; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--a-dark); }
.ftr-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; margin-top: 48px; padding-top: 22px; border-top: 1px solid rgba(var(--white-rgb), .12); font-size: .85rem; color: var(--on-dark-2); }

/* ------------------------------------------------------------------ mobile action bar (< 700px, after the hero) */
.actionbar { display: none; }
@media (max-width: 699px) {
  .actionbar { position: fixed; z-index: 70; left: 0; right: 0; bottom: 0; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: 0 6px env(safe-area-inset-bottom); background: rgba(var(--paper-rgb), .98); border-top: 1px solid var(--line); box-shadow: 0 -10px 28px -16px rgba(var(--walnut-rgb), .45); transform: translateY(110%); visibility: hidden; transition: transform .25s var(--ease), visibility 0s .25s; }
  .actionbar.show, html.no-js .actionbar { transform: none; visibility: visible; transition: transform .25s var(--ease); }
  .actionbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 56px; padding: 6px 4px; font: 700 .78rem/1 var(--label); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); text-decoration: none; }
  .actionbar a + a { border-left: 1px solid var(--line); }
  .actionbar svg { width: 20px; height: 20px; color: var(--p-ink); }
  .ab-icon { position: relative; display: inline-flex; }
  .ab-icon .live-dot { position: absolute; top: -3px; right: -6px; width: 8px; height: 8px; }
  .ab-icon .live-dot[hidden] { display: none; }
  .ftr { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  body.page-app .ftr { padding-bottom: 28px; }
}

/* ------------------------------------------------------------------ search dialog */
.search { position: fixed; inset: 0; z-index: 100; display: flex; justify-content: center; align-items: flex-start; padding: 10vh 16px 16px; background: rgba(var(--walnut-rgb), .62); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.search[hidden] { display: none; }
.search-box { width: min(680px, 100%); max-height: 80vh; display: flex; flex-direction: column; background: var(--paper); border-radius: 8px; border-top: 3px solid var(--p-fill); box-shadow: 0 40px 80px -30px rgba(var(--black-rgb), .6); overflow: hidden; }
.search-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 18px; border-bottom: 1px solid var(--line); }
.search-row > svg { width: 20px; height: 20px; color: var(--muted); }
.search-row input { flex: 1; min-width: 0; min-height: 52px; border: 0; background: transparent; font-size: 1.2rem; }
.search-row input:focus { outline: none; }
.search-row input::-webkit-search-cancel-button, .search-row input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }
.search-row:focus-within { box-shadow: inset 0 -3px 0 var(--focus); }
.search-x { min-height: 44px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: 4px; background: transparent; font: 700 .85rem/1 var(--label); letter-spacing: .14em; text-transform: uppercase; }
.search-x:hover { background: var(--p-soft); }
.search-res { overflow-y: auto; padding: 10px; }
.srch-item { display: block; padding: 12px 14px; border-radius: 6px; color: var(--ink); text-decoration: none; }
.srch-item + .srch-item { margin-top: 2px; }
.srch-item:hover, .srch-item.on { background: var(--p-soft); }
.srch-item strong { display: block; font: 700 1.08rem/1.35 var(--serif); }
.srch-k { display: block; margin-bottom: 4px; font: 700 .74rem/1.2 var(--label); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.srch-snip, .srch-line { display: block; margin-top: 3px; font-size: .95rem; line-height: 1.5; color: var(--ink-2); }
.srch-ans { border-left: 3px solid var(--p-fill); background: var(--parchment); }
.srch-go { display: inline-block; margin-top: 8px; font: 700 .85rem/1 var(--label); letter-spacing: .12em; text-transform: uppercase; color: var(--p-ink); }
.srch-item mark { background: var(--accent-tint); color: inherit; padding: 0 2px; border-radius: 2px; }
.srch-hint { padding: 8px 6px; color: var(--muted); }
.srch-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 6px 10px; }
.srch-chip { min-height: 40px; padding: 6px 14px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--white); font: 600 .95rem/1 var(--label); letter-spacing: .06em; color: var(--ink); }
.srch-chip:hover { border-color: var(--p-ink); color: var(--p-ink); }
html.srch-open { overflow: hidden; }

/* ------------------------------------------------------------------ lightbox (heritage.js) */
.lbx { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(var(--night-rgb), .94); color: var(--cream); }
.lbx::backdrop { background: rgba(var(--night-rgb), .7); }
.lbx figure { margin: 0; position: absolute; inset: 56px 16px 72px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.lbx img { max-width: 100%; max-height: calc(100% - 40px); object-fit: contain; border: 6px solid var(--paper); border-radius: 3px; box-shadow: 0 30px 60px -20px rgba(var(--black-rgb), .8); }
.lbx figcaption { font: italic 400 1rem/1.4 var(--serif); color: var(--on-dark); text-align: center; }
.lbx button { position: absolute; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(var(--cream-rgb), .4); background: rgba(var(--walnut-rgb), .6); color: var(--cream); font-size: 1.6rem; line-height: 1; }
.lbx button:hover { background: var(--walnut-2); }
.lbx button:focus-visible { outline: 3px solid var(--focus-on-dark); }
.lbx .lbx-x { top: 12px; right: 12px; }
.lbx .lbx-p { left: 12px; top: 50%; margin-top: -26px; }
.lbx .lbx-n { right: 12px; top: 50%; margin-top: -26px; }
@media (max-width: 599px) { .lbx .lbx-p, .lbx .lbx-n { top: auto; bottom: 12px; margin: 0; } }
html.lbx-open { overflow: hidden; }

/* ------------------------------------------------------------------ app install nudge (core.js) */
.nudge-back { position: fixed; inset: 0; z-index: 120; display: flex; align-items: flex-end; justify-content: center; padding: 16px; background: rgba(var(--walnut-rgb), .6); }
.nudge { width: min(440px, 100%); padding: 28px 26px 18px; background: var(--paper); border-top: 3px solid var(--p-fill); border-radius: 10px; box-shadow: 0 30px 60px -20px rgba(var(--black-rgb), .6); text-align: center; }
.nudge-icon { width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 16px; box-shadow: var(--shadow); }
.nudge h2 { font: 700 1.45rem/1.25 var(--serif); }
.nudge p { margin-top: 8px; color: var(--ink-2); }
.nudge-steps { text-align: left; margin: 16px 0; padding-left: 1.3em; color: var(--ink-2); }
.nudge-steps li + li { margin-top: 6px; }
.nudge-btn { width: 100%; margin-top: 16px; --bg: var(--p-fill); --fg: var(--on-p); --bd: var(--p-fill); }
.nudge-small { font-size: .9rem; }
.nudge-links { display: flex; justify-content: center; gap: 8px; margin-top: 10px; }
.nudge-link { min-height: 44px; padding: 0 12px; border: 0; background: none; font: 600 .95rem/1 var(--sans); color: var(--p-ink); text-decoration: underline; text-underline-offset: .2em; }
@media (min-width: 700px) { .nudge-back { align-items: center; } }

/* ------------------------------------------------------------------ reveal (heritage.js adds .rv under html.js only) */
html.js .rv { opacity: 0; transform: translateY(12px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
html.js .rv.in { opacity: 1; transform: none; }

/* ------------------------------------------------------------------ preferences + media */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; }
  html.js .rv { opacity: 1; transform: none; }
  .drawer { transition: none; }
}
@media (forced-colors: active) {
  .orn, .arch::after, .board::before, .cta-frame, .card-noimg::after, .vframe::after { display: none; }
  .card, .event, .story, .form, .map-card, .mcard, .board, .empty, .sunday-card, .staff-card { border: 1px solid CanvasText; }
  .btn { border: 1px solid ButtonText; }
  .live-dot { forced-color-adjust: none; background: Mark; }
  .hdr .brand img, .drawer .brand img { forced-color-adjust: none; background: var(--white); padding: 4px 8px; border-radius: 4px; box-sizing: content-box; }
  .field input:focus, .field textarea:focus { outline: 2px solid Highlight; }
  .check input { appearance: auto; -webkit-appearance: auto; }
  .check input::before { display: none; }
}
@media print {
  @page { margin: 16mm; }
  :root { --on-dark: var(--print-ink); --on-dark-2: var(--ink-2); --cream: var(--print-ink); --a-dark: var(--ink-2); --line-dark: var(--line); }
  .sec-cta { --on-p: var(--print-ink); }
  body { background: var(--print-paper); color: var(--print-ink); font-size: 11pt; }
  .svcbar, .hdr, .pagebar, .drawer, .drawer-scrim, .actionbar, .search, .skip, .sec-form, .sec-map, .sec-video, .yt, .hero-media, .live-banner, .live-soft, .ctas, .sec-more, .lbx, .ts-watch, .ftr-links svg, .vplay, .card-ask { display: none !important; }
  .sec, .sec.dark, .hero, .phero, .ftr, .sec-cta, .dark, .board, .sec-schedule, .card-noimg { background: var(--print-paper) !important; color: var(--print-ink) !important; box-shadow: none !important; padding-block: 18pt !important; min-height: 0 !important; }
  .sec::before, .hero-plain::before, .sec-cta::before, .ftr::before, .board::after, .dark::before, .card-noimg::before { display: none !important; }
  .hero h1, .phero h1, .sec-cta h2, .dark h2, .dark h3, .sched-name, .sched-time, .hero-lede, .hero-est, .board-h, .sched-note, .dark .prose, .ti-fig figcaption, .ftr, .ftr a, .ftr-verse { color: var(--print-ink) !important; }
  .board { border: 1px solid var(--line-strong); }
  .card, .event, .story, .mcard, .staff-card { box-shadow: none !important; break-inside: avoid; }
  details > *:not(summary) { display: block !important; }
  details::details-content { content-visibility: visible; display: contents; }
  .tog, .story .more summary { display: none; }
  .prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .85em; word-break: break-all; }
  html.js .rv, * { transition: none !important; }
  html.js .rv { opacity: 1 !important; transform: none !important; }
}