:root {
  --bg: #080C1F; --panel: #131B3C; --line: #27325E; --text: #F2F5FF; --text-2: #C7D1EC; --text-3: #95A2C8;
  --blue: #5FAAFF; --cyan: #5BC8F7; --violet: #B48CF5; --grad: linear-gradient(100deg, #2E8BF0, #8B4DE0);
  --strong: #63E2B0; --mod: #F7C873; --exp: #B9A6F7;
  --display: "Sora", "Inter", system-ui, sans-serif; --body: "Inter", system-ui, sans-serif; --mono: "IBM Plex Mono", ui-monospace, monospace;
}
* { box-sizing: border-box; }
html { scroll-snap-type: y mandatory; scroll-padding-top: 64px; }
body { margin: 0; background: #04060F; color: var(--text); font-family: var(--body); }
img { display: block; max-width: 100%; }
h1, h2, h3, p, ul { margin: 0; padding: 0; }
ul { list-style: none; }
a { color: var(--cyan); }

.dk-bar { position: sticky; top: 0; z-index: 5; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 20px; background: #04060F; border-bottom: 1px solid var(--line); }
.dk-brand { display: flex; align-items: center; gap: 9px; color: var(--text); text-decoration: none; font: 700 18px var(--display); }
.dk-brand img { height: 26px; width: auto; }
.dk-actions { display: flex; align-items: center; gap: 10px; }
.dk-count { color: var(--text-3); font: 500 13px var(--mono); }
.dk-btn { background: var(--grad); color: #fff; text-decoration: none; font-weight: 600; font-size: 14px; padding: 8px 14px; border-radius: 8px; }
.dk-btn.ghost { background: none; border: 1px solid var(--line); }

.deck { display: grid; gap: 22px; padding: 22px; }
.slide { position: relative; width: min(100%, calc((100vh - 110px) * 16 / 9)); margin-inline: auto; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 1.2cqw; background: radial-gradient(ellipse at 80% 0%, #17204A 0%, var(--bg) 60%); border: 1px solid var(--line); container-type: inline-size; scroll-snap-align: start; }
.slide .bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.slide.accent .bg { opacity: .35; }
.slide.cover::after, .slide.accent::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 12, 31, .92) 18%, rgba(8, 12, 31, .2) 75%); }
.pad { position: relative; z-index: 1; height: 100%; padding: 5cqw 6cqw; display: flex; flex-direction: column; justify-content: center; }
.pad.two { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4.5cqw; align-items: center; }
.pad.two.wide-left { grid-template-columns: 1.35fr .65fr; }

.k { font: 500 1.15cqw var(--mono); color: var(--cyan); text-transform: uppercase; letter-spacing: .12em; margin-bottom: 1.4cqw; }
h1 { font: 800 8.5cqw/1 var(--display); letter-spacing: -.035em; }
h2 { font: 700 3.6cqw/1.12 var(--display); letter-spacing: -.025em; max-width: 26ch; }
h2.huge { font-size: 6.4cqw; }
h3 { font: 600 1.6cqw/1.25 var(--display); }
.big { font: 700 3.2cqw var(--display); background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; margin-top: 1cqw; }
.sub { font-size: 1.75cqw; color: var(--text-2); margin-top: 2cqw; max-width: 46ch; line-height: 1.45; }
.cover .pad, .accent .pad { max-width: 70%; }

.pts { margin-top: 2.6cqw; display: grid; gap: 1.4cqw; }
.pts li { font-size: 1.55cqw; line-height: 1.45; color: var(--text-2); padding-left: 1.8cqw; position: relative; }
.pts li::before { content: ""; position: absolute; left: 0; top: .75cqw; width: .7cqw; height: .7cqw; border-radius: 50%; background: var(--grad); }
.pts li b { color: var(--text); }
.pts.small li { font-size: 1.4cqw; }

.stat { background: rgba(19, 27, 60, .8); border: 1px solid var(--line); border-radius: 1.4cqw; padding: 3cqw; display: grid; gap: 1cqw; }
.stat b { font: 800 7cqw/1 var(--display); background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.stat span { font-size: 1.6cqw; color: var(--text-2); line-height: 1.4; }
.stat small { font-size: 1cqw; color: var(--text-3); }

.ph { width: 100%; height: 100%; max-height: 40cqw; object-fit: cover; border-radius: 1.2cqw; border: 1px solid var(--line); }
.shot { width: 100%; border-radius: 1cqw; border: 1px solid var(--line); }
.trio { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 1.4cqw; margin-top: 2.4cqw; height: 30cqw; }
.trio img { width: 100%; height: 100%; object-fit: cover; border-radius: 1cqw; border: 1px solid var(--line); }
.dg-box { margin-top: 1.6cqw; }
.dg-box svg { width: 100%; height: auto; max-height: 34cqw; }

.nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.6cqw 3cqw; margin-top: 3cqw; }
.nums.three { grid-template-columns: repeat(3, 1fr); gap: 2cqw; }
.nums b { display: block; font: 800 5.4cqw/1 var(--display); }
.nums.three b { font-size: 4.2cqw; }
.nums span { display: block; font-size: 1.4cqw; color: var(--text-3); margin-top: .6cqw; line-height: 1.35; }
.note, .offices { font-size: 1.4cqw; color: var(--text-2); margin-top: 2.4cqw; line-height: 1.45; }
.offices { font: 500 1.3cqw var(--mono); color: var(--cyan); }

.tracks { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.2cqw; margin-top: 2.8cqw; }
.tracks article, .grid4 article, .road article { background: rgba(19, 27, 60, .85); border: 1px solid var(--line); border-radius: 1.1cqw; padding: 1.8cqw; display: grid; gap: .8cqw; align-content: start; }
.tracks p, .grid4 p, .road p { font-size: 1.25cqw; color: var(--text-2); line-height: 1.45; }
.ev { font: 600 .95cqw var(--mono); }
.ev.s { color: var(--strong); } .ev.m { color: var(--mod); } .ev.e { color: var(--exp); }
.grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4cqw; margin-top: 3cqw; }
.road { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6cqw; margin-top: 3cqw; }
.road span { font: 500 1.1cqw var(--mono); color: var(--cyan); }
.road h3 { font-size: 2.4cqw; }
.uses { background: rgba(8, 12, 31, .7); border: 1px solid var(--line); border-radius: 1.4cqw; padding: 3cqw; }
.uses li { font-size: 1.7cqw; padding: 1.1cqw 0; border-top: 1px solid var(--line); color: var(--text); }
.uses h3 { margin-bottom: 1cqw; }

.layers-dk { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.1cqw 1.6cqw; margin-top: 2.6cqw; }
.layers-dk div { display: grid; grid-template-columns: 3cqw 1fr auto; grid-template-rows: auto auto; gap: .2cqw 1cqw; align-items: center; padding: 1.3cqw 1.6cqw; border-radius: 1cqw; border: 1px solid var(--line); background: rgba(19, 27, 60, .85); }
.layers-dk div.nx { background: linear-gradient(120deg, #1B2160, #2A1764); border-color: #5468C8; }
.layers-dk span { grid-row: span 2; font: 700 1.8cqw var(--display); color: var(--text-3); }
.layers-dk b { font: 700 1.6cqw var(--display); }
.layers-dk em { grid-column: 2; font-style: normal; font-size: 1.15cqw; color: var(--text-2); }
.layers-dk i { grid-column: 3; grid-row: 1 / span 2; font: 600 1cqw var(--mono); font-style: normal; padding: .35cqw .8cqw; border-radius: 99px; }
.layers-dk .ok i { background: rgba(99, 226, 176, .14); color: var(--strong); }
.layers-dk .nx i { background: rgba(180, 140, 245, .22); color: #D9C6FF; }
.nv-dk { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2cqw; margin-top: 2.8cqw; }
.nv-dk div { background: rgba(19, 27, 60, .85); border: 1px solid var(--line); border-top: .3cqw solid #76B900; border-radius: 1cqw; padding: 1.6cqw; display: grid; gap: .5cqw; }
.nv-dk b { font: 700 1.55cqw var(--display); }
.nv-dk span { font-size: 1.2cqw; color: var(--text-2); }
.fine-dk { font-size: 1cqw; color: var(--text-3); margin-top: 2cqw; }

@media (max-width: 760px) {
  html { scroll-snap-type: none; }
  .deck { padding: 10px; gap: 12px; }
  .dk-btn.ghost, .dk-count { display: none; }
}
@media print {
  @page { size: 16in 9in; margin: 0; }
  html { scroll-snap-type: none; }
  body { background: var(--bg); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .dk-bar { display: none; }
  .deck { display: block; padding: 0; }
  .slide { width: 16in; height: 9in; aspect-ratio: auto; border: 0; border-radius: 0; break-after: page; margin: 0; }
  /* Gradient-clipped text prints with a stray box in Chromium PDFs, so print solid colours. */
  .big, .stat b { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: #8FB4FF; }
}