/* ============================================================
   SANDRA — Base: reset, body, grain, reduced-motion
   ============================================================ */

/* ---- Semantic theme tokens (default: four) ---- */
:root,
html[data-theme="four"] {
  --c-bg:        #18171a;
  --c-text:      #ece8e0;
  --c-accent:    #d4a853;
  --c-bg-2:      #1d1c1f;
  --c-ink-faint: rgba(236, 232, 224, 0.32);
  --c-rule:      rgba(236, 232, 224, 0.12);
}

html[data-theme="basalte"] {
  --c-bg:        #0f1318;
  --c-text:      #d0d3d8;
  --c-accent:    #7eb8a8;
  --c-bg-2:      #141920;
  --c-ink-faint: rgba(208, 211, 216, 0.32);
  --c-rule:      rgba(208, 211, 216, 0.12);
}

html[data-theme="raku"] {
  --c-bg:        #1a1214;
  --c-text:      #e8ddd5;
  --c-accent:    #a83240;
  --c-bg-2:      #201518;
  --c-ink-faint: rgba(232, 221, 213, 0.32);
  --c-rule:      rgba(232, 221, 213, 0.12);
}

html[data-theme="gres"] {
  --c-bg:        #f0e6d3;
  --c-text:      #3a2e24;
  --c-accent:    #c0653a;
  --c-bg-2:      #e5d8c1;
  --c-ink-faint: rgba(58, 46, 36, 0.32);
  --c-rule:      rgba(58, 46, 36, 0.12);
}

html[data-theme="porcelaine"] {
  --c-bg:        #f5f3f0;
  --c-text:      #2a2d32;
  --c-accent:    #3b5ea6;
  --c-bg-2:      #eae7e3;
  --c-ink-faint: rgba(42, 45, 50, 0.32);
  --c-rule:      rgba(42, 45, 50, 0.12);
}

html[data-theme="engobe"] {
  --c-bg:        #f2ece6;
  --c-text:      #2e1f1f;
  --c-accent:    #8b2942;
  --c-bg-2:      #e6ddd6;
  --c-ink-faint: rgba(46, 31, 31, 0.32);
  --c-rule:      rgba(46, 31, 31, 0.12);
}

/* ---- Smooth theme transition ---- */
html.theme-transition,
html.theme-transition * {
  transition: background-color 0.4s, color 0.4s, border-color 0.4s;
}

*, *::before, *::after { box-sizing: border-box; }

/* Lenis handles smooth scrolling — native smooth-scroll conflicts with it */
html { scroll-behavior: auto; }

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; }
a   { color: inherit; text-decoration: none; }
em  { font-style: italic; }

/* ---------- Texture overlays ---------- */
.grain {
  position: fixed; inset: 0; z-index: 90; pointer-events: none;
  opacity: .05; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Galerie vivante: minimal bottom vignette, no amber spot */
.stage-wash {
  position: fixed; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(120% 120% at 50% 120%, rgba(0, 0, 0, .35), transparent 60%);
}

/* Reveal states set by GSAP from-states */
[data-reveal] { will-change: transform, opacity; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; }
  .lantern__halo   { opacity: .8 !important; }
  .hero__stage img { filter: contrast(1.16) brightness(.6) saturate(1.1) !important; }
  .scroll-cue__line { animation: none; }
}