/* ============================================
   BACKGROUND LUXE — Atelier A.Q.
   Fond ivoire animé + verre + halo curseur.
   Couches posées DERRIÈRE le contenu (z-index négatif).
   ============================================ */
:root{
  --gold-bright:#E8B84B; --coral:#FF5E5B; --blue:#3A4FB8;
  --glass:rgba(255,255,255,0.62); --glass-strong:rgba(255,255,255,0.78); --glass-brd:rgba(255,255,255,0.88);
  --mx:50%; --my:30%;
}

.wash{position:fixed;inset:-10vw;z-index:-3;pointer-events:none;transition:transform .9s cubic-bezier(.23,1,.32,1);will-change:transform}
.blob{position:absolute;border-radius:50%;filter:blur(95px);will-change:transform;opacity:.5}
.b1{width:56vw;height:56vw;background:radial-gradient(circle,var(--coral),transparent 72%);top:-15vw;right:-12vw;animation:drift1 42s ease-in-out infinite}
.b2{width:50vw;height:50vw;background:radial-gradient(circle,var(--gold-bright),transparent 70%);top:14vw;left:-18vw;animation:drift2 48s ease-in-out infinite}
.b3{width:62vw;height:62vw;background:radial-gradient(circle,var(--teal),transparent 74%);bottom:-22vw;left:14vw;animation:drift1 52s ease-in-out infinite 6s}
.b4{width:46vw;height:46vw;background:radial-gradient(circle,var(--magenta),transparent 72%);bottom:2vw;right:-14vw;animation:drift2 45s ease-in-out infinite 4s}
.b5{width:40vw;height:40vw;background:radial-gradient(circle,var(--orange),transparent 76%);top:34vw;left:46vw;animation:drift1 58s ease-in-out infinite 8s}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(7vw,-6vw) scale(1.18)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1.05)}50%{transform:translate(-8vw,5.5vw) scale(1.12)}}

.champagne{position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(255,238,195,.26), transparent 36%),
    radial-gradient(circle at 20% 26%, rgba(232,184,75,.18), transparent 50%),
    radial-gradient(circle at 82% 72%, rgba(200,150,90,.15), transparent 48%),
    radial-gradient(circle at 50% 90%, rgba(255,215,130,.09), transparent 40%);
  transition:background .2s ease-out;animation:champ 18s ease-in-out infinite}
@keyframes champ{0%,100%{opacity:.92}50%{opacity:1}}

.sparkle{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.42;
  background-image:radial-gradient(circle,rgba(200,150,90,.30) .7px,transparent 1.4px),radial-gradient(circle,rgba(255,255,255,.20) .5px,transparent 1px);
  background-size:135px 135px,210px 210px;animation:sparkle 52s linear infinite}
@keyframes sparkle{from{background-position:0 0,0 0}to{background-position:135px 135px,210px 210px}}

.glass{background:var(--glass);backdrop-filter:blur(26px) saturate(180%);-webkit-backdrop-filter:blur(26px) saturate(180%);
  border:1px solid var(--glass-brd);box-shadow:0 25px 65px -22px rgba(44,37,34,.32),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -1px 0 rgba(255,255,255,.2)}

@media (prefers-reduced-motion: reduce){
  .blob,.champagne,.sparkle{animation:none !important}
  .wash{transition:none !important}
}
