/* =====================================================================
   THÈMES — fichier commun aux trois sites
   ---------------------------------------------------------------------
   Le thème actif est choisi dans config.json  →  "theme": "aurore"
   Thèmes disponibles :
     aurore     coloré, chaleureux, détendu
     ardoise    sérieux, sobre, corporate
     editorial  élégant, typographie à empattements
     minuit     sombre, tech, néon doux
     nature     doux, verts et tons terre
     constellation  nuit étoilée, sombre, ciel texturé (créé pour hoku.be)
   Pour créer un thème : copie un bloc [data-theme="..."], renomme-le,
   change les valeurs, et ajoute ses polices dans core.js (THEME_FONTS).
   Pour juste ajuster une couleur : "themeOverrides" dans config.json.
   ===================================================================== */

:root,
[data-theme="aurore"] {
  --bg: #fbf7f1;
  --bg-alt: #f4ede2;
  --surface: #ffffff;
  --surface-2: #fdfaf5;
  --ink: #1d1a2b;
  --ink-soft: #5b5670;
  --ink-faint: #8d88a0;
  --line: #ece5da;
  --accent: #7b5cff;
  --accent-ink: #ffffff;
  --accent-2: #ff6b4a;
  --accent-3: #14b8a6;
  --c1: #7b5cff; --c2: #ff6b4a; --c3: #14b8a6; --c4: #f5a524; --c5: #ec4899; --c6: #3b82f6;
  --radius: 22px;
  --radius-sm: 12px;
  --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(29,26,43,.05), 0 14px 34px -14px rgba(29,26,43,.22);
  --shadow-hover: 0 2px 4px rgba(29,26,43,.06), 0 24px 48px -16px rgba(29,26,43,.3);
  --font-display: "Bricolage Grotesque", system-ui, sans-serif;
  --font-body: "DM Sans", system-ui, sans-serif;
  --display-weight: 800;
  --display-tracking: -0.03em;
  --eyebrow-transform: none;
  --blob-1: #ff6b4a; --blob-2: #7b5cff; --blob-3: #ffc23d;
  --blob-opacity: .3;
  --card-border: transparent;
  --photo-shape: 200px 200px var(--radius) var(--radius);
  color-scheme: light;
}

[data-theme="ardoise"] {
  --bg: #f6f7f9;
  --bg-alt: #eef0f4;
  --surface: #ffffff;
  --surface-2: #fafbfc;
  --ink: #0f172a;
  --ink-soft: #475569;
  --ink-faint: #94a3b8;
  --line: #e2e8f0;
  --accent: #1e40af;
  --accent-ink: #ffffff;
  --accent-2: #0f766e;
  --accent-3: #b45309;
  --c1: #1e40af; --c2: #0f766e; --c3: #7c3aed; --c4: #b45309; --c5: #be123c; --c6: #334155;
  --radius: 10px;
  --radius-sm: 6px;
  --radius-pill: 6px;
  --shadow: 0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.08);
  --shadow-hover: 0 4px 6px rgba(15,23,42,.05), 0 12px 24px -6px rgba(15,23,42,.14);
  --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --display-weight: 700;
  --display-tracking: -0.025em;
  --eyebrow-transform: uppercase;
  --blob-1: transparent; --blob-2: transparent; --blob-3: transparent;
  --blob-opacity: 0;
  --card-border: #e2e8f0;
  --photo-shape: var(--radius);
  color-scheme: light;
}

[data-theme="editorial"] {
  --bg: #f7f4ee;
  --bg-alt: #efe9de;
  --surface: #fffdf9;
  --surface-2: #faf6ef;
  --ink: #1a1714;
  --ink-soft: #5c544a;
  --ink-faint: #9a9083;
  --line: #e2d9ca;
  --accent: #b5452a;
  --accent-ink: #ffffff;
  --accent-2: #2d4a3e;
  --accent-3: #c79a3a;
  --c1: #b5452a; --c2: #2d4a3e; --c3: #c79a3a; --c4: #3d4f7a; --c5: #8a3b5c; --c6: #5c544a;
  --radius: 4px;
  --radius-sm: 2px;
  --radius-pill: 999px;
  --shadow: 0 1px 0 rgba(26,23,20,.06);
  --shadow-hover: 0 18px 40px -20px rgba(26,23,20,.35);
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Manrope", system-ui, sans-serif;
  --display-weight: 600;
  --display-tracking: -0.02em;
  --eyebrow-transform: uppercase;
  --blob-1: transparent; --blob-2: transparent; --blob-3: transparent;
  --blob-opacity: 0;
  --card-border: #e2d9ca;
  --photo-shape: 2px;
  color-scheme: light;
}

[data-theme="minuit"] {
  --bg: #0b0d17;
  --bg-alt: #11142a;
  --surface: #151933;
  --surface-2: #1b2040;
  --ink: #eef0ff;
  --ink-soft: #a8acc9;
  --ink-faint: #6e7396;
  --line: #262b4d;
  --accent: #7c8cff;
  --accent-ink: #0b0d17;
  --accent-2: #22d3ee;
  --accent-3: #f472b6;
  --c1: #7c8cff; --c2: #22d3ee; --c3: #f472b6; --c4: #fbbf24; --c5: #34d399; --c6: #a78bfa;
  --radius: 18px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --shadow: 0 0 0 1px rgba(124,140,255,.08), 0 18px 40px -18px rgba(0,0,0,.8);
  --shadow-hover: 0 0 0 1px rgba(124,140,255,.35), 0 24px 60px -18px rgba(124,140,255,.35);
  --font-display: "Sora", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --display-weight: 700;
  --display-tracking: -0.035em;
  --eyebrow-transform: uppercase;
  --blob-1: #4f46e5; --blob-2: #06b6d4; --blob-3: #db2777;
  --blob-opacity: .28;
  --card-border: #262b4d;
  --photo-shape: 50%;
  color-scheme: dark;
}

[data-theme="nature"] {
  --bg: #f3f1ea;
  --bg-alt: #e8e6db;
  --surface: #fbfaf6;
  --surface-2: #f6f5ef;
  --ink: #1f2a22;
  --ink-soft: #55624f;
  --ink-faint: #8a9584;
  --line: #dcdccd;
  --accent: #3f6b4c;
  --accent-ink: #ffffff;
  --accent-2: #c0703f;
  --accent-3: #8a9a5b;
  --c1: #3f6b4c; --c2: #c0703f; --c3: #8a9a5b; --c4: #6b8fa3; --c5: #a35d6a; --c6: #b89a4a;
  --radius: 28px;
  --radius-sm: 14px;
  --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(31,42,34,.05), 0 12px 30px -16px rgba(31,42,34,.25);
  --shadow-hover: 0 2px 4px rgba(31,42,34,.06), 0 22px 44px -18px rgba(31,42,34,.32);
  --font-display: "Young Serif", Georgia, serif;
  --font-body: "Nunito Sans", system-ui, sans-serif;
  --display-weight: 400;
  --display-tracking: -0.01em;
  --eyebrow-transform: none;
  --blob-1: #8a9a5b; --blob-2: #c0703f; --blob-3: #6b8fa3;
  --blob-opacity: .18;
  --card-border: transparent;
  --photo-shape: 999px 999px var(--radius) var(--radius);
  color-scheme: light;
}

/* ---------------------------------------------------------------------
   CONSTELLATION — nuit profonde, étoiles discrètes, accents or et glace
   --------------------------------------------------------------------- */
[data-theme="constellation"] {
  --bg: #070a1c;
  --bg-alt: #0c1130;
  --surface: rgba(17, 23, 56, .72);
  --surface-2: rgba(24, 31, 72, .78);
  --ink: #eef1ff;
  --ink-soft: #a9b0d6;
  --ink-faint: #6f77a3;
  --line: rgba(170, 182, 255, .13);
  --accent: #f3d98b;
  --accent-ink: #0b0d1c;
  --accent-2: #8fb8ff;
  --accent-3: #c4a7ff;
  --c1: #8fb8ff; --c2: #f3d98b; --c3: #c4a7ff; --c4: #7ee0d0; --c5: #ff9fb4; --c6: #a5b4fc;
  --radius: 18px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --shadow: 0 0 0 1px rgba(170,182,255,.10), 0 20px 50px -24px rgba(0,0,0,.9);
  --shadow-hover: 0 0 0 1px rgba(243,217,139,.35), 0 0 40px -8px rgba(143,184,255,.25), 0 24px 60px -24px rgba(0,0,0,.9);
  --font-display: "Jost", "Futura", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --display-weight: 500;
  --display-tracking: -0.015em;
  --eyebrow-transform: uppercase;
  --blob-1: transparent; --blob-2: transparent; --blob-3: transparent;
  --blob-opacity: 0;
  --card-border: rgba(170,182,255,.12);
  --photo-shape: 50%;
  color-scheme: dark;
}
/* Ciel : nébuleuses très douces + trois couches d'étoiles en motif répété */
[data-theme="constellation"] body {
  background-color: var(--bg);
  background-image:
    radial-gradient(ellipse 60% 45% at 88% 0%, rgba(99, 102, 241, .16), transparent 70%),
    radial-gradient(ellipse 50% 40% at 0% 100%, rgba(45, 212, 191, .07), transparent 70%),
    radial-gradient(ellipse 80% 60% at 50% 50%, rgba(30, 41, 99, .25), transparent 80%);
  background-attachment: fixed;
}
[data-theme="constellation"] body::before,
[data-theme="constellation"] body::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
}
[data-theme="constellation"] body::before {
  background-image:
    radial-gradient(1px 1px at 23px 41px,  rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1px 1px at 97px 163px, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(1px 1px at 151px 88px, rgba(200,215,255,.45), transparent 60%),
    radial-gradient(1px 1px at 201px 207px,rgba(255,255,255,.30), transparent 60%),
    radial-gradient(1px 1px at 62px 219px, rgba(255,240,210,.40), transparent 60%),
    radial-gradient(1.5px 1.5px at 133px 312px, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 287px 61px,  rgba(200,215,255,.50), transparent 60%),
    radial-gradient(1.5px 1.5px at 341px 251px, rgba(255,240,210,.45), transparent 60%);
  background-size: 240px 240px, 240px 240px, 240px 240px, 240px 240px, 240px 240px, 390px 390px, 390px 390px, 390px 390px;
}
/* Quelques étoiles plus brillantes qui scintillent lentement */
[data-theme="constellation"] body::after {
  background-image:
    radial-gradient(2px 2px at 120px 90px,  #fff, transparent 70%),
    radial-gradient(2px 2px at 470px 380px, #f3d98b, transparent 70%),
    radial-gradient(2px 2px at 610px 140px, #cfe0ff, transparent 70%),
    radial-gradient(6px 6px at 470px 380px, rgba(243,217,139,.25), transparent 70%);
  background-size: 720px 520px;
  animation: twinkle 7s ease-in-out infinite alternate;
}
@keyframes twinkle { from { opacity: .35; } to { opacity: 1; } }