/* ── fonts (self-hosted, no external requests) ── */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/Archivo-regular-79dc5e.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/InstrumentSerif-italic-52a6c2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/InstrumentSerif-regular-2d243d.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --ink:#0B0908; --field:#171210; --field-2:#1F1815; --line:#2A211C; --line-2:#3A2E26;
  --paper:#F4EBE2; --muted:#B9A99C; --dim:#8A7A6E;
  --ember:#E0672F; --gold:#D2A93B; --scarlet:#C81713; --turq:#17A6C9; --cobalt:#2C6FD1;
  --display:"Instrument Serif","Iowan Old Style",Georgia,serif;
  --body:"Archivo","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(18px,4.4vw,72px);
  --maxw:1360px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; overflow-x:clip}
body{margin:0; background:var(--ink); color:var(--paper);
  font-family:var(--body); font-size:16.5px; line-height:1.66; overflow-x:clip;
  -webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{margin:0; font-family:var(--display); font-weight:400; line-height:1.02;
  letter-spacing:-0.012em; text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--turq); outline-offset:3px}

/* ── the warp: vertical threads behind everything ────────────────── */
.warp{position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.85;
  background-image:
    linear-gradient(90deg, transparent 0, transparent calc(12.5% - 1px), rgba(200,23,19,.22) calc(12.5% - 1px), rgba(200,23,19,.22) 12.5%, transparent 12.5%),
    linear-gradient(90deg, transparent 0, transparent calc(31%   - 1px), rgba(23,166,201,.18) calc(31%   - 1px), rgba(23,166,201,.18) 31%,   transparent 31%),
    linear-gradient(90deg, transparent 0, transparent calc(50%   - 1px), rgba(210,169,59,.20) calc(50%   - 1px), rgba(210,169,59,.20) 50%,   transparent 50%),
    linear-gradient(90deg, transparent 0, transparent calc(69%   - 1px), rgba(44,111,209,.18) calc(69%   - 1px), rgba(44,111,209,.18) 69%,   transparent 69%),
    linear-gradient(90deg, transparent 0, transparent calc(87.5% - 1px), rgba(224,103,47,.20) calc(87.5% - 1px), rgba(224,103,47,.20) 87.5%, transparent 87.5%);
}
main,header,footer{position:relative; z-index:1}

/* ── shared ──────────────────────────────────────────────────────── */
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut)}
.eyebrow{font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--dim);
  font-weight:600; margin:0}
.lede{font-size:clamp(16.5px,1.25vw,18.5px); line-height:1.74; color:var(--muted)}

/* a photograph is always mounted on its own field, never floating on black */
.plate{position:relative; background:var(--field); padding:10px; overflow:hidden}
.plate::after{content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 90px 8px rgba(11,9,8,.55)}
.plate > .im{background-size:cover; background-position:center; width:100%; height:100%;
  display:block; filter:saturate(1.02)}
.thread{position:absolute; left:0; right:0; top:0; height:2px; z-index:2}
/* art direction: each frame cropped to its own subject, not blind-centred */
.hero-weave .col-c .im{background-position:45% 50%}
.split .plate .im{background-position:center 42%}
.inv .plate .im{background-position:34% 62%}
.cards .card:nth-child(1) .im{background-position:center 28%}
.cards .card:nth-child(2) .im{background-position:center 38%}
.cards .card:nth-child(3) .im{background-position:center 46%}
.cards .card:nth-child(4) .im{background-position:center 56%}
.t-scarlet{background:var(--scarlet)} .t-turq{background:var(--turq)}
.t-gold{background:var(--gold)} .t-cobalt{background:var(--cobalt)} .t-ember{background:var(--ember)}

.btn{display:inline-flex; align-items:center; font-family:var(--body); font-size:13px;
  font-weight:600; letter-spacing:.09em; text-transform:uppercase; text-decoration:none;
  padding:15px 24px; transition:.22s}
.btn-fill{background:var(--paper); color:#120C09}
.btn-fill:hover{background:var(--gold)}
.btn-ghost{border:1px solid var(--line-2); color:var(--paper)}
.btn-ghost:hover{border-color:var(--turq); color:var(--turq)}

/* ── nav ─────────────────────────────────────────────────────────── */
.nav{position:sticky; top:0; z-index:40; background:rgba(11,9,8,.86);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line)}
.nav-in{max-width:var(--maxw); margin-inline:auto; padding:15px var(--gut);
  display:flex; align-items:center; gap:26px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand i{width:46px; aspect-ratio:1; background-image:url("img/logo.webp"); background-size:contain;
  background-repeat:no-repeat; display:block; flex:none}
.brand b{font-family:var(--display); font-size:23px; font-weight:400; letter-spacing:.04em}
.nav ul{list-style:none; display:flex; gap:28px; margin:0 0 0 auto; padding:0}
.nav a.lnk{font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
  text-decoration:none; transition:.2s}
.nav a.lnk:hover{color:var(--paper)}
.nav .wa{font-size:12px; letter-spacing:.11em; text-transform:uppercase; font-weight:600;
  color:#120C09; background:var(--gold); padding:10px 16px; text-decoration:none; transition:.2s}
.nav .wa:hover{background:var(--paper)}
.burger{display:none; margin-left:auto; background:none; border:0; padding:10px 2px; cursor:pointer}
.burger span{display:block; width:24px; height:1.5px; background:var(--paper)}
.burger span+span{margin-top:6px; width:16px; margin-left:auto}

/* ── hero: three warps, unequal, offset ──────────────────────────── */
.hero{padding-block:clamp(34px,4vw,60px) clamp(44px,5.5vw,80px)}
.hero-weave{display:grid; grid-template-columns:1fr 1.28fr 0.92fr; gap:clamp(14px,1.6vw,26px);
  align-items:start}
.hero-weave .plate{aspect-ratio:3/4.6}
.hero-weave .col-a{margin-top:clamp(20px,3vw,48px)}
.hero-weave .col-c{margin-top:clamp(46px,6.5vw,104px); aspect-ratio:3/4.3}
.hero-txt{padding-top:clamp(10px,2vw,34px)}
.hero-txt h1{font-size:clamp(40px,5.4vw,76px); letter-spacing:-0.02em; margin:20px 0 0}
.hero-txt h1 em{font-style:italic; color:var(--gold)}
.hero-txt .lede{margin-top:24px; max-width:40ch}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.hero-meta{display:flex; gap:14px 22px; margin-top:38px; padding-top:20px; border-top:1px solid var(--line);
  font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--dim); flex-wrap:wrap}
.hero-meta span{display:flex; align-items:center; gap:8px}
.hero-meta span::before{content:""; width:5px; height:5px; background:var(--gold); transform:rotate(45deg)}

/* ── who / mission: text column against a tall plate ─────────────── */
.sec{padding-block:clamp(56px,7vw,104px)}
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,68px); align-items:center}
.split.rev .col-txt{order:2}
.split h2{font-size:clamp(30px,3.7vw,52px); margin:18px 0 22px}
.split .plate{aspect-ratio:4/5}
.split p + p{margin-top:16px}

.mission{background:var(--field); border-block:1px solid var(--line)}
.mission-in{display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(24px,4vw,64px); align-items:center}
.mission h2{font-size:clamp(28px,3.3vw,46px); margin-bottom:20px}
.mission .plate{background:var(--ink); aspect-ratio:16/11}
.mission p{color:var(--muted); font-size:clamp(16.5px,1.3vw,18.5px)}
.mission p+p{margin-top:16px}

/* ── practices as warp threads ───────────────────────────────────── */
.prac-sec{padding-block:clamp(52px,6.5vw,92px)}
.prac-top{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:30px}
.prac-top h2{font-size:clamp(26px,2.8vw,38px)}
.threads{display:grid; grid-template-columns:repeat(8,1fr); gap:clamp(8px,1vw,14px)}
.thr{background:var(--field); padding:16px 14px 26px; min-height:158px; display:flex;
  flex-direction:column; justify-content:flex-end; position:relative; transition:.28s}
.thr::before{content:""; position:absolute; inset:0 0 auto 0; height:3px}
.thr:nth-child(8n+1)::before{background:var(--scarlet)}
.thr:nth-child(8n+2)::before{background:var(--ember)}
.thr:nth-child(8n+3)::before{background:var(--gold)}
.thr:nth-child(8n+4)::before{background:#7A9A3A}
.thr:nth-child(8n+5)::before{background:var(--turq)}
.thr:nth-child(8n+6)::before{background:var(--cobalt)}
.thr:nth-child(8n+7)::before{background:#8C4FA8}
.thr:nth-child(8n+8)::before{background:#B61914}
.thr:hover{background:var(--field-2); transform:translateY(-4px)}
.thr b{display:block; font-family:var(--display); font-size:19px; font-weight:400; line-height:1.12}
.thr i{display:block; font-style:normal; font-size:11px; color:var(--dim); margin-top:8px;
  letter-spacing:.05em; line-height:1.42; min-height:2.9em}

/* ── offerings: four tall plates ─────────────────────────────────── */
.off{padding-block:clamp(46px,5.5vw,78px) clamp(52px,6vw,86px)}
.off-top{max-width:56ch; margin-bottom:34px}
.off-top h2{font-size:clamp(30px,3.7vw,52px); margin:16px 0 16px}
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.5vw,20px)}
.card{position:relative; display:block; text-decoration:none; color:inherit;
  background:var(--field); overflow:hidden; transition:.32s}
.card .im{display:block; aspect-ratio:3/4.35; background-size:cover; background-position:center;
  transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.card:hover .im,.card:focus-visible .im{transform:scale(1.045)}
.card .veil{display:block; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,9,8,.10) 0%, rgba(11,9,8,.05) 34%, rgba(11,9,8,.80) 74%, rgba(11,9,8,.96) 100%)}
.card .body{display:block; position:absolute; inset:auto 0 0 0; padding:20px 18px 22px}
.card .d{display:block; font-size:10.5px; letter-spacing:.17em; text-transform:uppercase; color:var(--gold);
  font-weight:700; font-variant-numeric:tabular-nums}
.card h3{font-size:clamp(20px,1.6vw,25px); margin:9px 0 6px; line-height:1.1}
.card .s{display:block; font-size:12px; color:var(--muted); letter-spacing:.02em; line-height:1.45}
.card .go{margin-top:14px; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--paper); display:flex; align-items:center; gap:8px; opacity:0; transform:translateY(6px);
  transition:.3s}
.card:hover .go,.card:focus-visible .go{opacity:1; transform:none}
.off-note{margin-top:26px; padding:16px 18px; background:var(--field); border-left:2px solid var(--turq);
  font-size:13px; color:var(--muted)}

/* ── invitation ──────────────────────────────────────────────────── */
.inv{padding-block:clamp(46px,5.5vw,78px) clamp(56px,7vw,100px)}
.inv-in{display:grid; grid-template-columns:0.66fr 1.34fr; gap:clamp(24px,4vw,64px); align-items:center}
.inv .plate{aspect-ratio:3/4.2}
.inv h2{font-size:clamp(30px,3.9vw,54px); margin:18px 0 24px}
.inv p{color:var(--muted)}
.inv .pull{margin-top:26px; font-family:var(--display); font-style:italic; color:var(--paper);
  font-size:clamp(21px,2.2vw,31px); line-height:1.32; max-width:26ch}

/* ── footer ──────────────────────────────────────────────────────── */
footer{border-top:1px solid var(--line); background:var(--field); padding-block:56px 40px}
.f-grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:36px}
.f-grid h3{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim);
  font-family:var(--body); font-weight:700; margin-bottom:15px}
.f-list{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.f-list a{font-size:14px; color:var(--muted); text-decoration:none; transition:.2s}
.f-list a:hover{color:var(--gold)}
.f-mark{display:flex; gap:13px; align-items:flex-start}
.f-mark i{width:46px; aspect-ratio:1; background-image:url("img/logo.webp"); background-size:contain;
  background-repeat:no-repeat; flex:none; display:block}
.f-mark b{font-family:var(--display); font-size:21px; font-weight:400; letter-spacing:.04em; display:block}
.f-closing{font-family:var(--display); font-style:italic; color:var(--muted); font-size:15px;
  line-height:1.55; margin-top:12px; max-width:32ch}
.f-bot{display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; margin-top:44px;
  padding-top:20px; border-top:1px solid var(--line); font-size:11.5px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--dim)}

/* ── responsive ──────────────────────────────────────────────────── */
@media (max-width:1080px){
  .threads{grid-template-columns:repeat(4,1fr)}
  .cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .nav ul{display:none}
  .burger{display:block; order:3}
  .nav .wa{order:2; margin-left:auto}
  .hero-weave{grid-template-columns:1fr 1fr}
  .hero-txt{grid-column:1/-1; order:-1; padding-top:0}
  .hero-weave .col-a,.hero-weave .col-c{margin-top:0}
  .hero-weave .plate,.hero-weave .col-c{aspect-ratio:3/4}
  .split,.mission-in,.inv-in{grid-template-columns:1fr; gap:26px}
  .split.rev .col-txt{order:0}
  .split .plate,.inv .plate{aspect-ratio:16/11}
  .f-grid{grid-template-columns:1fr 1fr; gap:28px}
  .f-mark{grid-column:1/-1}
}
@media (max-width:520px){
  .threads{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:1fr}
  .card .im{aspect-ratio:3/3.4}
  .warp{opacity:.32}
  .cta-row .btn{flex:1 1 100%; justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important; transition-duration:.01ms!important}
}
.show-drafted [data-drafted]{outline:1px dashed rgba(23,166,201,.9); outline-offset:5px;
  background:rgba(23,166,201,.10)}

/* ═══════════════════════════════════════════════════════════════════
   INNER PAGES — Offerings · About · Contact
   Same tokens, same weave language as the homepage.
   ═══════════════════════════════════════════════════════════════════ */

/* active state in the nav */
.nav a.lnk.is-active{color:var(--paper)}
.nav a.lnk.is-active::after{content:""; display:block; height:1px; margin-top:5px;
  background:var(--gold)}

/* ── shared inner-page header ─────────────────────────────────────── */
.page-head{padding-block:clamp(44px,6vw,86px) clamp(28px,3.5vw,46px);
  border-bottom:1px solid var(--line)}
.page-head h1{font-size:clamp(36px,5.4vw,74px); letter-spacing:-0.02em; margin:16px 0 0}
.page-head h1 em{font-style:italic; color:var(--gold)}
.page-head .lede{margin-top:20px; max-width:56ch}
.page-head .meta{display:flex; gap:14px 26px; flex-wrap:wrap; margin-top:26px;
  font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--dim)}
.page-head .meta span{display:flex; align-items:center; gap:8px}
.page-head .meta span::before{content:""; width:5px; height:5px; background:var(--gold);
  transform:rotate(45deg); flex:none}

/* ── OFFERINGS ────────────────────────────────────────────────────── */
.ev-list{padding-block:clamp(40px,5vw,64px)}
.ev{display:grid; grid-template-columns:0.82fr 1.18fr; gap:clamp(24px,4vw,64px);
  padding-block:clamp(40px,5vw,72px); border-bottom:1px solid var(--line); align-items:start}
.ev:last-of-type{border-bottom:0}
.ev.flip{grid-template-columns:1.18fr 0.82fr}
.ev.flip .ev-body{order:-1}
.ev .plate{aspect-ratio:3/4; position:sticky; top:92px}
.ev-when{font-family:var(--body); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); font-weight:700; font-variant-numeric:tabular-nums}
.ev h2{font-size:clamp(28px,3.6vw,48px); margin:12px 0 8px; line-height:1.04}
.ev .sub{font-size:14px; color:var(--muted); letter-spacing:.02em}
.ev .blurb{margin-top:20px; font-size:clamp(16px,1.25vw,18px); line-height:1.72; color:var(--muted);
  max-width:58ch}

/* the variable blocks — no two gatherings carry the same set */
.blocks{margin-top:30px; display:grid; gap:1px; background:var(--line);
  border-block:1px solid var(--line)}
.blk{background:var(--ink); padding:18px 0 20px}
.blk > h3{font-family:var(--body); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim); font-weight:700; margin-bottom:12px}
.blk p{font-size:15px; color:var(--muted); line-height:1.66}
.chips{display:flex; flex-wrap:wrap; gap:7px}
.chips span{font-size:12.5px; letter-spacing:.02em; color:var(--paper); background:var(--field);
  border:1px solid var(--line-2); border-radius:2px; padding:6px 11px}
.chips.no span{color:var(--dim); background:transparent; text-decoration:line-through;
  text-decoration-color:var(--line-2)}

/* Mountain of Vision runs four staggered starts inside one gathering */
.sched{width:100%; border-collapse:collapse; font-size:14px}
.sched th{text-align:left; font-family:var(--body); font-size:9.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--dim); font-weight:700; padding:0 14px 9px 0;
  border-bottom:1px solid var(--line)}
.sched td{padding:11px 14px 11px 0; border-bottom:1px solid var(--line); color:var(--muted);
  vertical-align:middle}
.sched td:first-child{color:var(--paper); white-space:nowrap; font-variant-numeric:tabular-nums}
.sched tr:last-child td{border-bottom:0}
.qdot{display:inline-flex; align-items:center; gap:8px; white-space:nowrap}
.qdot i{width:9px; height:9px; border-radius:50%; display:block; flex:none;
  border:1px solid rgba(244,235,226,.35)}
.q-white i{background:#F4EBE2} .q-black i{background:#0B0908}
.q-yellow i{background:var(--gold)} .q-red i{background:var(--scarlet)}

/* day-by-day */
.days{display:grid; gap:0}
.day{display:grid; grid-template-columns:88px 1fr; gap:18px; padding:13px 0;
  border-bottom:1px solid var(--line)}
.day:last-child{border-bottom:0}
.day b{font-family:var(--body); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold); font-weight:700; padding-top:3px}
.day p{font-size:15px}

.note-strip{margin-top:22px; padding:15px 17px; background:var(--field);
  border-left:2px solid var(--turq); font-size:13.5px; color:var(--muted); line-height:1.6}
.note-strip.warn{border-left-color:var(--ember)}

/* past gatherings */
.past-sec{padding-block:clamp(44px,6vw,84px); border-top:1px solid var(--line-2)}
.past-head{display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  flex-wrap:wrap; margin-bottom:24px}
.past-head h2{font-size:clamp(22px,2.4vw,32px)}
.past{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.past a{display:block; text-decoration:none; color:inherit; background:var(--field);
  padding:18px 18px 20px; border-top:2px solid var(--line-2); transition:.25s; opacity:.62}
.past a:hover,.past a:focus-visible{opacity:1; border-top-color:var(--gold)}
.past .d{font-family:var(--body); font-size:10.5px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--dim); font-weight:700}
.past h3{font-size:19px; margin-top:8px; line-height:1.15}

/* ── ABOUT ────────────────────────────────────────────────────────── */
.person{display:grid; grid-template-columns:0.72fr 1.28fr; gap:clamp(24px,4vw,64px);
  padding-block:clamp(40px,5vw,72px); border-bottom:1px solid var(--line); align-items:start}
.person:last-of-type{border-bottom:0}
.person.flip{grid-template-columns:1.28fr 0.72fr}
.person.flip .p-body{order:-1}
.person .plate{aspect-ratio:3/4}
.p-role{font-family:var(--body); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); font-weight:700}
.person h2{font-size:clamp(28px,3.4vw,44px); margin:12px 0 18px}
.person p{color:var(--muted); font-size:clamp(16px,1.25vw,18px); line-height:1.72; max-width:58ch}
.person p + p{margin-top:14px}

/* a visible, honest hole where client copy is still missing */
.awaiting{margin-top:18px; padding:20px 22px; border:1px dashed var(--line-2);
  border-radius:3px; background:rgba(23,166,201,.05)}
.awaiting b{display:block; font-family:var(--body); font-size:10.5px; letter-spacing:.17em;
  text-transform:uppercase; color:var(--turq); font-weight:700; margin-bottom:9px}
.awaiting p{font-size:14.5px; color:var(--dim); max-width:none}
.awaiting ul{margin:10px 0 0; padding-left:17px; color:var(--dim); font-size:14px; line-height:1.75}

.ghost{display:grid; place-items:center; aspect-ratio:3/4; background:var(--field);
  border:1px dashed var(--line-2); text-align:center; padding:24px}
.ghost span{font-family:var(--body); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--dim); line-height:1.9}

/* ── CONTACT ──────────────────────────────────────────────────────── */
.contact{padding-block:clamp(44px,6vw,80px)}
.c-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(26px,4vw,64px);
  align-items:start}
.wa{display:block; text-decoration:none; color:inherit; background:var(--field);
  border-top:3px solid #25D366; padding:30px 30px 32px; transition:.25s}
.wa:hover,.wa:focus-visible{background:var(--field-2); transform:translateY(-2px)}
.wa .k{font-family:var(--body); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim); font-weight:700}
.wa strong{display:block; font-family:var(--display); font-weight:400; font-size:clamp(26px,3vw,38px);
  margin:10px 0 6px; letter-spacing:-0.01em; font-variant-numeric:tabular-nums}
.wa em{font-style:normal; font-size:14px; color:var(--muted); display:block}
.wa .go{margin-top:18px; display:inline-flex; align-items:center; gap:9px; font-size:12px;
  letter-spacing:.13em; text-transform:uppercase; font-weight:600; color:#25D366}

.dl{margin-top:26px; border-top:1px solid var(--line)}
.dl div{display:grid; grid-template-columns:120px 1fr; gap:18px; padding:15px 0;
  border-bottom:1px solid var(--line)}
.dl dt{font-family:var(--body); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--dim); font-weight:700; margin:0; padding-top:3px}
.dl dd{margin:0; font-size:15.5px; color:var(--paper); line-height:1.6}
.dl dd a{color:var(--paper); text-decoration:none; border-bottom:1px solid var(--line-2)}
.dl dd a:hover{border-bottom-color:var(--gold); color:var(--gold)}
.dl dd small{display:block; color:var(--dim); font-size:13px; margin-top:3px; letter-spacing:.01em}

.form-slot{background:var(--field); padding:26px 26px 28px; border-top:2px solid var(--turq)}
.form-slot h2{font-size:clamp(22px,2.4vw,30px); margin-bottom:8px}
.form-slot > p{font-size:14.5px; color:var(--muted); margin-bottom:20px}
.fld{margin-bottom:14px}
.fld label{display:block; font-family:var(--body); font-size:10.5px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--dim); font-weight:700; margin-bottom:7px}
.fld input,.fld textarea,.fld select{width:100%; background:var(--ink); color:var(--paper);
  border:1px solid var(--line-2); border-radius:2px; padding:12px 13px; font:inherit;
  font-size:15px; font-family:var(--body)}
.fld textarea{min-height:110px; resize:vertical}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:2px solid var(--turq);
  outline-offset:1px; border-color:transparent}

/* ── responsive for the inner pages ───────────────────────────────── */
@media (max-width:1080px){
  .past{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .ev,.ev.flip,.person,.person.flip,.c-grid{grid-template-columns:1fr; gap:26px}
  .ev.flip .ev-body,.person.flip .p-body{order:0}
  .ev .plate{position:static; aspect-ratio:16/11}
  .person .plate,.ghost{aspect-ratio:16/11}
  .day{grid-template-columns:1fr; gap:4px}
  .day b{padding-top:0}
  .dl div{grid-template-columns:1fr; gap:3px}
  .dl dt{padding-top:0}
}
@media (max-width:520px){
  .past{grid-template-columns:1fr}
  .sched{font-size:13px}
  .sched th:nth-child(3),.sched td:nth-child(3){display:none}
}



/* An unfilled team slot stays compact — it should read as ready, not broken.
   When the real photo and bio land, drop the .empty class and swap .ghost for
   .plate and the slot returns to the full portrait proportion.               */
.person.empty{padding-block:clamp(22px,2.6vw,36px)}
.person.empty .ghost{aspect-ratio:16/10}
.person.empty h2{font-size:clamp(22px,2.4vw,30px); margin:10px 0 14px; color:var(--dim)}
.person.empty .awaiting{margin-top:0}

/* ── touch targets ─────────────────────────────────────────────────
   Every link and control reaches 44px on a phone. Footer and contact
   links are short text, so the height comes from padding, not size.  */
@media (max-width:860px){
  .f-list{gap:0}
  .f-list a{display:block; padding-block:13px; min-height:44px}
  .dl dd a{display:inline-block; padding-block:11px; min-height:44px}
  .past a{min-height:64px}
  .burger{padding:12px 8px; min-height:44px; min-width:44px}
  .brand{min-height:44px}
  .nav .wa{min-height:44px; display:inline-flex; align-items:center}
  .thr{min-height:118px}
}