/* ============================================================
   GoldenKey FX — Premium 3D / Motion Layer  (GK.01.033)
   Loaded on every page after style/premium/luxe.
   Pure additive layer: no layout changes, only depth + motion.
   ============================================================ */

:root{
  --gkx-gold:#c9a227; --gkx-gold2:#e6c25a; --gkx-gold3:#f3dc8f;
  --gkx-navy:#0e2140; --gkx-navy2:#132a4e; --gkx-ink:#0a1729;
}

/* ---------- global scene depth ---------- */
/* removed: perspective on body breaks position:fixed (floaters/consent) */

/* ---------- scroll reveal ---------- */
.gkx-reveal{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .7s cubic-bezier(.22,.8,.28,1),transform .7s cubic-bezier(.22,.8,.28,1)}
.gkx-reveal.gkx-in{opacity:1;transform:none}
.gkx-reveal.gkx-d1{transition-delay:.08s}.gkx-reveal.gkx-d2{transition-delay:.16s}
.gkx-reveal.gkx-d3{transition-delay:.24s}.gkx-reveal.gkx-d4{transition-delay:.32s}

/* ---------- 3D tilt cards ---------- */
.gkx-tilt{transform-style:preserve-3d;will-change:transform;transition:box-shadow .35s ease}
.gkx-tilt.gkx-tilting{transition:box-shadow .35s ease}
.gkx-tilt:not(.gkx-tilting){transition:transform .6s cubic-bezier(.22,.8,.28,1),box-shadow .35s ease}
.gkx-tilt .gkx-glare{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,243,200,.14),rgba(255,255,255,0) 55%);
  opacity:0;transition:opacity .3s ease;mix-blend-mode:screen}
.gkx-tilt:hover .gkx-glare{opacity:1}
.gkx-tilt:hover{box-shadow:0 22px 44px -22px rgba(14,33,64,.35),0 6px 16px -10px rgba(201,162,39,.22)}

/* ---------- gold shimmer buttons ---------- */
.btn-gold,a.btn-gold,button.btn-gold{position:relative;overflow:hidden;transform:translateZ(0)}
.btn-gold::after{content:"";position:absolute;top:-60%;bottom:-60%;left:-30%;width:34%;
  background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.55) 48%,transparent 100%);
  transform:skewX(-22deg) translateX(-140%);animation:gkxShine 4.2s ease-in-out infinite}
@keyframes gkxShine{0%,55%{transform:skewX(-22deg) translateX(-160%)}75%,100%{transform:skewX(-22deg) translateX(460%)}}
.btn-gold:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 16px 34px -12px rgba(201,162,39,.65)}
.btn,.fab{transition:transform .28s cubic-bezier(.22,.8,.28,1),box-shadow .28s ease,background .28s ease}

/* ---------- link underline sweep ---------- */
.main-nav a,nav a{background-image:linear-gradient(90deg,var(--gkx-gold),var(--gkx-gold2));background-repeat:no-repeat;
  background-size:0% 2px;background-position:0 calc(100% - 2px);transition:background-size .3s ease}
.main-nav a:hover,nav a:hover{background-size:100% 2px}

/* ============================================================
   HERO 3D UPGRADE
   ============================================================ */
.gk-hero,.hero{position:relative;overflow:hidden;transform-style:preserve-3d}
.gk-hero>.container,.hero>.container,.gk-hero .hero-inner,.hero .hero-inner,
.gk-hero .badge-48,.hero .badge-48,.gk-hero .hero-rail,.hero .hero-rail{position:relative;z-index:5}

/* animated aurora sheets */
.gkx-aurora{position:absolute;inset:-20% -10%;z-index:1;pointer-events:none;filter:blur(70px);opacity:.3}
.gkx-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen}
.gkx-aurora i:nth-child(1){width:52vw;height:52vw;left:-14%;top:-30%;
  background:radial-gradient(circle,rgba(201,162,39,.34),transparent 62%);animation:gkxDrift1 16s ease-in-out infinite alternate}
.gkx-aurora i:nth-child(2){width:44vw;height:44vw;right:-12%;top:-10%;
  background:radial-gradient(circle,rgba(38,84,164,.5),transparent 60%);animation:gkxDrift2 20s ease-in-out infinite alternate}
.gkx-aurora i:nth-child(3){width:36vw;height:36vw;left:32%;bottom:-38%;
  background:radial-gradient(circle,rgba(243,220,143,.22),transparent 65%);animation:gkxDrift3 14s ease-in-out infinite alternate}
@keyframes gkxDrift1{to{transform:translate(9%,14%) scale(1.12)}}
@keyframes gkxDrift2{to{transform:translate(-10%,10%) scale(1.08) rotate(8deg)}}
@keyframes gkxDrift3{to{transform:translate(6%,-12%) scale(1.15)}}

/* particle canvas */
.gkx-particles{position:absolute;inset:0;z-index:2;pointer-events:none}

/* floating 3D glass orbs / key */
.gkx-orbs{position:absolute;inset:0;z-index:3;pointer-events:none;transform-style:preserve-3d}
.gkx-orb{position:absolute;border-radius:50%;
  background:
    radial-gradient(circle at 32% 28%,rgba(255,255,255,.55),rgba(255,255,255,.06) 42%,rgba(255,255,255,0) 60%),
    radial-gradient(circle at 68% 78%,rgba(201,162,39,.45),rgba(201,162,39,0) 55%),
    linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.02));
  border:1px solid rgba(243,220,143,.35);
  box-shadow:0 24px 44px -18px rgba(0,0,0,.55),inset 0 0 26px rgba(230,194,90,.18);
  backdrop-filter:blur(3px);animation:gkxFloat 7s ease-in-out infinite}
.gkx-orb.o1{width:120px;height:120px;right:6%;top:14%;animation-duration:8.5s}
.gkx-orb.o2{width:64px;height:64px;right:20%;top:52%;animation-duration:6.5s;animation-delay:-2.4s}
.gkx-orb.o3{width:42px;height:42px;left:5%;bottom:16%;animation-duration:7.5s;animation-delay:-4s}
.gkx-orb.o4{width:26px;height:26px;left:14%;top:20%;animation-duration:5.8s;animation-delay:-1.5s}
@keyframes gkxFloat{0%,100%{transform:translateY(0) rotateX(0) rotateY(0)}50%{transform:translateY(-22px) rotateX(9deg) rotateY(-7deg)}}
.gkx-ring{position:absolute;right:3.2%;top:9.5%;width:164px;height:164px;border-radius:50%;
  border:1.5px dashed rgba(243,220,143,.4);animation:gkxSpin 24s linear infinite}
@keyframes gkxSpin{to{transform:rotate(360deg)}}
@media(max-width:900px){.gkx-orb.o1{width:78px;height:78px;right:4%;top:9%}.gkx-ring{width:110px;height:110px;right:1.5%;top:6%}.gkx-orb.o2{display:none}}

/* headline: gold gradient + soft glow entrance */
.gk-hero h1,.hero h1{background:linear-gradient(92deg,#ffffff 0%,#fdf6de 38%,var(--gkx-gold3) 62%,#ffffff 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:gkxH1 9s ease-in-out infinite,gkxHeroIn .9s cubic-bezier(.22,.8,.28,1) both;
  text-shadow:none;filter:drop-shadow(0 6px 26px rgba(201,162,39,.28))}
.gk-hero h1 em,.gk-hero h1 [data-fz-cheapest]{-webkit-text-fill-color:#f3dc8f;background:none}
@keyframes gkxH1{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
@keyframes gkxHeroIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

/* hero quote form: 3D glass lift */
.hero-quote{transform:perspective(1100px) rotateY(-4deg) rotateX(1.2deg);transform-style:preserve-3d;
  transition:transform .6s cubic-bezier(.22,.8,.28,1),box-shadow .6s ease;
  box-shadow:0 40px 80px -34px rgba(0,0,0,.65),0 0 0 1px rgba(243,220,143,.22),0 10px 30px -14px rgba(201,162,39,.3)}
.hero-quote:hover{transform:perspective(1100px) rotateY(0) rotateX(0) translateY(-6px)}
@media(max-width:1024px){.hero-quote{transform:none}}

/* eyebrow chips pulse dot */
.hero-eyebrow .dot{animation:gkxPulse 2s ease-in-out infinite}
@keyframes gkxPulse{0%,100%{box-shadow:0 0 0 0 rgba(230,194,90,.55)}60%{box-shadow:0 0 0 9px rgba(230,194,90,0)}}

/* feature chips: stagger float-in + hover depth */
.gk-feats .gkf{transition:transform .3s ease,box-shadow .3s ease,background .3s ease}
.gk-feats .gkf:hover{transform:translateY(-3px) scale(1.03);background:rgba(230,194,90,.16);box-shadow:0 12px 26px -14px rgba(0,0,0,.6)}

/* stats bar: gold count glow */
.gk-statsbar b{text-shadow:0 0 22px rgba(243,220,143,.35)}
.gk-statsbar .gks{transition:background .35s ease}
.gk-statsbar .gks:hover{background:linear-gradient(135deg,#10233f,#173056)}

/* hero-rail items slide on hover */
.hero-rail .hr-item{transition:transform .3s ease,background .3s ease}
.hero-rail .hr-item:hover{transform:translateX(6px)}

/* ---------- section headers: kicker line grow ---------- */
h2.gkx-in,.gkx-in h2{animation:none}

/* ---------- image cards subtle zoom ---------- */
.card img,[class*="card"] img{transition:transform .6s cubic-bezier(.22,.8,.28,1)}
.gkx-tilt:hover img{transform:scale(1.045)}

/* ---------- floating action buttons: breathing glow ---------- */
.floaters .fab{animation:gkxFabGlow 3.4s ease-in-out infinite}
@keyframes gkxFabGlow{0%,100%{box-shadow:0 8px 22px -8px rgba(0,0,0,.55)}50%{box-shadow:0 10px 30px -8px rgba(201,162,39,.55)}}

/* ---------- ticker: gold pass-through light ---------- */
.fz-ticker{position:relative}
.fz-ticker::after{content:"";position:absolute;top:0;bottom:0;width:70px;left:-80px;
  background:linear-gradient(100deg,transparent,rgba(243,220,143,.16),transparent);
  animation:gkxTickLight 6s linear infinite;pointer-events:none}
@keyframes gkxTickLight{to{left:110%}}

/* ---------- scroll progress bar ---------- */
.gkx-progress{position:fixed;top:0;left:0;height:3px;width:0%;z-index:9999;
  background:linear-gradient(90deg,var(--gkx-gold),var(--gkx-gold3),var(--gkx-gold));
  box-shadow:0 0 12px rgba(230,194,90,.7);transition:width .12s linear;pointer-events:none}

/* ---------- back-to-top comet ---------- */
.gkx-top{position:fixed;right:22px;bottom:92px;width:46px;height:46px;border-radius:50%;z-index:59;cursor:pointer;
  display:grid;place-items:center;border:1px solid rgba(230,194,90,.5);
  background:linear-gradient(150deg,#132a4e,#0a1729);color:#f3dc8f;font-size:18px;
  opacity:0;pointer-events:none;transform:translateY(14px);transition:.35s ease}
.gkx-top.gkx-show{opacity:1;pointer-events:auto;transform:none}
.gkx-top:hover{box-shadow:0 14px 30px -10px rgba(201,162,39,.6);transform:translateY(-3px)}

/* ---------- counters ---------- */
[data-gkx-count]{font-variant-numeric:tabular-nums}

/* ---------- tables & rows hover lift (pricing) ---------- */
table tr{transition:background .25s ease}
table tbody tr:hover{background:rgba(201,162,39,.06)}

/* ---------- reduced motion: switch everything off ---------- */
@media(prefers-reduced-motion:reduce){
  .gkx-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .gkx-aurora i,.gkx-orb,.gkx-ring,.btn-gold::after,.fz-ticker::after,.floaters .fab,
  .gk-hero h1,.hero h1,.hero-eyebrow .dot{animation:none!important}
  .gkx-tilt{transform:none!important}
  .hero-quote{transform:none}
}