/* TINTA - design tokens (v2, ink-dominant)
   Night-atelier system: warm ink-black rooms, bone type, blood-red accent.
   The flash drop and studio bands flip to bone "paper" sections for contrast.
   Six Caps (towering condensed display) + Mona Sans (body). */
:root {
  /* Surfaces: dark page, paper bands */
  --color-bone: #14120f;         /* page background, warm ink-black */
  --color-bone-2: #1d1a16;       /* raised cards on dark */
  --color-ink: #eae7de;          /* paper sections (flash, studio, footer) */
  --color-ink-2: #f6f4ec;        /* paper cards */

  /* Text */
  --color-text: #ece9df;         /* on dark */
  --color-muted: #a49e90;        /* secondary on dark */
  --color-cream: #221f1a;        /* on paper */
  --color-muted-d: #6f6a5e;      /* secondary on paper */

  /* Accent: blood red, a step brighter for dark ground */
  --color-red: #bd3a2a;
  --color-red-deep: #9a2a1d;

  /* Lines */
  --color-line: rgba(236, 233, 223, .18);      /* hairlines on dark */
  --color-line-d: rgba(20, 18, 15, .16);       /* hairlines on paper */
  --color-line-d-strong: rgba(20, 18, 15, .38);

  /* Type */
  --font-display: "Six Caps", "Arial Narrow", sans-serif;
  --font-body: "Mona Sans", "Avenir Next", -apple-system, sans-serif;

  --fs-200: .8125rem;
  --fs-300: .9375rem;
  --fs-400: 1.0625rem;
  --fs-500: 1.1875rem;
  --fs-600: clamp(1.3rem, 1.1rem + .6vw, 1.65rem);
  --fs-700: clamp(1.9rem, 1.5rem + 1.4vw, 2.7rem);
  --fs-800: clamp(3rem, 2.2rem + 3vw, 4.8rem);
  --fs-huge: clamp(4.5rem, 3rem + 7vw, 9.5rem);

  /* Caps utility */
  --caps-ls: .18em;

  /* Space */
  --s1: .25rem; --s2: .5rem; --s3: .75rem; --s4: 1rem; --s5: 1.5rem;
  --s6: 2rem; --s7: 2.75rem; --s8: 3.5rem; --s9: 4.5rem; --s10: 6rem;

  /* Shape: sharp, gallery-plain */
  --radius: 0px;

  --container: 80rem;
  --header-h: 4.5rem;
}

/* Wide screens: container grows and the percentage root scales type +
   spacing together while respecting user font-size preferences. Nothing
   below 1600px changes. */
@media (min-width: 1600px) {
  :root { --container: 1400px; }
  html { font-size: 106.25%; }
}
@media (min-width: 2000px) {
  :root { --container: 1560px; }
  html { font-size: 112.5%; }
}