/* ================================================
   GSH CAPITAL — animations.css
   Toutes les animations keyframes, reveal,
   parallax classes, micro-interactions
   ================================================ */

/* ── KEYFRAMES ── */
@keyframes glow1    { 0%,100%{opacity:.7;transform:scale(1)}   50%{opacity:1;transform:scale(1.06)} }
@keyframes glow2    { 0%,100%{opacity:.5;transform:translateY(0)} 50%{opacity:.85;transform:translateY(-20px)} }
@keyframes bdot     { 0%,100%{opacity:1;transform:scale(1)}    50%{opacity:.25;transform:scale(.75)} }
@keyframes sline    { 0%,100%{opacity:.3;transform:scaleY(.8)} 50%{opacity:.7;transform:scaleY(1)} }
@keyframes panelIn  { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }
@keyframes glowPulse{ 0%,100%{box-shadow:0 0 0 rgba(184,153,106,0)} 50%{box-shadow:0 0 28px rgba(184,153,106,.3)} }
@keyframes dotRing  { 0%,100%{transform:scale(1);opacity:.5} 50%{transform:scale(1.4);opacity:0} }
@keyframes fcSlide  { from{transform:translateX(-50%) translateY(20px);opacity:0} to{transform:translateX(-50%) translateY(0);opacity:1} }

/* ── ANIMATED ELEMENTS ── */
.hbdot     { animation: bdot 2.5s ease-in-out infinite; }
.ubdot     { animation: bdot 1.8s ease-in-out infinite; }
.hgl1      { animation: glow1 10s ease-in-out infinite; }
.hgl2      { animation: glow2 14s ease-in-out infinite; }
.hscroll-line { animation: sline 2s ease-in-out infinite; }
.hpanel    { animation: panelIn 1s var(--ease) .6s both; }
.btn-gold  { animation: glowPulse 3.5s ease-in-out infinite; }
.btn-gold:hover { animation: none; }
.tldot::before { animation: dotRing 2.5s ease-in-out infinite; }
#fc        { animation: fcSlide .4s var(--ease) forwards; }

/* ── REVEAL SCROLL ── */
.rv {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.rv.in { opacity: 1; transform: none; }
.rv.d1 { transition-delay: .1s; }
.rv.d2 { transition-delay: .2s; }
.rv.d3 { transition-delay: .3s; }
.rv.d4 { transition-delay: .4s; }
.rv.d5 { transition-delay: .5s; }
.rv.d6 { transition-delay: .6s; }

/* ── PARALLAX CLASSES (JS modifie transform) ── */
.hg, .hgl1, .hgl2 { will-change: transform; }
.rb2 { will-change: transform; }

/* ── CARD GLOW HOVER ── */
.sc::after, .cg::after, .pst::after, .ct-card::before, .inv-card::after {
  transition: opacity var(--dur-f);
  pointer-events: none;
}

/* ── STICKY CTA DESKTOP ── */
.sticky-cta-desktop {
  position: fixed; bottom: 32px; right: 32px; z-index: 997;
  display: flex; flex-direction: column; gap: 8px; align-items: flex-end;
  opacity: 0; transform: translateY(12px);
  transition: opacity .4s var(--ease), transform .4s var(--ease);
  pointer-events: none;
}
.sticky-cta-desktop.show {
  opacity: 1; transform: translateY(0); pointer-events: auto;
}
.sticky-cta-desktop a {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 20px; border-radius: 50px;
  font-size: .76rem; font-weight: 500; text-decoration: none;
  transition: all .2s ease; white-space: nowrap;
}
.sticky-cta-desktop .scd-primary {
  background: var(--graphite); color: #fff;
  box-shadow: 0 8px 32px rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.1);
}
.sticky-cta-desktop .scd-primary:hover { box-shadow: 0 12px 40px rgba(0,0,0,.5); }
.sticky-cta-desktop .scd-secondary {
  background: var(--gold); color: #fff;
  box-shadow: 0 8px 28px rgba(184,153,106,.4);
}
.sticky-cta-desktop .scd-secondary:hover { background: #a88558; }

/* ── BRIDGE STEPS (stagger via JS) ── */
.bv-step { transition: opacity .5s var(--ease), transform .5s var(--ease), background var(--dur-f), border-color var(--dur-f); }

/* ── CONSTRUCTION BARS ── */
.con-bar-fill { transition: width 1.2s var(--ease); }

/* ── BUTTON RIPPLE container ── */
.btn { position: relative; overflow: hidden; }

/* ── SCROLL PROGRESS ── */
#spb {
  position: fixed; top: 0; left: 0; height: 2px; z-index: 1001;
  background: linear-gradient(90deg, var(--gold), var(--gold2));
  width: 0%; transition: width .1s linear;
  pointer-events: none;
}
