/* Hallmark · custom direction by request: the visual language of amerikanlisesi.com's sections after the film (cream, navy, crimson; Fraunces over Figtree; paper sheets; numbered questions) · genre: editorial · job: read, then visit amerikanlisesi.com from in-text links
 * hero: half-viewport or taller; a photo slider on home pages, one photo beside the head on inner pages; the head's second part set on its own line in the italic accent · nav: wordmark left, topic links in a light pill · footer: navy band, about text, every topic, photo credits · imagery: photographs, data diagrams and tables
 * axes: light/high-contrast-serif/warm · posture: restrained · contrast: pass · fold: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V3 · weakest: V, by request the satellites share the main site's look; each keeps its own name, wordmark, contents layout and photographs */
/* Hallmark · scope note · long-form search pages: the 80-words-per-screen budget (58) and section-scale gates (77, 78) belong to landing pages and are not claimed as passed here */
/* Hallmark · waive 38ii · the italic Fraunces second line of every H1 and of the wordmark · the user asked for amerikanlisesi.com's section heads, whose signature is this italic crimson line */
/* Hallmark · waive 38iii · .hero h1 .r is a whole second line at the same size, set on its own line (display: block) · the main site's head style the user chose, one per page in the hero */

/* Turkish-only subsets (Google Fonts text= API): one file per style. Fallback faces are metric-matched to the real fonts so the swap does not shift layout. */
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("/fonts/figtree-tr.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/fraunces-400-tr.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-style: italic; font-weight: 300; font-display: swap; src: url("/fonts/fraunces-italic-300-tr.woff2") format("woff2"); }
@font-face { font-family: "Figtree Fallback"; src: local("Arial"), local("ArialMT"), local("Liberation Sans"); size-adjust: 98.63%; ascent-override: 96.32%; descent-override: 25.35%; line-gap-override: 0%; }
@font-face { font-family: "Fraunces Fallback"; font-style: normal; src: local("Georgia"); size-adjust: 105.47%; ascent-override: 92.73%; descent-override: 24.18%; line-gap-override: 0%; }
@font-face { font-family: "Fraunces Fallback"; font-style: italic; src: local("Georgia Italic"), local("Georgia-Italic"); size-adjust: 94.20%; ascent-override: 103.82%; descent-override: 27.07%; line-gap-override: 0%; }

:root {
  color-scheme: light;
  /* palette borrowed from amerikanlisesi.com's sections after the film: warm cream, navy, crimson, pale blue bands */
  --cream: #fffbf4; --paper: #fffefa; --blue: #e6f2f6; --blue-2: #d6e8ef;
  --navy: #123d59; --navy-d: #0b2a3f; --slate: #465c68;
  --crimson: #c10a3a; --crimson-d: #9d0730;
  --line: rgba(18, 61, 89, 0.14); --line-2: rgba(18, 61, 89, 0.28); --muted: rgba(18, 61, 89, 0.74);
  --on-dark: #fffbf4; --on-dark-2: rgba(255, 251, 244, 0.82); --on-dark-3: rgba(255, 251, 244, 0.6); --on-dark-line: rgba(255, 251, 244, 0.22);
  --shade: rgba(11, 42, 63, 0.78); --shade-0: rgba(11, 42, 63, 0);
  --shadow-sheet: 0 1px 1px rgba(18, 61, 89, 0.05), 0 30px 70px -30px rgba(18, 61, 89, 0.4);
  --shadow-card: 0 1px 1px rgba(18, 61, 89, 0.05), 0 18px 40px -24px rgba(18, 61, 89, 0.35);
  --accent: var(--crimson); --accent-d: var(--crimson-d);

  --serif: "Fraunces", "Fraunces Fallback", Georgia, "Times New Roman", serif;
  --sans: "Figtree", "Figtree Fallback", Arial, system-ui, sans-serif;

  --space-3xs: 2px; --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 40px; --space-2xl: 64px; --space-3xl: 96px;
  --gx: clamp(20px, 5.5vw, 88px);
  --flow-xs: clamp(24px, 4vw, 56px); --flow-s: clamp(40px, 5vw, 72px); --flow-m: clamp(40px, 5vw, 80px); --flow-l: clamp(56px, 7vw, 96px); --flow-xl: clamp(64px, 7vw, 120px); --flow-cap: clamp(48px, 8vw, 96px); --flow-gap: clamp(24px, 4vw, 64px);
  --radius-s: 4px; --radius-m: 12px; --radius-l: 18px; --radius-xl: 24px; --radius-pill: 999px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1); --dur: 220ms;
  --z-raised: 10; --z-skip: 100;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--space-lg); }
body { margin: 0; background: var(--cream); color: var(--navy); font-family: var(--sans); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; }
::selection { background: color-mix(in srgb, var(--crimson) 22%, transparent); }
:focus-visible { outline: 2px solid var(--crimson); outline-offset: 3px; border-radius: 8px; }
a { color: inherit; }
img, svg, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { margin: 0; overflow-wrap: break-word; min-width: 0; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
[hidden] { display: none !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.wrap { width: min(1280px, 100%); margin-inline: auto; padding-inline: var(--gx); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }

/* Shared page styles for abdlise.com and amerikaciftdiploma.com, in the visual language of amerikanlisesi.com's sections after the film.
   Colours and faces come from tokens.css only. */

.skip { position: absolute; left: var(--space-md); top: var(--space-xs); z-index: var(--z-skip); padding: var(--space-xs) var(--space-md); border-radius: var(--radius-pill); background: var(--navy); color: var(--on-dark); transform: translateY(-200%); }
.skip:focus-visible { transform: none; }
main:focus { outline: none; }
.sheet, .table, .checks, .hero { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .38 0 0 0 0 .28 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E"); }

/* ---------- masthead: a light pill, like the main site's nav over cream ---------- */
.mast { padding-top: var(--space-sm); }
.mast .wrap { padding-block: var(--space-xs); }
.mast__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-lg); }
.wordmark { font: 400 1.375rem/1 var(--serif); letter-spacing: -0.02em; color: var(--navy); text-decoration: none; white-space: nowrap; }
.wordmark__b { font-style: italic; font-weight: 300; color: var(--crimson); }
.mast__nav { min-width: 0; }
.mast__nav ul { display: flex; gap: var(--space-2xs); margin: 0; padding: var(--space-2xs); list-style: none; overflow-x: auto; scrollbar-width: none; border-radius: var(--radius-pill); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.mast__nav a { display: inline-block; padding: var(--space-xs) var(--space-md); border-radius: var(--radius-pill); font-size: 0.875rem; font-weight: 600; text-decoration: none; white-space: nowrap; color: var(--navy); transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease); }
.mast__nav a:hover { background: var(--blue); }
.mast__nav a:active { background: var(--blue-2); }
.mast__nav a[aria-current="page"] { background: var(--navy); color: var(--on-dark); }
@media (max-width: 62rem) { .mast__nav { width: 100%; } }

/* ---------- hero ---------- */
.hero { background-color: var(--cream); padding-block: var(--flow-xs) var(--flow-s); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--flow-gap); align-items: center; }
@media (min-width: 62rem) {
  .hero--slides .hero__grid, .hero--photo .hero__grid { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); min-height: clamp(440px, 62svh, 720px); }
}
.hero__text { display: grid; gap: var(--space-md); align-content: center; }
.hero h1 { font: 400 clamp(2.4rem, 4.3vw, 4.1rem)/1.02 var(--serif); letter-spacing: -0.03em; color: var(--navy); max-width: 18ch; }
.hero--text h1 { max-width: 22ch; }
.hero h1 .r { display: block; font-style: italic; font-weight: 300; color: var(--crimson); }
.hero .lead { max-width: 40rem; font-size: clamp(1.0625rem, 1.25vw, 1.1875rem); line-height: 1.62; color: var(--slate); }
.doc__meta { font-size: 0.8125rem; font-weight: 600; color: var(--muted); }

.crumbs ol { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-xs); margin: 0; padding: 0; list-style: none; font-size: 0.8125rem; font-weight: 600; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-inline-end: var(--space-xs); }
.crumbs a { text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.crumbs a:hover { color: var(--crimson); }

.hero__photo { position: relative; margin: 0; height: clamp(320px, 60svh, 680px); border-radius: var(--radius-xl); overflow: hidden; background: var(--blue-2); }
.hero__photo picture, .hero__photo img, .slide picture, .slide img { width: 100%; height: 100%; }
.hero__photo img, .slide img { object-fit: cover; }
.hero__photo figcaption, .slide figcaption { position: absolute; inset: auto 0 0 0; z-index: var(--z-raised); padding: var(--flow-cap) var(--space-lg) var(--space-lg); background: linear-gradient(0deg, var(--shade), var(--shade-0)); color: var(--on-dark); font-size: 0.9375rem; line-height: 1.45; }
.hero__photo figcaption a, .slide figcaption a { color: var(--on-dark); text-decoration-color: var(--on-dark-3); text-underline-offset: 3px; }
.slide figcaption b { display: block; font: 400 clamp(1.25rem, 1.8vw, 1.6rem)/1.15 var(--serif); letter-spacing: -0.015em; margin-bottom: var(--space-2xs); }

.slider { position: relative; min-width: 0; }
.slider__track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; height: clamp(340px, 62svh, 700px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--radius-xl); background: var(--blue-2); overscroll-behavior-x: contain; }
.slider__track::-webkit-scrollbar { display: none; }
.slide { position: relative; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; overflow: hidden; }
.slider__nav { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-top: var(--space-sm); }
.slider__btn { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--navy); color: var(--on-dark); cursor: pointer; transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.slider__btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.slider__btn:hover { background: var(--crimson); }
.slider__btn:active { transform: scale(0.94); }
.slider__btn:disabled { background: var(--line-2); cursor: not-allowed; }
.slider__dots { display: flex; gap: var(--space-xs); }
.slider__dots a { display: block; width: 10px; height: 10px; border-radius: var(--radius-pill); background: var(--line-2); transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.slider__dots a:hover { background: var(--navy); }
.slider__dots a[aria-current="true"] { background: var(--crimson); transform: scaleX(2.4); }

@media (max-width: 61.99rem) {
  .hero--slides .slider, .hero--photo .hero__photo { order: -1; }
  .slider__track { height: 54svh; min-height: 300px; }
  .hero__photo { height: 46svh; min-height: 260px; }
}

/* ---------- document ---------- */
.doc__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); padding-block: var(--flow-m) var(--flow-xl); }
@media (min-width: 62rem) {
  .doc__grid { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: var(--flow-m); }
  .doc__grid--solo { grid-template-columns: minmax(0, 1fr); }
  .doc__aside { position: sticky; top: var(--space-lg); align-self: start; max-height: calc(100dvh - var(--space-2xl)); overflow-y: auto; }
}
.toc { border-radius: var(--radius-l); background: var(--paper); box-shadow: var(--shadow-card); padding: var(--space-md) var(--space-md) var(--space-xs); }
.toc__head { font: italic 300 1.25rem/1.1 var(--serif); color: var(--crimson); padding-bottom: var(--space-xs); }
.toc ol { margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.toc li { counter-increment: toc; border-top: 1px solid var(--line); }
.toc a { display: grid; grid-template-columns: 1.8em minmax(0, 1fr); gap: var(--space-2xs); padding-block: var(--space-xs); font-size: 0.875rem; font-weight: 600; line-height: 1.35; text-decoration: none; transition: color var(--dur) var(--ease); }
.toc a::before { content: counter(toc, decimal-leading-zero); font: italic 300 0.9375rem/1.35 var(--serif); color: var(--crimson); }
.toc a:hover { color: var(--crimson); }
.toc--band { background: var(--blue); box-shadow: none; padding: var(--space-lg); }
.toc--band ol { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 0 var(--space-lg); }

.prose { max-width: 46rem; min-width: 0; }
.doc__grid--solo .prose { margin-inline: auto; }
.prose > * + * { margin-top: var(--space-md); }
.prose h2 { font: 400 clamp(1.9rem, 3vw, 2.75rem)/1.05 var(--serif); letter-spacing: -0.025em; color: var(--navy); margin-top: clamp(48px, 6vw, 80px); scroll-margin-top: var(--space-lg); }
.prose > :first-child { margin-top: 0; }
.prose h3 { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: var(--navy); margin-top: var(--space-xl); scroll-margin-top: var(--space-lg); }
.prose h2 + *, .prose h3 + * { margin-top: var(--space-sm); }
.prose p, .prose li { font-size: 1.0625rem; line-height: 1.7; color: var(--slate); }
.prose strong { font-weight: 700; color: var(--navy); }
.prose a { color: var(--navy); text-decoration-color: color-mix(in srgb, var(--crimson) 55%, transparent); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color var(--dur) var(--ease); }
.prose a:hover { color: var(--crimson); }
.prose ul, .prose ol { padding-left: var(--space-lg); }
.prose li + li { margin-top: var(--space-xs); }
.prose li::marker { color: var(--crimson); }

/* ---------- printed sheets (tables, diagrams) ---------- */
.sheet, .table { position: relative; margin: var(--space-xl) 0; padding: clamp(20px, 3vw, 36px); background-color: var(--paper); border-radius: var(--radius-s); box-shadow: var(--shadow-sheet); }
.sheet__title, .table__title { display: block; padding-bottom: var(--space-sm); border-bottom: 2px solid var(--navy); font-size: clamp(1.0625rem, 1.5vw, 1.3rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: var(--navy); }
.sheet__title span, .table__sub { display: block; margin-top: var(--space-2xs); font-size: 0.8125rem; font-weight: 500; letter-spacing: 0; color: var(--muted); }
.sheet__scroll, .table__scroll { overflow-x: auto; margin-top: var(--space-xs); }
.sheet table, .table table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.sheet th, .sheet td, .table th, .table td { padding: var(--space-sm) var(--space-sm) var(--space-sm) 0; text-align: left; vertical-align: top; line-height: 1.45; border-bottom: 1px dashed var(--line-2); color: var(--navy); }
.sheet thead th, .sheet thead td, .table thead th, .table thead td { font-size: 0.8125rem; font-weight: 700; color: var(--muted); vertical-align: bottom; border-bottom: 1px solid var(--line-2); }
.sheet tbody th, .table tbody th { font-weight: 700; }
.sheet td, .table td { color: var(--slate); }
.sheet tfoot th, .sheet tfoot td, .table tfoot th, .table tfoot td { border-bottom: 0; border-top: 2px solid var(--navy); font-weight: 800; color: var(--navy); }
.sheet .num, .table .num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.sheet tr.is-marked th, .sheet tr.is-marked td, .table tr.is-marked th, .table tr.is-marked td { color: var(--crimson); font-weight: 700; }
.sheet__note, .table__note, .sheet figcaption:not(.sheet__title) { margin-top: var(--space-sm); font-size: 0.8125rem; line-height: 1.5; color: var(--muted); }
.sheet img, .table img { width: 100%; margin-top: var(--space-md); }
.diagram img { min-width: 40rem; margin-top: 0; }

/* ---------- photos in the text ---------- */
.photo { margin: var(--space-xl) 0; }
.photo picture, .photo img { width: 100%; }
.photo img { aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--radius-l); }
.photo figcaption { margin-top: var(--space-xs); font-size: 0.875rem; line-height: 1.5; color: var(--muted); }

/* ---------- notes, steps, checks, terms ---------- */
.note { margin: var(--space-xl) 0; padding: var(--space-lg); border-radius: var(--radius-l); background: var(--blue); }
.note > * + * { margin-top: var(--space-xs); }
.note__head { font-size: 1.125rem; font-weight: 800; letter-spacing: -0.015em; color: var(--navy); }
.note p { color: var(--slate); }

.prose .steps { list-style: none; padding: 0; margin-top: var(--space-lg); counter-reset: step; display: grid; }
.prose .steps > li { counter-increment: step; display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--space-md); margin: 0; padding-block: var(--space-md); border-top: 1px solid var(--line-2); }
.steps > li::before { content: counter(step, decimal-leading-zero); font: italic 300 2rem/1 var(--serif); color: var(--crimson); }
.steps h3 { margin: 0; font-size: 1.125rem; }
.steps p { margin-top: var(--space-2xs); }

.prose .checks { list-style: none; padding: var(--space-lg); margin-top: var(--space-lg); background-color: var(--paper); border-radius: var(--radius-s); box-shadow: var(--shadow-sheet); }
.prose .checks > li { margin: 0; padding-block: var(--space-md); border-top: 1px dashed var(--line-2); }
.checks > li:first-child { border-top: 0; }
.checks label { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); gap: var(--space-sm); align-items: start; cursor: pointer; }
.checks input { width: 1.25rem; height: 1.25rem; margin: var(--space-2xs) 0 0; accent-color: var(--crimson); cursor: pointer; }
.checks input:hover { outline: 1px solid var(--crimson); outline-offset: 2px; }
.checks input:active { transform: scale(0.94); }
.checks input:disabled { cursor: not-allowed; }
.checks strong { display: block; font-size: 1.0625rem; font-weight: 800; line-height: 1.3; color: var(--navy); }
.checks span span { display: block; margin-top: var(--space-2xs); font-size: 0.9375rem; line-height: 1.55; color: var(--slate); }
.checks input:checked + span strong { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--crimson) 60%, transparent); text-decoration-thickness: 2px; }

.terms { margin: var(--space-lg) 0 0; }
.terms > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xs); padding-block: var(--space-md); border-top: 1px solid var(--line-2); }
@media (min-width: 40rem) { .terms > div { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: var(--space-lg); } }
.terms dt { font-size: 1.0625rem; font-weight: 800; line-height: 1.35; color: var(--navy); scroll-margin-top: var(--space-lg); }
.terms dt small { display: block; font: italic 300 1rem/1.35 var(--serif); color: var(--crimson); }
.terms dd { margin: 0; line-height: 1.65; color: var(--slate); }

/* ---------- questions: numbered, like the main site's FAQ ---------- */
.prose .faq { margin-top: var(--flow-l); }
.faq__grid { counter-reset: q; display: grid; margin-top: var(--space-lg); }
.qa { counter-increment: q; padding-block: var(--space-lg); border-top: 1.5px solid var(--navy); }
.prose .qa h3 { display: flex; gap: var(--space-md); margin: 0; font-size: 1.125rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.3; }
.qa h3::before { content: counter(q, decimal-leading-zero); flex: none; width: 24px; font: italic 300 1.5rem/1.1 var(--serif); color: var(--crimson); }
.prose .qa p { margin: var(--space-sm) 0 0 var(--space-xl); font-size: 1rem; line-height: 1.6; }

.prose .sources { margin-top: clamp(48px, 6vw, 80px); }
.prose .sources h2 { font-size: 1.5rem; margin-top: 0; }
.sources ol { padding-left: var(--space-lg); margin-top: var(--space-sm); }
.prose .sources li { font-size: 0.875rem; line-height: 1.5; }
.sources__note { display: block; color: var(--muted); }

/* ---------- next reads: the pale blue band ---------- */
.next { background: var(--blue); padding-block: clamp(56px, 7vw, 104px); }
.next h2 { font: 400 clamp(1.9rem, 3vw, 2.75rem)/1.05 var(--serif); letter-spacing: -0.025em; color: var(--navy); }
.next ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: var(--space-lg); margin: var(--space-xl) 0 0; padding: 0; list-style: none; }
.next a { display: grid; align-content: start; gap: var(--space-xs); height: 100%; padding: var(--space-md) var(--space-md) var(--space-lg); border-radius: var(--radius-l); background: var(--paper); box-shadow: var(--shadow-card); text-decoration: none; transition: transform var(--dur) var(--ease); }
.next a:hover { transform: translateY(-3px); }
.next a:active { transform: translateY(0); }
.next__pic img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--radius-m); }
.next__title { font-size: 1.0625rem; font-weight: 800; letter-spacing: -0.015em; line-height: 1.25; color: var(--navy); }
.next a:hover .next__title { color: var(--crimson); }
.next__desc { font-size: 0.875rem; line-height: 1.5; color: var(--slate); }

/* ---------- footer: navy ---------- */
.foot { background: var(--navy-d); color: var(--on-dark-2); padding-block: var(--flow-l) var(--space-xl); }
.foot a { color: var(--on-dark); text-decoration-color: var(--on-dark-3); text-underline-offset: 3px; }
.foot :focus-visible { outline-color: var(--on-dark); }
.foot__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
@media (min-width: 62rem) { .foot__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-2xl); } }
.foot__name { font: 400 1.6rem/1 var(--serif); letter-spacing: -0.02em; color: var(--on-dark); }
.foot__name .wordmark__b { color: var(--on-dark); }
.foot__about p + p { margin-top: var(--space-md); max-width: 52ch; font-size: 0.875rem; line-height: 1.6; }
.foot__nav h2 { font: italic 300 1.25rem/1.2 var(--serif); color: var(--on-dark); }
.foot__nav ul { columns: 2 14rem; column-gap: var(--space-xl); margin: var(--space-sm) 0 0; padding: 0; list-style: none; font-size: 0.875rem; }
.foot__nav li { break-inside: avoid; padding-block: var(--space-2xs); }
.foot__legal { grid-column: 1 / -1; padding-top: var(--space-md); border-top: 1px solid var(--on-dark-line); font-size: 0.75rem; line-height: 1.6; color: var(--on-dark-3); }
.foot__legal p + p { margin-top: var(--space-xs); }

/* ---------- controls ---------- */
.btn { display: inline-flex; align-items: center; min-height: 46px; padding: var(--space-xs) var(--space-lg); border: 0; border-radius: var(--radius-pill); background: var(--paper); color: var(--navy); box-shadow: inset 0 0 0 1.5px var(--navy); font-size: 0.9375rem; font-weight: 700; cursor: pointer; transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.btn:hover { background: var(--blue); }
.btn:active { transform: scale(0.97); }
.btn:disabled, .btn[aria-disabled="true"] { background: var(--blue); color: var(--muted); box-shadow: inset 0 0 0 1.5px var(--line-2); cursor: not-allowed; }
.btn--primary { background: var(--crimson); color: var(--on-dark); box-shadow: none; }
.btn--primary:hover { background: var(--crimson-d); }

.calc input, .calc select { width: 100%; min-height: 48px; padding: 0 var(--space-sm); border: 0; border-radius: var(--radius-m); background: var(--cream); box-shadow: inset 0 0 0 1.5px var(--line-2); color: var(--navy); font-size: 1rem; font-weight: 500; transition: box-shadow var(--dur) var(--ease), background-color var(--dur) var(--ease); }
.calc input:hover, .calc select:hover { box-shadow: inset 0 0 0 1.5px var(--navy); }
.calc input:focus-visible, .calc select:focus-visible { background: var(--paper); }
.calc input:disabled, .calc select:disabled { background: var(--blue); color: var(--muted); cursor: not-allowed; }
.calc label { display: grid; gap: var(--space-2xs); font-size: 0.8125rem; font-weight: 700; color: var(--muted); }
.calc__rows { display: grid; margin-top: var(--space-xs); }
.calc__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-xs) var(--space-sm); align-items: end; padding-block: var(--space-sm); border-bottom: 1px dashed var(--line-2); }
@media (min-width: 48rem) { .calc__row { grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) auto; } }
.calc__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }
dl.calc__out { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: var(--space-md) var(--space-xl); margin: var(--space-lg) 0 0; padding-top: var(--space-md); border-top: 2px solid var(--navy); }
.calc__out div { display: grid; gap: var(--space-2xs); }
.calc__out dt { font-size: 0.8125rem; font-weight: 700; color: var(--muted); }
.calc__out dd { margin: 0; font: 400 clamp(2.4rem, 4vw, 3.2rem)/1 var(--serif); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: var(--navy); }
.calc__out dd.is-accent { color: var(--crimson); }
.calc__fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); margin-top: var(--space-md); }
.calc .calc__fields input { font: 400 1.75rem/1 var(--serif); font-variant-numeric: tabular-nums; min-height: 56px; }
.prose p.calc__out { margin-top: var(--space-lg); font-weight: 600; color: var(--navy); }
.calc__value { font: italic 300 clamp(3rem, 6vw, 4.5rem)/0.9 var(--serif); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: var(--crimson); }

@media print {
  .mast__nav, .doc__aside, .toc, .next, .foot, .skip, .btn, .slider__nav { display: none; }
  .hero, body { background: none; }
  .sheet, .table, .checks { box-shadow: none; }
}
.foot__credits { margin-top: var(--space-xs); }
.hero h1.is-long { font-size: clamp(2.1rem, 3.3vw, 3.2rem); max-width: 22ch; }