/* ─────────────────────────────────────────────────────────────────────────
   VILLA SUN — DESIGN TOKENS
   Belmond / Cheval Blanc inspiration : ivoire, champagne, marine profonde
   ───────────────────────────────────────────────────────────────────────── */

:root {
  /* ── Palette CHAMPAGNE (défaut Belmond) ─────────────────────────────── */
  --vs-ivory-50:  #FBF8F2;
  --vs-ivory-100: #F6F0E4;   /* sand beige principal */
  --vs-ivory-200: #ECE3D1;
  --vs-ivory-300: #DBCCB0;
  --vs-ivory-400: #C0AC83;
  --vs-ivory-500: #A89968;   /* olive gold */
  --vs-ivory-600: #8A7A52;
  --vs-ivory-700: #6B5E40;
  --vs-ivory-800: #4D4530;
  --vs-ivory-900: #2D2820;

  --vs-gold-50:   #FAF5EB;
  --vs-gold-100:  #F1E6CC;
  --vs-gold-200:  #E4D2A6;
  --vs-gold-300:  #D4BB80;
  --vs-gold-400:  #C2A875;   /* champagne gold — accent principal */
  --vs-gold-500:  #B0945F;
  --vs-gold-600:  #927A4D;
  --vs-gold-700:  #74613D;
  --vs-gold-800:  #56492E;
  --vs-gold-900:  #3A311F;

  --vs-terracotta-50:  #FAF1EC;
  --vs-terracotta-100: #F2DDD0;
  --vs-terracotta-200: #E6BFA8;
  --vs-terracotta-300: #D49D7F;
  --vs-terracotta-400: #B47A5E;   /* terracotta affinée (CTA chaud) */
  --vs-terracotta-500: #9A6248;
  --vs-terracotta-600: #7E5039;
  --vs-terracotta-700: #62402D;
  --vs-terracotta-800: #4A3122;
  --vs-terracotta-900: #2F1F16;

  --vs-marine-50:  #ECF1F3;
  --vs-marine-100: #D3DEE2;
  --vs-marine-200: #A8BDC4;
  --vs-marine-300: #7A99A4;
  --vs-marine-400: #4F7682;
  --vs-marine-500: #325864;
  --vs-marine-600: #1F4651;   /* marine profonde — accent froid */
  --vs-marine-700: #173640;
  --vs-marine-800: #11272E;
  --vs-marine-900: #0B1A1F;

  --vs-ink-50:  #F4F2EC;
  --vs-ink-100: #E5E1D5;
  --vs-ink-200: #C7BEA8;
  --vs-ink-300: #8F8268;
  --vs-ink-400: #5C5240;
  --vs-ink-500: #3A3328;
  --vs-ink-600: #2A241D;
  --vs-ink-700: #1F1A14;   /* ink noir chaud */
  --vs-ink-800: #14110D;
  --vs-ink-900: #0A0907;

  --vs-pearl: #FAF7F2;

  /* ── Couleurs sémantiques (mappées par les Tweaks) ───────────────────── */
  --vs-bg:          var(--vs-ivory-100);
  --vs-bg-elev:     var(--vs-pearl);
  --vs-bg-deep:     var(--vs-ivory-200);
  --vs-fg:          var(--vs-ink-700);
  --vs-fg-soft:     var(--vs-ink-500);
  --vs-fg-muted:    var(--vs-ink-400);
  --vs-line:        var(--vs-ivory-300);
  --vs-line-soft:   var(--vs-ivory-200);
  --vs-accent:      var(--vs-gold-400);     /* gold — luxe */
  --vs-accent-deep: var(--vs-gold-600);
  --vs-warm:        var(--vs-terracotta-400); /* CTA chaud */
  --vs-warm-deep:   var(--vs-terracotta-500);
  --vs-cool:        var(--vs-marine-600);   /* marine */
  --vs-cool-soft:   var(--vs-marine-400);

  /* ── Typographie ─────────────────────────────────────────────────────── */
  --vs-serif: 'Cormorant Garamond', 'EB Garamond', Georgia, serif;
  --vs-sans:  'Inter', 'Outfit', -apple-system, system-ui, sans-serif;

  /* Échelle — Tailwind-like avec tailles display agrandies */
  --vs-text-xs:   12px;   --vs-lh-xs:   1.5;
  --vs-text-sm:   13px;   --vs-lh-sm:   1.55;
  --vs-text-base: 15px;   --vs-lh-base: 1.65;
  --vs-text-lg:   17px;   --vs-lh-lg:   1.6;
  --vs-text-xl:   20px;   --vs-lh-xl:   1.5;
  --vs-text-2xl:  24px;   --vs-lh-2xl:  1.4;
  --vs-text-3xl:  30px;   --vs-lh-3xl:  1.3;
  --vs-text-4xl:  38px;   --vs-lh-4xl:  1.2;
  --vs-text-5xl:  48px;   --vs-lh-5xl:  1.1;
  --vs-text-6xl:  64px;   --vs-lh-6xl:  1.05;
  --vs-text-7xl:  80px;   --vs-lh-7xl:  1;
  --vs-text-8xl:  100px;  --vs-lh-8xl:  .98;
  --vs-text-9xl:  128px;  --vs-lh-9xl:  .95;

  /* Letter-spacing */
  --vs-tracking-tight:  -0.02em;
  --vs-tracking-snug:   -0.01em;
  --vs-tracking-normal: 0;
  --vs-tracking-wide:   0.04em;
  --vs-tracking-wider:  0.12em;
  --vs-tracking-widest: 0.24em;

  /* ── Espacement (échelle 8px) ────────────────────────────────────────── */
  --vs-s-1:   8px;
  --vs-s-2:   16px;
  --vs-s-3:   24px;
  --vs-s-4:   32px;
  --vs-s-6:   48px;
  --vs-s-8:   64px;
  --vs-s-12:  96px;
  --vs-s-16:  128px;
  --vs-s-24:  192px;

  /* ── Layout ──────────────────────────────────────────────────────────── */
  --vs-container: 1440px;
  --vs-gutter:    32px;
  --vs-gutter-lg: 64px;

  /* ── Bordures & rayons (luxe = peu de radius) ────────────────────────── */
  --vs-radius-sm: 2px;
  --vs-radius:    4px;
  --vs-radius-md: 8px;
  --vs-radius-lg: 16px;
  --vs-radius-pill: 999px;
  --vs-hairline: 0.5px solid var(--vs-line);

  /* ── Ombres (très subtiles) ──────────────────────────────────────────── */
  --vs-shadow-xs: 0 1px 2px rgba(31, 26, 20, 0.04);
  --vs-shadow-sm: 0 2px 6px rgba(31, 26, 20, 0.06);
  --vs-shadow:    0 6px 24px rgba(31, 26, 20, 0.08);
  --vs-shadow-lg: 0 20px 60px rgba(31, 26, 20, 0.12);
  --vs-shadow-glass: 0 1px 0 rgba(255,255,255,.5) inset, 0 12px 40px rgba(31,26,20,.10);

  /* ── Motion ──────────────────────────────────────────────────────────── */
  --vs-ease:      cubic-bezier(0.16, 1, 0.3, 1);
  --vs-ease-out:  cubic-bezier(0.22, 1, 0.36, 1);
  --vs-dur-1:     200ms;
  --vs-dur-2:     400ms;
  --vs-dur-3:     600ms;
  --vs-dur-4:     800ms;
}

/* ── Palette SUNSET (terracotta + ocre + crème chaude) ─────────────────── */
[data-palette="sunset"] {
  --vs-bg:          #F5EADC;
  --vs-bg-elev:     #FBF4E8;
  --vs-bg-deep:     #ECDBC4;
  --vs-fg:          #2A1F14;
  --vs-fg-soft:     #5A4632;
  --vs-fg-muted:    #80694F;
  --vs-line:        #DDC9AC;
  --vs-line-soft:   #EBD9BD;
  --vs-accent:      #C8884F;   /* ocre chaud */
  --vs-accent-deep: #A36B38;
  --vs-warm:        #B85B3A;   /* terracotta vive */
  --vs-warm-deep:   #8E4226;
  --vs-cool:        #4A6452;   /* olive doux */
  --vs-cool-soft:   #7A8C7C;
}

/* ── Palette MARINE (bleu profond, sable clair, accent doré) ───────────── */
[data-palette="marine"] {
  --vs-bg:          #F2F0E8;
  --vs-bg-elev:     #FAF9F4;
  --vs-bg-deep:     #E2DED1;
  --vs-fg:          #15252B;
  --vs-fg-soft:     #3A4F56;
  --vs-fg-muted:    #6A7D83;
  --vs-line:        #C7CFCD;
  --vs-line-soft:   #DDE2DF;
  --vs-accent:      #B89B5E;   /* doré atténué */
  --vs-accent-deep: #927A48;
  --vs-warm:        #1F4651;   /* marine = CTA */
  --vs-warm-deep:   #12303A;
  --vs-cool:        #1F4651;
  --vs-cool-soft:   #4F7682;
}

/* ── Typographie alternative ───────────────────────────────────────────── */
[data-type="cormorant-outfit"] { --vs-sans: 'Outfit', system-ui, sans-serif; }
[data-type="ebgaramond-inter"] {
  --vs-serif: 'EB Garamond', 'Cormorant Garamond', Georgia, serif;
  --vs-sans:  'Inter', system-ui, sans-serif;
}

/* ── RTL ───────────────────────────────────────────────────────────────── */
[dir="rtl"] {
  /* Hebrew renders better with slightly tighter tracking on serif */
  --vs-tracking-snug: -0.005em;
}