/* ============================================================
   HigherEd Collective — built on the BYQ "Reforma" design system
   Tokens transcribed from Reforma DESIGN.md
   ============================================================ */
:root{
  /* Colours */
  --antique-linen:#f7f6f5;
  --lifted-white:#ffffff;
  --pale-stone:#e5e3e1;
  --morning-sky:#d6e0ea;
  --pale-sage:#dee6e1;
  --candlelit-cream:#f6efe4;
  --deep-burgundy:#241018;
  --accent:#ef2938;            /* HigherEd Collective brand red (from logo) */
  --ink-64:rgba(36,16,24,.64);
  --ink-42:rgba(36,16,24,.42);
  --ink-12:rgba(36,16,24,.12);
  --linen-64:rgba(247,246,245,.64);
  --linen-14:rgba(247,246,245,.14);

  /* Type */
  --serif:"Sentient","Sentient Variable",Georgia,serif;
  --sans:"Inter","Google Sans Flex Variable",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --mono:"Fragment Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  /* Radius */
  --r-card:20px; --r-btn:32px; --r-tag:8px; --r-med:12px;

  /* Motion */
  --enter:600ms cubic-bezier(.16,1,.3,1);
  --inter:300ms cubic-bezier(.2,0,0,1);

  --maxw:1800px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--antique-linen);color:var(--deep-burgundy);
  font-family:var(--sans);font-size:16px;line-height:1.5;font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 32px}
.section{padding:120px 0}
.section--lg{padding:160px 0}
.section--sm{padding:80px 0}
.section--linen{background:var(--antique-linen)}
.section--sky{background:var(--morning-sky)}
.section--sage{background:var(--pale-sage)}
.section--cream{background:var(--candlelit-cream)}
.section--dark{background:var(--deep-burgundy);color:var(--antique-linen)}
.measure{max-width:49.75rem}
.measure-sm{max-width:42.5rem}

/* ---------- Type ---------- */
h1,h2,h3,h4,h5{font-family:var(--serif);font-weight:300;margin:0}
h1{font-size:clamp(2.75rem,6vw,4rem);line-height:1.06;letter-spacing:-.187rem}
h2{font-size:clamp(2.25rem,4.4vw,3.25rem);line-height:1.04;letter-spacing:-.156rem}
h3{font-size:clamp(1.75rem,2.6vw,2.5rem);line-height:1.1;letter-spacing:-.125rem}
h4{font-size:1.75rem;line-height:1.14;letter-spacing:-.02rem}
h5{font-size:1.5rem;line-height:1.17}
em{font-style:italic}
p{margin:0}
.lead{font-size:20px;line-height:1.4;color:var(--ink-64)}
.section--dark .lead{color:var(--linen-64)}
.body{font-size:16px;line-height:1.5;color:var(--ink-64)}
.section--dark .body{color:var(--linen-64)}
.small{font-size:14px;line-height:1.43;letter-spacing:.016rem;color:var(--ink-64)}

/* Section label: dot + uppercase mono */
.label{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);
  font-size:12px;line-height:1;letter-spacing:.047rem;text-transform:uppercase;
  color:var(--ink-64);font-weight:500}
.section--dark .label{color:var(--linen-64)}
.label::before{content:"";width:6px;height:6px;background:var(--accent);border-radius:2px;flex:none}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:var(--r-btn);
  font-size:16px;font-weight:500;font-family:var(--sans);border:1px solid transparent;
  transition:background var(--inter),color var(--inter),border-color var(--inter);cursor:pointer}
.btn svg{transition:transform var(--inter)}
.btn:hover svg{transform:translateX(4px)}
.btn--primary{background:var(--deep-burgundy);color:var(--antique-linen)}
.btn--primary:hover{background:#3a1c27}
.btn--secondary{background:transparent;color:var(--deep-burgundy);border-color:var(--ink-12)}
.btn--secondary:hover{background:var(--morning-sky);border-color:transparent}
.section--dark .btn--primary{background:var(--antique-linen);color:var(--deep-burgundy)}
.section--dark .btn--primary:hover{background:#fff}
.section--dark .btn--secondary{color:var(--antique-linen);border-color:var(--linen-14)}
.section--dark .btn--secondary:hover{background:rgba(247,246,245,.08)}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:16px;color:var(--deep-burgundy)}
.link svg{transition:transform var(--inter)}
.link:hover svg{transform:translateX(4px)}
.section--dark .link{color:var(--antique-linen)}

/* ---------- Nav ---------- */
.nav{position:fixed;top:16px;left:0;right:0;z-index:50;padding:0 32px}
.nav__inner{max-width:var(--maxw);margin:0 auto;background:var(--lifted-white);
  border-radius:var(--r-card);box-shadow:0 4px 80px rgba(35,31,35,.08);
  display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 20px}
.nav__logo{display:flex;align-items:center;gap:10px}
.nav__logo img{height:34px;width:auto}
.nav__links{display:flex;align-items:center;gap:32px;margin-left:auto;margin-right:12px}
.nav__links a{font-size:14px;letter-spacing:.016rem;color:var(--ink-64);transition:color var(--inter)}
.nav__links a:hover,.nav__links a[aria-current="page"]{color:var(--deep-burgundy)}
.nav__cta{display:flex;align-items:center;gap:10px}
.nav__cta .btn{padding:11px 20px;font-size:14px}

/* ---------- Hero ---------- */
.hero{padding:180px 0 120px}
.hero__eyebrow{margin-bottom:28px}
.hero__title{max-width:20ch;margin-bottom:28px}
.hero__copy{max-width:38rem;margin-bottom:36px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
.hero__cred{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;color:var(--ink-64)}
.hero{padding:150px 0 100px}
.hero__grid{display:grid;grid-template-columns:1fr 1fr;column-gap:65px;row-gap:16px;align-items:center}
.hero__grid>*{min-width:0}
.hero__text{padding:48px 0}
.hero__stats{margin-top:40px}

/* Hero photo strips: two columns looping vertically in opposite directions */
.hero__reel{position:relative;display:flex;justify-content:space-between;align-items:flex-start;
  width:100%;max-width:600px;height:740px;margin-left:auto;overflow:hidden}
.hero__reel::before,.hero__reel::after{content:"";position:absolute;left:0;right:0;height:220px;
  z-index:2;pointer-events:none}
.hero__reel::before{top:-1px;background:linear-gradient(var(--antique-linen),rgba(247,246,245,.5) 43%,rgba(247,246,245,0))}
.hero__reel::after{bottom:-1px;background:linear-gradient(0deg,var(--antique-linen),rgba(247,246,245,.5) 48%,rgba(247,246,245,0))}
.hero__col{width:48%;display:flex;flex-direction:column;will-change:transform;
  animation:reelDown 60s linear infinite}
.hero__col--up{animation-name:reelUp}
.hero__set{display:flex;flex-direction:column;gap:20px;padding-bottom:20px}
.hero__shot{height:360px;border-radius:var(--r-med);overflow:hidden;background:var(--pale-stone)}
.hero__shot img{width:100%;height:100%;object-fit:cover}
@keyframes reelDown{from{transform:translateY(-50%)}to{transform:translateY(0)}}
@keyframes reelUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.hero__stats .stat{padding:28px 16px 0 0}
.hero__stats .stat__n{font-size:clamp(2.5rem,4vw,3.5rem);letter-spacing:-.125rem}

/* ---------- Generic heads ---------- */
.head{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:64px}
.head__label{margin-bottom:4px}

/* ---------- Cards ---------- */
.cards{display:grid;gap:16px}
.cards--3{grid-template-columns:repeat(3,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
.cards--2{grid-template-columns:repeat(2,1fr)}
/* grid children must be allowed to shrink below their content width */
.cards>*,.eco>*,.rules>*,.stats>*,.split>*,.uni>*,.footer__top>*{min-width:0}
.card{background:var(--lifted-white);border-radius:var(--r-card);padding:32px;
  transition:transform var(--inter)}
.card:hover{transform:translateY(-4px)}
.card__n{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;color:var(--ink-42);
  text-transform:uppercase;margin-bottom:20px}
.card h4{margin-bottom:12px}
.section--dark .card{background:rgba(247,246,245,.06)}
.section--sky .card,.section--sage .card,.section--cream .card{background:var(--lifted-white)}

/* Rules list (no pitching etc.) */
.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
.rule{padding:32px 0;border-top:1px solid var(--linen-14)}
.rule h4{margin-bottom:8px}
.rules--light .rule{border-top-color:var(--ink-12)}

/* ---------- Split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split__media{border-radius:var(--r-card);overflow:hidden;height:34rem}
.split__media img{width:100%;height:100%;object-fit:cover}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:64px}
.stats--3{grid-template-columns:repeat(3,1fr)}
.stat{padding:40px 24px;border-top:1px solid var(--ink-12)}
.stat__n{font-family:var(--serif);font-weight:300;font-size:clamp(3rem,6vw,4.5rem);
  line-height:1;letter-spacing:-.187rem;display:block;margin-bottom:12px}
.stat__l{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;color:var(--ink-64)}
.section--dark .stat{border-top-color:var(--linen-14)}
.section--dark .stat__l{color:var(--linen-64)}

/* ---------- Journey: pinned horizontal scroll ---------- */
.journey{padding-top:160px}
.journey__pin{position:relative;margin-top:24px}
.journey__sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;padding-top:72px}
.journey__sticky>.wrap{width:100%}
.journey__meta{display:flex;align-items:center;gap:24px;margin-bottom:40px}
.journey__bar{position:relative;flex:1;height:1px;background:var(--ink-12)}
.journey__fill{position:absolute;left:0;top:-1px;height:3px;width:100%;background:var(--accent);
  transform:scaleX(0);transform-origin:left center;border-radius:2px}
.journey__count{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;color:var(--ink-64);min-width:64px;text-align:right}
.journey__track{display:flex;gap:24px;will-change:transform}
.journey__track>*{min-width:0}
.ed{flex:none;width:clamp(320px,30vw,460px)}
.ed__media{height:min(50vh,520px);border-radius:var(--r-card);overflow:hidden;margin-bottom:20px;background:var(--pale-stone)}
.ed__media img{width:100%;height:100%;object-fit:cover;transition:transform 600ms cubic-bezier(.16,1,.3,1)}
.ed:hover .ed__media img{transform:scale(1.03)}
.ed__n{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;color:var(--ink-42);
  text-transform:uppercase;margin-bottom:10px}
.ed h4{font-size:1.5rem;margin-bottom:8px}
.ed .body{max-width:24rem}

/* ---------- Ecosystem ---------- */
.eco{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.eco__item{background:var(--lifted-white);border-radius:var(--r-card);padding:28px;
  display:flex;flex-direction:column;gap:12px;transition:transform var(--inter)}
.eco__item:hover{transform:translateY(-4px)}
.eco__item h4{font-size:1.375rem}
.eco--4{grid-template-columns:repeat(4,1fr)}
.eco__item .status{margin-top:auto}
.status{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;padding:7px 10px;
  border-radius:var(--r-tag);background:var(--antique-linen);font-family:var(--mono);font-size:11px;
  line-height:1;letter-spacing:.047rem;text-transform:uppercase;color:var(--deep-burgundy)}
.status::before{content:"";width:6px;height:6px;border-radius:99px;background:var(--accent);flex:none}
.status--soon{color:var(--ink-42)}
.status--soon::before{background:var(--ink-42)}

/* ---------- Testimonial ---------- */
.testi{padding:160px 0}
.testi__inner{max-width:42.5rem;margin:0 auto;display:flex;flex-direction:column;align-items:center;
  gap:32px;text-align:center}
.testi__stars{display:flex;gap:4px;color:var(--accent)}
.testi__stars svg{width:20px;height:20px;flex:none}
.testi__quote{margin:0;font-family:var(--serif);font-weight:300;font-size:2.5rem;line-height:2.75rem;
  letter-spacing:-.125rem;color:var(--deep-burgundy)}
.testi__author{display:flex;align-items:center;gap:16px;text-align:left}
.testi__avatar{flex:none;width:64px;height:64px;border-radius:var(--r-med);overflow:hidden;
  background:var(--lifted-white);display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:18px;letter-spacing:-.02rem}
.testi__avatar img{width:100%;height:100%;object-fit:cover}
.testi__who{display:flex;flex-direction:column;gap:2px;max-width:30rem;font-size:16px;line-height:1.5rem}
.testi__name{font-weight:500}
.testi__role{color:var(--ink-64)}

.rules--3{grid-template-columns:repeat(3,1fr);column-gap:32px}

/* ---------- Unimarketer ---------- */
.uni{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.uni__cover{border-radius:var(--r-card);overflow:hidden;height:38rem}
.uni__cover img{width:100%;height:100%;object-fit:cover}
.uni__issue{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;
  color:var(--ink-64);margin-bottom:20px}
.topics{list-style:none;margin:32px 0;padding:0;border-top:1px solid var(--ink-12)}
.topics li{padding:14px 0;border-bottom:1px solid var(--ink-12);font-size:16px}
.uni__stat{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;
  color:var(--ink-64);margin-top:24px}

/* ---------- Summit ---------- */
.summit{position:relative;border-radius:var(--r-card);overflow:hidden;padding:120px 64px;isolation:isolate}
.summit img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center;z-index:-2}
.summit::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(36,16,24,.88) 0%,rgba(36,16,24,.6) 45%,rgba(36,16,24,.1) 100%)}
.summit *{color:var(--antique-linen)}
.summit .btn--primary{background:var(--antique-linen);color:var(--deep-burgundy)}
.summit .btn--primary:hover{background:#fff}
.summit .btn--primary *{color:inherit}
.summit__meta{display:flex;flex-wrap:wrap;gap:48px;margin:36px 0}
.summit__meta div{display:flex;flex-direction:column;gap:6px}
.summit__meta dt{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;color:var(--linen-64)}
.summit__meta dd{margin:0;font-size:20px;line-height:1.4}

/* ---------- Final CTA: rotating photo ring ---------- */
.cta{position:relative;padding-top:120px;overflow:clip}
.cta__content{position:relative;z-index:3;max-width:48rem;margin:0 auto 120px;display:flex;
  flex-direction:column;align-items:center;gap:32px;text-align:center}
.fan{--cw:340px;--ch:360px;--r:1520px;position:relative;height:540px;pointer-events:none}
.fan::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60%;z-index:2;
  background:linear-gradient(180deg,rgba(247,246,245,0),var(--antique-linen))}
.fan__ring{position:absolute;left:50%;top:calc(var(--ch) / 2 + var(--r));width:0;height:0;
  animation:fanSpin 240s linear infinite;animation-play-state:paused;will-change:transform}
.fan.is-live .fan__ring{animation-play-state:running}
.fan__card{position:absolute;left:0;top:0;width:var(--cw);height:var(--ch);margin:calc(var(--ch) / -2) 0 0 calc(var(--cw) / -2);
  border-radius:var(--r-card);overflow:hidden;background:var(--pale-stone);
  transform:rotate(calc(var(--i) * 15deg)) translateY(calc(var(--r) * -1))}
.fan__card img{width:100%;height:100%;object-fit:cover}
@keyframes fanSpin{to{transform:rotate(-360deg)}}

/* Blur-in entrance for the CTA heading */
.reveal.reveal--blur{transform:none;filter:blur(20px);
  transition:opacity 1000ms cubic-bezier(.16,1,.3,1),filter 1000ms cubic-bezier(.16,1,.3,1)}
.reveal--blur.is-in{filter:blur(0)}

/* ---------- Footer ---------- */
.footer{padding:80px 0 40px;border-top:1px solid var(--ink-12)}
.footer__top{display:grid;grid-template-columns:1.4fr 1fr;gap:64px;margin-bottom:64px}
.footer__logo img{height:44px;width:auto;margin-bottom:20px}
.footer__nav{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.footer__nav a{font-size:14px;color:var(--ink-64);transition:color var(--inter)}
.footer__nav a:hover{color:var(--deep-burgundy)}
.footer__bottom{display:flex;justify-content:space-between;gap:24px;padding-top:32px;
  border-top:1px solid var(--ink-12);font-size:14px;color:var(--ink-64)}

/* ---------- Entrance animation ---------- */
.reveal{opacity:0;transform:translate3d(0,50px,0);
  transition:opacity var(--enter),transform var(--enter)}
.reveal.is-in{opacity:1;transform:translate3d(0,0,0)}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  .card:hover,.eco__item:hover{transform:none}
  .hero__col,.fan__ring{animation:none}
  .drawer__panel,.drawer__scrim{transition:none}
  .journey__pin{height:auto!important}
  .journey__sticky{position:static;height:auto;overflow:visible;display:block}
  .journey__meta{display:none}
  .journey__track{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px 16px;transform:none!important}
  .ed{width:auto}
  .reveal.reveal--blur{filter:none}
}

/* ---------- Responsive ---------- */
@media (max-width:1200px){
  .eco,.eco--4{grid-template-columns:repeat(2,1fr)}
  .cards--4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:991px){
  .section{padding:80px 0}.section--lg{padding:100px 0}.section--sm{padding:64px 0}
  .split,.uni,.footer__top{grid-template-columns:1fr;gap:40px}
  .cards--3{grid-template-columns:1fr}
  .hero{padding:140px 0 80px}
  .hero__grid{grid-template-columns:1fr;row-gap:64px}
  .hero__text{padding:0;text-align:center;display:flex;flex-direction:column;align-items:center}
  .hero__title,.hero__copy{margin-left:auto;margin-right:auto}
  .hero__actions{justify-content:center}
  .hero__stats{width:100%;max-width:38rem}
  .hero__reel{height:600px;margin:0 auto}
  .hero__reel::before,.hero__reel::after{height:140px}
  .hero__shot{height:320px}
  .split__media,.uni__cover{height:24rem}
  .summit{padding:80px 32px}
  .summit::after{background:linear-gradient(180deg,rgba(36,16,24,.7),rgba(36,16,24,.85))}
}
@media (max-width:767px){
  .wrap{padding:0 16px}
  .nav{padding:0 16px}
  h1{letter-spacing:-.156rem}
  .cards--2,.cards--4,.rules,.rules--3,.stats,.stats--3,.eco,.eco--4,.footer__nav{grid-template-columns:1fr}
  .nav__inner{gap:12px;padding:12px 14px}
  .nav__logo img{height:28px}
  .nav__cta .btn{padding:10px 16px}
  .nav__links{gap:20px}
  .nav__cta{display:none} /* on phones the Join link stands in for the button */
  .card{padding:24px}
  .summit__meta{gap:24px}
  .footer__bottom{flex-direction:column;gap:12px}
  .hero__stats.stats--3{grid-template-columns:repeat(3,1fr)}
  .hero__stats .stat{padding:20px 8px 0 0}
  .hero__stats .stat__n{font-size:2.25rem;letter-spacing:-.08rem}
  .hero__stats .stat__l{font-size:11px}
}
@media (max-width:991px){
  .fan{height:440px}
  .journey{padding:100px 0 80px}
  .journey__pin{height:auto!important;margin-top:56px}
  .journey__sticky{position:static;height:auto;overflow:visible;display:block;padding-top:0}
  .journey__meta{display:none}
  .journey__track{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 16px;transform:none!important}
  .ed{width:auto}
  .ed__media{height:auto;aspect-ratio:4/3}
}
@media (max-width:767px){
  .journey__track{grid-template-columns:1fr;gap:40px}
}
@media (max-width:767px){
  .cta{padding-top:96px}
  .cta__content{gap:24px;margin-bottom:80px}
  .fan{--cw:180px;--ch:190px;--r:805px;height:300px}
  .testi{padding:96px 0}
  .testi__inner{gap:24px}
  .testi__quote{font-size:2rem;line-height:2rem;letter-spacing:-.094rem}
  .testi__author{gap:12px}
  .testi__who{font-size:14px;line-height:1.25rem}
  .testi__avatar{width:48px;height:48px}
  .testi__author{align-items:flex-start}
}
@media (max-width:479px){
  .jform__row{grid-template-columns:1fr}
  .hero__col{width:100%}
  .hero__col--up{display:none}
  .hero__set{gap:8px;padding-bottom:8px}
  .hero__shot{height:260px}
}

/* ============================================================
   Join the Community page
   ============================================================ */
.jhero__media{height:min(40rem,calc(100vh - 200px));min-height:28rem;border-radius:var(--r-card);overflow:hidden}
.jhero__media img{width:100%;height:100%;object-fit:cover}

/* Who should join: fit / not-a-fit cards */
.fit{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.fit>*{min-width:0}
.fit__card{background:var(--lifted-white);border-radius:var(--r-card);padding:40px}
.fit__card h4{margin-bottom:28px}
.fit__card--muted{background:rgba(255,255,255,.5)}
.ticks{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink-12)}
.ticks li{display:flex;gap:14px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--ink-12);font-size:18px;line-height:1.4}
.ticks svg{flex:none;width:22px;height:22px;margin-top:1px}
.ticks--yes svg{color:var(--accent)}
.ticks--no li{color:var(--ink-64)}
.ticks--no svg{color:var(--ink-42)}

/* What you get (dark section) */
.perks{display:grid;grid-template-columns:repeat(2,1fr);column-gap:48px}
.perks>*{min-width:0}
.perk{display:flex;gap:24px;align-items:baseline;padding:28px 0;border-top:1px solid var(--linen-14)}
.perk__n{flex:none;font-family:var(--mono);font-size:12px;letter-spacing:.047rem;color:var(--linen-64);width:24px}
.perk p{font-family:var(--serif);font-weight:300;font-size:1.5rem;line-height:1.25;letter-spacing:-.03rem}
.soon{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.soon>*{min-width:0}
.soon__item{background:rgba(247,246,245,.06);border-radius:var(--r-card);padding:28px;display:flex;flex-direction:column;gap:20px}
.soon__item p{font-size:18px;line-height:1.4}
.section--dark .status--soon{background:rgba(247,246,245,.1);color:var(--linen-64)}
.section--dark .status--soon::before{background:var(--linen-64)}

/* Form fields (shared by the join drawer) */
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field label,.field__label{font-size:14px;font-weight:500;letter-spacing:.016rem}
.field .req{color:var(--accent);margin-left:2px}
.field input,.field select,.phone__num{font:inherit;font-size:16px;color:var(--deep-burgundy);height:52px;padding:0 16px;
  background:var(--lifted-white);border:1px solid var(--ink-12);border-radius:var(--r-med);
  transition:border-color var(--inter),box-shadow var(--inter);width:100%}
.field input::placeholder{color:var(--ink-42)}
.field input:hover,.field select:hover,.phone__num:hover{border-color:var(--ink-42)}
.field input:focus,.field select:focus,.phone__num:focus-within{outline:none;border-color:var(--deep-burgundy);box-shadow:0 0 0 3px rgba(36,16,24,.08)}
.field select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5l3 3 3-3' stroke='%23241018' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.field__help{font-size:13px;line-height:1.4;color:var(--ink-64)}
.field__error{font-size:13px;line-height:1.4;color:#c21f2c}
.field[data-state="error"] input,.field[data-state="error"] select,.field[data-state="error"] .phone__num{border-color:#c21f2c}
.field[data-state="error"] .phone__num input{border:0}

/* Phone: country code select + number box */
.phone{display:grid;grid-template-columns:minmax(0,170px) minmax(0,1fr);gap:8px}
.phone__num{display:flex;align-items:center;gap:10px;padding:0 0 0 16px;cursor:text}
.phone__code{flex:none;font-family:var(--mono);font-size:14px;color:var(--ink-64)}
.phone__num input{height:100%;border:0;padding:0 16px 0 0;background:transparent;box-shadow:none}
.phone__num input:focus{box-shadow:none}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--ink-64);cursor:pointer}
.check input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--deep-burgundy);cursor:pointer}
.form__note{font-family:var(--mono);font-size:12px;letter-spacing:.047rem;text-transform:uppercase;color:var(--ink-64)}

/* Sign-up call to action (opens the drawer) */
.apply-cta{max-width:44rem;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:24px}
.apply-cta .form__note{margin-top:4px}

/* ---------- Join drawer: slides in from the right, like the Summit registration ---------- */
.drawer{position:fixed;inset:0;z-index:120;visibility:hidden;pointer-events:none}
.drawer.is-active{visibility:visible}
.drawer.is-open{pointer-events:auto}
.drawer__scrim{position:absolute;inset:0;width:100%;border:0;padding:0;margin:0;cursor:pointer;
  background:rgba(36,16,24,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  opacity:0;transition:opacity 400ms cubic-bezier(.2,0,0,1)}
.drawer.is-open .drawer__scrim{opacity:1}
.drawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(580px,100%);background:var(--antique-linen);
  display:flex;flex-direction:column;box-shadow:-24px 0 80px rgba(36,16,24,.18);
  transform:translateX(100%);transition:transform 600ms cubic-bezier(.16,1,.3,1)}
.drawer.is-open .drawer__panel{transform:none}
.drawer__bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px 40px;border-bottom:1px solid var(--ink-12)}
.drawer__close{flex:none;width:44px;height:44px;border-radius:99px;border:1px solid var(--ink-12);background:transparent;
  color:var(--deep-burgundy);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--inter),border-color var(--inter)}
.drawer__close:hover{background:var(--morning-sky);border-color:transparent}
.drawer__close:focus-visible{outline:2px solid var(--deep-burgundy);outline-offset:2px}
.drawer__body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:36px 40px 48px}
.drawer__title{font-size:clamp(2rem,3.2vw,2.75rem);line-height:1.05;letter-spacing:-.1rem;margin-bottom:14px}
.drawer__intro{font-size:16px;line-height:1.5;color:var(--ink-64);margin-bottom:32px;max-width:30rem}
.jform{display:flex;flex-direction:column;gap:22px}
.jform__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.jform__group{display:flex;flex-direction:column;gap:22px;padding:24px 0;border-top:1px solid var(--ink-12);border-bottom:1px solid var(--ink-12)}
.jform__legal{display:flex;flex-direction:column;gap:12px}
.jform__legal .field__help{font-size:13px}
.jform__message{font-size:14px;line-height:1.45;color:#c21f2c;background:rgba(194,31,44,.06);border-radius:var(--r-med);padding:12px 14px}
.jform__actions{display:flex;flex-direction:column;align-items:stretch;gap:14px;margin-top:6px}
.jform__actions .btn{justify-content:center;border:0;padding:16px 26px}
.jform__actions .form__note{text-align:center}
.btn[aria-busy="true"]{opacity:.6;cursor:progress}
.drawer__success{display:none;padding-top:8px}
.drawer.is-sent .jform,.drawer.is-sent .drawer__intro,.drawer.is-sent .drawer__title{display:none}
.drawer.is-sent .drawer__success{display:block}
.drawer__success h3{margin:24px 0 16px}
.drawer__success .btn{margin-top:32px}
.form-success__icon{width:48px;height:48px;border-radius:var(--r-med);background:var(--pale-sage);display:flex;align-items:center;justify-content:center;color:var(--deep-burgundy)}
body.drawer-open{overflow:hidden}

@media (max-width:991px){
  .fit{grid-template-columns:1fr}
  .soon{grid-template-columns:1fr}
  .jhero__media{height:26rem;min-height:0}
}
@media (max-width:767px){
  .perks{grid-template-columns:1fr}
  .fit__card{padding:24px}
  .drawer__bar{padding:14px 20px}
  .drawer__body{padding:28px 20px 40px}
  .phone{grid-template-columns:minmax(0,128px) minmax(0,1fr)}
  .perk p{font-size:1.25rem}
  .ticks li{font-size:16px}
}