/* ============================================================
   SORTED LIGHT — design tokens
   toddlercupholder.com

   This file IS the door's visual identity. Everything that makes
   this site look like itself and not like another door lives here.

   "Sorted Light": calm, sane, ordered — the antidote to a chaotic
   toddler house. A cool, aired-out, just-tidied stage (cool near-
   white ground, cool ink, Sky-blue action) so the color-per-kid
   system reads as ORDER, not decoration. The deliberate break from
   couch / tumbler / bed, which all wear a warm ground.

   Anti-constellation law: do not copy this file to another door.
   Each door gets its own world.
   ============================================================ */

:root{
  /* ---- surface ---- */
  --paper:#F4F5F3;        /* ground — clean cool-bright near-white, faint cool-grey cast */
  --paper-lift:#FBFCFB;   /* raised surfaces, cards — cleaner/brighter cool white */
  --cream:#E8EDEB;        /* bands, fills + light text on dark sections — cool tint (was the warm checkout-continuity token; see report) */

  /* ---- ink ---- */
  --ink:#1E2321;          /* headings, primary text — cool near-black */
  --ink-soft:#49514D;     /* body copy — cool mid */
  --ink-faint:#828A86;    /* captions, eyebrows, micro — cool grey */
  --rule:#CDD2CE;         /* hairlines, borders — soft cool-grey */

  /* ---- accent ---- */
  --terracotta:#2E7098;       /* primary action — SKY (deepened from the soft product Sky for AA white-text contrast; see report) */
  --terracotta-deep:#22587A;  /* primary action, hover — deeper Sky */
  --sage:#7E9083;             /* secondary accent — calm cool sage-green */
  --gold:#AF8A46;             /* micro-accents ONLY (stars, flags) — never buttons; muted amber */
  --error:#D98A83;            /* alert / error text — cool clay-rose, tuned to read on the dark packs section */

  /* ---- product colorway swatches ---- */
  --sw-charcoal:#3A3733;
  --sw-sage:#7C8A6E;
  --sw-white:#F3F0EA;
  --sw-terracotta:#B4552F;
  --sw-navy:#2E3D52;
  --sw-sky:#8FAFC4;
  --sw-brick:#8E3B32;
  --sw-sand:#D9C8A9;

  /* ---- type ---- */
  --display:'Hanken Grotesk',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  /* ---- layout ---- */
  --shell:min(1180px,100% - 2.5rem);
  --gut:clamp(3.5rem,9vw,7rem);   /* vertical section rhythm */
  --r:7px;                         /* radius — soft, not pill, not square */
}