/* ═══════════════════════════════════════════════════════════════════════════
   FONDAZIONE CARAVELLI — COUCHE 3D FLAMBOYANTE  (fc-3d-flamboyant.css)
   ───────────────────────────────────────────────────────────────────────────
   Styles du voile décoratif posé par assets/js/fc-3d-flamboyant.js sur les
   surfaces [data-k3-scene] et héros .k3v3-* du Palazzo.

   Palette : Carrara (blanc froid), Obsidienne (noir bleu), Lapis (bleu
   profond), or pâle — rim lights chaud/froid façon caustiques de marbre.
   Les couleurs d'accent sont injectées en variables par le JS :
     --fc3d-froid : "r, g, b" de la rim froide (par scène)
     --fc3d-chaud : "r, g, b" de la rim chaude (or pâle)

   Aucune règle ici ne modifie la mise en page existante : tout est en
   position:absolute; inset:0; pointer-events:none au sein de l'hôte.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Hôte : contexte de positionnement sans toucher au flux existant ────── */
.fc3d-hote {
  position: relative;
}

/* ── Voile : conteneur des couches, transition douce pour la parallaxe ──── */
.fc3d-voile {
  position: absolute;
  inset: -6%;                       /* débordement : la parallaxe ne révèle
                                       jamais de bord nu */
  pointer-events: none;
  z-index: 2;                       /* au-dessus du canvas Three / du
                                       fallback, sous le texte éventuel
                                       (les surfaces Palazzo placent leur
                                       contenu en z-index ≥ 3 ou après dans
                                       le flux) */
  will-change: transform;
  contain: layout style;
}

/* ── Caustiques froides : la "flamme de marbre" ───────────────────────────
   Texture k3_cold_caustics.webp (EXISTANTE) en dérive lente, fusion écran.
   Rim lights : deux dégradés radiaux — lapis froid en haut à gauche,
   or pâle chaud en bas à droite — superposés à la texture. */
.fc3d-caustics {
  position: absolute;
  inset: 0;
  background-repeat: repeat;
  background-size: 640px 640px;
  opacity: 0.22;
  mix-blend-mode: screen;
  filter: saturate(1.15) brightness(1.05);
  animation: fc3d-derive-caustics 90s linear infinite;
}

/* ── Grain spectral : texture k3_prismatic_grain.webp (EXISTANTE) ─────────
   Micro-texture irisée, quasi subliminale — le "vernis" de luxe. */
.fc3d-grain {
  position: absolute;
  inset: 0;
  background-repeat: repeat;
  background-size: 320px 320px;
  opacity: 0.10;
  mix-blend-mode: overlay;
}

/* ── Rim lights chaud/froid : posées en pseudo-éléments du voile ──────────
   Suggèrent une profondeur de champ : bords lumineux, cœur assombri. */
.fc3d-voile::before,
.fc3d-voile::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* Rim froide — lapis/glacier, coin supérieur gauche. */
.fc3d-voile::before {
  background:
    radial-gradient(120% 90% at 12% 8%,
      rgba(var(--fc3d-froid, 150, 190, 235), 0.28) 0%,
      rgba(var(--fc3d-froid, 150, 190, 235), 0.08) 38%,
      transparent 62%);
  mix-blend-mode: screen;
}

/* Rim chaude — or pâle, coin inférieur droit + vignette obsidienne. */
.fc3d-voile::after {
  background:
    radial-gradient(110% 85% at 88% 92%,
      rgba(var(--fc3d-chaud, 235, 205, 155), 0.22) 0%,
      rgba(var(--fc3d-chaud, 235, 205, 155), 0.06) 36%,
      transparent 60%),
    radial-gradient(140% 120% at 50% 50%,
      transparent 55%,
      rgba(6, 9, 16, 0.28) 100%);   /* vignette obsidienne */
  mix-blend-mode: screen;
}

/* ── Poussière de marbre : canvas 2D par-dessus le voile ────────────────── */
.fc3d-poussiere {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 3;
  opacity: 0.9;
}

/* ── Mode statique (prefers-reduced-motion / mobile faible) ───────────────
   Le JS pose .fc3d-statique sur l'hôte : voile figé, renforcé en opacité
   pour rester élégant sans mouvement ; aucun canvas n'est créé. */
.fc3d-statique .fc3d-caustics {
  animation: none;
  opacity: 0.30;                    /* un peu plus présent puisqu'immobile */
  background-position: 30% 40%;     /* cadrage choisi, flatteur */
}

/* Sécurité supplémentaire : si l'utilisateur réduit les animations APRÈS
   le chargement, le CSS fige immédiatement la dérive même si le canvas
   continue un instant (le JS n'écoute pas ce changement à chaud). */
@media (prefers-reduced-motion: reduce) {
  .fc3d-caustics { animation: none; }
  .fc3d-voile    { will-change: auto; }
}

/* ── Keyframes : dérive lente des caustiques (90 s, quasi imperceptible) ── */
@keyframes fc3d-derive-caustics {
  from { background-position: 0 0; }
  to   { background-position: 640px 320px; }
}

/* ── Écrans étroits : adoucissement global (GPU mobile) ─────────────────── */
@media (max-width: 640px) {
  .fc3d-caustics { opacity: 0.16; background-size: 480px 480px; }
  .fc3d-grain    { opacity: 0.07; }
}