body[data-theme="minimal"] {
  --bg: #f3f5f8;
  --bg-strong: #e6ebf3;
  --surface: rgba(255, 255, 255, 0.68);
  --surface-strong: rgba(255, 255, 255, 0.9);
  --text-primary: #121722;
  --text-secondary: #4f5a6f;
  --accent: #0e69ff;
  --stroke: rgba(18, 23, 34, 0.11);
  --hero-font: "Syne", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #f5f8ff;
  --shadow-xl: 0 24px 80px rgba(18, 23, 34, 0.12);
  --shadow-glass: 0 40px 120px rgba(12, 24, 46, 0.2);
  --glass-top: rgba(255, 255, 255, 0.56);
  --glass-bottom: rgba(241, 246, 255, 0.12);
  --glass-edge: rgba(255, 255, 255, 0.62);
  --glass-line: rgba(255, 255, 255, 0.48);
  --glass-glow: rgba(201, 227, 255, 0.42);
}

body[data-theme="editorial"] {
  --bg: #fcf8f2;
  --bg-strong: #f4eee4;
  --surface: rgba(255, 250, 242, 0.72);
  --surface-strong: rgba(255, 252, 246, 0.9);
  --text-primary: #251e19;
  --text-secondary: #695748;
  --accent: #8b5a2b;
  --stroke: rgba(37, 30, 25, 0.13);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #fff8ef;
  --shadow-xl: 0 22px 74px rgba(72, 46, 25, 0.15);
  --shadow-glass: 0 36px 110px rgba(63, 38, 14, 0.24);
  --glass-top: rgba(255, 252, 244, 0.58);
  --glass-bottom: rgba(247, 235, 216, 0.14);
  --glass-edge: rgba(255, 248, 236, 0.66);
  --glass-line: rgba(255, 250, 240, 0.52);
  --glass-glow: rgba(255, 221, 184, 0.35);
}

body[data-theme="futuristic"] {
  --bg: #090d16;
  --bg-strong: #02040b;
  --surface: rgba(12, 19, 34, 0.72);
  --surface-strong: rgba(14, 22, 39, 0.86);
  --text-primary: #eff4ff;
  --text-secondary: #a1b5d4;
  --accent: #09e2ff;
  --stroke: rgba(173, 222, 255, 0.2);
  --hero-font: "Sora", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #01131e;
  --shadow-xl: 0 26px 90px rgba(0, 193, 255, 0.2);
  --shadow-glass: 0 42px 130px rgba(0, 132, 196, 0.34);
  --glass-top: rgba(163, 233, 255, 0.2);
  --glass-bottom: rgba(7, 24, 44, 0.24);
  --glass-edge: rgba(178, 238, 255, 0.54);
  --glass-line: rgba(210, 245, 255, 0.44);
  --glass-glow: rgba(60, 228, 255, 0.36);
  --glass-blur: 20px;
  --glass-sat: 190%;
}

body[data-theme="luxe"] {
  --bg: #101011;
  --bg-strong: #171317;
  --surface: rgba(27, 24, 29, 0.72);
  --surface-strong: rgba(28, 23, 31, 0.92);
  --text-primary: #f8f3ec;
  --text-secondary: #cabca7;
  --accent: #d5a054;
  --stroke: rgba(224, 191, 137, 0.21);
  --hero-font: "Syne", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #18120b;
  --shadow-xl: 0 26px 90px rgba(213, 160, 84, 0.2);
  --shadow-glass: 0 40px 130px rgba(109, 70, 23, 0.28);
  --glass-top: rgba(255, 238, 205, 0.24);
  --glass-bottom: rgba(34, 27, 21, 0.28);
  --glass-edge: rgba(253, 227, 177, 0.5);
  --glass-line: rgba(250, 229, 183, 0.42);
  --glass-glow: rgba(226, 172, 83, 0.3);
  --glass-blur: 19px;
  --glass-sat: 182%;
}

body[data-theme="editorial"] .hero-title {
  letter-spacing: -0.018em;
  line-height: 0.93;
}

body[data-theme="futuristic"] .hero-title {
  text-transform: uppercase;
  letter-spacing: 0.01em;
}

body[data-theme="futuristic"] .button {
  box-shadow: inset 0 0 0 1px rgba(10, 226, 255, 0.4);
}

body[data-theme="editorial"] .hero-3d-stage {
  background:
    radial-gradient(circle at 40% 40%, rgba(255, 246, 224, 0.1), transparent 56%),
    radial-gradient(circle at 66% 74%, rgba(139, 90, 43, 0.18), transparent 66%);
}

body[data-theme="futuristic"] .hero-3d-stage {
  background:
    radial-gradient(circle at 40% 40%, rgba(180, 245, 255, 0.08), transparent 56%),
    radial-gradient(circle at 66% 74%, rgba(9, 226, 255, 0.2), transparent 66%);
}

body[data-theme="luxe"] .hero-3d-stage {
  background:
    radial-gradient(circle at 40% 40%, rgba(255, 230, 184, 0.08), transparent 56%),
    radial-gradient(circle at 66% 74%, rgba(213, 160, 84, 0.18), transparent 66%);
}

body[data-theme="luxe"] .button {
  border-radius: 10px;
}

body[data-theme="luxe"] .offer-card,
body[data-theme="luxe"] .timeline li,
body[data-theme="luxe"] .proof-grid {
  border-color: color-mix(in srgb, var(--glass-edge) 56%, var(--stroke));
}

body[data-theme="futuristic"] .offer-card,
body[data-theme="futuristic"] .timeline li,
body[data-theme="futuristic"] .proof-grid {
  box-shadow:
    0 0 0 1px rgba(9, 226, 255, 0.22),
    0 26px 92px rgba(9, 226, 255, 0.2),
    inset 0 0 28px rgba(9, 226, 255, 0.08);
}

body[data-theme="editorial"] .button {
  border-radius: 14px;
}

body[data-theme="editorial"] .styles-hero {
  border-color: color-mix(in srgb, var(--glass-edge) 62%, var(--stroke));
}

body[data-theme="futuristic"] .styles-hero {
  box-shadow:
    0 0 0 1px rgba(9, 226, 255, 0.24),
    0 36px 100px rgba(9, 226, 255, 0.2),
    inset 0 0 28px rgba(9, 226, 255, 0.08);
}

body[data-theme="luxe"] .styles-hero {
  border-color: color-mix(in srgb, var(--glass-edge) 64%, var(--stroke));
}

/* ════════════════════════════════════════════════════════════════
   SHOWCASE BUSINESS UNIVERSES — body[data-biz="..."]
   Utilisent les mêmes custom properties que les [data-theme] afin
   que toute la page (orbs, fond, scroll-bar) adopte l'univers.
   ════════════════════════════════════════════════════════════════ */

body[data-biz] {
  transition: background 700ms ease, color 500ms ease;
}

/* Pendant la transition de frame : couper la transition du body entier.
   La page background est invisible derrière les frames — le transition est inutile
   et provoque un repaint full-page coûteux. */
body[data-biz].theme-switching {
  transition: none;
}

/* Aurora + orbs/caustics sont cachés derrière les frames du showcase.
   On les met en pause pour économiser du GPU (animations ~30s/16s infinies). */
body[data-biz]::before,
body[data-biz]::after {
  animation-play-state: paused;
}

body[data-biz] .orb,
body[data-biz] .caustic {
  animation-play-state: paused;
  opacity: 0;
  transition: opacity 400ms ease;
}

body[data-biz="spa"] {
  --bg: #f4f0ea;
  --bg-strong: #ebe4d8;
  --surface: rgba(250, 246, 240, 0.74);
  --surface-strong: rgba(255, 252, 247, 0.92);
  --text-primary: #2c2620;
  --text-secondary: #7a6a58;
  --accent: #8fad8a;
  --stroke: rgba(44, 38, 32, 0.1);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #1e1a16;
  --shadow-xl: 0 24px 80px rgba(100, 90, 70, 0.14);
  --shadow-glass: 0 36px 120px rgba(80, 68, 50, 0.18);
  --glass-top: rgba(255, 252, 246, 0.6);
  --glass-bottom: rgba(240, 232, 218, 0.16);
  --glass-edge: rgba(255, 250, 240, 0.68);
  --glass-line: rgba(255, 248, 236, 0.54);
  --glass-glow: rgba(200, 220, 196, 0.4);
  /* Showcase-specific */
  --sc-deco: rgba(143, 173, 138, 0.22);
  --sc-hl-size: clamp(2.4rem, 5.5vw, 5rem);
}

body[data-biz="resto"] {
  --bg: #0e0b0a;
  --bg-strong: #070505;
  --surface: rgba(20, 15, 13, 0.78);
  --surface-strong: rgba(24, 18, 15, 0.94);
  --text-primary: #f5ede4;
  --text-secondary: #a0887a;
  --accent: #8b2635;
  --stroke: rgba(245, 237, 228, 0.12);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #f5ede4;
  --shadow-xl: 0 26px 90px rgba(139, 38, 53, 0.22);
  --shadow-glass: 0 40px 130px rgba(100, 22, 36, 0.34);
  --glass-top: rgba(255, 240, 230, 0.14);
  --glass-bottom: rgba(20, 12, 10, 0.28);
  --glass-edge: rgba(240, 210, 194, 0.3);
  --glass-line: rgba(255, 230, 210, 0.22);
  --glass-glow: rgba(139, 38, 53, 0.28);
  /* Showcase-specific */
  --sc-deco: rgba(139, 38, 53, 0.2);
  --sc-hl-size: clamp(2.8rem, 6vw, 6rem);
}

body[data-biz="mode"] {
  --bg: #ffffff;
  --bg-strong: #f2f2f2;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-strong: rgba(255, 255, 255, 0.96);
  --text-primary: #080808;
  --text-secondary: #555555;
  --accent: #080808;
  --stroke: rgba(8, 8, 8, 0.12);
  --hero-font: "Syne", sans-serif;
  --body-font: "Syne", sans-serif;
  --button-text: #ffffff;
  --shadow-xl: 0 22px 70px rgba(0, 0, 0, 0.1);
  --shadow-glass: 0 36px 110px rgba(0, 0, 0, 0.18);
  --glass-top: rgba(255, 255, 255, 0.7);
  --glass-bottom: rgba(240, 240, 240, 0.2);
  --glass-edge: rgba(255, 255, 255, 0.78);
  --glass-line: rgba(255, 255, 255, 0.6);
  --glass-glow: rgba(0, 0, 0, 0.04);
  /* Showcase-specific */
  --sc-deco: rgba(8, 8, 8, 0.05);
  --sc-hl-size: clamp(3.2rem, 7.5vw, 7.5rem);
}

body[data-biz="immo"] {
  --bg: #0d1829;
  --bg-strong: #070e1a;
  --surface: rgba(15, 26, 48, 0.76);
  --surface-strong: rgba(18, 30, 54, 0.94);
  --text-primary: #eee8dc;
  --text-secondary: #8e9db8;
  --accent: #c9a96e;
  --stroke: rgba(201, 169, 110, 0.2);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #0d1829;
  --shadow-xl: 0 26px 90px rgba(201, 169, 110, 0.16);
  --shadow-glass: 0 42px 130px rgba(13, 24, 41, 0.5);
  --glass-top: rgba(201, 169, 110, 0.18);
  --glass-bottom: rgba(10, 18, 34, 0.28);
  --glass-edge: rgba(201, 169, 110, 0.38);
  --glass-line: rgba(220, 195, 148, 0.3);
  --glass-glow: rgba(201, 169, 110, 0.24);
  /* Showcase-specific */
  --sc-deco: rgba(201, 169, 110, 0.12);
  --sc-hl-size: clamp(2.2rem, 5vw, 4.8rem);
}

body[data-biz="saas"] {
  --bg: #06080f;
  --bg-strong: #020308;
  --surface: rgba(8, 13, 24, 0.78);
  --surface-strong: rgba(10, 16, 28, 0.94);
  --text-primary: #e8f0ff;
  --text-secondary: #7a9ac0;
  --accent: #1a8cff;
  --stroke: rgba(26, 140, 255, 0.22);
  --hero-font: "Sora", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #ffffff;
  --shadow-xl: 0 26px 90px rgba(26, 140, 255, 0.22);
  --shadow-glass: 0 42px 130px rgba(10, 70, 180, 0.38);
  --glass-top: rgba(26, 140, 255, 0.18);
  --glass-bottom: rgba(6, 10, 20, 0.3);
  --glass-edge: rgba(80, 170, 255, 0.44);
  --glass-line: rgba(140, 200, 255, 0.36);
  --glass-glow: rgba(26, 140, 255, 0.32);
  /* Showcase-specific */
  --sc-deco: rgba(26, 140, 255, 0.12);
  --sc-hl-size: clamp(2.4rem, 5.8vw, 5.6rem);
}

body[data-biz="conseil"] {
  --bg: #0f1f14;
  --bg-strong: #091409;
  --surface: rgba(16, 32, 20, 0.78);
  --surface-strong: rgba(20, 38, 24, 0.96);
  --text-primary: #e8e2d0;
  --text-secondary: #8a9d84;
  --accent: #c4a24a;
  --stroke: rgba(196, 162, 74, 0.18);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #0f1f14;
  --shadow-xl: 0 26px 90px rgba(196, 162, 74, 0.18);
  --shadow-glass: 0 42px 130px rgba(15, 31, 20, 0.6);
  --glass-top: rgba(196, 162, 74, 0.16);
  --glass-bottom: rgba(12, 24, 16, 0.28);
  --glass-edge: rgba(196, 162, 74, 0.36);
  --glass-line: rgba(220, 192, 120, 0.28);
  --glass-glow: rgba(196, 162, 74, 0.22);
  /* Showcase-specific */
  --sc-deco: rgba(196, 162, 74, 0.12);
  --sc-hl-size: clamp(2.2rem, 4.8vw, 4.6rem);
}

body[data-biz="beaute"] {
  --bg: #faf4f5;
  --bg-strong: #f2e8ea;
  --surface: rgba(250, 242, 244, 0.74);
  --surface-strong: rgba(255, 248, 250, 0.92);
  --text-primary: #2d1f22;
  --text-secondary: #8b6a71;
  --accent: #c4788a;
  --stroke: rgba(45, 31, 34, 0.1);
  --hero-font: "Cormorant Garamond", serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #2d1f22;
  --shadow-xl: 0 24px 80px rgba(196, 120, 138, 0.16);
  --shadow-glass: 0 36px 120px rgba(160, 80, 100, 0.2);
  --glass-top: rgba(255, 246, 248, 0.62);
  --glass-bottom: rgba(242, 226, 230, 0.16);
  --glass-edge: rgba(255, 242, 246, 0.7);
  --glass-line: rgba(255, 238, 244, 0.54);
  --glass-glow: rgba(196, 120, 138, 0.28);
  /* Showcase-specific */
  --sc-deco: rgba(196, 120, 138, 0.18);
  --sc-hl-size: clamp(2.6rem, 6vw, 5.5rem);
}

body[data-biz="sante"] {
  --bg: #f4f8fb;
  --bg-strong: #e8f0f6;
  --surface: rgba(244, 248, 252, 0.76);
  --surface-strong: rgba(250, 253, 255, 0.92);
  --text-primary: #0f2535;
  --text-secondary: #4a6880;
  --accent: #2c7be5;
  --stroke: rgba(15, 37, 53, 0.1);
  --hero-font: "Manrope", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #ffffff;
  --shadow-xl: 0 24px 80px rgba(44, 123, 229, 0.16);
  --shadow-glass: 0 36px 120px rgba(30, 100, 200, 0.2);
  --glass-top: rgba(244, 250, 255, 0.62);
  --glass-bottom: rgba(220, 235, 248, 0.16);
  --glass-edge: rgba(200, 225, 248, 0.66);
  --glass-line: rgba(210, 230, 252, 0.52);
  --glass-glow: rgba(44, 123, 229, 0.22);
  /* Showcase-specific */
  --sc-deco: rgba(44, 123, 229, 0.1);
  --sc-hl-size: clamp(2.2rem, 5vw, 4.8rem);
}

body[data-biz="archi"] {
  --bg: #1c1c1e;
  --bg-strong: #111113;
  --surface: rgba(28, 28, 30, 0.8);
  --surface-strong: rgba(32, 32, 35, 0.96);
  --text-primary: #f0ebe2;
  --text-secondary: #9a9080;
  --accent: #b87333;
  --stroke: rgba(184, 115, 51, 0.22);
  --hero-font: "Syne", sans-serif;
  --body-font: "Manrope", sans-serif;
  --button-text: #1c1c1e;
  --shadow-xl: 0 26px 90px rgba(184, 115, 51, 0.2);
  --shadow-glass: 0 40px 130px rgba(100, 60, 20, 0.3);
  --glass-top: rgba(184, 115, 51, 0.16);
  --glass-bottom: rgba(24, 24, 26, 0.28);
  --glass-edge: rgba(200, 140, 70, 0.38);
  --glass-line: rgba(210, 160, 90, 0.3);
  --glass-glow: rgba(184, 115, 51, 0.24);
  /* Showcase-specific */
  --sc-deco: rgba(184, 115, 51, 0.12);
  --sc-hl-size: clamp(2.8rem, 6.5vw, 6rem);
}