/* ==========================================================
   Skov Design Group · Design tokens
   The single source of truth for color, type, space, and shape.
   Every page and the design system guide read from this file.
   ========================================================== */

:root {
  /* ---- Color: core palette ---- */
  --skov-ivory:       #F6F2EA;  /* primary ground */
  --skov-tabby:       #E8E0D1;  /* secondary ground, cards, rules */
  --skov-sage:        #9AAA8F;  /* signature accent, large shapes only */
  --skov-sage-bright: #B5C9A5;  /* brighter sage for use on River Night */
  --skov-deep-sage:   #5E6F57;  /* accent text, links, buttons */
  --skov-moss:        #52624B;  /* deep sage, darkened for small text on Tabby */
  --skov-river-night: #22303A;  /* dark ground: footer, dusk sections */
  --skov-ink:         #141414;  /* primary text */
  --skov-candle:      #C2A46B;  /* rare highlight on dark grounds */

  /* ---- Color: roles (use these in components) ---- */
  --color-bg:            var(--skov-ivory);
  --color-bg-alt:        var(--skov-tabby);
  --color-bg-dark:       var(--skov-river-night);
  --color-text:          var(--skov-ink);
  --color-text-muted:    #5A5852;
  --color-text-on-dark:  var(--skov-ivory);
  --color-muted-on-dark: #B9C0B2;
  --color-accent:        var(--skov-deep-sage);
  --color-accent-soft:   var(--skov-sage);
  --color-accent-dark:   var(--skov-sage-bright); /* accent on dark grounds */
  --color-highlight:     var(--skov-candle);  /* on dark grounds only */
  --color-rule:          #E1D9CA;
  --color-rule-dark:     rgba(154, 170, 143, 0.22);
  --color-focus:         var(--skov-deep-sage);

  /* ---- Type ---- */
  --font-display: "Gilda Display", "Didot", Georgia, serif;
  --font-body:    "Jost", "Futura", "Avenir Next", system-ui, sans-serif;

  --text-xs:   0.6875rem;  /* 11px  eyebrows, labels (always caps + tracking) */
  --text-sm:   0.875rem;   /* 14px  captions, meta */
  --text-base: 1.0625rem;  /* 17px  body */
  --text-lg:   1.25rem;    /* 20px  lead paragraphs */
  --text-xl:   1.75rem;    /* 28px  h3 */
  --text-2xl:  clamp(2rem, 3.6vw, 2.75rem);    /* h2 */
  --text-3xl:  clamp(2.5rem, 6vw, 4.5rem);     /* h1 / hero */

  --weight-light:   300;
  --weight-regular: 400;
  --weight-medium:  500;

  --leading-tight: 1.06;
  --leading-snug:  1.25;
  --leading-body:  1.7;

  --tracking-caps: 0.28em;   /* eyebrows, nav, buttons */
  --tracking-logo: 0.36em;

  /* ---- Space (8pt rhythm) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --section: clamp(4.5rem, 10vw, 8rem);

  /* ---- Layout ---- */
  --measure: 36rem;       /* comfortable reading width */
  --container: 76rem;

  /* ---- Shape & depth ---- */
  --radius-sm: 2px;
  --radius-md: 4px;
  --border: 1px solid var(--color-rule);
  --shadow-soft: 0 24px 48px -32px rgba(20, 20, 20, 0.35);

  /* ---- Motion ---- */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur: 240ms;
}