/* ==========================================================================
   MyCampusStartups, v3
   --------------------------------------------------------------------------
   One beige ground for every band (Luke's rule); cards are white objects on
   it; pine and pine-deep carry the dark bands, the hero wash and the footer.
   Type is the app's: Newsreader for display, Public Sans for everything else,
   IBM Plex Mono for numbers and labels. Every face ships from fonts/.

   Contrast pairs are pinned by test_contrast.py. Do not re-derive them.
   ========================================================================== */

@font-face{font-family:"Newsreader";src:url("fonts/newsreader.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url("fonts/newsreader-italic.woff2") format("woff2");font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:"Public Sans";src:url("fonts/public-sans.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/plex-mono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/plex-mono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  /* Ground and surfaces */
  --parchment:#F3ECDF;
  --cream:#F3ECDF;
  --white:#FFFFFF;
  --sand:#DFD2B9;
  --sand-deep:#C9B896;
  --sand-num:#AC915D;

  /* Ink */
  --ink:#26221C;
  --ink-soft:#4A4339;
  --ink-lede:#544C40;
  --muted:#6B6359;

  /* Brand */
  --pine:#134E37;
  --pine-bright:#1C6B47;
  --pine-deep:#0E3A29;
  --clay:#A55127;
  --clay-label:#A95328;
  --clay-deep:#B95A2B;
  --clay-bright:#EE8A55;
  --gold:#E3C36B;
  --brass:#7A6431;

  /* On dark ground */
  --on-pine:#F4EBDA;
  --on-pine-soft:#BFCCC2;

  /* Spacing, base 8 */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
  --band:clamp(72px,8.5vw,122px);
  --gutter:clamp(20px,4vw,44px);
  --maxw:1220px;
  --measure:64ch;

  /* Type */
  --f-display:"Newsreader",Georgia,"Times New Roman",serif;
  --f-body:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --dur:220ms;
  --ease:cubic-bezier(.4,0,.2,1);
  --radius:18px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--parchment);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;display:block}
h1,h2,h3,h4,p,figure,ul,ol,dl,dd,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
button{font:inherit}
table{border-collapse:collapse}
:focus-visible{outline:3px solid var(--pine-bright);outline-offset:3px}
.band-pine :focus-visible,.band-deep :focus-visible,.hero-photo :focus-visible,.hero-pine :focus-visible,.footer :focus-visible{outline-color:var(--gold)}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--f-display);font-weight:500;font-optical-sizing:auto;letter-spacing:-.025em;line-height:1.04;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(2.75rem,6.2vw,5.5rem);letter-spacing:-.03em;line-height:1}
h2{font-size:clamp(2rem,3.7vw,3.05rem);letter-spacing:-.025em}
h3{font-size:1.4rem;letter-spacing:-.012em;line-height:1.2}
.lede{font-size:clamp(1.08rem,1.35vw,1.28rem);line-height:1.5;color:var(--ink-lede);text-wrap:pretty}
.eyebrow{display:block;font:700 .78rem/1 var(--f-body);letter-spacing:.11em;text-transform:uppercase;color:var(--clay-label)}
.mono{font-family:var(--f-mono)}
.measure{max-width:var(--measure)}
p{text-wrap:pretty}
.small{font-size:.92rem}
.muted{color:var(--muted)}
.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:var(--s4);top:-60px;z-index:100;background:var(--pine);color:#fff;padding:.6em 1em;border-radius:999px;text-decoration:none;font-weight:600}
.skip:focus{top:var(--s3)}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{max-width:900px}
.band{padding-block:var(--band)}
.band-tight{padding-block:calc(var(--band) * .6)}
.band-rule{border-top:1px solid var(--sand)}
.band-pine{background:var(--pine);color:var(--on-pine)}
.band-deep{background:var(--pine-deep);color:var(--on-pine)}
.band-pine h2,.band-deep h2,.band-pine h3,.band-deep h3{color:#fff}
.band-pine .lede,.band-deep .lede{color:var(--on-pine)}
.band-pine .eyebrow,.band-deep .eyebrow{color:var(--gold)}
.head{max-width:66ch;margin-bottom:clamp(32px,4.5vw,56px)}
.head .eyebrow{margin-bottom:var(--s3)}
.head h2{margin-bottom:var(--s3)}
.head.center{margin-inline:auto;text-align:center}
.head.center .lede{margin-inline:auto}
.stack>*+*{margin-top:var(--s4)}
.mt5{margin-top:var(--s5)}.mt6{margin-top:var(--s6)}.mt7{margin-top:var(--s7)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:center}
.split.flip .split-text{order:2}
.split-text h2{margin-bottom:var(--s4)}
.split-text p{color:var(--ink-lede);max-width:52ch;font-size:1.06rem}
.split-text p+p{margin-top:var(--s3)}
.split-text .checks{margin-top:var(--s5)}
.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7)}
@media(max-width:900px){.split{grid-template-columns:1fr}.split.flip .split-text{order:0}}
@media(max-width:800px){.cols-2{grid-template-columns:1fr;gap:var(--s6)}}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(243,236,223,.86);-webkit-backdrop-filter:saturate(1.6) blur(10px);backdrop-filter:saturate(1.6) blur(10px);border-bottom:1px solid var(--sand)}
.nav-in{display:flex;align-items:center;gap:var(--s6);min-height:76px;position:relative}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:800;font-size:1.08rem;letter-spacing:-.01em;white-space:nowrap}
.brand img{width:40px;height:40px;flex:none}
.nav-links{display:flex;gap:var(--s5)}
.nav-links a{text-decoration:none;font-weight:500;font-size:.95rem;color:var(--ink-soft);padding:6px 0;border-bottom:2px solid transparent;transition:color var(--dur) var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a[aria-current="page"]{color:var(--ink);font-weight:700;border-bottom-color:var(--pine)}
.nav-cta{margin-left:auto;display:flex;gap:var(--s2);align-items:center}
.nav-cta .btn{padding:.62em 1.1em;font-size:.92rem}
.nav-toggle{display:none;border:1px solid var(--sand-deep);background:transparent;border-radius:999px;padding:.55em 1em;font-weight:600;font-size:.9rem;cursor:pointer;color:var(--ink)}
@media(max-width:940px){
  .nav-links{display:none}
  .nav.open .nav-links{display:flex;flex-direction:column;gap:var(--s2);position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--sand);padding:var(--s4) var(--gutter) var(--s5)}
  .nav.open .nav-links a{font-size:1.1rem;padding:var(--s3) 0;border-bottom:1px solid var(--sand)}
  .nav-toggle{display:inline-flex}
}
@media(max-width:600px){.brand span{display:none}.nav-in{gap:var(--s3)}.nav-cta .btn{padding:.6em .9em;font-size:.88rem}}
@media(max-width:380px){.nav-cta .btn-ghost{display:none}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.8em 1.35em;border-radius:999px;font-weight:600;font-size:.98rem;line-height:1.15;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--pine);color:#fff}
.btn-primary:hover{background:var(--pine-bright)}
.btn-ghost{border-color:var(--sand-deep);color:var(--ink);background:transparent}
.btn-ghost:hover{background:#fff;border-color:var(--ink-soft)}
.btn-cream{background:var(--on-pine);color:var(--pine)}
.btn-cream:hover{background:#fff}
.btn-light{border-color:rgba(244,235,218,.55);color:var(--on-pine);background:transparent}
.btn-light:hover{background:rgba(255,255,255,.1);border-color:var(--on-pine)}
.btn-lg{padding:.95em 1.65em;font-size:1.04rem}
.btn .arw{width:16px;height:16px}
.actions{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center}

/* ---------- hero ---------- */
.hero-photo{position:relative;isolation:isolate;min-height:min(90vh,860px);display:flex;align-items:flex-end;color:#fff;background:var(--pine-deep)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;z-index:-2;filter:brightness(.72) saturate(.9)}
.hero-photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,58,41,.28) 0%,rgba(14,58,41,.48) 45%,rgba(14,58,41,.84) 80%,rgba(14,58,41,.94) 100%)}
.hero-in{padding-block:clamp(64px,10vw,132px) clamp(40px,6vw,76px);width:100%}
.hero-type{max-width:54rem}
.hero-type .eyebrow{color:var(--gold);margin-bottom:var(--s4)}
.hero-type h1{color:#fff;margin-bottom:var(--s5)}
.hero-type h1:last-child{margin-bottom:0}
.hero-type .lede{color:var(--on-pine);max-width:34rem;margin-bottom:var(--s6)}
.hero-type .actions{margin-bottom:var(--s5)}
.hero-note{font-size:.95rem;color:var(--on-pine-soft);margin-top:var(--s5);max-width:60ch}
.hero-pine{background:var(--pine-deep);color:#fff;padding-block:clamp(72px,10vw,140px) clamp(56px,8vw,110px)}
.hero-pine .hero-type{max-width:58rem}
@media(max-width:600px){.hero-photo{min-height:0}.hero-in{padding-top:clamp(250px,68vw,360px)}}

/* ---------- the door ---------- */
.door{max-width:600px}
.door-row{display:flex;gap:6px;background:#fff;border:1px solid var(--sand);border-radius:999px;padding:6px 6px 6px 10px;box-shadow:0 14px 34px -22px rgba(14,58,41,.6);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.door-row:focus-within{border-color:var(--pine);box-shadow:0 0 0 4px rgba(28,107,71,.22)}
.door-row input{flex:1;min-width:0;border:0;background:transparent;padding:.72em 1em;font:inherit;font-size:1.02rem;color:var(--ink);outline:none;border-radius:999px}
.door-row input::placeholder{color:var(--muted)}
.door-help{font-size:.9rem;line-height:1.5;color:var(--muted);margin-top:var(--s3);max-width:52ch}
.door-dark .door-help{color:var(--on-pine-soft)}
.door-err{font-size:.92rem;font-weight:600;color:var(--clay-label);margin-top:var(--s2)}
.door-err:empty{display:none}
.door-dark .door-err{color:var(--gold)}
@media(max-width:560px){.door-row{flex-direction:column;border-radius:22px;padding:8px}.door-row .btn{width:100%}.door-row input{padding:.8em .9em}}

/* ---------- stats ---------- */
.stats-band{position:relative;z-index:2;margin-top:-52px;padding-bottom:0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--sand);border:1px solid var(--sand);border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 60px -40px rgba(14,58,41,.5)}
.stat{background:#fff;padding:var(--s6) var(--s5)}
.stat b{display:block;font:500 clamp(2.4rem,4vw,3.4rem)/1 var(--f-display);letter-spacing:-.03em;color:var(--pine);margin-bottom:var(--s2)}
.stat span{color:var(--ink-soft);font-size:.98rem;line-height:1.4;display:block;text-wrap:pretty}
.stats-3{grid-template-columns:repeat(3,1fr)}
.band-pine .stats,.band-deep .stats{background:rgba(244,235,218,.18);border-color:rgba(244,235,218,.18);box-shadow:none}
.band-pine .stat,.band-deep .stat{background:rgba(255,255,255,.05)}
.band-pine .stat b,.band-deep .stat b{color:var(--gold)}
.band-pine .stat span,.band-deep .stat span{color:var(--on-pine)}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.stats-3{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.stats,.stats-3{grid-template-columns:1fr 1fr}.stats-band{margin-top:-36px}}
@media(max-width:420px){.stats,.stats-3{grid-template-columns:1fr}}

/* ---------- steps ---------- */
.steps{display:grid;gap:clamp(48px,7vw,96px)}
.step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px);align-items:center}
.step:nth-child(even) .step-text{order:2}
.step-n{display:block;font:500 .88rem/1 var(--f-mono);color:var(--clay-label);letter-spacing:.1em;margin-bottom:var(--s3)}
.step h3{font-size:clamp(1.65rem,2.5vw,2.15rem);margin-bottom:var(--s3)}
.step p{color:var(--ink-lede);max-width:44ch;font-size:1.06rem}
.steps-plain{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5)}
.steps-plain .step-n{margin-bottom:var(--s3)}
.steps-plain h3{font-size:1.35rem;margin-bottom:var(--s2)}
.steps-plain p{color:var(--ink-lede);font-size:.98rem}
@media(max-width:900px){.step{grid-template-columns:1fr}.step:nth-child(even) .step-text{order:0}.steps-plain{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps-plain{grid-template-columns:1fr}}

/* ---------- frames ---------- */
.frame{border-radius:20px;padding:clamp(14px,2.4vw,30px);background:linear-gradient(135deg,#DCE6DD 0%,#EEF0E5 100%);overflow:hidden}
.frame-pine{background:linear-gradient(135deg,#134E37 0%,#2F6E52 100%)}
.frame-clay{background:linear-gradient(135deg,#EAD8C5 0%,#F3ECDF 100%)}
.frame-sand{background:linear-gradient(135deg,#E2D6BE 0%,#F1EADC 100%)}
.frame-sage{background:linear-gradient(135deg,#CFDDD1 0%,#E9EEE3 100%)}
.frame img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(38,34,28,.12);box-shadow:0 24px 60px -32px rgba(14,58,41,.55);background:#fff}
.frame-crop img{aspect-ratio:16/10;object-fit:cover;object-position:top left}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.cards-2{grid-template-columns:repeat(2,1fr)}
.card{background:#fff;border:1px solid var(--sand);border-radius:var(--radius);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s3)}
.card h3{margin:0}
.card p{color:var(--ink-lede);margin:0}
.card .chip{align-self:flex-start}
.card .more{margin-top:auto;padding-top:var(--s2)}
a.card{text-decoration:none;color:inherit;transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
a.card:hover{transform:translateY(-3px);border-color:var(--sand-deep);box-shadow:0 20px 40px -30px rgba(14,58,41,.45)}
.card-photo,.card-shot{padding:0;overflow:hidden;gap:0}
.card-photo img{width:100%;aspect-ratio:16/10;object-fit:cover}
.card-shot .shot{aspect-ratio:16/10;overflow:hidden;background:var(--cream);border-bottom:1px solid var(--sand)}
.card-shot .shot img{width:100%;height:100%;object-fit:cover;object-position:top left}
.card-body{padding:var(--s5) var(--s6) var(--s6);display:flex;flex-direction:column;gap:var(--s3);flex:1}
.more{font-weight:600;color:var(--pine);text-decoration:none;display:inline-flex;align-items:center;gap:.4em}
.more:hover{text-decoration:underline}
.band-deep .card,.band-pine .card{background:rgba(255,255,255,.06);border-color:rgba(244,235,218,.2)}
.band-deep .card p,.band-pine .card p{color:var(--on-pine-soft)}
.chip{display:inline-block;font:500 .74rem/1 var(--f-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--pine);background:var(--cream);border:1px solid var(--sand);border-radius:999px;padding:.45em .85em}
.band-deep .chip,.band-pine .chip{color:var(--gold);background:transparent;border-color:rgba(227,195,107,.5)}
@media(max-width:960px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.cards,.cards-2{grid-template-columns:1fr}}

/* ---------- checks ---------- */
.checks{display:grid;gap:var(--s3)}
.checks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:var(--s3);align-items:start;font-size:1.04rem;line-height:1.5;color:var(--ink-soft)}
.checks li::before{content:"";width:22px;height:22px;margin-top:3px;border-radius:50%;background:var(--pine) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.band-pine .checks li,.band-deep .checks li{color:var(--on-pine)}
.band-pine .checks li::before,.band-deep .checks li::before{background-color:var(--gold);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%230E3A29' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E")}
.checks-2{grid-template-columns:1fr 1fr;column-gap:var(--s6)}
@media(max-width:800px){.checks-2{grid-template-columns:1fr}}

/* ---------- table ---------- */
.tbl{width:100%;font-size:.98rem;background:#fff;border:1px solid var(--sand);border-radius:var(--radius);overflow:hidden}
.tbl caption{text-align:left;font-weight:600;padding:var(--s4) var(--s5);border-bottom:1px solid var(--sand);caption-side:top;background:#fff}
.tbl th{font:700 .72rem var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:var(--s3) var(--s5);border-bottom:1px solid var(--sand);background:#fff}
.tbl td{padding:var(--s3) var(--s5);border-bottom:1px solid var(--sand)}
.tbl tr:last-child td{border-bottom:0}
.tbl .num{font-family:var(--f-mono);text-align:right;white-space:nowrap}
.tbl-wrap{overflow-x:auto}

/* ---------- faq ---------- */
.faq{max-width:780px}
.faq details{border-top:1px solid var(--sand)}
.faq details:last-child{border-bottom:1px solid var(--sand)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s4) 0;font-weight:600;font-size:1.08rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--sand-deep);display:grid;place-items:center;font:500 1.2rem/1 var(--f-display);color:var(--pine);transition:transform var(--dur) var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 var(--s5);color:var(--ink-lede);max-width:64ch}

/* ---------- cta band ---------- */
.cta-band{background:var(--pine);color:var(--on-pine);text-align:center}
.cta-band h2{color:#fff;margin-bottom:var(--s3)}
.cta-band .lede{color:var(--on-pine);margin:0 auto var(--s6);max-width:50ch}
.cta-band .actions{justify-content:center}
.cta-band .door{margin:0 auto;text-align:left}

/* ---------- team ---------- */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.person{display:flex;gap:var(--s4);align-items:center;background:#fff;border:1px solid var(--sand);border-radius:var(--radius);padding:var(--s5)}
.person img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--sand)}
.person b{display:block;font-size:1.08rem}
.person span{display:block;color:var(--muted);font-size:.95rem}
.person a{color:var(--pine);font-size:.9rem;text-decoration:none;word-break:break-all}
.person a:hover{text-decoration:underline}
@media(max-width:900px){.team{grid-template-columns:1fr}}

/* ---------- login ---------- */
.login{min-height:calc(100vh - 76px - 300px);display:grid;place-items:center;padding-block:var(--band)}
.login-box{width:100%;max-width:540px;text-align:center}
.login-box img{width:64px;height:64px;margin:0 auto var(--s4)}
.login-box h1{font-size:clamp(2.4rem,5vw,3.6rem);margin-bottom:var(--s3)}
.login-box .lede{margin-bottom:var(--s6)}
.login-box .door{margin:0 auto;text-align:left}
.login-box .aside{margin-top:var(--s7);color:var(--muted);font-size:.95rem}
.login-box .aside a{color:var(--pine);font-weight:600}

/* ---------- footer ---------- */
.footer{background:var(--pine-deep);color:var(--on-pine-soft);padding-block:var(--s8) var(--s6)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:var(--s7)}
.foot-brand img{width:150px;height:auto}
.foot-brand p{margin-top:var(--s4);max-width:34ch;font-size:.95rem}
.footer .foot-h{color:#fff;font:700 .78rem var(--f-body);letter-spacing:.11em;text-transform:uppercase;margin-bottom:var(--s3)}
.footer ul{display:grid;gap:var(--s2)}
.footer li a{color:var(--on-pine);text-decoration:none}
.footer li a:hover{color:#fff;text-decoration:underline}
.foot-mark{margin-top:var(--s8);font:800 clamp(2.3rem,9.3vw,7.5rem)/.95 var(--f-body);letter-spacing:-.045em;color:var(--on-pine);white-space:nowrap;overflow:hidden;user-select:none}
.foot-legal{margin-top:var(--s5);font-size:.8rem;line-height:1.55;max-width:96ch;color:var(--on-pine-soft)}
@media(max-width:800px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>:first-child{grid-column:1/-1}}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity 420ms var(--ease),transform 420ms var(--ease)}
.rv.in,.no-js .rv{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ==========================================================================
   The founders opening (ported from v2)
   --------------------------------------------------------------------------
   One h1, split into two lines with a collapsing spacer between them. A small
   film panel sits in the spacer. When the film ends the panel grows to the
   full container, the two lines converge onto it, flat pine fades in over
   the footage and the headline goes ink to gold on the same curve. The end
   state is the resting state, so with JavaScript off or motion turned down
   the page simply starts there. The door sits beneath, with the lede.
   ========================================================================== */
.hero-rh{padding-block:clamp(28px,4vw,56px) clamp(40px,6vw,72px)}
.rh{position:relative;height:clamp(430px,46vw,620px);margin-block:0 clamp(28px,3.6vw,52px)}
.rh-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(560px,74%);height:clamp(150px,18vw,258px);border-radius:14px;overflow:hidden;background:var(--pine);transition:width .62s cubic-bezier(.62,0,.16,1),height .62s cubic-bezier(.62,0,.16,1),border-radius .62s cubic-bezier(.62,0,.16,1)}
.rh.go .rh-panel{width:100%;height:100%;border-radius:20px}
.rh-panel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s var(--ease)}
.rh-panel video.ready{opacity:1}
.rh-end{position:absolute;inset:0;background:var(--pine);opacity:0;transition:opacity .5s var(--ease)}
.rh.done .rh-end{opacity:1}
.rh-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-inline:var(--gutter);pointer-events:none}
.rh-h1{margin:0;color:var(--ink);font-size:clamp(2.6rem,6.4vw,5.4rem);line-height:.98;letter-spacing:-.033em;transition:color .5s var(--ease)}
.rh.done .rh-h1{color:var(--gold)}
.rh-h1 span{display:block}
.rh-gap{height:clamp(210px,25vw,362px);transition:height .62s cubic-bezier(.62,0,.16,1)}
.rh.go .rh-gap{height:0}
.rh-meta{display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,4vw,56px)}
.rh-meta .lede{margin:0;max-width:34rem;flex:1 1 320px}
.rh-meta .door{flex:0 1 560px;width:100%}
@media(prefers-reduced-motion:reduce){.rh-panel,.rh-h1,.rh-gap,.rh-panel video,.rh-end{transition:none}}
@media(max-width:900px){.rh-meta{flex-direction:column;align-items:stretch;gap:var(--s5)}.rh-meta .lede{flex:0 0 auto}.rh-meta .door{flex:0 0 auto;max-width:none}}
@media(max-width:760px){.rh{height:clamp(360px,92vw,480px)}.rh-panel{width:min(300px,84%);height:clamp(112px,22vw,150px)}.rh-gap{height:clamp(190px,34vw,250px)}.rh-h1{font-size:clamp(2.2rem,9.6vw,3rem)}}
.no-js .rh-panel,.rh-static .rh-panel{width:100%;height:100%;border-radius:20px}
.no-js .rh-gap,.rh-static .rh-gap{height:0}
.no-js .rh-h1,.rh-static .rh-h1{color:var(--gold)}
.no-js .rh-end,.rh-static .rh-end{opacity:1}

/* ==========================================================================
   The home opening: a textured field, one centered headline
   --------------------------------------------------------------------------
   The beige ground stays the ground. Soft gold and green highlights sit on it,
   blurred into a field that fades back into plain beige at the top and bottom,
   so the section has no edges and the page reads as one surface. A grain
   overlay keeps it from looking like a flat fill. Headline in ink. Motion
   turned down means a still field.
   ========================================================================== */
.hero-tex{position:relative;isolation:isolate;overflow:hidden;background:var(--parchment);color:var(--ink);text-align:center}
.hero-tex::before{content:"";position:absolute;inset:-30%;z-index:-2;
  background:
    radial-gradient(34% 40% at 24% 36%,rgba(227,195,107,.9) 0%,rgba(227,195,107,0) 70%),
    radial-gradient(38% 44% at 76% 30%,rgba(110,182,132,.74) 0%,rgba(110,182,132,0) 70%),
    radial-gradient(36% 40% at 62% 82%,rgba(28,107,71,.4) 0%,rgba(28,107,71,0) 70%),
    radial-gradient(28% 32% at 20% 84%,rgba(196,150,60,.42) 0%,rgba(196,150,60,0) 70%),
    radial-gradient(30% 34% at 50% 55%,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 70%);
  filter:blur(64px) saturate(1.1);
  transform:translate3d(-2%,-1%,0) scale(1.03);
  animation:tex-drift 28s ease-in-out infinite alternate}
.hero-tex::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(180deg,var(--parchment) 0%,rgba(243,236,223,0) 22%,rgba(243,236,223,0) 78%,var(--parchment) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .14 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:100% 100%,240px 240px;opacity:1}
@keyframes tex-drift{from{transform:translate3d(-2%,-1%,0) scale(1.03)}to{transform:translate3d(2%,1.5%,0) scale(1.1)}}
@media(prefers-reduced-motion:reduce){.hero-tex::before{animation:none}}
.hero-tex .wrap{padding-block:clamp(64px,9vw,120px) clamp(48px,6vw,80px);width:100%}
.hero-tex h1{color:var(--ink);font-size:clamp(3rem,8.2vw,7.4rem);line-height:.98;letter-spacing:-.035em;max-width:13ch;margin-inline:auto}
@media(max-width:600px){.hero-tex h1{font-size:clamp(2.6rem,12vw,3.6rem)}}


/* ---------- the floating cards under the headline ---------- */
.float-rail{position:relative;display:flex;justify-content:center;align-items:flex-start;gap:clamp(4px,1.6vw,28px);margin-top:clamp(40px,6vw,84px);padding-inline:var(--s2)}
.float-card{flex:0 0 auto;width:clamp(230px,23vw,318px);border-radius:16px;filter:drop-shadow(0 34px 44px rgba(14,58,41,.22)) drop-shadow(0 8px 14px rgba(38,34,28,.12));transition:transform .5s var(--ease),filter .5s var(--ease);will-change:transform}
.float-card img{display:block;width:100%;height:auto;border-radius:16px}
.fc-1{transform:rotate(-4deg) translateY(22px)}
.fc-2{transform:translateY(-6px) scale(1.04);z-index:2}
.fc-3{transform:rotate(3.5deg) translateY(30px)}
.float-card:hover{transform:translateY(-10px) rotate(0) scale(1.04);z-index:3;filter:drop-shadow(0 44px 54px rgba(14,58,41,.28)) drop-shadow(0 10px 16px rgba(38,34,28,.14))}
.float-card picture{display:block;animation:bob 8s ease-in-out infinite}
.fc-2 picture{animation-duration:9.5s;animation-delay:-3s}
.fc-3 picture{animation-duration:7.5s;animation-delay:-5s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.float-card picture{animation:none}}
.float-note{margin-top:clamp(40px,5vw,64px);font-size:.86rem;color:var(--muted)}
@media(max-width:640px){
  .float-rail{justify-content:flex-start;gap:var(--s4);overflow-x:auto;scroll-snap-type:x mandatory;padding:12px var(--gutter) 28px;margin-inline:calc(-1 * var(--gutter));scrollbar-width:none}
  .float-rail::-webkit-scrollbar{display:none}
  .float-card{width:min(78vw,300px);scroll-snap-align:center;transform:none}
  .fc-2{transform:none}
}