/* HALUS — design tokens. Single source of truth for colour, type and geometry.
   Never hard-code a hex value in a component; add a token here instead.
   Every pair below was computed against WCAG 2.1 and clears AA. */

:root{
  /* ── surfaces ─────────────────────────────────────────── */
  --paper:#FBFAF8;
  --surface:#F2F0EC;
  --surface-2:#E7E4DE;
  --sand:#EFE9DC;
  --sand-3:#DCD0BA;

  /* ── ink ──────────────────────────────────────────────── */
  --ink-900:#191A17;   /* body text */
  --ink-800:#262824;
  --ink-700:#3D3F3A;   /* secondary text */
  --ink-500:#63665F;   /* meta — lightest that still clears AA on paper */
  --ink-400:#8C8F87;   /* disabled, placeholders */
  --ink-300:#B4B7AF;   /* text on the dark register */

  /* ── pine — the ONLY accent, used where a customer can act ─ */
  --pine-800:#1B2E24;
  --pine-700:#21382C;  /* accent TEXT on light. Never use pine-600 for text on paper */
  --pine-600:#2C4A3B;  /* button fills, focus rings */
  --pine-500:#3B6250;
  --pine-300:#7FA894;  /* accent on the dark register */
  --pine-100:#E3EAE5;  /* selected rows, in-stock chips */

  /* ── signal — scarcity and warnings only. Never decoration ─ */
  --rust-700:#8A3F22;
  --rust-600:#9C4A2A;
  --amber-700:#7E5A14;

  /* ── lines ────────────────────────────────────────────── */
  --line-hair:#DDD9D2;      /* structural hairlines */
  --line-strong:#868178;    /* form controls — lightest tone that reaches 3:1
                               on paper, surface, surface-2 AND sand */
  --line-hair-dark:#2E312C; /* hairlines on the dark register */

  /* ── type ─────────────────────────────────────────────── */
  --sans:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:'IBM Plex Mono','SFMono-Regular',Consolas,monospace;

  --t-display:clamp(2.2rem,4.6vw,3.5rem);
  --t-h1:1.9rem;
  --t-h2:1.65rem;
  --t-h3:1.05rem;
  --t-body:1rem;
  --t-small:.88rem;
  --t-spec:.82rem;
  --t-micro:.66rem;

  /* ── geometry & motion ────────────────────────────────── */
  --r:3px;
  --ease:cubic-bezier(.2,.6,.3,1);
  --dur:150ms;

  --wrap:1180px;
  --gutter:28px;

  /* ── vertical rhythm ──────────────────────────────────────
     Three values, used everywhere, so the distance between two things on this site is
     always one of three distances. Sections previously had no spacing rule at all — the
     class the templates asked for was never defined — and every page ran together. */
  --band:72px;        /* a major band of the page, top and bottom */
  --band-tight:48px;  /* the same on a phone, where 72 is a wasted screen */
  --stack:34px;       /* between blocks inside one band */
}

/* Turkish requires locl or İ and ı render with the wrong forms. Non-negotiable. */
html[lang="tr"],html[lang^="tr-"]{font-feature-settings:"locl" 1;}

/* Prices and spec figures must align in columns */
.price,.spec-figure,.num{font-feature-settings:"tnum" 1,"locl" 1;}

/* pine-600 clears 3:1 on every light surface */
:focus-visible{outline:2px solid var(--pine-600);outline-offset:3px;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;}
}