/* ============================================================
   Tralucia — Design tokens (landing)
   Palette derivata da src/lib/tokens.js (sand + ink + sage).
   ============================================================ */

:root {
  color-scheme: light dark;

  /* --- Brand (Tralucia kit: near-black + cream + bronze) --- */
  --ink:       #1A1816;
  --ink-mid:   #4A453E;
  --ink-soft:  #8A8578;
  --ink-ghost: #B5AFA4;

  /* accent: bronze — usato con parsimonia (em words, label, icone, hover) */
  --sage:       #8C6B3D;
  --sage-mid:   #B08E5E;
  --sage-light: #E8DCCB;

  --sand:      #F5F1EA;
  --sand-dark: #ECE5D8;
  --white:     #FBF9F4;

  /* --- Surfaces --- */
  --bg-page:   #F5F1EA;
  --surface:   #FBF9F4;
  --surface-2: #ECE5D8;

  /* --- Text --- */
  --text:    #1A1816;
  --text-2:  #8A8578;
  --text-3:  #B5AFA4;

  /* --- Lines --- */
  --line:        rgba(26,24,22,0.10);
  --line-mid:    rgba(26,24,22,0.18);

  /* --- Radius --- */
  --radius-sm:   6px;
  --radius:      10px;
  --radius-lg:   16px;
  --radius-pill: 999px;

  /* --- Space (8px base) --- */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* --- Typography --- */
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:  'Inter', -apple-system, sans-serif;
  --font-serif: 'Cormorant Garamond', Georgia, serif;

  --text-xs:   10px;
  --text-sm:   12px;
  --text-md:   13px;
  --text-base: 14px;
  --text-lg:   16px;
  --text-xl:   18px;
  --text-2xl:  24px;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;

  --line-height-tight:   1.2;
  --line-height-normal:  1.55;
  --line-height-relaxed: 1.8;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg-page:   #1A1816;
    --surface:   #262320;
    --surface-2: #201D1A;

    --text:    #F5F1EA;
    --text-2:  #B5AFA4;
    --text-3:  #6E685E;

    --line:        rgba(245,241,234,0.10);
    --line-mid:    rgba(245,241,234,0.18);

    --sage-light: rgba(140,107,61,0.20);
  }
}