/* =====================================================================
   ACADEMICS · EDITORIAL REDESIGN (owner brief, 25 Sep 2026)
   ---------------------------------------------------------------------
   Loaded by Academics.html only and scoped to body.acad-ed. Builds on
   oa-system.css (fonts, tokens, .btn, .kicker, .wrap, .faq, the quiz) and
   follows the owner's Academics mockup (25 Sep 2026, "97B74418…png" in the
   project root): cream and navy grounds only, Spectral headlines, one gold accent.

   Ground rhythm, top to bottom:
     navy hero · cream journey · navy streams · cream stream guide ·
     cream teaching · cream extra help · navy technology · cream projects ·
     navy teachers · cream school year · cream questions · navy visit
   Neighbouring cream sections are divided by a hairline, as in the mockup.

   Photographs are never drawn much larger than their files: every `sizes`
   on the page describes the DRAWN width (after object-fit), not the box.
   ===================================================================== */
body.acad-ed{
  --ivory:#F7F3EA;
  --gold-warm:#C99A2E;        /* hairlines, nodes and rules (brief palette) */
  --gold-on-navy:#E7BD5A;     /* gold TEXT on navy */
  --ac-shadow:0 30px 60px -34px rgba(22,36,63,.38), 0 8px 20px -12px rgba(22,36,63,.14);
  background:var(--ivory);
}
.acad-ed main > section{ position:relative; }
.acad-ed .bg-ivory{ background:var(--ivory); }
.acad-ed main > .section:not(.ac-cta){ padding-top:clamp(56px,6.2vw,92px); padding-bottom:clamp(56px,6.2vw,92px); }
.acad-ed main > .bg-ivory + .bg-ivory{ border-top:1px solid rgba(22,36,63,.1); }
/* Large pale-gold numerals (journey, teaching), as in the mockup. */
.ac-num{ display:block; font:400 clamp(40px,3.6vw,52px)/.9 var(--font-display); letter-spacing:-.02em; color:#D8BD83; font-variant-numeric:lining-nums; }
.acad-ed .kicker{ font-size:12px; letter-spacing:.22em; }
.acad-ed .kicker::before{ background:var(--gold-warm); }
.acad-ed .bg-navy .kicker{ color:var(--gold-on-navy); }
.acad-ed .bg-navy .kicker::before{ background:var(--gold-on-navy); }

/* Section heads. Three shapes, so the page does not repeat one layout:
   split (h2 left, lede answering on the right), centre, and stack. */
.ac-head{ margin-bottom:clamp(32px,4vw,56px); }
.ac-head h2{ font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; margin:16px 0 0; }
.ac-head .lede{ margin:0; max-width:46ch; font-size:var(--t-lede); line-height:1.6; }
.ac-head--split{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:20px clamp(32px,5vw,80px); align-items:end; }
.ac-head--split .lede{ justify-self:end; padding-bottom:8px; }
.ac-head--center{ text-align:center; }
.ac-head--center h2{ max-width:22ch; margin-inline:auto; }
.ac-head--center .lede{ margin:18px auto 0; }
.ac-head--stack .lede{ margin-top:18px; }
@media(max-width:860px){
  .ac-head--split{ display:block; }
  .ac-head--split .lede{ margin-top:18px; padding:0; justify-self:start; }
}

/* =====================================================================
   1 · HERO — navy under the copy, the classroom photograph bright beside it.
   The hero is only as tall as the copy needs (never less than the photo's own
   ratio), so the photograph is drawn close to its file size and stays sharp.
   ===================================================================== */
.ac-hero{ position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center;
  min-height:max(32vw, 540px);
  background:
    radial-gradient(70% 90% at 0% 100%, rgba(11,18,38,.6), transparent 70%),
    var(--navy-deep);
  color:#fff; }
.ac-hero-photo{ position:absolute; top:0; right:0; bottom:0; width:57%; margin:0; z-index:0; overflow:hidden; }
.ac-hero-photo picture{ display:block; height:100%; }
.ac-hero-photo img{ display:block; width:100%; height:100%; object-fit:cover; object-position:62% 50%; }
/* A soft seam only, so the photograph stays bright (brief: "allow the photograph to remain bright"). */
.ac-hero-photo::before{ content:""; position:absolute; inset:0 auto 0 0; width:16%; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, var(--navy-deep) 0%, rgba(22,36,63,.5) 40%, rgba(22,36,63,0) 100%); }
/* Top right: the chat button owns the bottom right corner of the screen. */
.ac-hero-photo figcaption{ position:absolute; right:clamp(16px,2vw,28px); top:clamp(16px,2vw,26px); z-index:2;
  padding:8px 12px; border-radius:3px; background:rgba(13,22,39,.62);
  font:600 11px/1.2 var(--font-ui); letter-spacing:.14em; text-transform:uppercase; color:#fff; }
.ac-hero-inner{ position:relative; z-index:2; width:100%; max-width:1360px;
  padding-top:clamp(48px,5.4vw,84px); padding-bottom:clamp(48px,5.4vw,84px); }
.ac-hero-copy{ max-width:min(580px, 40vw, calc(43vw - max(0px, (100vw - 1360px) / 2) - 68px)); }
.ac-eyebrow{ display:flex; align-items:center; gap:18px; margin:0 0 clamp(18px,2.2vw,26px);
  font:600 13px/1 var(--font-ui); letter-spacing:.26em; text-transform:uppercase; color:var(--gold-on-navy); }
.ac-eyebrow::after{ content:""; width:clamp(48px,6vw,90px); height:1px; background:currentColor; opacity:.75; }
.ac-hero h1{ color:#fff; font-size:clamp(38px,4.2vw,60px); line-height:1.04; letter-spacing:-.018em; font-weight:700; margin:0; }
.ac-gold{ color:var(--gold-on-navy); }
.ac-hero-lede{ margin:clamp(20px,2.2vw,28px) 0 0; max-width:30em; font-size:clamp(16.5px,1.3vw,18.5px); line-height:1.62;
  color:rgba(255,255,255,.9); }
.ac-hero-facts{ list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0, auto)); justify-content:start; gap:16px clamp(18px,2.2vw,36px);
  margin:clamp(26px,3vw,38px) 0 0; padding:clamp(20px,2.2vw,26px) 0 0; border-top:1px solid rgba(255,255,255,.16); }
.ac-hero-facts li{ min-width:0; }
.ac-hero-facts b{ display:block; font:600 clamp(16px,1.5vw,22px)/1.15 var(--font-display); color:#fff; white-space:nowrap; }
.ac-hero-facts span{ display:block; margin-top:5px; font:500 13px/1.35 var(--font-ui); color:var(--on-navy-soft); }

@media(max-width:900px){
  .ac-hero{ display:block; min-height:0; }
  .ac-hero-photo{ position:relative; width:100%; aspect-ratio:16/10; }
  .ac-hero-photo::before{ inset:auto 0 0 0; width:auto; height:22%;
    background:linear-gradient(0deg, var(--navy-deep) 0%, rgba(22,36,63,0) 100%); }
  .ac-hero-photo figcaption{ top:14px; right:14px; font-size:10px; }
  .ac-hero-inner{ padding-top:10px; padding-bottom:clamp(40px,8vw,64px); }
  .ac-hero-copy{ max-width:620px; }
}
@media(max-width:560px){
  /* A strong phone crop: in close on the class and the teacher, the ceiling fans trimmed away. */
  .ac-hero-photo{ aspect-ratio:4/3; }
  .ac-hero-photo img{ transform:scale(1.22); transform-origin:60% 88%; }
  .ac-hero-photo::before{ height:16%; }
  .ac-hero h1{ font-size:clamp(36px,10.4vw,46px); line-height:1.05; }
  .ac-hero-lede{ font-size:16px; }
  .ac-hero-facts{ display:grid; grid-template-columns:1fr; gap:12px; }
  .ac-hero-facts li{ display:flex; align-items:baseline; justify-content:space-between; gap:12px;
    padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.1); }
  .ac-hero-facts li:last-child{ border-bottom:0; padding-bottom:0; }
  .ac-hero-facts b{ font-size:18px; }
  .ac-hero-facts span{ margin:0; text-align:right; }
}

/* =====================================================================
   2 · THE JOURNEY — three stages in three columns: a large numeral, a line
   icon, the classes, the stage. The school's own three stages (see the FAQ).
   ===================================================================== */
.ac-journey .ac-head{ margin-bottom:clamp(26px,3vw,40px); }
.ac-journey .ac-head h2{ max-width:none; font-size:clamp(30px,3vw,44px); }
.ac-journey .ac-head .lede{ margin-top:12px; font-size:16.5px; }
.ac-stages{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid rgba(201,154,46,.55); }
.ac-st{ min-width:0; padding:clamp(24px,2.6vw,34px) clamp(22px,3vw,44px) 4px; border-left:1px solid var(--rule-strong); }
.ac-st:first-child{ border-left:0; padding-left:clamp(0px,1.4vw,20px); }
.ac-st-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.ac-st-ic{ flex:none; width:clamp(40px,3.6vw,52px); height:auto; margin-top:2px; fill:none; stroke:#C9A45A; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round; }
.ac-st-cls{ display:block; margin-top:12px; font:700 11px/1.2 var(--font-ui); letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dark); }
.ac-st h3{ margin:12px 0 0; font-size:clamp(21px,1.9vw,26px); line-height:1.15; letter-spacing:-.01em; color:var(--navy-deep); }
.ac-st p{ margin:10px 0 0; max-width:34ch; font-size:15.5px; line-height:1.62; color:var(--text-soft); }
.ac-st .ac-subjects{ margin-top:12px; font-size:13.5px; line-height:1.6; color:var(--text); }
@media(max-width:860px){
  .ac-stages{ grid-template-columns:1fr; }
  .ac-st, .ac-st:first-child{ padding:24px 0 26px; border-left:0; border-bottom:1px solid var(--rule-strong); }
  .ac-st:last-child{ border-bottom:0; padding-bottom:0; }
  .ac-st p{ max-width:52ch; }
}

/* =====================================================================
   3 · STREAMS — the heading on the left, four cream cards beside it (mockup).
   Wide screens: all four side by side, rows lined up across the cards
   (subgrid). Narrower: the heading above; the cards scroll sideways with
   arrows and position marks (inline script, [data-strip]).
   ===================================================================== */
.ac-streams .wrap{ max-width:1360px; }
.ac-streams-grid{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,3.1fr); gap:clamp(28px,3vw,48px); align-items:center; }
.ac-streams-side h2{ margin:16px 0 0; font-size:clamp(30px,2.7vw,40px); line-height:1.06; letter-spacing:-.015em; color:#fff; }
.ac-streams-side .lede{ margin:18px 0 0; max-width:34ch; font-size:16px; line-height:1.62; color:var(--on-navy); }
.ac-streams-btn{ margin-top:clamp(24px,2.6vw,34px); }
.ac-streams-cards{ min-width:0; }
.ac-paths{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 clamp(12px,1.2vw,18px); }
.ac-pw{ position:relative; min-width:0; display:flex; flex-direction:column; overflow:hidden;
  background:var(--ivory); border-radius:10px; box-shadow:0 22px 40px -28px rgba(0,0,0,.6); color:var(--text); }
@supports (grid-template-rows:subgrid){
  @media(min-width:1101px){
    .ac-pw{ display:grid; grid-row:span 5; grid-template-rows:subgrid; row-gap:0; }
  }
}
.ac-pw > :not(.ac-pw-img){ margin-left:clamp(16px,1.5vw,22px); margin-right:clamp(16px,1.5vw,22px); }
.ac-pw-img{ aspect-ratio:16 / 10; overflow:hidden; background:var(--navy-ink); }
.ac-pw-img img{ display:block; width:100%; height:100%; object-fit:cover; }
.ac-pw h3{ margin-top:18px; margin-bottom:0; font-size:clamp(22px,1.8vw,26px); line-height:1.1; letter-spacing:-.01em; color:var(--navy-deep); }
.ac-pw-pos{ margin-top:8px; margin-bottom:0; font:500 15.5px/1.45 var(--font-display); color:var(--gold-dark); }
.ac-subs{ list-style:none; margin-top:16px; margin-bottom:0; padding:0; }
.ac-subs li{ position:relative; padding:5px 0 5px 28px; font:500 14.5px/1.4 var(--font-ui); color:var(--navy-deep); }
.ac-subs li::before{ content:""; position:absolute; left:0; top:6px; width:18px; height:18px; border-radius:50%; background:#C9A045
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.4l2.6 2.6L13 6.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat; }
.ac-pw-choice{ margin-top:14px; padding:12px 0 clamp(18px,1.8vw,24px); border-top:1px solid rgba(22,36,63,.1); }
.ac-one{ margin:0; font-size:13.5px; line-height:1.5; color:var(--text); }
.ac-one + .ac-one{ margin-top:8px; }
.ac-one-k{ display:block; margin-bottom:2px; font:700 10.5px/1.3 var(--font-ui); letter-spacing:.18em; text-transform:uppercase; color:var(--gold-dark); }
.ac-combos{ margin:6px 0 0; padding:0 0 0 20px; }
.ac-combos li{ padding:2px 0; font-size:13.5px; line-height:1.45; color:var(--text); }
.ac-combos li::marker{ color:var(--gold-dark); font-weight:600; }
/* Arrows and position marks for the sideways strips (streams on narrow screens, teachers). */
.ac-strip-nav{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:20px; }
.ac-strip-nav[hidden]{ display:none; }
.ac-strip-dots{ display:flex; gap:6px; margin:0; }
.ac-strip-dots i{ width:22px; height:3px; border-radius:2px; background:rgba(255,255,255,.22); transition:background-color .25s ease; }
.ac-strip-dots i.on{ background:var(--gold-on-navy); }
.ac-strip-btns{ display:flex; gap:10px; margin-left:auto; }
.ac-strip-btn{ width:46px; height:46px; display:grid; place-items:center; padding:0; cursor:pointer;
  border:1px solid rgba(255,255,255,.3); border-radius:50%; background:transparent; color:#fff;
  font:500 18px/1 var(--font-ui); transition:border-color .2s ease, background-color .2s ease; }
.ac-strip-btn:hover:not(:disabled){ border-color:var(--gold-on-navy); background:rgba(231,189,90,.1); }
.ac-strip-btn:focus-visible{ outline:2px solid var(--gold-on-navy); outline-offset:3px; }
.ac-strip-btn:disabled{ opacity:.35; cursor:default; }
@media(max-width:1279px){
  .ac-streams-grid{ grid-template-columns:1fr; gap:clamp(28px,3.4vw,40px); }
  .ac-streams-side{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:8px 40px; align-items:end; }
  .ac-streams-side .kicker{ grid-column:1; }
  .ac-streams-side h2{ grid-column:1; }
  .ac-streams-side .lede{ grid-column:2; grid-row:1 / span 2; margin:0; }
  .ac-streams-btn{ grid-column:2; margin-top:12px; justify-self:start; }
}
@media(max-width:1100px){
  .ac-paths{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain;
    margin:0 -28px; padding:2px 28px 6px; scroll-padding-inline:28px; scrollbar-width:none; }
  .ac-paths::-webkit-scrollbar{ display:none; }
  .ac-paths:focus-visible{ outline:2px solid var(--gold-on-navy); outline-offset:-2px; }
  .ac-pw{ flex:0 0 min(320px, 40%); scroll-snap-align:start; }
  .ac-pw-choice{ margin-top:auto; }
  .ac-subs + .ac-pw-choice{ margin-top:14px; }
}
@media(max-width:760px){
  .ac-streams-side{ display:block; }
  .ac-streams-side .lede{ margin-top:16px; }
  .ac-pw{ flex-basis:min(320px, 82%); }
}
@media(prefers-reduced-motion:reduce){ .ac-strip-dots i, .ac-strip-btn{ transition:none; } }

/* =====================================================================
   4 · STREAM GUIDE — the question and the guide on the left, a photograph and
   three points beside it (mockup). The live quiz (assets/oa-quiz.js) renders
   in .sfq-shell under the copy: its start screen is just the button, and the
   questions and result open there as a card.
   ===================================================================== */
.ac-guide-grid{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.6fr); gap:clamp(24px,2.6vw,40px); align-items:center; }
.ac-guide-main h2{ margin:16px 0 0; font-size:clamp(28px,2.5vw,36px); line-height:1.08; letter-spacing:-.015em; color:var(--navy-deep); }
.ac-nw{ white-space:nowrap; }
.ac-guide-sub{ margin:14px 0 0; font:500 clamp(19px,1.6vw,22px)/1.35 var(--font-display); color:var(--navy-deep); }
.ac-guide-note{ margin:14px 0 0; max-width:46ch; font-size:15px; line-height:1.6; color:var(--text-soft); }
.ac-guide .sfq-shell{ margin:clamp(20px,2.2vw,28px) 0 0; max-width:none; padding:0; background:none; border:0; border-radius:0; box-shadow:none; overflow:visible; }
.ac-guide .sfq-shell::before{ display:none; }
.ac-guide .sfq-intro{ text-align:left; }
.ac-guide .sfq-eyebrow, .ac-guide .sfq-intro-lede{ display:none; }
.ac-guide .sfq-start{ min-height:54px; padding:15px 30px; font-size:16px; }
.ac-guide .sfq-meta{ margin-top:12px; font-size:13px; }
.ac-guide .sfq-fallback{ text-align:left; }
.ac-guide .sfq-fallback-cta{ justify-content:flex-start; }
/* Once started, the questions and the result sit in a card. */
.ac-guide .sfq-shell:has(.sfq-q), .ac-guide .sfq-shell:has(.sfq-result){
  padding:clamp(22px,2.4vw,32px); background:#fff; border:1px solid rgba(201,154,46,.35); border-radius:10px;
  box-shadow:0 24px 48px -36px rgba(22,36,63,.45); overflow:hidden; }
.ac-guide .sfq-result{ margin:calc(-1 * clamp(22px,2.4vw,32px)); padding:clamp(24px,2.6vw,34px); border-radius:0; }
.ac-guide .sfq-ctas .btn{ flex:1 1 auto; justify-content:center; }
.ac-guide-photo{ margin:0; min-width:0; border-radius:10px; overflow:hidden; background:var(--navy-deep); }
.ac-guide-photo img{ display:block; width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; }
.ac-guide-pts{ list-style:none; margin:0; padding:clamp(20px,2vw,28px); display:grid; gap:clamp(18px,2vw,26px);
  background:#F1E9DA; border-radius:10px; }
.ac-guide-pts li{ display:flex; align-items:center; gap:14px; font:500 15px/1.35 var(--font-ui); color:var(--navy-deep); }
.ac-guide-pts svg{ flex:none; width:38px; height:38px; fill:none; stroke:#C9A045; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
@media(max-width:1100px){
  .ac-guide-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .ac-guide-main{ grid-column:1 / -1; }
}
@media(max-width:640px){
  .ac-guide-grid{ grid-template-columns:1fr; }
  .ac-guide .sfq-start{ width:100%; justify-content:center; }
  .ac-guide .sfq-meta{ text-align:center; }
}

/* =====================================================================
   5 · HOW WE TEACH — the four steps in a row under the heading, the lesson
   photograph beside them (mockup).
   ===================================================================== */
.ac-teach-grid{ display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:clamp(28px,3.4vw,56px); align-items:center; }
.ac-teach-main h2{ margin:16px 0 0; font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; color:var(--navy-deep); }
.ac-steps{ list-style:none; margin:clamp(22px,2.4vw,32px) 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid rgba(201,154,46,.55); }
.ac-steps li{ min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; align-items:end; align-content:start;
  padding:clamp(18px,2vw,24px) clamp(12px,1.4vw,20px) 0; border-left:1px solid var(--rule-strong); }
.ac-steps li:first-child{ border-left:0; padding-left:0; }
.ac-steps .ac-num{ font-size:clamp(32px,2.6vw,40px); }
.ac-steps h3{ margin:0 0 2px; font-size:clamp(18px,1.5vw,21px); line-height:1.2; color:var(--navy-deep); }
.ac-steps p{ grid-column:1 / -1; margin:10px 0 0; font-size:14px; line-height:1.5; color:var(--text-soft); }
.ac-teach-photo{ margin:0; min-width:0; border-radius:10px; overflow:hidden; background:var(--navy-deep); }
.ac-teach-photo img{ display:block; width:100%; height:auto; aspect-ratio:16 / 10; object-fit:cover; object-position:44% 40%; }
@media(max-width:1100px){ .ac-teach-grid{ grid-template-columns:1fr; } }
@media(max-width:700px){
  .ac-steps{ grid-template-columns:1fr 1fr; }
  .ac-steps li:nth-child(3){ border-left:0; padding-left:0; }
  .ac-steps li:nth-child(n+3){ margin-top:18px; border-top:1px solid var(--rule-strong); }
}
@media(max-width:420px){
  .ac-steps{ grid-template-columns:1fr; }
  .ac-steps li{ border-left:0; padding-left:0; }
  .ac-steps li + li{ margin-top:14px; border-top:1px solid var(--rule-strong); }
}

/* =====================================================================
   6 · EXTRA HELP — the statement and its two points on the left, the
   photograph beside them, one band like the rest of the page.
   ===================================================================== */
.ac-help-grid{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:clamp(28px,3.4vw,56px); align-items:center; }
.ac-help-h{ margin:16px 0 0; font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; color:var(--navy-deep); }
.ac-help-h span{ color:var(--gold-dark); }
.ac-help-body{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(18px,2vw,28px); margin-top:clamp(22px,2.4vw,32px);
  border-top:1px solid rgba(201,154,46,.55); }
.ac-help-pt{ padding-top:clamp(16px,1.8vw,22px); }
.ac-help-pt + .ac-help-pt{ padding-left:clamp(18px,2vw,28px); border-left:1px solid var(--rule-strong); }
.ac-help-pt h3{ margin:0; font:700 11px/1.3 var(--font-ui); letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dark); }
.ac-help-pt p{ margin:10px 0 0; font-size:15px; line-height:1.6; color:var(--text); }
.ac-help-photo{ margin:0; min-width:0; border-radius:10px; overflow:hidden; background:var(--navy-deep); }
.ac-help-photo img{ display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover; }
@media(max-width:900px){ .ac-help-grid{ grid-template-columns:1fr; } }
@media(max-width:520px){
  .ac-help-body{ grid-template-columns:1fr; }
  .ac-help-pt + .ac-help-pt{ padding-left:0; border-left:0; margin-top:16px; border-top:1px solid var(--rule-strong); }
}

/* =====================================================================
   7 · TECHNOLOGY — on navy: the statement, and the smart-board lesson
   running off the edge of the page
   ===================================================================== */
.ac-tech{ overflow-x:clip; }
.ac-tech-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px clamp(40px,5.6vw,96px); align-items:center; }
.ac-tech-h{ margin:16px 0 0; font-size:clamp(30px,3.4vw,46px); line-height:1.08; letter-spacing:-.015em; color:#fff; }
.ac-tech-h span{ display:block; margin-top:.12em; color:var(--gold-on-navy); }
.ac-tech-fact{ margin:clamp(22px,2.6vw,32px) 0 0; padding-top:20px; max-width:34ch; border-top:1px solid rgba(255,255,255,.16);
  font-size:var(--t-lede); line-height:1.6; color:var(--on-navy); }
.ac-tech-photo{ margin:0; min-width:0; }
.ac-tech-frame{ position:relative; overflow:hidden; border-radius:10px; background:var(--navy-ink); }
.ac-tech-frame img{ display:block; width:100%; height:auto; aspect-ratio:16 / 10; object-fit:cover; object-position:50% 50%; }
.ac-tech-photo figcaption{ margin-top:14px; font:600 11px/1.3 var(--font-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--on-navy-soft); }
@media(min-width:901px){
  /* The photograph runs off the right edge of the page. */
  .ac-tech-photo{ margin-right:calc(-1 * (max(0px, (100vw - var(--maxw)) / 2) + 28px)); }
  .ac-tech-frame{ border-radius:10px 0 0 10px; }
}
@media(max-width:900px){ .ac-tech-grid{ grid-template-columns:1fr; } .ac-tech-h{ max-width:18ch; } }
@media(max-width:560px){
  .ac-tech-frame{ margin-inline:-28px; border-radius:0; }
  .ac-tech .eb-wm{ transform:scale(.8); transform-origin:100% 100%; }
  .ac-tech-photo figcaption{ margin-top:12px; }
}

/* =====================================================================
   8 · PROJECTS — the heading on the left, three photographs in a row with
   their captions underneath (mockup).
   ===================================================================== */
.ac-proj-grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.9fr); gap:clamp(28px,3.4vw,56px); align-items:center; }
.ac-proj-main h2{ margin:16px 0 0; font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; color:var(--navy-deep); }
.ac-proj-main .lede{ margin:16px 0 0; max-width:40ch; font-size:16px; line-height:1.62; }
.ac-proj-foot{ margin:18px 0 0; padding-top:14px; max-width:40ch; border-top:1px solid var(--rule-strong); font-size:14px; line-height:1.6; color:var(--text-soft); }
.ac-shots{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,1.4vw,20px); }
.ac-shot{ margin:0; min-width:0; }
.ac-shot-img{ overflow:hidden; border-radius:8px; background:var(--navy-deep); }
.ac-shot-img img{ display:block; width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.ac-shot--build .ac-shot-img img{ object-position:50% 35%; }
.ac-shot:hover .ac-shot-img img{ transform:scale(1.03); }
.ac-shot figcaption{ padding-top:12px; }
.ac-shot-k{ display:block; font:700 11px/1 var(--font-ui); letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dark); }
.ac-shot-t{ display:block; margin-top:6px; font-size:13.5px; line-height:1.5; color:var(--text-soft); }
@media(prefers-reduced-motion:reduce){ .ac-shot:hover .ac-shot-img img{ transform:none; } }
@media(max-width:1100px){ .ac-proj-grid{ grid-template-columns:1fr; } }
@media(max-width:640px){
  .ac-shots{ grid-template-columns:1fr; gap:24px; }
  .ac-shot-t{ font-size:15px; }
}

/* =====================================================================
   9 · TEACHERS — on navy: the heading on the left, a row of portrait cards
   beside it; arrows appear if the row has to scroll (mockup).
   ===================================================================== */
.ac-people-grid{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr); gap:clamp(28px,3.4vw,56px); align-items:center; }
.ac-people-main h2{ margin:16px 0 0; font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; color:#fff; }
.ac-people-main .lede{ margin:16px 0 0; max-width:38ch; font-size:16px; line-height:1.62; color:var(--on-navy); }
.ac-people-also{ margin:14px 0 0; max-width:40ch; font-size:14.5px; line-height:1.6; color:var(--on-navy-soft); }
.ac-people-also b{ color:#fff; font-weight:600; }
.ac-people-main .btn{ margin-top:clamp(20px,2.2vw,28px); min-height:52px; }
.ac-people-row{ min-width:0; }
.ac-teachers{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(12px,1.3vw,18px); }
.ac-teachers:focus-visible{ outline:2px solid var(--gold-on-navy); outline-offset:4px; border-radius:6px; }
.ac-t{ min-width:0; overflow:hidden; border-radius:8px; background:var(--ivory); box-shadow:0 22px 40px -28px rgba(0,0,0,.65); }
.ac-t-img{ aspect-ratio:4 / 5; overflow:hidden; background:#F4F4F2; }
.ac-t-img img{ display:block; width:100%; height:100%; object-fit:cover; }
.ac-t-cap{ padding:12px 14px 14px; }
.ac-people .ac-t-n{ margin:0; font:600 15px/1.25 var(--font-ui); color:var(--navy-deep); }
.ac-t-yrs{ margin:4px 0 0; font:500 13px/1.3 var(--font-ui); color:var(--gold-dark); }
.ac-strip-nav--side{ margin-top:16px; }
@media(max-width:1000px){ .ac-people-grid{ grid-template-columns:1fr; } }
@media(max-width:760px){
  .ac-teachers{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain;
    margin:0 -28px; padding:0 28px 6px; scroll-padding-inline:28px; scrollbar-width:none; }
  .ac-teachers::-webkit-scrollbar{ display:none; }
  .ac-teachers:focus-visible{ outline-offset:-3px; }
  .ac-t{ flex:0 0 min(62%, 240px); scroll-snap-align:start; }
  .ac-people-main .btn{ width:100%; justify-content:center; }
}

/* =====================================================================
   10 · THE SCHOOL YEAR — four chapters
   ===================================================================== */
.ac-chapters{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--rule-strong); }
.ac-chapters li{ position:relative; min-width:0; padding:clamp(26px,3vw,36px) clamp(18px,2.2vw,30px) 4px; border-left:1px solid var(--rule); }
.ac-chapters li:first-child{ padding-left:0; border-left:0; }
.ac-chapters li::before{ content:""; position:absolute; top:-2px; left:0; width:52px; height:3px; background:var(--gold-warm); }
.ac-chapters li:not(:first-child)::before{ left:clamp(18px,2.2vw,30px); }
.ac-ch-n{ display:inline; font:700 11.5px/1 var(--font-ui); letter-spacing:.2em; color:var(--gold-dark); }
.ac-ch-w{ display:inline; font:700 11.5px/1 var(--font-ui); letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dark); white-space:nowrap; }
.ac-ch-w::before{ content:"·"; margin:0 .6em; }
.ac-chapters h3{ margin:14px 0 0; font-size:clamp(20px,1.8vw,24px); line-height:1.2; color:var(--navy-deep); }
.ac-chapters p{ margin:8px 0 0; font-size:15px; line-height:1.62; color:var(--text-soft); }
.ac-year-note{ margin:clamp(30px,3.4vw,44px) 0 0; font-size:15px; line-height:1.6; color:var(--text-soft); }
.ac-year-note a{ color:var(--navy-deep); font-weight:600; white-space:nowrap; }
@media(max-width:900px){
  .ac-chapters{ grid-template-columns:1fr 1fr; }
  .ac-chapters li:nth-child(3){ padding-left:0; border-left:0; }
  .ac-chapters li:nth-child(3)::before{ left:0; }
  .ac-chapters li:nth-child(n+3){ margin-top:22px; border-top:1px solid var(--rule-strong); }
}
@media(max-width:520px){
  .ac-chapters{ grid-template-columns:1fr; }
  .ac-chapters li{ padding:24px 0 6px; border-left:0; }
  .ac-chapters li::before, .ac-chapters li:not(:first-child)::before{ left:0; }
  .ac-chapters li + li{ margin-top:18px; border-top:1px solid var(--rule-strong); }
}

/* =====================================================================
   11 · QUESTIONS — the heading holds still on the left, a large accordion on the right
   ===================================================================== */
.ac-faq-grid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:32px clamp(40px,6vw,104px); align-items:start; }
.ac-faq-side{ position:sticky; top:calc(var(--header-h) + 36px); }
.ac-faq-side h2{ margin:16px 0 0; font-size:clamp(30px,3vw,44px); line-height:1.06; letter-spacing:-.015em; }
.ac-faq-side .lede{ margin:18px 0 0; font-size:var(--t-lede); }
.ac-faq-more{ margin:22px 0 0; padding-top:18px; border-top:1px solid var(--rule-strong); font-size:15px; color:var(--text-soft); }
.ac-faq-more a{ color:var(--navy-deep); font-weight:600; white-space:nowrap; }
.ac-faq .faq{ max-width:none; margin:0; gap:0; border-top:1px solid var(--rule-strong); }
/* overflow visible: the shared .faq-item clips, which hid the keyboard focus ring. */
.ac-faq .faq-item{ background:none; border:0; border-bottom:1px solid var(--rule-strong); border-radius:0; box-shadow:none; overflow:visible; }
.ac-faq .faq-item summary{ padding:clamp(22px,2.4vw,30px) 0; gap:24px;
  font-size:clamp(18px,1.5vw,21px); line-height:1.3; color:var(--navy-deep); }
.ac-faq .faq-item summary::after{ width:34px; height:34px; box-sizing:border-box; display:grid; place-items:center;
  border:1px solid var(--rule-strong); border-radius:50%; font-size:20px; line-height:1;
  transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease; }
.ac-faq .faq-item[open] summary::after{ background:var(--navy-deep); border-color:var(--navy-deep); color:#fff; }
.ac-faq .faq-item summary:focus-visible{ outline-offset:4px; }
.ac-faq .faq-a{ padding:0 58px 26px 0; font-size:16.5px; line-height:1.7; color:var(--text); }
@media(max-width:860px){
  .ac-faq-grid{ grid-template-columns:1fr; }
  .ac-faq-side{ position:static; }
  .ac-faq .faq-a{ padding-right:0; }
}

/* =====================================================================
   12 · VISIT — the conclusion, set large
   ===================================================================== */
.ac-cta.section{ padding-top:clamp(72px,8.4vw,120px); padding-bottom:clamp(72px,8.4vw,120px); }
.ac-cta-grid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:30px clamp(40px,6vw,104px); align-items:end; }
.ac-cta h2{ margin:16px 0 0; font-size:var(--t-h2); line-height:1.06; letter-spacing:-.015em; color:#fff; }
.ac-cta h2 span{ display:block; color:var(--gold-on-navy); }
.ac-cta-sub{ margin:0; max-width:42ch; font-size:var(--t-lede); line-height:1.65; color:var(--on-navy-soft); }
.ac-cta-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:clamp(24px,2.8vw,32px); }
.ac-cta-actions .btn{ min-height:56px; padding:16px 28px; }
@media(max-width:860px){
  .ac-cta-grid{ grid-template-columns:1fr; }
  .ac-cta-actions{ flex-direction:column; }
  .ac-cta-actions .btn{ justify-content:center; }
}

/* PRE-LAUNCH AUDIT FIXES (25 Sep 2026) */
/* "Choosing a stream": the points column was so narrow that each point stacked four lines high. */
@media (min-width:1101px){ .ac-guide-grid{ grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.85fr); } }
