/* ============================================================
   TOKENS
   TODO: every value in this block is a placeholder. Replace with the real
   ShefMath variables from Figma (get_variable_defs on the design system node).
   Nothing outside this block hardcodes a color, radius, or font.
   ============================================================ */
:root{
  --orange:        #FF7A1A;   /* TODO: ShefMath primary orange */
  --orange-deep:   #C24E00;   /* TODO: press/shadow shade of primary */
  --orange-soft:   #FFE9D6;   /* TODO: tint for surfaces */

  --ink:           #1B1714;
  --ink-2:         #5C5148;
  --ink-3:         #8C8078;
  --paper:         #FFFFFF;
  --surface:       #FFF7F0;
  --line:          #EFE2D6;

  /* Four tracks. TODO: match to the app's field colors if it assigns them. */
  --alg:  #FF7A1A;
  --geo:  #2E86FF;
  --comb: #A855F7;
  --nt:   #00A870;

  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-pill: 999px;

  --display: 'Baloo 2', system-ui, sans-serif;
  --body: 'Inter', system-ui, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, monospace;

  --shift: 5px;              /* 3D button offset */
  --wrap: 1080px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);line-height:1.08;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,7vw,4.6rem);font-weight:800}
h2{font-size:clamp(2rem,4.4vw,3rem);font-weight:800}
h3{font-size:1.25rem;font-weight:700}
p{margin:0 0 1em}
.wrap{width:min(100% - 40px,var(--wrap));margin-inline:auto}
.band{padding:clamp(64px,9vw,120px) 0}
.band--soft{background:var(--surface)}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.eyebrow{
  font:600 .78rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 18px
}
.lede{font-size:1.18rem;color:var(--ink-2);max-width:56ch}

/* ---------- 3D pill button (ShefMath house style) ---------- */
.btn{
  display:inline-block;font:700 1.05rem/1 var(--display);
  padding:19px 34px 20px;border-radius:var(--r-pill);border:0;cursor:pointer;
  background:var(--orange);color:#fff;text-decoration:none;
  box-shadow:0 var(--shift) 0 var(--orange-deep);
  transition:transform .06s ease,box-shadow .06s ease;
}
.btn:active{transform:translateY(var(--shift));box-shadow:0 0 0 var(--orange-deep)}
.btn--ghost{
  background:var(--paper);color:var(--ink);box-shadow:0 var(--shift) 0 var(--line);
}
.btn--wide{width:100%;text-align:center}
:where(a,button,summary):focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* ---------- header ---------- */
.hdr{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)
}
.hdr__in{display:flex;align-items:center;gap:16px;height:70px}
.brand{font:800 1.3rem/1 var(--display);text-decoration:none;margin-right:auto}
.brand span{color:var(--orange)}
.hdr .btn{padding:13px 24px 14px;font-size:.95rem;--shift:4px}
.hdr__links{display:flex;gap:26px;font-size:.95rem;font-weight:500}
.hdr__links a{text-decoration:none;color:var(--ink-2)}
.hdr__links a:hover{color:var(--ink)}
@media(max-width:820px){.hdr__links{display:none}}

/* ---------- SIGNATURE: the goal-line meter ----------
   AMC 10 is out of 150. The line at 100 is the whole product. */
.meter{margin:38px 0 0}
.meter__scale{
  position:relative;height:26px;border-radius:var(--r-pill);
  background:var(--surface);border:1px solid var(--line);overflow:hidden
}
.meter__fill{display:flex;height:100%;width:0;transition:width 1.5s cubic-bezier(.2,.8,.2,1)}
.meter.is-on .meter__fill{width:calc(100% * 100 / 150)}
.meter__seg{height:100%}
.meter__seg--alg{flex:28;background:var(--alg)}
.meter__seg--geo{flex:26;background:var(--geo)}
.meter__seg--comb{flex:23;background:var(--comb)}
.meter__seg--nt{flex:23;background:var(--nt)}
.meter__goal{
  position:absolute;left:calc(100% * 100 / 150);top:-9px;bottom:-9px;width:3px;
  background:var(--ink);border-radius:2px
}
.meter__axis{
  display:flex;justify-content:space-between;margin-top:12px;
  font:500 .8rem/1 var(--mono);color:var(--ink-3)
}
.meter__label{
  position:absolute;left:calc(100% * 100 / 150);transform:translateX(-50%);
  top:26px;font:600 .8rem/1 var(--mono);color:var(--ink);white-space:nowrap
}
.meter__wrap{position:relative;padding-bottom:26px}

/* ---------- hero ---------- */
.hero{padding:clamp(56px,8vw,96px) 0 clamp(56px,8vw,88px)}
.hero h1 span{color:var(--orange)}
.hero__lede{font-size:1.22rem;color:var(--ink-2);max-width:50ch;margin-top:26px}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:38px}
.hero__price{font:600 1rem/1.5 var(--mono);color:var(--ink-2)}
.hero__price b{color:var(--ink);font-weight:600}

/* ---------- credential strip ---------- */
.creds{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:2px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden
}
.creds div{background:var(--paper);padding:24px 22px}
.creds b{display:block;font:700 1.6rem/1 var(--mono);color:var(--orange);margin-bottom:6px}
.creds small{font-size:.92rem;color:var(--ink-2);line-height:1.4;display:block}

/* ---------- generic grid ---------- */
.grid{display:grid;gap:22px}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:30px
}
.card p{color:var(--ink-2);font-size:.98rem;margin-bottom:0}
.card h3{margin-bottom:10px}

/* ---------- track cards ---------- */
.track{border-top:6px solid var(--tc)}
.track__tag{
  font:600 .74rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--tc);margin-bottom:12px;display:block
}
.track__bar{height:8px;border-radius:var(--r-pill);background:var(--surface);margin-top:22px;overflow:hidden}
.track__bar i{display:block;height:100%;background:var(--tc);width:var(--tw)}
.track--alg{--tc:var(--alg)} .track--geo{--tc:var(--geo)}
.track--comb{--tc:var(--comb)} .track--nt{--tc:var(--nt)}

/* ---------- included list ---------- */
.incl{list-style:none;padding:0;margin:0;display:grid;gap:2px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.incl li{background:var(--paper);padding:20px 24px;display:flex;gap:18px;align-items:baseline}
.incl b{font:600 .95rem/1.5 var(--mono);color:var(--orange);min-width:44px}
.incl span{font-size:1rem}
.incl em{color:var(--ink-3);font-style:normal;font-size:.92rem;display:block;margin-top:3px}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
@media(max-width:820px){.split{grid-template-columns:1fr}}
.shot{
  border-radius:var(--r-lg);border:1px solid var(--line);overflow:hidden;background:var(--surface)
}
.shot--ph{
  aspect-ratio:4/3;display:grid;place-items:center;text-align:center;padding:24px;
  font:500 .9rem/1.5 var(--mono);color:var(--ink-3)
}

/* ---------- testimonials ---------- */
.quotes{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px}
.quote p{font-size:1.02rem;color:var(--ink)}
.quote cite{
  display:block;margin-top:16px;
  font:600 .9rem/1.4 var(--mono);color:var(--ink-3);font-style:normal
}

/* ---------- schedule (loaded from schedule.json) ---------- */
.sched-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.sched-tab{
  font:600 .85rem/1 var(--mono);padding:10px 16px;border-radius:var(--r-pill);
  border:1px solid var(--line);background:var(--paper);color:var(--ink-2);cursor:pointer
}
.sched-tab:hover{border-color:var(--ink-3)}
.sched-tab.is-active{background:var(--ink);border-color:var(--ink);color:#fff}

.sched-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sched-head h3{font-size:1.5rem}
.sched-date{color:var(--ink-3);font-size:.9rem}
.sched-desc{color:var(--ink-2);max-width:64ch;margin-top:10px}

.sched-wed{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 20px;margin:22px 0
}
.sched-wed__tag{
  font:600 .7rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  background:var(--ink);color:#fff;border-radius:var(--r-pill);padding:5px 10px
}
.sched-wed b{font-family:var(--display);font-size:1rem}
.sched-wed .num{color:var(--ink-3);font-size:.85rem;margin-left:auto}





.sched-wed__test{
  display:inline-flex;
  align-items:center;
  font:600 .78rem/1 var(--mono);
  text-decoration:none;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--r-pill);
  padding:8px 14px;
  transition:border-color .12s ease;
}

.sched-wed__test:hover{
  border-color:var(--ink);
}






.sched-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:22px}
.sched-card{
  border:1px solid var(--line);border-left:5px solid var(--tc);border-radius:var(--r-md);
  padding:20px 22px;background:var(--paper)
}
.sched-card__track{
  font:600 .7rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--tc)
}
.sched-card h4{font-family:var(--display);font-size:1.05rem;margin:10px 0 8px}
.sched-card__when{font:500 .82rem/1 var(--mono);color:var(--ink-3);margin-bottom:10px}
.sched-card__desc{color:var(--ink-2);font-size:.92rem;margin-bottom:0}
.sched-error{color:var(--ink-2)}


.sched-card__pdf{
  display:inline-flex;align-items:center;gap:8px;
  font:600 .82rem/1 var(--mono);text-decoration:none;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:11px 18px;margin-top:16px;
  transition:border-color .12s ease,color .12s ease
}
.sched-card__pdf:hover{border-color:var(--tc);color:var(--tc)}

/* keep the buttons on one line across the four Week 0 cards */
.sched-card:has(.sched-card__pdf){display:flex;flex-direction:column}
.sched-card:has(.sched-card__pdf) .sched-card__desc{margin-bottom:16px}
.sched-card:has(.sched-card__pdf) .sched-card__pdf{margin-top:auto;align-self:flex-start}

/* ---------- pricing ---------- */
.pricing-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:28px;max-width:940px;margin-inline:auto;align-items:start
}
.price{
  background:var(--paper);border:2px solid var(--ink);border-radius:var(--r-lg);
  padding:clamp(28px,4vw,44px);max-width:520px;margin-inline:auto
}
.pricing-grid .price{max-width:none;margin-inline:0}
.price__badge{
  display:inline-block;background:var(--ink);color:#fff;border-radius:var(--r-pill);
  padding:8px 16px;font:600 .74rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase
}

/* ---------- early-bird countdown ---------- */
.countdown{margin:20px 0 26px;text-align:center}
.countdown__label{
  display:block;font:600 .78rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:10px
}
.countdown__nums{display:flex;justify-content:center;gap:10px}
.countdown__nums div{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:10px 12px;min-width:56px
}
.countdown__nums b{display:block;font:700 1.4rem/1 var(--mono);color:var(--orange)}
.countdown__nums small{
  display:block;font:500 .68rem/1 var(--mono);color:var(--ink-3);
  margin-top:4px;text-transform:uppercase;letter-spacing:.06em
}

.price__big{font:800 3.4rem/1 var(--mono);margin:22px 0 4px;letter-spacing:-.03em}
.price__big small{font:600 1.05rem/1 var(--mono);color:var(--ink-2);letter-spacing:0}
.price__alt{color:var(--ink-2);font-size:.98rem;margin-bottom:26px}
.price ul{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:11px;font-size:.97rem}
.price li::before{content:"✓";color:var(--orange);font-weight:700;margin-right:11px}
.price__next{
  margin-top:22px;padding-top:20px;border-top:1px solid var(--line);
  font:500 .88rem/1.6 var(--mono);color:var(--ink-3);text-align:center
}
.seats{margin:26px 0 0}
.seats__bar{height:10px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);overflow:hidden}
.seats__bar i{display:block;height:100%;background:var(--orange);width:var(--taken)}
.seats__txt{font:500 .85rem/1 var(--mono);color:var(--ink-2);margin-top:10px;text-align:center}

/* ---------- faq ---------- */
.faq{max-width:760px;margin-inline:auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:22px 0;font-family:var(--display);
  font-weight:700;font-size:1.08rem;display:flex;justify-content:space-between;gap:20px
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--orange);font-size:1.5rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq div{padding:0 0 24px;color:var(--ink-2);font-size:1rem}

/* ---------- closer + footer ---------- */
.closer{background:var(--ink);color:#fff;text-align:center;border-radius:var(--r-lg);padding:clamp(48px,7vw,80px) 28px}
.closer h2{margin-bottom:18px}
.closer p{color:#C9BFB6;max-width:46ch;margin-inline:auto}
.ftr{padding:52px 0;border-top:1px solid var(--line);font-size:.9rem;color:var(--ink-3)}
.ftr__in{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between}
.ftr a{color:var(--ink-2)}

/* ---------- motion ---------- */
.rise{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.rise.is-on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rise{opacity:1;transform:none}
  .meter__fill{width:calc(100% * 100 / 150)}
}







/* ---------- callout note ---------- */
.note{
  background:var(--orange-soft);border:1px solid var(--line);
  border-radius:var(--r-md);padding:26px 28px;margin-top:32px
}
.note h3{margin:0 0 10px;font-size:1.1rem}
.note p{color:var(--ink-2);font-size:.98rem;margin-bottom:10px}
.note p:last-child{margin-bottom:0}

/* ---------- who this is for ---------- */
.fitgrid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:40px}
.fit{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:30px
}
.fit h3{margin-bottom:18px}
.fit ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.fit li{color:var(--ink-2);font-size:.98rem;line-height:1.5;padding-left:26px;position:relative}
.fit--yes li::before{content:"✓";position:absolute;left:0;color:var(--orange);font-weight:700}
.fit--no li::before{content:"–";position:absolute;left:0;color:var(--ink-3);font-weight:700}
.fit--no{background:var(--surface)}

/* ---------- score math + exam dates ---------- */
.scoremath,.datepair{display:grid;gap:18px;margin:32px 0}
.scoremath{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.datepair{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.scoremath div,.datepair div{
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-md);padding:20px 22px
}
.scoremath b{display:block;font:700 2rem/1 var(--mono);color:var(--orange);margin-bottom:6px}
.datepair b{display:block;font:700 1.3rem/1.2 var(--mono);color:var(--orange);margin-bottom:6px}
.scoremath small,.datepair small{display:block;font-size:.9rem;line-height:1.45;color:var(--ink-2)}