/* Hallmark · genre: modern-minimal · theme: studied-DNA (source: Chris's attached dark/green screenshot), minimal layout
 * macrostructure: product presentation + personal build process · nav: N9 edge-aligned · footer: Ft2
 * Scope: marketing routes only. Games, CRM and the individual website designs keep their identities.
 * pre-emit critique: P5 H5 E4 S5 R5 V5 */
:root {
  color-scheme: dark;
  --color-paper: oklch(17% .012 250);
  --color-paper-2: oklch(21% .014 250);
  --color-paper-3: oklch(25% .014 250);
  --color-ink: oklch(96% .006 250);
  --color-ink-2: oklch(78% .012 250);
  --color-ink-3: oklch(69% .012 250);
  --color-rule: oklch(32% .014 250);
  --color-rule-strong: oklch(47% .014 250);
  --color-accent: oklch(72% .165 152);
  --color-accent-deep: oklch(66% .15 152);
  --color-accent-ink: oklch(15% .02 152);
  --color-focus: oklch(80% .12 152);
  --font-display: "IBM Plex Sans", ui-sans-serif, sans-serif;
  --font-brand: "Barlow Condensed", "Arial Narrow", sans-serif;
  --font-body: "IBM Plex Sans", ui-sans-serif, sans-serif;
  --text-display: clamp(2.5rem, 5vw, 4.75rem);
  --text-display-s: clamp(1.8rem, 3vw, 2.8rem);
  --track-display: -.04em;
  --track-caps: 0;
  --radius-sm: 28px;
  --radius-input: 10px;
  --radius-shot: 16px;
}
.mast { width: min(100% - 4rem, 68rem); margin-inline: auto; padding: var(--space-md) 0; display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); text-align: left; }
.mast__line, .mast__rule { display: none; }
.mast__name { font: 600 1.5rem/1.1 var(--font-brand); letter-spacing: .02em; text-transform: none; white-space: nowrap; }
.mast__nav ul { margin: 0; gap: var(--space-lg); }
.mast__nav a { font: 400 .875rem/1 var(--font-body); text-transform: none; }
.button { font: 400 1rem/1.2 var(--font-body); text-transform: none; letter-spacing: 0; padding-inline: var(--space-lg); border-radius: var(--radius-sm); }
.button--outline { color: var(--color-accent); border-color: var(--color-rule-strong); }
.button--outline:hover { background: var(--color-paper-3); color: var(--color-ink); }
.text-link { color: var(--color-accent); text-decoration: none; }
.text-link:hover { text-decoration: underline; }
h1 span, .page-intro h1 span { color: var(--color-accent); }
.offer-sheet { border: 0; border-radius: var(--radius-shot); padding: var(--space-xl); }
.offer-sheet__price { font-weight: 600; letter-spacing: -.05em; }
.offer-sheet__list { padding-inline-start: var(--space-lg); }
.contact { border-radius: var(--radius-shot); }
.colophon { font: 400 .875rem/1.6 var(--font-body); }
.colophon nav { gap: var(--space-lg); }
.colophon__small { font-size: .8125rem; }
.capture img { border-radius: var(--radius-shot); border: 1px solid var(--color-rule); }
.order-summary { background: var(--color-paper-2); border: 0; border-radius: var(--radius-shot); padding: var(--space-xl); }
.order-layout img { border-radius: var(--radius-shot); }
@media (max-width: 40rem) {
  .mast { width: calc(100% - 2rem); flex-wrap: wrap; gap: var(--space-xs); }
  .mast__nav { width: 100%; }
  .mast__nav ul { justify-content: start; gap: var(--space-md); }
  .mast__nav a { font-size: .8125rem; }
  .offer-sheet, .order-summary { padding: var(--space-lg); }
}