/* ============================================================
   SPECTRUM v3 — the phone. The artboard is 430. The instruments
   are drawn whole at the column's width (their own --s); the
   chips that carry the offer are re-set in a column. The gauge
   and the flight between blocks need a desk and are left out.
   ============================================================ */
@media (max-width: 899px) {
  :root { --m: calc(100vw / 430); --s: var(--m); --tm: calc(var(--m) / var(--text-scale, 1)); --t: var(--tm); }
  body { font-size: calc(14 * var(--tm)); }
  .notes, .film, .pip, .gauge, .seven__ground, .hue-tag, .outs__seed { display: none !important; }

  .nav, .back-nav { left: calc(16 * var(--m)); right: calc(16 * var(--m)); top: calc(14 * var(--m)); }
  .nav .chip:not(.chip--brand):not(.chip--live), .back-nav .chip--line { display: none; }
  .chip { height: calc(32 * var(--m)); font-size: calc(12 * var(--tm)); }
  .mark { left: calc(16 * var(--m)); width: calc(398 * var(--m)); bottom: calc(16 * var(--m)); }

  main section, main > div { position: relative; }

  /* ---------- top ---------- */
  .top { height: auto; padding: calc(70 * var(--m)) calc(16 * var(--m)) 0; display: flex; flex-direction: column; gap: calc(10 * var(--m)); }
  .top > * { position: relative; left: auto !important; top: auto !important; }
  .hero { --s: calc(var(--m) * 398 / 340); --t: calc(var(--tm) * 398 / 340); }
  .clock { display: flex; gap: calc(14 * var(--m)); align-items: center; width: auto; }
  .face { width: calc(80 * var(--m)); height: calc(80 * var(--m)); }
  .clock__cap { margin: 0; font-size: calc(13 * var(--tm)); }
  .intro { width: auto; }
  .intro__lead { font-size: calc(32 * var(--tm)); }
  .facts { grid-template-columns: 1fr 1fr; margin-top: calc(24 * var(--m)); }
  .fact { min-height: calc(112 * var(--m)); }
  .fact b { font-size: calc(18 * var(--tm)); }
  .fact em, .fact span { font-size: calc(11 * var(--tm)); }
  .cta { height: calc(56 * var(--m)); font-size: calc(16 * var(--tm)); }
  .weeks { width: auto; height: auto; display: grid; grid-template-columns: 1fr 1fr; gap: calc(8 * var(--m)); margin-top: calc(30 * var(--m)); }
  .wk { min-height: calc(270 * var(--m)); padding-top: calc(164 * var(--m)); }
  .wk__sw { height: calc(150 * var(--m)); }
  .wk__name { font-size: calc(21 * var(--tm)); }
  .wk__line { font-size: calc(12 * var(--tm)); }

  .ground { position: absolute !important; left: 0 !important; top: auto !important; bottom: 0; width: 100%; height: calc(560 * var(--m)); }
  .ticker { position: absolute !important; bottom: calc(470 * var(--m)); top: auto !important; left: 0 !important; }
  .ticker__in { font-size: calc(80 * var(--tm)); }
  .wheel-sec { height: calc(560 * var(--m)); margin: 0 calc(-16 * var(--m)); width: auto; }
  .wheel { --s: calc(var(--m) * 370 / 600); --t: calc(var(--tm) * 370 / 600); top: calc(150 * var(--m)); }
  .wheel__mark { font-size: calc(17 * var(--t)); }
  .wheel__read em { font-size: calc(17 * var(--t)); }
  .wheel__read span { font-size: calc(18 * var(--t)); }

  /* ---------- seven, on paper ---------- */
  .seven { height: auto; display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--m)); padding: calc(30 * var(--m)) 0 calc(20 * var(--m)); }
  .seven > * { position: relative; left: auto !important; top: auto !important; }
  .curric { --s: calc(var(--m) * 398 / 330); --t: calc(var(--tm) * 398 / 330); }
  .shape, .sclock { --s: calc(var(--m) * 300 / 330); --t: calc(var(--tm) * 300 / 330); }
  .shape__body { font-size: calc(15 * var(--t)); }
  .sclock__cap { font-size: calc(18 * var(--t)); }
  .record { --s: calc(var(--m) * 380 / 500); --t: calc(var(--tm) * 380 / 500); }
  .record__cap { left: auto; top: auto; width: auto; right: 0; bottom: calc(-30 * var(--s)); text-align: right; font-size: calc(18 * var(--t)); }
  .faculty { --s: calc(var(--m) * 398 / 514); --t: calc(var(--tm) * 398 / 514); height: calc(560 * var(--s)); margin-top: calc(40 * var(--m)); }
  .hang h3 { font-size: calc(30 * var(--t)); }
  .hang > p:last-child, .hang__no { font-size: calc(15 * var(--t)); }
  .faculty__cap { font-size: calc(18 * var(--t)); width: 100%; }
  .prism { width: calc(398 * var(--m)); height: calc(460 * var(--m)); }
  .prism__word { font-size: calc(70 * var(--tm)); }
  .prism__say { width: calc(340 * var(--m)); font-size: calc(15 * var(--tm)); }
  .prism__k, .prism__warm, .prism__cool { font-size: calc(11 * var(--tm)); }
  .prism__warm { top: auto; bottom: calc(110 * var(--m)); }
  .prism__cool { bottom: calc(92 * var(--m)); }

  /* ---------- mid ---------- */
  .mid { padding-top: calc(40 * var(--m)); display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--m)); }
  .deck { --s: calc(var(--m) * 398 / 336); --t: calc(var(--tm) * 398 / 336); margin: 0; }
  .deck__pic { top: calc(var(--i) * 122 * var(--s)); }
  .deck__slot { visibility: visible; }
  .fan { --s: calc(var(--m) * 0.62); --t: calc(var(--tm) * 0.62); width: 100%; margin: 0; }
  .fan__cap { --s: var(--m); --t: var(--tm); left: calc(16 * var(--m)); top: 0; font-size: calc(15 * var(--tm)); }
  .win { --s: calc(var(--m) * 398 / 1045); --t: calc(var(--tm) * 398 / 1045); margin: 0; height: calc(697 * var(--s)); }
  .win > * { margin-left: calc(16 * var(--m) - 198 * var(--s)); }
  .win__shot b { font-size: calc(46 * var(--t)); }
  .win__shot em, .win__shot span { font-size: calc(22 * var(--t)); }
  .win__k { font-size: calc(18 * var(--t)); }
  .win__name { font-size: calc(26 * var(--t)); }
  .win__say { font-size: calc(18 * var(--t)); }
  .outs { width: calc(398 * var(--m)); height: auto; margin: 0; display: flex; flex-direction: column; gap: calc(8 * var(--m)); }
  .outs > * { position: relative; left: auto !important; top: auto !important; }
  .out { width: 100%; height: auto; padding-bottom: calc(24 * var(--m)); }
  .out h3 { margin-top: calc(30 * var(--m)); }
  .outs__k { order: -1; padding: 0 0 calc(4 * var(--m)); }

  /* ---------- night ---------- */
  .night { padding-top: calc(40 * var(--m)); }
  .poster { --s: calc(var(--m) * 430 / 1440); --t: calc(var(--tm) * 430 / 1440); margin-top: 0; }
  .poster__seat { display: block; }
  .field { width: calc(398 * var(--m)); height: 80vh; margin-top: calc(60 * var(--m)); }
  .field__call { font-size: calc(28 * var(--tm)); }
  .field__call--left { top: calc(38% - 20 * var(--m)); }
  .field__call--right { top: calc(56% - 20 * var(--m)); left: calc(16 * var(--m)); margin: 0; }
  .field__tick { font-size: calc(12 * var(--tm)); }
  .enrol { height: auto; margin-top: calc(60 * var(--m)); padding: 0 calc(16 * var(--m)); display: flex; flex-direction: column; gap: calc(30 * var(--m)); }
  .enrol__card { position: relative; left: auto; width: 100%; min-height: calc(640 * var(--m)); }
  .enrol__price b { font-size: calc(130 * var(--tm)); }
  .enrol__spec { font-size: calc(14 * var(--tm)); grid-template-columns: calc(80 * var(--m)) 1fr; }
  .enrol__btn { font-size: calc(16 * var(--tm)); }
  .enrol__fine { font-size: calc(10 * var(--tm)); }
  .faq { position: relative; left: auto; width: 100%; }
  .faq summary { font-size: calc(20 * var(--tm)); }
  .faq details p { padding-right: 0; font-size: calc(14 * var(--tm)); }
  .foot { padding: calc(50 * var(--m)) calc(16 * var(--m)) calc(16 * var(--m)); }
  .foot__line { flex-wrap: wrap; }
  .foot__line .nav__gap { display: none; }
}