/* Oke & Tempo - Design tokens SSOT (15/Aug/26)
   Extracted from index.html inline <style> block.
   Edit here, not in the inline block. */

:root {
  --cotton: #f0efe7;
  --charcoal: #212120;
  --chocolate: #3a2c28;
  --greige: #c8c6ba;
  --white: #ffffff;
  --copy-size: clamp(0.98rem, 1.35vw, 1.16rem);
  --copy-leading: 1.48;
  --copy-gap: 0.9rem;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);
  --underline-h: 1px;
  --underline-bp: 4px;
  --underline-op: 0.55;
  --underline-dur: 0.7s;
  --underline-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --btn-size: 0.62rem;
  --btn-size-sm: 0.58rem;
  --track-primary: 0.14em;
  --track-secondary: 0.12em;
  --track-meta: 0.08em;
  --btn-pad-y: 0.625rem;
  --btn-pad-y-sm: 0.45rem;
  --btn-pad-y-back: 0.5rem;
  /* Underline atom contract:
     rest = none (scaleX 0). hover/focus = scaleX 1.
     Users: nav-btn, dropdown-btn, back, founder-back, word-cue.
     No underline: link--web (globe + label; hover = full white + hint),
     btn--primary (filled), icon-only anchors (opacity only).
     Never leave UA text-decoration underline on <a>. */
}

@media (max-width: 640px) {
  :root {
    --copy-size: clamp(0.94rem, 4vw, 1.06rem);
    --copy-leading: 1.52;
    --copy-gap: 0.85rem;
  }
}