:root{
    --bg:#F7F2E7; --bg-alt:#EFE7D3; --surface:#FFFDF7;
    --ink:#1B2420; --ink-soft:#43483F; --muted:#6E7368;
    --forest:#1E4638; --forest-deep:#122E24; --forest-tint:#E7EDE6;
    --gold:#A97D22; --gold-soft:#E8D19C; --rust:#A8461F; --line:#DCD2B8;
    --shadow:rgba(30,55,44,.16);
    --mark-page:#1E4638; --mark-fold:#12251D; --mark-11:#F7F2E7; --mark-plus:#C89B3C;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#101C16; --bg-alt:#152219; --surface:#17251C;
      --ink:#F1EBDA; --ink-soft:#D3CDB9; --muted:#98A092;
      --forest:#5A9A7C; --forest-deep:#0B1712; --forest-tint:#1B2C22;
      --gold:#E4C77A; --gold-soft:#F1E2B4; --rust:#E28E5F;
      --line:#2B3C31; --shadow:rgba(0,0,0,.45);
    }
  }
  :root[data-theme="dark"]{
    --bg:#101C16; --bg-alt:#152219; --surface:#17251C;
    --ink:#F1EBDA; --ink-soft:#D3CDB9; --muted:#98A092;
    --forest:#5A9A7C; --forest-deep:#0B1712; --forest-tint:#1B2C22;
    --gold:#E4C77A; --gold-soft:#F1E2B4; --rust:#E28E5F;
    --line:#2B3C31; --shadow:rgba(0,0,0,.45);
  }

  *{box-sizing:border-box;}
  html{background:var(--bg); scroll-behavior:smooth;}
  body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:'Karla',system-ui,sans-serif; -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif; font-weight:600; margin:0; text-wrap:balance; color:var(--ink);}
  p{margin:0; line-height:1.65; color:var(--ink-soft);}
  a{color:inherit; text-decoration:none;}
  button{font-family:inherit; cursor:pointer;}
  .mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}
  ::selection{background:var(--gold-soft); color:var(--forest-deep);}
  :focus-visible{outline:2px solid var(--gold); outline-offset:2px;}

  .wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
  @media (min-width:768px){ .wrap{padding:0 32px;} }

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    border-radius:999px; padding:14px 28px; font-size:15px; font-weight:600;
    letter-spacing:-.01em; transition:transform .25s cubic-bezier(.34,1.56,.64,1), background .2s, border-color .2s;
    border:1px solid transparent; white-space:nowrap;
  }
  .btn:hover{ transform:translateY(-2px); }
  .btn-solid{ background:var(--forest); color:var(--bg); }
  .btn-solid:hover{ background:var(--forest-deep); }
  .btn-outline{ background:transparent; border-color:color-mix(in srgb, var(--ink) 25%, transparent); color:var(--ink); }
  .btn-outline:hover{ border-color:color-mix(in srgb, var(--ink) 60%, transparent); }
  .btn-gold{ background:var(--gold); color:var(--forest-deep); }
  .btn-gold:hover{ background:var(--gold-soft); }

  /* ---------- Nav ---------- */
  header{ position:fixed; top:0; left:0; right:0; z-index:50; transition:transform .35s cubic-bezier(.22,1,.36,1); }
  header.nav-hidden{ transform:translateY(-100%); }
  .nav-bar{ transition:background .3s, border-color .3s, backdrop-filter .3s; border-bottom:1px solid transparent; }
  .nav-bar.solid{ background:color-mix(in srgb, var(--bg) 86%, transparent); backdrop-filter:blur(10px); border-color:var(--line); }
  .nav-inner{ height:76px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
  .brand{ display:flex; align-items:center; gap:10px; flex:none; }
  .brand svg{ width:34px; height:34px; }
  .brand-word{ font-family:'Fraunces',serif; font-weight:600; font-size:16px; }
  .brand-word .plus{ color:var(--gold); }
  .nav-links{ display:none; align-items:center; gap:30px; font-size:14px; font-weight:500; color:var(--ink-soft); }
  .nav-links a:hover{ color:var(--forest); }
  .nav-right{ display:none; align-items:center; gap:20px; }
  .nav-login{ font-size:14px; font-weight:500; color:var(--ink-soft); }
  .nav-login:hover{ color:var(--forest); }
  .nav-cta{ background:var(--forest); color:var(--bg); padding:10px 20px; border-radius:999px; font-size:14px; font-weight:600; }
  .nav-cta:hover{ background:var(--forest-deep); }
  @media (min-width:900px){ .nav-links, .nav-right{ display:flex; } .nav-burger{ display:none !important; } }
  .nav-burger{ display:flex; flex-direction:column; gap:5px; background:none; border:none; padding:8px; margin-right:-8px; }
  .nav-burger span{ display:block; width:24px; height:1.5px; background:var(--ink); transition:transform .25s, opacity .25s; }
  .nav-burger.open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .nav-burger.open span:nth-child(2){ opacity:0; }
  .nav-burger.open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }
  .mobile-menu{ max-height:0; overflow:hidden; background:var(--bg); border-bottom:1px solid transparent; transition:max-height .35s ease, border-color .35s; }
  .mobile-menu.open{ max-height:520px; border-color:var(--line); }
  .mobile-menu-inner{ padding:24px; display:flex; flex-direction:column; gap:20px; font-family:'Fraunces',serif; font-size:17px; }
  .mobile-menu-inner a.plain{ font-family:'Karla',sans-serif; font-size:15px; color:var(--ink-soft); }
  .mobile-menu-inner .btn{ font-family:'Karla',sans-serif; }

  /* ---------- Hero ---------- */
  .hero{ position:relative; overflow:hidden; background:var(--bg); padding:188px 0 80px; }
  @media (min-width:768px){ .hero{ padding:206px 0 96px; } }
  .hero-bg{ position:absolute; inset:0; pointer-events:none;
    background-image:
      radial-gradient(ellipse 900px 480px at 18% 0%, var(--bg-alt) 0%, transparent 55%),
      radial-gradient(ellipse 700px 500px at 96% 30%, var(--forest-tint) 0%, transparent 55%);
  }
  .hero-grid{ position:relative; display:grid; grid-template-columns:1fr; gap:56px; align-items:center; }
  @media (min-width:900px){ .hero-grid{ grid-template-columns:1.05fr .95fr; gap:56px; } }
  .eyebrow{
    font-size:11.5px; text-transform:uppercase; letter-spacing:.12em; color:var(--ink-soft);
    display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface);
    border-radius:999px; padding:9px 16px; margin-bottom:28px; max-width:100%;
  }
  .eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); flex:none; }
  .eyebrow .full{ display:none; } .eyebrow .short{ display:inline; }
  @media (min-width:480px){ .eyebrow .full{ display:inline; } .eyebrow .short{ display:none; } }
  .hero h1{ font-size:42px; line-height:1.06; letter-spacing:-.01em; }
  @media (min-width:768px){ .hero h1{ font-size:63px; line-height:1.03; } }
  .hero h1 em{ font-style:normal; color:var(--forest); }
  .hero-sub{ margin-top:24px; max-width:480px; font-size:17.5px; }
  @media (min-width:768px){ .hero-sub{ font-size:18.5px; } }
  .hero-ctas{ margin-top:40px; display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
  .hero-pillars{ margin-top:56px; display:flex; flex-wrap:wrap; align-items:center; gap:12px 32px; font-size:11.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); }
  .hero-pillars .sep{ width:4px; height:4px; border-radius:50%; background:var(--line); }
  .scroll-cue{ display:none; margin-top:16px; flex-direction:column; align-items:center; gap:8px; color:var(--muted); }
  @media (min-width:900px){ .scroll-cue{ display:flex; } }
  .scroll-cue .rail{ width:1px; height:36px; background:var(--line); position:relative; overflow:hidden; }
  .scroll-cue .rail i{ position:absolute; inset-inline:0; top:0; height:12px; background:var(--gold); animation:railmove 1.6s ease-in-out infinite; }
  @keyframes railmove{ 0%{ transform:translateY(-100%);} 100%{ transform:translateY(220%);} }

  /* hero 3D paper stack (CSS 3D, mouse + scroll reactive) */
  .hero-stage{ position:relative; height:340px; perspective:1400px; }
  @media (min-width:768px){ .hero-stage{ height:480px; } }
  .paper-rig{ position:absolute; inset:0; transform-style:preserve-3d; transform:rotateX(8deg) rotateY(-18deg); transition:transform .15s linear; will-change:transform; }
  .sheet{ position:absolute; left:50%; top:50%; border-radius:14px; box-shadow:0 30px 60px var(--shadow); }
  .sheet-1{ width:220px; height:290px; margin:-145px 0 0 -80px; background:var(--bg-alt); transform:translateZ(-40px) rotate(-7deg); }
  .sheet-2{ width:220px; height:290px; margin:-145px 0 0 -70px; background:var(--surface); transform:translateZ(-22px) rotate(4deg); }
  .sheet-3{ width:220px; height:290px; margin:-145px 0 0 -60px; background:var(--surface); transform:translateZ(-4px) rotate(-2deg); }
  .sheet-4{ width:200px; height:264px; margin:-132px 0 0 -50px; background:var(--rust); transform:translateZ(14px) rotate(5deg); }
  .sheet-5{ width:230px; height:300px; margin:-150px 0 0 -30px; background:var(--forest-deep); transform:translateZ(34px) rotate(-3deg); }
  .stamp{ position:absolute; right:6%; top:30%; width:64px; height:64px; transform:translateZ(60px); animation:stampin .8s cubic-bezier(.34,1.56,.64,1) .3s both, stampfloat 3.4s ease-in-out 1.2s infinite; }
  .stamp svg{ width:100%; height:100%; }
  @keyframes stampin{ from{ transform:translateZ(60px) scale(0) rotate(-20deg); opacity:0;} to{ transform:translateZ(60px) scale(1) rotate(-8deg); opacity:1;} }
  @keyframes stampfloat{ 0%,100%{ margin-top:0;} 50%{ margin-top:-8px;} }
  @media (prefers-reduced-motion:reduce){ .stamp{ animation:none; } .paper-rig{ transition:none; } }

  /* ---------- Trust strip ---------- */
  .trust{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); overflow:hidden; }
  .trust-track{ display:flex; width:max-content; padding:16px 0; animation:marquee 30s linear infinite; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
  .trust-track span{ display:inline-flex; align-items:center; gap:40px; font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); padding-right:40px; white-space:nowrap; }
  .trust-track span i{ width:4px; height:4px; border-radius:50%; background:var(--gold); margin-left:40px; }
  @keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
  @media (prefers-reduced-motion:reduce){ .trust-track{ animation:none; } }

  /* ---------- Section scaffolding ---------- */
  section{ padding:60px 0; }
  @media (min-width:768px){ section{ padding:88px 0; } }
  .kicker{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:.14em; color:var(--gold); }
  .sec-head h2{ margin-top:12px; font-size:32px; }
  @media (min-width:768px){ .sec-head h2{ font-size:42px; } }

  .reveal{ opacity:1; transform:none; transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
  .js .reveal{ opacity:0; transform:translateY(24px); }
  .js .reveal.in-view{ opacity:1; transform:none; }
  @media (prefers-reduced-motion:reduce){ .js .reveal{ opacity:1; transform:none; } }

  /* ---------- How it works (pinned scrub) ---------- */
  .how{ background:var(--forest-deep); color:var(--bg); overflow:clip; }
  .how .kicker{ color:var(--gold); }
  .how h2{ color:var(--bg); }
  .how-pin{ position:relative; }
  .how-sticky{ position:sticky; top:0; min-height:100vh; display:flex; flex-direction:column; justify-content:center; padding:56px 0; }
  .how-head{ margin-bottom:40px; }
  .how-track{ display:flex; gap:24px; padding:0 24px; width:max-content; will-change:transform; }
  @media (min-width:768px){ .how-track{ padding:0 32px; gap:32px; } }
  .step-card{ width:82vw; max-width:420px; flex:none; border-radius:20px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); padding:32px; }
  @media (min-width:768px){ .step-card{ width:min(70vw,540px); padding:40px; } }
  .step-card .num{ font-family:'IBM Plex Mono',monospace; color:var(--gold); font-size:13px; }
  .step-card h3{ color:var(--bg); font-size:26px; margin-top:16px; }
  @media (min-width:768px){ .step-card h3{ font-size:30px; } }
  .step-card p{ color:rgba(247,242,231,.72); margin-top:16px; max-width:420px; }
  .step-tag{ display:inline-block; margin-top:28px; font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--forest-deep); background:var(--gold-soft); border-radius:999px; padding:6px 14px; }
  .how-track-wrap{ overflow:hidden; }
  @media (max-width:899px){ .how-pin{ min-height:0; } .how-sticky{ position:static; min-height:0; padding:0; }
    .how-track{ flex-direction:column; width:100%; padding:0 24px; transform:none !important; } .step-card{ width:100%; max-width:none; } }

  /* ---------- School match ---------- */
  .match-grid{ display:grid; grid-template-columns:1fr; gap:56px; align-items:start; }
  @media (min-width:900px){ .match-grid{ grid-template-columns:.9fr 1.1fr; } }
  .match-copy p{ margin-top:20px; max-width:440px; font-size:16px; }
  .match-card{ border:1px solid var(--line); background:var(--surface); border-radius:20px; padding:32px; }
  @media (min-width:768px){ .match-card{ padding:36px; } }
  .match-fields{ display:grid; grid-template-columns:1fr; gap:16px; }
  @media (min-width:560px){ .match-fields{ grid-template-columns:1fr 1fr; } }
  .field label{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); display:block; margin-bottom:8px; }
  select{
    width:100%; border:1px solid var(--line); background:var(--bg); color:var(--ink); border-radius:10px;
    padding:12px 14px; font-family:'Karla',sans-serif; font-size:15px; appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%2343483F' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 14px center;
  }
  select:focus{ border-color:var(--forest); }
  select:disabled{ opacity:.45; }
  .match-result{ margin-top:22px; border-radius:14px; background:var(--forest-tint); border:1px solid color-mix(in srgb, var(--forest) 15%, transparent); padding:20px 22px; display:none; }
  .match-result.show{ display:block; animation:fadeup .4s cubic-bezier(.22,1,.36,1); }
  @keyframes fadeup{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none;} }
  .match-result .tag{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--forest); display:flex; align-items:center; gap:8px; }
  .match-result .tag i{ width:6px; height:6px; border-radius:50%; background:var(--forest); }
  .match-result h4{ margin-top:8px; font-size:17px; font-weight:600; }
  .match-result p{ margin-top:6px; font-size:14px; }
  .match-empty{ margin-top:22px; font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--muted); }

  /* ---------- Subjects ---------- */
  .subj-grid{ margin-top:48px; display:grid; grid-template-columns:1fr; gap:20px; }
  @media (min-width:640px){ .subj-grid{ grid-template-columns:1fr 1fr; } }
  @media (min-width:1080px){ .subj-grid{ grid-template-columns:repeat(4,1fr); } }

  /* ---------- Features ---------- */
  .features-grid{ margin-top:48px; display:grid; grid-template-columns:1fr; gap:40px 32px; }
  @media (min-width:640px){ .features-grid{ grid-template-columns:1fr 1fr; } }
  @media (min-width:1080px){ .features-grid{ grid-template-columns:repeat(4,1fr); } }
  .feature-item .num{ font-family:'IBM Plex Mono',monospace; color:var(--gold); font-size:11px; margin-right:8px; }
  .feature-item h3{ display:inline; font-family:'Fraunces',serif; font-size:16.5px; color:var(--ink); }
  .feature-item p{ margin-top:10px; font-size:14px; line-height:1.6; color:var(--ink-soft); }
  .flip{ height:260px; perspective:1000px; }
  .flip-inner{ position:relative; width:100%; height:100%; transition:transform .7s cubic-bezier(.22,1,.36,1); transform-style:preserve-3d; border-radius:18px; }
  .flip:hover .flip-inner, .flip:focus-within .flip-inner, .flip-inner.flipped{ transform:rotateY(180deg); }
  .flip-face{ position:absolute; inset:0; border-radius:18px; padding:24px; backface-visibility:hidden; display:flex; flex-direction:column; justify-content:space-between; }
  .flip-front{ background:var(--surface); border:1px solid var(--line); }
  .flip-back{ transform:rotateY(180deg); display:flex; align-items:center; }
  .subj-tag{ align-self:flex-start; font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; padding:5px 12px; border-radius:999px; }
  .flip-front p{ font-family:'Fraunces',serif; font-size:18px; line-height:1.35; color:var(--ink); }
  .flip-hint{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--muted); }
  .flip-back p{ font-family:'Fraunces',serif; font-style:italic; font-size:16px; line-height:1.4; }
  .flip-btn{ position:absolute; inset:0; width:100%; height:100%; background:none; border:none; padding:0; display:block; }
  @media (hover:none){ .flip-inner{ transition:transform .5s; } }

  /* ---------- Proof / track ---------- */
  .proof-grid{ display:grid; grid-template-columns:1fr; gap:56px; align-items:center; }
  @media (min-width:1080px){ .proof-grid{ grid-template-columns:1fr 1.05fr; } }
  .proof-list{ margin-top:32px; display:flex; flex-direction:column; gap:14px; font-size:14.5px; }
  .proof-list li{ display:flex; gap:12px; align-items:flex-start; }
  .proof-list i{ width:6px; height:6px; border-radius:50%; background:var(--gold); margin-top:7px; flex:none; }
  .proof-card{ border-radius:20px; border:1px solid var(--line); background:var(--surface); padding:32px; box-shadow:0 18px 50px var(--shadow); }
  .proof-card-head{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:28px; gap:16px; }
  .proof-card-head .lab{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
  .proof-card-head h4{ font-size:19px; margin-top:6px; }
  .proof-badge{ font-family:'IBM Plex Mono',monospace; font-size:11px; border:1px solid var(--line); border-radius:999px; padding:5px 12px; color:var(--ink-soft); white-space:nowrap; }
  .bar-row{ margin-bottom:20px; }
  .bar-row:last-child{ margin-bottom:0; }
  .bar-label{ display:flex; justify-content:space-between; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-soft); margin-bottom:6px; }
  .bar-track{ height:10px; border-radius:999px; background:var(--bg-alt); overflow:hidden; }
  .bar-fill{ height:100%; border-radius:999px; width:0; transition:width 1s cubic-bezier(.22,1,.36,1); }

  /* ---------- Pricing ---------- */
  .pricing-head{ text-align:center; max-width:560px; margin:0 auto; }
  .toggle-wrap{ display:flex; justify-content:center; margin-top:36px; }
  .toggle{ display:inline-flex; border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:4px; }
  .toggle button{ border:none; background:none; border-radius:999px; padding:9px 18px; font-size:13px; font-weight:600; color:var(--ink-soft); transition:background .2s,color .2s; }
  .toggle button.active{ background:var(--forest); color:var(--bg); }
  .tier-grid{ margin-top:48px; display:grid; grid-template-columns:1fr; gap:24px; align-items:stretch; }
  @media (min-width:1080px){ .tier-grid{ grid-template-columns:repeat(3,1fr); } }
  .tier-grid-2{ max-width:760px; margin-left:auto; margin-right:auto; }
  @media (min-width:760px){ .tier-grid-2{ grid-template-columns:repeat(2,1fr); } }
  @media (min-width:1080px){ .tier-grid-2{ grid-template-columns:repeat(2,1fr); } }
  .tier{ border-radius:20px; padding:32px; display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); }
  .tier.hi{ background:var(--forest-deep); color:var(--bg); border-color:transparent; box-shadow:0 24px 60px var(--shadow); }
  @media (min-width:1080px){ .tier.hi{ transform:translateY(-14px); } }
  .tier-badge{ align-self:flex-start; font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; background:var(--gold); color:var(--forest-deep); border-radius:999px; padding:5px 14px; margin-bottom:18px; }
  .tier h3{ font-size:20px; }
  .tier.hi h3{ color:var(--bg); }
  .tier-price{ display:flex; align-items:baseline; gap:6px; margin-top:16px; font-family:'Fraunces',serif; }
  .tier-price .amt{ font-size:38px; }
  .tier-price .per{ font-size:13.5px; color:var(--muted); font-family:'Karla',sans-serif; }
  .tier.hi .per{ color:rgba(247,242,231,.7); }
  .tier-desc{ margin-top:16px; font-size:14.5px; }
  .tier.hi .tier-desc{ color:rgba(247,242,231,.75); }
  .tier-feats{ margin-top:28px; display:flex; flex-direction:column; gap:12px; font-size:14px; flex:1; }
  .tier-feats li{ display:flex; gap:10px; align-items:flex-start; }
  .tier-feats i{ width:6px; height:6px; border-radius:50%; background:var(--forest); margin-top:7px; flex:none; }
  .tier.hi .tier-feats i{ background:var(--gold); }
  .tier.hi .tier-feats span{ color:rgba(247,242,231,.9); }
  .tier .btn{ margin-top:32px; width:100%; }
  .price-note{ text-align:center; margin-top:32px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--muted); }
  [data-plan="annual"] .show-monthly{ display:none; }
  [data-plan="monthly"] .show-annual{ display:none; }

  /* ---------- Sample CTA ---------- */
  .sample{ position:relative; overflow:hidden; background:linear-gradient(155deg, var(--forest-deep), var(--forest) 75%); color:var(--bg); padding:72px 0; }
  .sample::after{ content:""; position:absolute; right:-140px; bottom:-180px; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle, rgba(247,242,231,.08), transparent 70%); }
  .sample-grid{ position:relative; display:grid; grid-template-columns:1fr; gap:28px; align-items:center; }
  @media (min-width:768px){ .sample-grid{ grid-template-columns:auto 1fr auto; gap:32px; } }
  .sample svg{ width:76px; height:76px; }
  .sample h2{ color:var(--bg); font-size:28px; }
  @media (min-width:768px){ .sample h2{ font-size:36px; } }
  .sample p{ color:rgba(247,242,231,.72); margin-top:10px; max-width:440px; }

  /* ---------- FAQ ---------- */
  .faq-wrap{ max-width:760px; margin:0 auto; }
  .faq-list{ margin-top:48px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .faq-item{ border-bottom:1px solid var(--line); }
  .faq-item:last-child{ border-bottom:none; }
  .faq-q{ width:100%; background:none; border:none; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 0; text-align:left; }
  .faq-q h3{ font-size:18px; }
  @media (min-width:768px){ .faq-q h3{ font-size:19px; } }
  .faq-icon{ flex:none; width:32px; height:32px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:18px; line-height:1; transition:transform .3s, background .3s, border-color .3s; color:var(--ink-soft); }
  .faq-item.open .faq-icon{ transform:rotate(45deg); background:var(--forest); border-color:var(--forest); color:var(--bg); }
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .35s cubic-bezier(.22,1,.36,1); }
  .faq-a p{ padding-bottom:24px; max-width:600px; font-size:15px; }

  /* ---------- Footer ---------- */
  footer{ padding:80px 0 40px; border-top:1px solid var(--line); }
  .foot-grid{ display:grid; grid-template-columns:1fr; gap:48px; }
  @media (min-width:640px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
  @media (min-width:900px){ .foot-grid{ grid-template-columns:1.2fr repeat(4,1fr); } }
  .foot-brand p{ margin-top:18px; max-width:260px; font-size:14px; }
  .foot-form{ margin-top:28px; display:flex; gap:8px; max-width:300px; }
  .foot-form input{ min-width:0; flex:1; border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:10px 16px; font-size:13.5px; font-family:'Karla',sans-serif; color:var(--ink); }
  .foot-form input:focus{ border-color:var(--forest); }
  .foot-form button{ flex:none; background:var(--forest); color:var(--bg); border:none; border-radius:999px; padding:10px 16px; font-size:13px; font-weight:600; }
  .foot-col p.head{ font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:16px; }
  .foot-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; font-size:14px; color:var(--ink-soft); }
  .foot-col a:hover{ color:var(--forest); }
  .foot-bottom{ margin-top:64px; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--muted); }

  /* ---------- Page-top spacer (clears the fixed banner + nav) ---------- */
  .page-top{ padding-top:128px; }
  @media (min-width:768px){ .page-top{ padding-top:152px; } }

  /* ---------- Inner page header (non-homepage hero) ---------- */
  .inner-hero{ position:relative; overflow:hidden; background:var(--bg); padding:128px 0 56px; }
  @media (min-width:768px){ .inner-hero{ padding:152px 0 64px; } }
  .inner-hero .hero-bg{ background-image:radial-gradient(ellipse 900px 460px at 14% 0%, var(--bg-alt) 0%, transparent 55%); }
  .inner-hero h1{ margin-top:12px; font-size:34px; line-height:1.06; max-width:720px; letter-spacing:-.01em; }
  @media (min-width:768px){ .inner-hero h1{ font-size:48px; } }
  .inner-hero .lead{ margin-top:20px; font-size:16px; max-width:600px; }
  @media (min-width:768px){ .inner-hero .lead{ font-size:17px; } }
  .inner-hero .actions{ margin-top:32px; display:flex; flex-wrap:wrap; gap:10px; }

  /* ---------- Form fields (login/signup/sample) ---------- */
  input[type="text"], input[type="email"], input[type="password"], input[type="search"], textarea{
    width:100%; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:10px;
    padding:12px 14px; font-family:'Karla',sans-serif; font-size:15px;
  }
  input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus{ border-color:var(--forest); outline:none; }
  textarea{ resize:vertical; min-height:110px; }
  .form-card{ border:1px solid var(--line); background:var(--surface); border-radius:20px; padding:32px; }
  @media (min-width:768px){ .form-card{ padding:40px; } }
  .form-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
  @media (min-width:560px){ .form-grid.two{ grid-template-columns:1fr 1fr; } }
  .form-grid .full{ grid-column:1/-1; }
  .auth-card{ max-width:440px; margin:0 auto; }
  .auth-card .brand-mark{ display:flex; justify-content:center; }
  .auth-card .brand-mark svg{ width:44px; height:44px; }

  /* ---------- Type / feature cards (subject deep-dives) ---------- */
  .type-grid{ margin-top:32px; display:grid; grid-template-columns:1fr; gap:20px; }
  @media (min-width:640px){ .type-grid{ grid-template-columns:1fr 1fr; } }
  .type-card{ border:1px solid var(--line); background:var(--surface); border-radius:14px; padding:20px; }
  .type-card h3{ font-size:16px; }
  .type-card p{ margin-top:8px; font-size:13.5px; line-height:1.6; }
  .info-grid{ display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:40px; }
  @media (min-width:768px){ .info-grid{ grid-template-columns:1fr 1fr; } }
  .info-card{ border:1px solid var(--line); background:var(--surface); border-radius:16px; padding:22px; }
  .info-card .lab{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
  .info-card p.body{ margin-top:8px; font-size:15px; color:var(--ink); }
  .sample-box{ margin-top:40px; border-radius:20px; background:var(--forest-deep); color:var(--bg); padding:28px 32px; }
  @media (min-width:768px){ .sample-box{ padding:36px; } }
  .sample-box .lab{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--gold); }
  .sample-box .prompt{ margin-top:12px; font-family:'Fraunces',serif; font-style:italic; font-size:19px; line-height:1.4; max-width:640px; }
  .sample-box .answer{ margin-top:12px; font-size:13.5px; color:rgba(247,242,231,.7); }
  .sample-box .note{ margin-top:18px; font-size:13px; color:rgba(247,242,231,.6); }

  /* ---------- Chip filters ---------- */
  .chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
  .chip{ border-radius:999px; padding:9px 16px; font-size:13px; font-weight:500; border:1px solid var(--line); color:var(--ink-soft); background:none; }
  .chip.active{ background:var(--forest); color:var(--bg); border-color:var(--forest); }
  .filter-bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px 0; }
  .filter-bar select{ width:auto; min-width:200px; }

  /* ---------- Paper cards (subjects browse) ---------- */
  .paper-grid{ margin-top:32px; display:grid; grid-template-columns:1fr; gap:20px; }
  @media (min-width:640px){ .paper-grid{ grid-template-columns:1fr 1fr; } }
  @media (min-width:1080px){ .paper-grid{ grid-template-columns:repeat(3,1fr); } }
  .paper-card{ border:1px solid var(--line); background:var(--surface); border-radius:16px; padding:22px; display:flex; flex-direction:column; height:100%; }
  .paper-card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .paper-tag{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--forest); background:var(--forest-tint); border-radius:999px; padding:5px 10px; }
  .paper-tag.free{ color:var(--forest-deep); background:var(--gold-soft); }
  .paper-card h3{ margin-top:16px; font-size:17px; }
  .paper-card p.desc{ margin-top:8px; font-size:13px; flex:1; }
  .paper-meta{ margin-top:18px; display:flex; justify-content:space-between; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--muted); border-top:1px solid var(--line); padding-top:14px; }

  /* ---------- Table (schools directory / comparison) ---------- */
  .table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
  table{ width:100%; min-width:600px; border-collapse:collapse; font-size:14px; }
  thead tr{ border-bottom:1px solid var(--line); background:color-mix(in srgb, var(--bg-alt) 40%, transparent); text-align:left; }
  th{ padding:14px 20px; font-weight:500; color:var(--ink-soft); }
  td{ padding:14px 20px; border-bottom:1px solid color-mix(in srgb, var(--line) 70%, transparent); color:var(--ink-soft); }
  tr:last-child td{ border-bottom:none; }
  td.school{ font-family:'Fraunces',serif; color:var(--ink); }
  .type-pill{ font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--forest); background:var(--forest-tint); border-radius:999px; padding:4px 10px; }
  .cell-link{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--forest); }
  .cell-link:hover{ text-decoration:underline; }

  /* ---------- Dashboard ---------- */
  .dash-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px; }
  .dash-tabs{ display:flex; gap:8px; }
  .dash-grid{ margin-top:40px; display:grid; grid-template-columns:1fr; gap:24px; }
  @media (min-width:1080px){ .dash-grid{ grid-template-columns:1.1fr .9fr; } }
  .dash-card{ border-radius:20px; border:1px solid var(--line); background:var(--surface); padding:28px; }
  .dash-card.dark{ background:var(--forest-deep); color:var(--bg); border-color:transparent; }
  .dash-list{ margin-top:24px; display:flex; flex-direction:column; }
  .dash-list .row{ display:flex; justify-content:space-between; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); font-size:14px; }
  .dash-list .row:last-child{ border-bottom:none; }
  .dash-schools{ margin-top:12px; display:flex; flex-direction:column; gap:8px; font-size:14px; }
  .dash-schools li{ display:flex; align-items:center; gap:8px; }
  .dash-schools i{ width:6px; height:6px; border-radius:50%; background:var(--gold); }

  /* ---------- Compare table shading ---------- */
  .compare-yes{ color:var(--forest); font-size:16px; }
  .compare-no{ color:var(--muted); font-size:16px; }

/* live additions */
.formmsg[hidden]{display:none}
.pack-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.pack-row:first-of-type{border-top:1px solid var(--line)}
.pack-row .meta{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--muted);margin-top:2px}
.pack-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.pack-links .btn{padding:9px 16px;font-size:13.5px}
.acct-pack{margin-top:36px}
.acct-pack h2{font-size:24px}
@media (max-width:560px){.pack-row{grid-template-columns:1fr}.pack-links{justify-content:flex-start}}
#prose p,#prose li{line-height:1.7}