/* ---------- Kryt — Short-course academy & class seats 231 (store) ----------
   THE STRUCTURAL MOVE: warm chalk paper carries the entire page and exactly
   TWO blocks invert — the tutor strip gives up the container and goes edge to
   edge on board green, and the band multiplies its photograph into the same
   green instead of laying a grey scrim over it. So the scroll reads paper,
   paper, GREEN, paper, GREEN, paper, dropping the colour twice and nowhere
   else, which is where the reference puts its one coloured band. Everything
   between stays contained and centre-headed on chalk. The dry yellow touches
   three things only: the slabs, the swipe behind the price, and the rule under
   a hovered nav link — colour on the link, never a moved element. */
body.t-kryt {
  background: #f4f1ea;
  color: #15171a;
  --kr-chalk: #d8a12a;
  --kr-board: #123028;
  --bg-flat: #f4f1ea;
  --surface: #fbf9f4;
  --surface-2: #ebe6da;
  --line: #ded8c9;
  --line-strong: #c8c1ae;
  --heading: #15171a;
  --text: #15171a;
  --muted: #5f6165;
  --header-bg: #f4f1ea;
  --radius: 2px;
  --shadow: none;
}
body.t-kryt .sf-header, body.t-kryt .sf-head,
body.t-kryt .sf-footer, body.t-kryt .sf-foot, body.t-kryt .sf-cats {
  background: #f4f1ea; border-color: #ded8c9;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
/* a live link is underscored in chalk — type and colour only */
body.t-kryt .sf-navlink:hover { color: #15171a; text-decoration: underline; text-decoration-color: var(--kr-chalk); text-decoration-thickness: 2px; text-underline-offset: 7px; }

/* flat chalk-yellow slabs printed in board ink, no border and no shadow */
body.t-kryt .btn.brand { background: var(--kr-chalk); border: 0; box-shadow: none; color: #15171a; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 15px 30px; }
body.t-kryt .btn.brand:hover { background: #bf8c1b; opacity: 1; }
body.t-kryt .sc-h2 { font-size: clamp(24px, 3.4vw, 38px); font-weight: 700; letter-spacing: -0.025em; margin-bottom: 30px; }

/* the opening plate owns the whole first screen: one cut, one paragraph, one slab */
body.t-kryt .sc-hero { min-height: 100vh; padding: 24px 20px; }
body.t-kryt .sc-hero-inner, body.t-kryt .sc-banner-inner { max-width: 900px; }
body.t-kryt .sc-hero h1 { font-size: clamp(38px, 6.8vw, 86px); font-weight: 800; line-height: 1.03; letter-spacing: -0.035em; margin-bottom: 20px; }

/* GREEN ONE — the tutors, edge to edge on board green, four across in one row */
body.t-kryt .sc-strip { width: 100vw; max-width: 100vw; margin: 0 calc(50% - 50vw); padding: 86px 20px 94px; background: var(--kr-board); }
body.t-kryt .sc-strip .sc-h2 { color: #f4f1ea; }
body.t-kryt .sc-strip-row { max-width: 1080px; margin: 0 auto; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; }
body.t-kryt .sc-strip-img { aspect-ratio: 3 / 4; border-radius: 0; background: #0d241e; border-color: #24493f; }
body.t-kryt .sc-strip-label { margin-top: 14px; font-size: 13.5px; font-weight: 600; letter-spacing: 0; color: #f4f1ea; }

/* GREEN TWO — the band; the photograph is multiplied INTO the board colour
   rather than sat under a grey scrim, so the green is the ground and not a tint */
body.t-kryt .sc-banner { min-height: 54vh; background-color: var(--kr-board); background-blend-mode: multiply; }
body.t-kryt .sc-banner h2 { font-size: clamp(28px, 4.2vw, 46px); font-weight: 700; letter-spacing: -0.025em; }

/* the catalogue: four across in two rows that fill, everything set left under the tile */
body.t-kryt .sc-buygrid { padding: 96px 20px 92px; }
body.t-kryt .sc-buy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 46px 26px; }
body.t-kryt .sc-buy-card { align-items: flex-start; text-align: left; }
body.t-kryt .sc-buy-cat { color: var(--muted); letter-spacing: 0.18em; }
/* the price is the only place the yellow touches type — a chalk swipe behind
   board ink, never yellow lettering, which chalk paper cannot hold */
body.t-kryt .sc-buy-p { margin-top: 8px; padding: 3px 7px; background: rgba(216, 161, 42, 0.34); color: #15171a; font-weight: 700; font-size: 15.5px; }

/* the six labelled blocks: one column of pure type against one photograph */
body.t-kryt .sc-about-split { padding: 98px 20px 94px; gap: 64px; align-items: start; }
body.t-kryt .sc-about-media img { aspect-ratio: 3 / 4; border-radius: 0; }
body.t-kryt .sc-about-copy p { color: #33363a; font-size: 15.5px; line-height: 1.85; }
body.t-kryt .sc-contact-split { padding: 86px 20px 98px; border-top: 1px solid #ded8c9; }
body.t-kryt .sc-field input, body.t-kryt .sc-field textarea { border-radius: 0; background: #fbf9f4; }

@media (max-width: 900px) {
  body.t-kryt .sc-strip-row, body.t-kryt .sc-buy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* NIGHT — the paper drops to a dark slate rather than to the board colour, so
   the two green bands stay the only green on the page and the inversion still
   reads as an inversion. The yellow lifts a shade to hold against it. */
html[data-theme="dark"] body.t-kryt {
  background: #16181c;
  color: #e5e1d7;
  --kr-chalk: #e8b447;
  --kr-board: #0e2620;
  --bg-flat: #16181c;
  --surface: #1d2025;
  --surface-2: #23272c;
  --line: #2e323a;
  --line-strong: #3e434c;
  --heading: #f4f1ea;
  --text: #e5e1d7;
  --muted: #8c8f97;
  --header-bg: #16181c;
}
html[data-theme="dark"] body.t-kryt .sf-header, html[data-theme="dark"] body.t-kryt .sf-head,
html[data-theme="dark"] body.t-kryt .sf-footer, html[data-theme="dark"] body.t-kryt .sf-foot,
html[data-theme="dark"] body.t-kryt .sf-cats { background: #16181c; border-color: #2e323a; }
html[data-theme="dark"] body.t-kryt .sc-about-copy p { color: #b3b0a7; }
html[data-theme="dark"] body.t-kryt .sc-buy-p { background: rgba(232, 180, 71, 0.86); color: #16181c; }
html[data-theme="dark"] body.t-kryt .sc-strip-img { background: #0a1d18; border-color: #1d3f36; }
html[data-theme="dark"] body.t-kryt .sc-field input, html[data-theme="dark"] body.t-kryt .sc-field textarea { background: #1d2025; }
html[data-theme="dark"] body.t-kryt .sc-contact-split { border-top-color: #2e323a; }