/* ==========================================================================
   3rd Annual EqualiTEA — Digital Program
   Art direction: Modern Historical Elegance.
   Copperplate-invitation typography, engraved gold rules, arch-masked
   imagery, full-bleed chapter grounds. Content and section sequence are
   carried over verbatim from the approved program.
   ========================================================================== */

@font-face{font-family:Cormorant;src:url('assets/fonts/cormorant-garamond-var.woff2') format('woff2-variations');
  font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/fonts/cormorant-garamond-var-italic.woff2') format('woff2-variations');
  font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:Jost;src:url('assets/fonts/jost-var.woff2') format('woff2-variations');
  font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:Pinyon;src:url('assets/fonts/pinyon-script.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}

:root{
  /* ---------- ink ---------- */
  --ink:#150B23;
  --plum-900:#241238; --plum-800:#33194E; --plum-700:#452468; --plum-600:#5B3287;
  --violet-50:#F3EFF8;
  --gold-900:#7E5A10; --gold-text:#8A6412; --gold-700:#A87C1E; --gold-500:#C99A2E;
  --gold-300:#E4C170; --gold-100:#F6E7B8;
  --paper:#FBF8F3; --parchment:#F2ECE1; --white:#fff;
  --body:#3C3348; --muted:#6A6278;
  --hair:rgba(21,11,35,.14);
  --hair-gold:rgba(201,154,46,.42);

  /* ---------- type ---------- */
  --serif:Cormorant,"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:Jost,"Century Gothic","Segoe UI",-apple-system,Helvetica,Arial,sans-serif;
  --script:Pinyon,"Snell Roundhand","Segoe Script",cursive;

  --eyebrow:.75rem;
  --micro:.75rem;
  --small:.875rem;
  --base:1rem;
  --lead:1.0625rem;

  /* ---------- space ---------- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --chapter:clamp(72px,9vw,132px);

  /* ---------- measure ---------- */
  --wide:1260px; --mid:1080px; --prog:880px; --col:780px; --text:62ch;

  --ease:cubic-bezier(.22,.68,.28,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--body);
  font-family:var(--sans);font-size:var(--base);font-weight:400;line-height:1.6;
  font-synthesis-weight:none;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
p,h1,h2,h3,dl,dd,ul{margin-top:0}
h1,h2,h3{font-family:var(--serif);font-weight:300;text-wrap:balance;letter-spacing:.01em}
section[id]{scroll-margin-top:calc(var(--bar,72px) + 12px)}

::selection{background:var(--gold-300);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold-500);outline-offset:4px;border-radius:2px}

.skip-link{
  position:fixed;z-index:999;top:var(--s3);left:var(--s3);padding:var(--s3) var(--s5);
  background:var(--ink);color:var(--gold-100);border-radius:2px;
  font-size:var(--micro);font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;transform:translateY(-220%);transition:transform 200ms var(--ease);
}
.skip-link:focus{transform:none}

.shell{width:min(100% - 44px,var(--wide));margin-inline:auto}
.shell--mid{width:min(100% - 44px,var(--mid))}
.shell--col{width:min(100% - 44px,var(--col))}
.shell--prog{width:min(100% - 44px,var(--prog))}
.chapter{padding-block:var(--chapter)}

/* grain overlay for the warm grounds */
.grain{position:relative;isolation:isolate}
.grain::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:var(--grain);opacity:.28;mix-blend-mode:multiply;
}

/* ---------- shared ornaments ---------- */
.eyebrow{
  margin:0 0 var(--s4);font-family:var(--sans);font-size:var(--eyebrow);font-weight:500;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold-text);
}
.rule{display:flex;align-items:center;gap:var(--s3);width:100%}
.rule::before,.rule::after{
  content:"";flex:1;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-500) 45%,var(--gold-500) 55%,transparent);
}
.rule i{
  flex:none;width:7px;height:7px;background:var(--gold-500);
  transform:rotate(45deg);
}
.rule--tight{width:min(280px,60%)}

.masthead{text-align:center;margin-bottom:var(--s9)}
.masthead .eyebrow{margin-bottom:var(--s3)}
.masthead h2{
  margin:0;font-size:clamp(2.15rem,4.6vw,3.35rem);font-weight:300;
  line-height:1.04;letter-spacing:.02em;color:var(--plum-800);
}
.masthead .rule{margin:var(--s5) auto 0;width:min(220px,52%)}
.masthead--invert h2{color:var(--white)}
.masthead--invert .eyebrow{color:var(--gold-300)}

/* arch mask — the recurring image device */
.arch{border-radius:50% 50% 3px 3px / 32% 32% 0 0;overflow:hidden}

/* ==========================================================================
   header
   ========================================================================== */
.bar{
  position:sticky;top:0;z-index:100;
  background:rgba(251,248,243,.9);
  backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);
  border-bottom:1px solid var(--hair);
}
.bar::after{
  content:"";position:absolute;inset:auto 0 -1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-500) 30%,var(--gold-300) 50%,var(--gold-500) 70%,transparent);
}
.bar__in{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s6);
  width:min(100% - 44px,var(--wide));min-height:76px;margin-inline:auto;
}
.bar__logo{display:block;flex:none}
.bar__logo img{width:236px}
.nav{display:flex;align-items:center;gap:clamp(18px,3.2vw,44px)}
.nav a{
  position:relative;display:block;padding:28px 0;
  font-size:var(--eyebrow);font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;text-decoration:none;color:var(--plum-800);
  white-space:nowrap;transition:color 200ms var(--ease);
}
.nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:22px;height:1px;
  background:var(--gold-500);transform:scaleX(0);transform-origin:left;
  transition:transform 280ms var(--ease);
}
.nav a:hover{color:var(--gold-text)}
.nav a:hover::after,.nav a:focus-visible::after{transform:none}

/* ==========================================================================
   hero
   ========================================================================== */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(880px,92svh);
  display:grid;grid-template-rows:1fr auto;
  background:var(--plum-900);color:var(--white);
}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(120% 100% at 22% 50%,rgba(21,11,35,.94) 22%,rgba(21,11,35,.72) 48%,rgba(21,11,35,.4) 72%,rgba(21,11,35,.55) 100%),
    linear-gradient(180deg,rgba(21,11,35,.72),transparent 30%,transparent 62%,rgba(21,11,35,.8));
}
.hero__frame{
  display:grid;place-items:center;
  margin:clamp(20px,3.4vw,44px);
  padding:clamp(36px,6vw,80px) clamp(20px,4vw,56px);
  border:1px solid var(--hair-gold);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
}
.hero__in{max-width:920px;text-align:center}
.hero__rule{width:min(300px,64%);margin-inline:auto}
.hero__ordinal{
  display:block;margin:var(--s6) 0 var(--s3);
  font-family:var(--sans);font-size:clamp(.75rem,1.5vw,.9rem);font-weight:500;
  letter-spacing:.44em;text-indent:.44em;text-transform:uppercase;color:var(--gold-300);
}
.hero h1{margin:0}
.hero__name{
  display:block;font-size:clamp(3.6rem,12.5vw,9.5rem);font-weight:300;
  line-height:.86;letter-spacing:.015em;text-transform:uppercase;
  text-shadow:0 4px 60px rgba(21,11,35,.7);
}
.hero__name span{
  color:var(--gold-300);
  background:linear-gradient(180deg,var(--gold-100),var(--gold-300) 46%,var(--gold-500));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero__theme{
  margin:var(--s5) auto 0;max-width:28ch;
  font-family:var(--script);font-size:clamp(1.5rem,3.6vw,2.6rem);
  line-height:1.5;color:var(--gold-100);
  text-shadow:0 2px 30px rgba(21,11,35,.8);
}
.facts{
  display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s4) clamp(28px,6vw,72px);
  margin:var(--s7) 0 0;padding-top:var(--s6);
  border-top:1px solid rgba(255,255,255,.14);
}
.fact{display:flex;align-items:center;gap:var(--s4);text-align:left}
.fact svg{
  width:26px;height:26px;flex:none;color:var(--gold-300);
  fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;
}
.fact dt,.fact dd{margin:0}
.fact dt{
  font-size:var(--micro);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--white);
}
.fact dd{font-size:var(--small);letter-spacing:.06em;color:rgba(255,255,255,.72)}
.hero__welcome{
  position:relative;z-index:1;margin:0;padding:var(--s4) var(--s5);
  background:linear-gradient(90deg,var(--gold-700),var(--gold-300) 30%,var(--gold-100) 50%,var(--gold-300) 70%,var(--gold-700));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(126,90,16,.4);
  color:var(--plum-900);font-size:var(--micro);font-weight:500;
  letter-spacing:.36em;text-indent:.36em;text-transform:uppercase;text-align:center;
}

/* ==========================================================================
   today's program — a single sequential spine
   ========================================================================== */
.program{background:var(--paper)}

/* ---- order of proceedings ------------------------------------------------
   Not a timeline: there are no per-item times, only a running order. So the
   numerals do the sequencing typographically and every entry carries the same
   portrait treatment — the panel is three people, not a different species. */
.agenda{margin:0;padding:0;list-style:none}
.entry{
  display:grid;
  grid-template-columns:var(--num,58px) var(--face,80px) minmax(0,1fr);
  align-items:start;gap:0 clamp(18px,2.4vw,30px);
  padding-block:clamp(26px,3vw,36px);
}
.entry + .entry{border-top:1px solid var(--hair)}
.entry__no{
  grid-column:1;justify-self:end;
  font-family:var(--serif);font-size:clamp(2.1rem,3.4vw,2.9rem);font-weight:300;
  line-height:.85;letter-spacing:-.02em;color:var(--gold-500);
  font-variant-numeric:lining-nums tabular-nums;
}
.entry__face{grid-column:2;width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%}
.entry__face,.panelist img{
  background:var(--parchment);
  box-shadow:0 0 0 1px var(--hair-gold),0 0 0 5px var(--paper),0 0 0 6px rgba(21,11,35,.05);
}
.entry__body{grid-column:3;min-width:0;padding-top:2px}
.entry__role{
  margin:0 0 var(--s2);font-size:var(--eyebrow);font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gold-text);
}
.entry h3{
  margin:0 0 var(--s2);font-size:clamp(1.35rem,2.2vw,1.7rem);font-weight:600;
  line-height:1.15;color:var(--plum-800);
}
.entry p:not(.entry__role){margin:0;font-size:var(--small);line-height:1.65;color:var(--muted)}

/* the one item that is three people at once */
.panel .entry__body{grid-column:3}
.panel__inner{
  position:relative;margin-top:var(--s5);
  padding:clamp(30px,3.4vw,40px) clamp(20px,2.6vw,30px);
  background:linear-gradient(170deg,var(--parchment),#EDE5D6);
  box-shadow:inset 0 0 0 1px var(--hair-gold);
}
.panel__inner::before{
  content:"";position:absolute;inset:0 0 auto;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold-500) 26%,var(--gold-300) 50%,var(--gold-500) 74%,transparent);
}
.panelists{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,2vw,26px);
}
.panelist{min-width:0;text-align:center}
.panelist img{
  width:clamp(84px,7vw,104px);aspect-ratio:1;margin:0 auto var(--s4);
  object-fit:cover;border-radius:50%;
  box-shadow:0 0 0 1px var(--hair-gold),0 0 0 5px var(--parchment),0 0 0 6px rgba(21,11,35,.05);
}
.panelist h3{margin:0 0 var(--s1);font-size:var(--base);font-weight:600;line-height:1.2}
.panelist p{margin:0;font-size:var(--micro);line-height:1.5;color:var(--muted)}

/* ==========================================================================
   today's voices
   ========================================================================== */
.voices{
  background:
    radial-gradient(80% 55% at 50% 0%,rgba(91,50,135,.55),transparent 70%),
    linear-gradient(180deg,var(--ink),var(--plum-900) 55%,var(--ink));
  color:var(--white);
}
.roster{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:clamp(34px,4vw,56px) clamp(16px,2.6vw,34px);
}
.voice{flex:0 1 168px;min-width:132px;text-align:center}
.voice img{
  width:clamp(104px,12vw,140px);aspect-ratio:1;margin:0 auto var(--s4);
  object-fit:cover;border-radius:50%;background:var(--plum-700);
  box-shadow:0 0 0 1px rgba(228,193,112,.7),0 0 0 6px rgba(228,193,112,.1);
}
.voice h3{
  margin:0 0 var(--s2);font-size:1.1rem;font-weight:600;line-height:1.18;color:var(--white);
}
.voice p{margin:0;font-size:var(--micro);line-height:1.5;color:rgba(255,255,255,.66)}
.voice .voice__role{
  margin-bottom:var(--s2);font-size:var(--small);font-weight:400;
  letter-spacing:.005em;line-height:1.45;color:#E9D49B;
}
.voice--panel img{box-shadow:0 0 0 1px var(--gold-300),0 0 0 3px var(--plum-900),0 0 0 4px rgba(228,193,112,.55),0 0 0 10px rgba(228,193,112,.1)}
.voice--panel h3::after{
  content:"";display:block;width:18px;height:1px;margin:var(--s2) auto 0;background:var(--gold-500);
}

.cta{margin-top:var(--s9);text-align:center}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s3);
  min-height:52px;padding:var(--s3) clamp(28px,4vw,44px);
  border:1px solid var(--gold-500);color:var(--gold-100);
  font-size:var(--micro);font-weight:500;letter-spacing:.24em;text-transform:uppercase;
  text-decoration:none;background:transparent;
  transition:background 300ms var(--ease),color 300ms var(--ease),border-color 300ms var(--ease);
}
.btn:hover{background:var(--gold-300);border-color:var(--gold-300);color:var(--plum-900)}

/* ==========================================================================
   featured biographies — editorial spreads, no card chrome
   ========================================================================== */
.bios{background:var(--parchment)}
.bio{
  display:grid;grid-template-columns:minmax(0,290px) minmax(0,1fr);
  align-items:center;gap:clamp(30px,4.6vw,72px);
}
.bio + .bio{margin-top:var(--s8);padding-top:var(--s8);border-top:1px solid var(--hair)}
.bio:nth-of-type(even){grid-template-columns:minmax(0,1fr) minmax(0,290px)}
.bio:nth-of-type(even) .bio__fig{grid-column:2;grid-row:1}
.bio:nth-of-type(even) .bio__body{grid-column:1;grid-row:1}
.bio__fig{position:relative;isolation:isolate}
.bio__fig img{
  width:100%;aspect-ratio:3/4;object-fit:cover;
  border-radius:50% 50% 3px 3px / 32% 32% 0 0;
}
.bio__fig::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  border:1px solid var(--hair-gold);
  border-radius:50% 50% 3px 3px / 32% 32% 0 0;
  transform:translate(16px,16px);
}
.bio:nth-of-type(even) .bio__fig::after{transform:translate(-16px,16px)}
.bio h3{
  margin:0;font-size:clamp(2rem,4vw,3rem);font-weight:300;line-height:1.06;color:var(--plum-800);
}
.bio__body .rule{margin:var(--s4) 0 var(--s5);width:min(150px,44%)}
.bio__body p{
  max-width:var(--text);margin:0 0 var(--s4);
  font-size:var(--lead);line-height:1.8;color:var(--body);
}
.bio__body p:last-child{margin-bottom:0}
.bio__body em{font-family:var(--serif);font-style:italic;font-size:1.12em;font-weight:500}

/* ==========================================================================
   modern historical elegance — full-bleed triptych
   ========================================================================== */
.elegance{background:var(--paper);padding-bottom:0}
.elegance__lead{max-width:640px;margin:0 auto;text-align:center}
.elegance__lead p{margin:0 0 var(--s4);font-size:var(--lead);line-height:1.85;color:var(--muted)}
.elegance__lead p:last-child{margin-bottom:0}
.triptych{
  display:grid;grid-template-columns:repeat(3,1fr);margin-top:var(--chapter);
}
.swatch{
  display:grid;align-content:center;justify-items:center;gap:var(--s4);
  min-height:clamp(340px,34vw,440px);
  padding:clamp(44px,6vw,84px) clamp(24px,3vw,44px);text-align:center;
}
.swatch svg{
  width:60px;height:60px;fill:none;stroke:currentColor;stroke-width:1.25;
  stroke-linecap:round;stroke-linejoin:round;opacity:.9;
}
.swatch h3{
  margin:var(--s3) 0 0;font-size:clamp(1.7rem,2.6vw,2.2rem);font-weight:400;
  letter-spacing:.16em;text-transform:uppercase;
}
.swatch__meaning{
  margin:0;padding-bottom:var(--s5);
  font-size:var(--micro);font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  border-bottom:1px solid currentColor;
}
.swatch p:last-child{
  max-width:26ch;margin:0;font-size:var(--base);line-height:1.75;
}
.swatch--purple{background:linear-gradient(170deg,var(--plum-700),var(--plum-900));color:var(--gold-100)}
.swatch--purple h3{color:var(--white)}
.swatch--purple .swatch__meaning{border-color:rgba(246,231,184,.4)}
.swatch--white{background:var(--white);color:var(--plum-800)}
.swatch--white .swatch__meaning{border-color:rgba(51,25,78,.24)}
.swatch--white p:last-child{color:var(--muted)}
.swatch--gold{background:linear-gradient(170deg,var(--gold-300),var(--gold-500));color:var(--plum-900)}
.swatch--gold .swatch__meaning{border-color:rgba(21,11,35,.3)}

/* ==========================================================================
   sponsors — tier bands, no boxes
   ========================================================================== */
.sponsors{
  background:var(--parchment);
  border-top:1px solid rgba(21,11,35,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.tier + .tier{margin-top:var(--s8)}
.tier + .tier--band{margin-top:var(--s8)}

.tier__label{
  display:flex;align-items:center;gap:var(--s5);margin:0 0 var(--s6);
  font-size:var(--eyebrow);font-weight:500;letter-spacing:.28em;
  text-transform:uppercase;color:var(--plum-700);white-space:nowrap;
}
.tier__label::before,.tier__label::after{content:"";flex:1;height:1px;background:var(--hair)}

/* four headline tiers share one premium row */
.headline-row{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--s6) clamp(24px,3vw,48px);
  padding-bottom:var(--s8);margin-bottom:var(--s8);
  border-bottom:1px solid var(--hair);
}
.headline-row .tier{margin:0}
.headline-row .tier__label{
  justify-content:center;margin-bottom:var(--s5);
  font-size:var(--eyebrow);letter-spacing:.2em;
}
.headline-row .tier__label::before,.headline-row .tier__label::after{display:none}
.mark{
  display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;width:clamp(146px,15vw,206px);height:122px;padding:var(--s4);
  background:var(--white);border:1px solid rgba(21,11,35,.07);
  box-shadow:0 1px 2px rgba(21,11,35,.04);
  text-decoration:none;color:var(--plum-800);
  transition:transform 300ms var(--ease),box-shadow 300ms var(--ease),border-color 300ms var(--ease);
}
.mark img{
  flex:0 0 auto;width:auto;height:auto;
  max-width:100%;max-height:62px;object-fit:contain;
}
/* optical normalisation — wordmarks read by width, emblems by height */
.mark--wide img{max-height:46px}
.mark--emblem img{max-height:80px;max-width:82%}
/* SVGs that carry a viewBox but no intrinsic size collapse to 0 in flex —
   an explicit width restores them without touching the source files */
.mark--vector img{width:100%;height:auto}
a.mark:hover,a.mark:focus-visible{
  transform:translateY(-3px);border-color:var(--hair-gold);
  box-shadow:0 10px 26px rgba(21,11,35,.10);
}
.mark--type{font-family:var(--serif);font-size:1.3rem;font-weight:500;letter-spacing:.01em;text-align:center}
a.mark--type:hover{color:var(--gold-text)}
.mark--plate{background:var(--plum-900);border-color:var(--plum-900)}
.mark--pair{flex-direction:column;gap:var(--s2)}
.mark--pair > div{display:flex;align-items:center;gap:var(--s3)}
.mark--pair img{max-height:40px}
.mark--pair span{color:var(--hair);font-size:1.1rem}
.mark--pair p{
  margin:0;font-size:var(--micro);letter-spacing:.06em;line-height:1.35;
  text-transform:uppercase;color:var(--muted);
}

.marks{
  display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;
  gap:var(--s4);
}
.headline-row .marks{gap:0}
.headline-row .mark{width:100%;height:150px;padding:var(--s5)}
.headline-row .mark img{max-height:84px;max-width:100%}

/* ==========================================================================
   committee & credits
   ========================================================================== */
.credits{
  background:var(--paper);
  border-top:1px solid var(--hair);
  text-align:center;
}
.colophon{max-width:820px;margin-inline:auto}
.credits h2{
  margin:0;font-size:clamp(2rem,3.6vw,2.9rem);font-weight:300;
  letter-spacing:.02em;color:var(--plum-800);
}
.colophon > .rule{margin:var(--s5) auto var(--s8);width:min(200px,48%)}
.committee{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--s5) var(--s6);margin:0 0 var(--s9);padding:0;list-style:none;
}
.committee li{
  position:relative;padding-top:var(--s5);
  font-family:var(--serif);font-size:clamp(1.15rem,1.7vw,1.35rem);
  font-weight:500;line-height:1.3;color:var(--plum-800);
}
.committee li::before{
  content:"";position:absolute;top:0;left:50%;width:6px;height:6px;
  background:var(--gold-500);transform:translateX(-50%) rotate(45deg);
}
.design-credit{
  display:grid;justify-items:center;gap:var(--s5);
  padding-top:var(--s8);border-top:1px solid var(--hair);
}
.design-credit .eyebrow{margin:0}
.design-credit a{justify-self:center;width:260px;max-width:72%}
.design-credit a img{width:100%}
.design-credit img{
  width:min(260px,72%);padding:var(--s4) var(--s5);background:var(--white);
  box-shadow:0 0 0 1px var(--hair-gold),0 0 0 6px var(--paper),0 0 0 7px var(--hair);
}

/* ==========================================================================
   save the date
   ========================================================================== */
.savedate{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(620px,78svh);display:grid;
  background:var(--plum-900);color:var(--white);
}
.savedate__bg{position:absolute;inset:0;z-index:-2}
.savedate__bg img{width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.savedate__bg::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(110% 100% at 22% 50%,rgba(21,11,35,.93) 16%,rgba(36,18,56,.68) 46%,rgba(36,18,56,.22) 74%,rgba(36,18,56,.06) 100%),
    linear-gradient(180deg,rgba(21,11,35,.55),transparent 32%,rgba(21,11,35,.45));
}
.savedate__frame{
  display:grid;place-items:center;text-align:center;
  margin:clamp(20px,3.4vw,44px);padding:clamp(40px,6vw,80px) var(--s5);
  border:1px solid var(--hair-gold);
}
.savedate__tradition{
  margin:0 0 var(--s5);font-size:var(--micro);font-weight:500;
  letter-spacing:.36em;text-indent:.36em;text-transform:uppercase;color:var(--gold-300);
}
.savedate h2{
  margin:0;font-family:var(--script);font-size:clamp(3.4rem,9vw,7rem);font-weight:400;
  line-height:1.1;color:var(--gold-100);text-shadow:0 4px 40px rgba(21,11,35,.7);
}
.savedate__date{
  margin:var(--s5) 0 0;font-family:var(--serif);font-size:clamp(2rem,5vw,3.6rem);
  font-weight:300;letter-spacing:.1em;text-transform:uppercase;
}
.savedate__event{
  display:inline-block;margin:var(--s6) 0 0;padding:var(--s3) clamp(20px,3vw,36px);
  border:1px solid var(--gold-500);
  font-size:var(--micro);font-weight:500;letter-spacing:.3em;text-indent:.3em;
  text-transform:uppercase;color:var(--gold-100);
}

/* ==========================================================================
   footer
   ========================================================================== */
.foot{
  position:relative;background:var(--ink);color:rgba(255,255,255,.74);
}
.foot::before{
  content:"";position:absolute;inset:0 0 auto;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-500) 28%,var(--gold-300) 50%,var(--gold-500) 72%,transparent);
}
.foot__in{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;gap:var(--s7) var(--s9);padding-block:var(--s9) var(--s8);
}
.foot__logo{
  display:block;width:238px;margin-bottom:var(--s5);
  padding:var(--s3) var(--s4);background:var(--white);
  box-shadow:0 0 0 1px rgba(228,193,112,.34),0 0 0 6px rgba(21,11,35,1),0 0 0 7px rgba(228,193,112,.14);
}
.foot__in p{margin:0;max-width:44ch;font-size:var(--small);line-height:1.7}
.social{text-align:right}
.social > p{
  margin:0 0 var(--s5);font-size:var(--eyebrow);font-weight:500;
  letter-spacing:.28em;text-transform:uppercase;color:var(--gold-300);
}
.social div{display:flex;gap:var(--s4);justify-content:flex-end}
.social a{
  display:grid;place-items:center;width:54px;height:54px;
  border:1px solid rgba(228,193,112,.4);border-radius:50%;color:var(--gold-100);
  text-decoration:none;
  transition:border-color 260ms var(--ease),background 260ms var(--ease),color 260ms var(--ease);
}
.social a svg{width:20px;height:20px;fill:currentColor}
.social a:hover,.social a:focus-visible{
  background:var(--gold-300);border-color:var(--gold-300);color:var(--plum-900);
}
.totop{
  grid-column:1/-1;display:flex;align-items:center;gap:var(--s4);
  padding-top:var(--s7);border-top:1px solid rgba(255,255,255,.12);
  font-size:var(--eyebrow);font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-300);text-decoration:none;
  transition:color 240ms var(--ease);
}
.totop::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.12)}
.totop svg{
  width:34px;height:34px;flex:none;padding:9px;
  border:1px solid rgba(228,193,112,.4);border-radius:50%;
  fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  transition:transform 300ms var(--ease),border-color 240ms var(--ease);
}
.totop:hover{color:var(--gold-100)}
.totop:hover svg{transform:translateY(-3px);border-color:var(--gold-300)}
.foot__legal{
  margin:0;max-width:none;padding:var(--s4) var(--s5);text-align:center;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:var(--micro);letter-spacing:.08em;color:rgba(255,255,255,.58);
}

/* ==========================================================================
   scroll reveals — CSS only, no JS, degrades to fully visible
   ========================================================================== */
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .hero__bg img,.savedate__bg img{
      height:118%;
      animation:drift both linear;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    .entry,.bio,.voice,.tier,.swatch,.masthead,.credits__grid > *{
      animation:rise both linear;
      animation-timeline:view();
      animation-range:entry 2% cover 20%;
    }
  }
}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes drift{from{transform:translateY(-14%)}to{transform:translateY(0)}}

/* ==========================================================================
   breakpoints
   ========================================================================== */
@media (max-width:1080px){
  .bio,.bio:nth-of-type(even){grid-template-columns:minmax(0,240px) minmax(0,1fr)}
  .bio:nth-of-type(even) .bio__fig{grid-column:1}
  .bio:nth-of-type(even) .bio__body{grid-column:2}
  .credits__grid{grid-template-columns:1fr;gap:var(--s8)}
  .credits__grid > .divider{height:1px;width:100%}
}

@media (max-width:860px){
  :root{--bar:130px}
  .bar__in{flex-direction:column;gap:0;padding-block:var(--s3) 0}
  .bar__logo img{width:186px}
  .nav{width:100%;justify-content:center;gap:var(--s5)}
  .nav a{padding:var(--s4) 0;font-size:.6875rem;letter-spacing:.16em}
  .nav a::after{bottom:10px}
  .triptych{grid-template-columns:1fr}
  .entry{--num:48px;--face:70px}
  .panelists{gap:var(--s4) var(--s3)}
}

@media (max-width:680px){
  :root{--bar:120px}
  .shell,.shell--mid,.shell--col{width:min(100% - 32px,var(--wide))}
  .hero{min-height:auto}
  .hero__frame{margin:14px;padding:var(--s9) var(--s4)}
  .hero__name{font-size:clamp(2.9rem,14vw,4.6rem)}
  .hero__theme{font-size:clamp(1.3rem,6.4vw,1.8rem);max-width:16ch}
  .facts{gap:var(--s5);flex-direction:column;align-items:center}
  .fact{width:min(280px,100%)}
  .nav{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--hair)}
  .bar__logo img{width:152px}
  .nav a{
    padding:var(--s2) 3px;font-size:.6875rem;letter-spacing:.05em;
    text-align:center;line-height:1.25;display:flex;align-items:center;
    justify-content:center;min-height:48px;
  }
  .nav a::after{display:none}

  .agenda{padding-left:44px}
  .agenda::before{left:16px}
  .entry__no{left:-45px;width:30px;height:30px}
  .entry__no span{font-size:.95rem}
  .panel{margin-inline:-44px 0;padding:var(--s7) var(--s5)}
  .panel .entry__role{margin-bottom:var(--s6)}
  .panelists{grid-template-columns:1fr;gap:var(--s7)}
  .panelist img{width:150px}

  .roster{gap:var(--s7) var(--s5)}
  .voice{flex:0 1 132px}

  .bio,.bio:nth-of-type(even){grid-template-columns:1fr;gap:var(--s6)}
  .bio:nth-of-type(even) .bio__fig,.bio__fig{grid-column:1;grid-row:1}
  .bio:nth-of-type(even) .bio__body,.bio__body{grid-column:1;grid-row:2}
  .bio__fig{width:min(260px,72%)}
  .bio__fig img{aspect-ratio:4/5}
  .bio__fig::after{transform:translate(10px,10px)}

  .committee{columns:1}
  .foot__in{flex-direction:column;align-items:flex-start;gap:var(--s7)}
  .social{text-align:left}
  .social div{justify-content:flex-start}
  .savedate{min-height:auto}
  .savedate__frame{margin:14px;padding:var(--s9) var(--s4)}
}

@media (max-width:400px){
  .roster{gap:var(--s6) var(--s4)}
  .voice{flex:0 1 118px;min-width:118px}
  .marks{gap:var(--s6) var(--s5)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
}

@media print{
  .bar,.skip-link,.foot,.cta{display:none}
  body{background:#fff;color:#000;font-size:10.5pt}
  .chapter{padding-block:16pt}
  .hero,.voices,.savedate,.swatch--purple,.panel,.mark--plate{
    background:#fff!important;color:#000!important;
  }
  .hero__bg,.savedate__bg{display:none}
  .hero__name span,.hero__theme,.savedate h2,.savedate__tradition,.hero__ordinal,
  .voice h3,.voice p,.panelist h3,.panelist p,.swatch--purple h3,.panel .entry__role{color:#000!important}
  .hero__frame,.savedate__frame,.panel::before{border-color:#999!important}
  .hero__welcome{background:none!important;border-block:1pt solid #000}
  .entry,.bio,.tier,.panel{break-inside:avoid}
  a{text-decoration:none;color:#000}
}

@media (max-width:860px){
  .headline-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .headline-row{grid-template-columns:1fr;gap:var(--s7);padding-bottom:var(--s8);margin-bottom:var(--s8)}
  .headline-row .mark{height:120px}
}

@media (max-width:680px){
  .marks{gap:var(--s3)}
  .mark{width:calc(50% - var(--s3) / 2);height:104px;padding:var(--s3)}
  .mark img{max-height:48px}
  .mark--wide img{max-height:38px}
  .mark--emblem img{max-height:64px}
  .mark--pair img{max-height:30px}
  .mark--type{font-size:1.05rem}
  .headline-row .mark{height:130px}
  .swatch{min-height:0;padding-block:var(--s9)}
}

@media (max-width:860px){
  .committee{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:680px){
  .entry{--num:30px;--face:56px;gap:0 var(--s3);padding-block:var(--s5)}
  .panel .entry__body{grid-column:2/-1}
  .panel__inner{margin-inline:calc(var(--face) * -1 - var(--s3))}
  .entry__no{font-size:1.6rem;padding-top:3px}
  .entry h3{font-size:1.2rem}
  .panel__inner{padding:var(--s5) var(--s4)}
  .panelists{grid-template-columns:1fr;gap:var(--s5)}
  .panelist img{width:104px}
  .committee{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s4);margin-bottom:var(--s8)}
  .committee li{font-size:1.05rem}
  .design-credit{padding-top:var(--s7)}
  .foot__in{grid-template-columns:1fr;gap:var(--s7);padding-block:var(--s8) var(--s7)}
  .social{text-align:left}
  .social div{justify-content:flex-start}
  .totop{padding-top:var(--s6)}
}

/* per-portrait crop tuning */
.p-ashley{object-position:38% 18%}.p-angela{object-position:60% 15%}
.p-julia{object-position:center 16%}.p-takeata{object-position:52% 10%}
.p-gabrielle{object-position:center 20%}.p-wendy{object-position:46% 7%}
.p-cassondra{object-position:center 18%}.p-erica{object-position:center 16%}
.p-reisha{object-position:center 18%}.p-adrienne{object-position:center 20%}
.p-charlee{object-position:54% 16%}
.b-angela{object-position:58% 16%}.b-wendy{object-position:46% 10%}
.b-cassondra{object-position:center 14%}.b-erica{object-position:center 18%}