/* iAlphas. Bold, fast, technical. Dark surfaces, blue and pink. Fjalla One headings (uppercase style), Nunito Sans body. */
@font-face { font-family: "Fjalla One"; font-weight: 400; font-display: swap; src: url("/fonts/Fjalla-One.woff2") format("woff2"); }
@font-face { font-family: "Nunito Sans"; font-weight: 400; font-display: swap; src: url("/fonts/Nunito-Sans-wght-400.woff2") format("woff2"); }
@font-face { font-family: "Nunito Sans"; font-weight: 700; font-display: swap; src: url("/fonts/Nunito-Sans-wght-700.woff2") format("woff2"); }
:root {
  --black: #000000; --navy: #191d3a; --navy-2: #232850; --blue: #2e56cc; --blue-text: #9db4ff; --pink: #fd6481;
  --mist: #b8bdd6; --white: #ffffff; --text: #e9ebf5;
  --sec: 56px; --shell: 1200px; --r: 4px;
}
@media (min-width: 900px) { :root { --sec: 96px; } }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--black); color: var(--text); font: 400 1.0625rem/1.6 "Nunito Sans", system-ui, sans-serif; }
@media (min-width: 900px) { body { font-size: 1.125rem; } }
h1, h2, h3, .lane-name, .kicker, .cta, .ghost, .foot-h, .logo span, .foot-brand, .sub-btn, .menu-btn { font-family: "Fjalla One", Impact, "Arial Narrow", sans-serif; font-weight: 400; text-transform: uppercase; letter-spacing: 0.03em; }
h1 { font-size: clamp(2.25rem, 1.5rem + 3.4vw, 4.25rem); line-height: 1.05; margin: 0 0 24px; color: var(--white); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); line-height: 1.1; margin: 0 0 16px; color: var(--white); }
p { margin: 0 0 16px; max-width: 66ch; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--blue-text); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--pink); outline-offset: 3px; }
.shell { width: 100%; max-width: var(--shell); margin: 0 auto; padding: 0 20px; }
.narrow { max-width: 820px; } .center { text-align: center; } .center p { margin-inline: auto; }
.skip { position: absolute; left: 8px; top: -64px; background: var(--pink); color: var(--black); padding: 8px 16px; z-index: 100; }
.skip:focus { top: 8px; }
.kicker { color: var(--pink); font-size: 1rem; letter-spacing: 0.16em; margin-bottom: 12px; }
.lead { font-size: 1.1875rem; color: var(--text); }
.row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-top: 24px; }

/* Buttons: one primary (pink), one secondary (outline) */
.cta { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 28px; background: var(--pink); color: var(--black); text-decoration: none; border: 0; border-radius: var(--r); font-size: 1.0625rem; cursor: pointer; transition: transform 0.15s ease; }
.cta:hover { transform: translateY(-2px); }
.cta[disabled] { opacity: 0.7; }
.ghost { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 24px; color: var(--white); border: 2px solid var(--blue); border-radius: var(--r); text-decoration: none; font-size: 1.0625rem; }

/* Header */
.top { position: sticky; top: 0; z-index: 40; background: var(--black); border-bottom: 2px solid var(--blue); }
.top-in { display: flex; align-items: center; justify-content: space-between; min-height: 68px; gap: 16px; }
.logo span, .foot-brand { text-transform: none; }
.logo { display: inline-flex; align-items: center; gap: 12px; color: var(--white); text-decoration: none; font-size: 1.5rem; }
.logo img { width: 44px; }
.menu-btn { min-width: 88px; min-height: 48px; background: transparent; color: var(--white); border: 2px solid var(--blue); border-radius: var(--r); font-size: 1rem; cursor: pointer; }
.nav { display: none; position: absolute; top: 70px; left: 0; right: 0; background: var(--black); padding: 8px 20px 24px; border-bottom: 2px solid var(--blue); }
.nav.open { display: block; }
.nav > ul { list-style: none; margin: 0 0 16px; padding: 0; }
.nav a, .sub-btn { display: flex; align-items: center; min-height: 48px; color: var(--white); text-decoration: none; }
.sub-btn { background: none; border: 0; padding: 0; font-size: 1.0625rem; cursor: pointer; }
.sub-btn::after { content: ""; margin-left: 8px; border: 6px solid transparent; border-top-color: var(--pink); margin-top: 6px; }
.sub { display: none; list-style: none; margin: 0; padding: 0 0 8px 16px; border-left: 2px solid var(--blue); }
.sub.open { display: block; }
.nav a[aria-current="page"] { color: var(--pink); }
@media (min-width: 980px) {
  .menu-btn { display: none; }
  .nav { display: flex; position: static; padding: 0; border: 0; gap: 32px; align-items: center; background: none; }
  .nav > ul { display: flex; gap: 28px; margin: 0; }
  .has-sub { position: relative; }
  .sub { position: absolute; top: 56px; left: -16px; width: 300px; background: var(--navy); border: 1px solid var(--blue); padding: 8px 16px; }
  .sub a { min-height: 44px; }
}

/* Hero: full bleed code image under a dark gradient */
.hero, .band { position: relative; overflow: hidden; isolation: isolate; }
.hero-bg, .band-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: 0.45; }
.hero::after, .band::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(0, 0, 0, 0.94) 0%, rgba(0, 0, 0, 0.78) 55%, rgba(25, 29, 58, 0.6) 100%); }
.hero-in { padding: 72px 20px 96px; max-width: var(--shell); }
.hero h1 { max-width: 14ch; }
.hero-with-chip { display: grid; gap: 32px; align-items: center; }
@media (min-width: 900px) {
  .hero-with-chip { grid-template-columns: minmax(0, 1fr) minmax(200px, 320px); gap: 48px; }
}
.hero-chip { width: min(280px, 70%); max-width: 320px; height: auto; justify-self: center; filter: drop-shadow(0 12px 40px rgba(253, 100, 129, 0.25)); }
.tech-line { color: var(--mist); max-width: 42rem; margin: 0 0 8px; }
.chip-frame { max-width: 280px; height: auto; background: #000; border-radius: 16px; }

@media (min-width: 900px) { .hero-in { padding: 128px 20px 144px; } }
.band-in { padding: 64px 20px 72px; }
.band h1 { max-width: 18ch; }

/* Pillars */
.pillars { background: var(--navy); border-top: 4px solid var(--pink); }
.pillars-grid { display: grid; gap: 0; }
.pillars article { padding: 32px 24px; border-bottom: 1px solid var(--navy-2); }
.pillars h2 { font-size: 1.5rem; }
.pillars p { color: var(--mist); margin: 0; }
.pillar-hot { background: var(--black); }
.pillar-hot p { color: var(--white); font-weight: 700; font-size: 1.1875rem; }
@media (min-width: 860px) { .pillars-grid { grid-template-columns: repeat(3, 1fr); } .pillars article { border-bottom: 0; border-right: 1px solid var(--navy-2); padding: 48px 32px; } }

/* Lanes */
.lanes, .scope, .lane-detail, .closing, .more { padding: var(--sec) 0; }
.lane-grid, .scope-grid { display: grid; gap: 20px; margin-top: 32px; }
@media (min-width: 640px) { .lane-grid, .scope-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .lane-grid, .scope-grid { grid-template-columns: repeat(3, 1fr); } }
.lane { display: flex; flex-direction: column; background: var(--navy); color: var(--text); text-decoration: none; border: 1px solid var(--navy-2); border-top: 4px solid var(--blue); border-radius: var(--r); overflow: hidden; transition: border-color 0.15s ease, transform 0.15s ease; }
.lane:hover, .lane:focus-visible { border-top-color: var(--pink); transform: translateY(-3px); }
.lane-top { display: flex; align-items: flex-start; justify-content: space-between; padding: 24px 24px 0; }
.lane-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--blue); color: var(--white); border-radius: var(--r); }
.lane-no { font-family: "Fjalla One", Impact, "Arial Narrow", sans-serif; color: var(--pink); font-size: 1rem; letter-spacing: 0.08em; }
.lane-body { display: flex; flex-direction: column; gap: 8px; padding: 20px 24px 24px; flex: 1; }
.lane-name { font-size: 1.75rem; line-height: 1.1; color: var(--white); letter-spacing: 0.04em; }
.lane-text { color: var(--mist); }
.lane-go { margin-top: auto; color: var(--pink); font-weight: 700; }
.scope-card { background: var(--navy); border: 1px solid var(--navy-2); border-top: 4px solid var(--blue); border-radius: var(--r); padding: 0 0 24px; display: flex; flex-direction: column; transition: border-color 0.15s ease; }
.scope-card:hover, .scope-card:focus-within { border-top-color: var(--pink); }
.scope-card > :not(.lane-top) { padding: 0 24px; }
.scope-card h2.lane-name { margin-top: 20px; }
.scope-card p { color: var(--mist); }
.scope-card .row { margin-top: auto; }

/* Split */
.split { padding: var(--sec) 0; background: var(--navy); }
.split-in { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .split-in { grid-template-columns: 1fr 1fr; gap: 64px; } }
.frame { border: 2px solid var(--blue); border-radius: var(--r); }
.track { counter-reset: t; list-style: none; padding: 0; margin: 0 0 24px; }
.track li { counter-increment: t; position: relative; padding: 0 0 20px 56px; }
.track li::before { content: counter(t, decimal-leading-zero); position: absolute; left: 0; top: -2px; font: 1.5rem/1 "Fjalla One", sans-serif; color: var(--pink); }
.track strong { color: var(--white); }

/* Referral strip */
.refer { background: var(--blue); padding: 48px 0; }
.refer h2 { color: var(--white); }
.refer p { color: var(--white); margin: 0; }
.refer-in { display: grid; gap: 24px; align-items: center; }
@media (min-width: 860px) { .refer-in { grid-template-columns: 1fr auto; } }
.refer .cta { background: var(--black); color: var(--white); }

/* Lane detail and forms */
.detail-in { display: grid; gap: 48px; align-items: start; }
@media (min-width: 960px) { .detail-in { grid-template-columns: 1.15fr 1fr; gap: 64px; } .panel { position: sticky; top: 92px; } }
.lane-detail h2 { font-size: 1.75rem; margin-top: 32px; } .lane-detail h2:first-child { margin-top: 0; }
.panel { background: var(--navy); border: 1px solid var(--blue); border-radius: var(--r); padding: 28px 24px; }
.ticks { list-style: none; padding: 0; margin: 0 0 16px; }
.ticks li { position: relative; padding-left: 28px; margin-bottom: 10px; }
.ticks li::before { content: ""; position: absolute; left: 0; top: 10px; width: 12px; height: 12px; background: var(--pink); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.callout { border-left: 4px solid var(--pink); background: var(--navy); padding: 16px 20px; color: var(--white); }
.chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.chips a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--blue); border-radius: 999px; color: var(--white); text-decoration: none; }
.form { display: grid; gap: 16px; }
.fld label { display: block; font-weight: 700; margin-bottom: 6px; color: var(--white); }
.opt, .hint, .form-note { color: var(--mist); font-weight: 400; }
.form-note { font-size: 0.9375rem; margin: 0; }
.form-ack { margin: 0; color: var(--white); font-size: 1rem; line-height: 1.5; font-weight: 400; }
input, select, textarea { width: 100%; min-height: 48px; padding: 12px 14px; font: inherit; color: var(--white); background: var(--black); border: 2px solid #6f7bb0; border-radius: var(--r); }
textarea { min-height: 120px; resize: vertical; }
[aria-invalid="true"] { border-color: var(--pink); }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Closing */
.closing { background: radial-gradient(ellipse at 50% 0%, var(--navy-2) 0%, var(--black) 70%); border-top: 1px solid var(--navy-2); }

/* Legal */
.legal { padding-top: 48px; padding-bottom: var(--sec); }
.legal h2 { font-size: 1.375rem; margin-top: 40px; scroll-margin-top: 96px; }
.summary { background: var(--navy); border-left: 4px solid var(--pink); padding: 24px 28px; }
.summary h2, .toc h2 { margin-top: 0; }
.toc { margin: 32px 0; } .toc ol { columns: 2 260px; padding-left: 20px; } .toc li { margin-bottom: 6px; break-inside: avoid; }

/* Footer */
.foot { background: var(--navy); padding: 56px 0 24px; border-top: 4px solid var(--blue); }
.foot-grid { display: grid; gap: 32px; }
@media (min-width: 860px) { .foot-grid { grid-template-columns: 1.4fr 1fr 1fr; } }
.foot-brand { display: flex; align-items: center; gap: 12px; font-size: 1.5rem; color: var(--white); }
.foot-h { font-size: 1.125rem; color: var(--pink); }
.foot ul { list-style: none; padding: 0; margin: 0; }
.foot li a { display: inline-flex; align-items: center; min-height: 44px; color: var(--text); }
.foot-base { border-top: 1px solid var(--navy-2); margin-top: 32px; padding-top: 20px; font-size: 0.9375rem; color: var(--mist); }
.foot-base a { color: var(--text); margin-left: 16px; display: inline-flex; min-height: 44px; align-items: center; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
@media print { .top, .foot, .toc, .skip, .band-bg { display: none; } body { background: #fff; color: #000; } h1, h2 { color: #000; } }
/* Tap targets (Mono sign-off): contents links 44px rows, inline text links at least 24px tall */
.toc li { margin-bottom: 0; }
.toc a { display: block; min-height: 44px; padding: 10px 0; box-sizing: border-box; }
main p a, main li a, main dd a, main summary a, .legal a { padding-block: 4px; }
main .toc a { padding: 10px 0; }
.foot-legal { margin: 0; } .foot-legal a:first-child { margin-left: 0; }
/* Legal drafts: pending values, tables, numbered contents (toc numbers are in the link text) */
.ph { text-decoration: underline dotted; text-decoration-thickness: 2px; text-underline-offset: 4px; text-decoration-color: var(--pink); }
.ph-note { font-size: 0.9375rem; color: var(--mist); margin: 12px 0 0; }
.toc ol { list-style: none; padding-left: 0; }
.legal ol, .legal ul { padding-left: 24px; }
.legal li { margin-bottom: 8px; }
.table-wrap { overflow-x: auto; margin: 16px 0; }
.legal table { border-collapse: collapse; width: 100%; min-width: 480px; }
.legal th, .legal td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--navy-2); }
.legal th { color: var(--white); }