/* =====================================================================
   Davs Studio – couche « premium » (animations). Tout est désactivé si
   l'utilisateur a demandé moins d'animations dans son téléphone.
   ===================================================================== */

/* Grain argentique très léger, comme une photo de studio */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* En-tête : filet doré qui apparaît au défilement */
.top{transition:box-shadow .4s,background .4s}
.top.scrolled{background:rgba(0,0,0,.94);box-shadow:0 1px 0 rgba(208,175,115,.35),0 10px 30px -20px rgba(208,175,115,.4)}

/* ---------- Logo vivant ---------- */
.logo-stage{position:relative;display:block;margin:0 auto;width:min(320px,80vw);perspective:900px}
.logo-stage .dust{position:absolute;left:-22%;top:-22%;width:144%;height:144%;pointer-events:none;z-index:3}
.logo-stage .halo{position:absolute;inset:6% 6% 10%;border-radius:50%;z-index:2;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle at 50% 45%,rgba(214,176,98,.16),rgba(214,176,98,.05) 45%,transparent 70%);
  filter:blur(18px);animation:halo 6s ease-in-out infinite alternate}
.logo-wrap{position:relative;display:block;z-index:1;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.7,.2,1);
  animation:logoIn 1.6s cubic-bezier(.2,.7,.2,1) both}
.logo-wrap .logo{display:block;width:100%;height:auto;margin:0;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);mask-composite:intersect}
/* Reflet de lumière qui balaie le métal doré (le noir du logo reste noir) */
.logo-wrap .sheen{position:absolute;inset:0;pointer-events:none;mix-blend-mode:color-dodge;
  background:linear-gradient(105deg,transparent 38%,rgba(255,226,160,.0) 42%,rgba(255,232,178,.55) 48%,rgba(255,250,235,.9) 50%,rgba(255,232,178,.55) 52%,transparent 60%);
  background-size:300% 100%;background-position:130% 0;animation:sheen 7s cubic-bezier(.5,0,.3,1) 1.4s infinite}
@keyframes sheen{0%{background-position:130% 0}28%{background-position:-30% 0}100%{background-position:-30% 0}}
@keyframes halo{from{opacity:.55;transform:scale(.94)}to{opacity:1;transform:scale(1.06)}}
@keyframes logoIn{from{opacity:0;transform:scale(.92) translateY(10px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}

/* Accroche et boutons du haut : apparition en cascade */
.hero .lead,.hero .sub,.hero .ctas{animation:fadeUp 1s cubic-bezier(.2,.7,.2,1) both}
.hero .lead{animation-delay:.5s}.hero .sub{animation-delay:.7s}.hero .ctas{animation-delay:.9s}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* Bouton doré : reflet au survol, et un reflet discret toutes les 6 s sur le bouton principal */
.btn.gold{position:relative;overflow:hidden;isolation:isolate;transition:transform .25s,box-shadow .35s}
.btn.gold::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%)}
.btn.gold:hover::after{transition:transform .9s cubic-bezier(.3,0,.2,1);transform:translateX(120%)}
.btn.gold:hover{box-shadow:0 10px 30px -12px rgba(208,175,115,.75)}
.hero .btn.gold::after{animation:btnSheen 6s ease-in-out 2.2s infinite}
@keyframes btnSheen{0%,70%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}

/* ---------- Bandeau défilant ---------- */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:0 calc(50% - 50vw);width:100vw;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee .track{display:flex;width:max-content;animation:marq 38s linear infinite}
.marquee span{font-family:Cinzel,serif;font-size:clamp(1.3rem,4vw,2.4rem);letter-spacing:.14em;white-space:nowrap;padding:0 .7em;line-height:1.2}
.marquee span:nth-child(4n+1){color:var(--gold)}
.marquee span:nth-child(4n+3){color:transparent;-webkit-text-stroke:1px rgba(208,175,115,.7)}
.marquee i{font-style:normal;color:var(--gold);opacity:.7;align-self:center;font-size:.9rem}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- Révélations au défilement ---------- */
html .rv{opacity:0;transform:translateY(22px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
html .rv.in{opacity:1;transform:none}
.member.rv{transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),border-color .5s}
.gold-rule{transition:width 1.1s cubic-bezier(.2,.7,.2,1) .2s}
.gold-rule.rv{opacity:1;transform:none;width:0}
.gold-rule.rv.in{width:56px}

/* Carte des prestations : la ligne pointillée s'illumine au survol */
.menu-item .dots{transition:border-color .4s}
.menu-item .price{transition:text-shadow .4s}
.menu-item:hover .dots{border-color:var(--gold)}
.menu-item:hover .price{text-shadow:0 0 18px rgba(208,175,115,.6)}

/* Équipe : zoom lent sur la photo et cadre doré intérieur */
.member{position:relative;transition:border-color .5s}
.member .ph{transition:transform 1.6s cubic-bezier(.2,.7,.2,1),filter 1s}
.member:hover{border-color:rgba(208,175,115,.6)}
.member:hover .ph{transform:scale(1.045);filter:contrast(1.06)}
.member::before{content:"";position:absolute;inset:10px 10px auto;aspect-ratio:4/5;width:calc(100% - 20px);border:1px solid rgba(208,175,115,.0);z-index:2;pointer-events:none;transition:border-color .6s}
.member:hover::before{border-color:rgba(208,175,115,.55)}

/* Avantages : icône dorée qui s'allume */
.benefit svg{transition:filter .5s}
.benefit:hover svg{filter:drop-shadow(0 0 8px rgba(208,175,115,.7))}

/* Grand écran : logo plus présent */
@media (min-width:900px){
  .logo-stage{width:min(460px,100%);margin:0}
}

/* Accessibilité : aucune animation si le téléphone le demande */
@media (prefers-reduced-motion:reduce){
  .logo-wrap,.logo-wrap .sheen,.logo-stage .halo,.hero .lead,.hero .sub,.hero .ctas,.marquee .track,.hero .btn.gold::after{animation:none!important}
  .logo-stage .dust{display:none}
  html .rv{opacity:1;transform:none;transition:none}
  .gold-rule.rv{width:56px}
}
html,body{overflow-x:clip}