/* ═══════════════════════════════════════════════════════════════
   premium.css — Cinematic elevation layer
   ────────────────────────────────────────────────────────────
   Sits on top of style.css → enhancements.css → editorial.css
   Loads last, wins the cascade. All refinements are additive;
   removing this file returns the site to its previous state.
═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────
   1. TYPOGRAPHY TUNING — editorial precision
───────────────────────────────────────────────────────── */
html{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body{
  font-family:'Inter','DM Sans',-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif;
  font-feature-settings:'ss01','ss03','cv11','calt','liga';
  letter-spacing:-.006em;
}
h1,h2,h3,h4,h5,h6{letter-spacing:-.02em}
p{text-wrap:pretty}
.hero-h1-lux,.prog-title,.why-title,.trainer-title,.cta-final-title,.aud-title,.faq-title,.tia-title,.btn-title{
  text-wrap:balance;
  font-feature-settings:'ss01','ss03','dlig','calt';
}

/* ─────────────────────────────────────────────────────────
   2. HERO PARTICLES & AMBIENT LIGHT — cinematic depth
───────────────────────────────────────────────────────── */
.hero-lux{position:relative}
.hero-particles{
  position:absolute;inset:0;
  pointer-events:none;
  z-index:1;
  opacity:.7;
}
.hero-orbs{
  position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden;
}
.hero-orb{
  position:absolute;
  width:520px;height:520px;
  border-radius:50%;
  filter:blur(80px);
  opacity:.35;
  animation:orbFloat 22s ease-in-out infinite;
  will-change:transform;
}
.hero-orb-1{
  top:-15%;left:-8%;
  background:radial-gradient(circle,rgba(240,165,0,.55),transparent 65%);
  animation-delay:0s;
}
.hero-orb-2{
  bottom:-20%;right:-10%;
  background:radial-gradient(circle,rgba(232,93,4,.4),transparent 65%);
  animation-delay:-7s;
  animation-duration:26s;
}
.hero-orb-3{
  top:35%;right:20%;
  width:340px;height:340px;
  background:radial-gradient(circle,rgba(100,140,255,.22),transparent 65%);
  animation-delay:-14s;
  animation-duration:30s;
}
@keyframes orbFloat{
  0%,100%{transform:translate(0,0) scale(1)}
  25%{transform:translate(40px,-30px) scale(1.05)}
  50%{transform:translate(-30px,20px) scale(.95)}
  75%{transform:translate(20px,40px) scale(1.02)}
}

/* Vignette overlay for cinematic feel */
.hero-lux::after{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(ellipse 120% 100% at 50% 60%,transparent 40%,rgba(3,8,20,.35) 100%);
  pointer-events:none;
  z-index:1;
}

/* Elevate hero content above particles/orbs */
.hero-lux .container{position:relative;z-index:3}

/* ─────────────────────────────────────────────────────────
   3. MAGNETIC BUTTON EFFECT SUPPORT
───────────────────────────────────────────────────────── */
.btn-lux,.btn-gold,.btn-outline,.btn-ghost{
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),
             background .35s ease,
             box-shadow .4s cubic-bezier(.4,0,.2,1),
             border-color .35s ease,
             color .35s ease;
  will-change:transform;
}

/* Gold buttons — refined glow ring on hover */
.btn-lux-primary{position:relative;isolation:isolate}
.btn-lux-primary::after{
  content:'';
  position:absolute;inset:-2px;
  border-radius:inherit;
  background:conic-gradient(from 0deg,rgba(240,165,0,.8),rgba(255,225,157,.6),rgba(240,165,0,.8));
  opacity:0;
  z-index:-1;
  filter:blur(8px);
  transition:opacity .5s ease;
}
.btn-lux-primary:hover::after{opacity:.6}

/* ─────────────────────────────────────────────────────────
   4. SECTION EDGE FADES — cinematic transitions
───────────────────────────────────────────────────────── */
.prog-section,.why-section,.trainer-section,.tia-section,.aud-section,.faq-section,.cta-final,.btn-section{
  position:relative;
}
.prog-section::before,.why-section::before,.trainer-section::before,.tia-section::before,.aud-section::before,.faq-section::before,.cta-final::before,.btn-section::before{
  content:'';
  position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(80%,600px);height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(240,165,0,.35) 50%,transparent 100%);
  pointer-events:none;
  z-index:2;
  opacity:.5;
}

/* ─────────────────────────────────────────────────────────
   5. SPLIT-TEXT REVEAL — cinematic headline entrance
───────────────────────────────────────────────────────── */
.split-word{
  display:inline-block;
  overflow:hidden;
  vertical-align:top;
  line-height:inherit;
}
.split-word > span{
  display:inline-block;
  transform:translateY(110%);
  opacity:0;
  transition:transform 1.1s cubic-bezier(.22,1,.36,1),
             opacity 1.1s cubic-bezier(.22,1,.36,1);
}
.split-revealed .split-word > span{
  transform:translateY(0);
  opacity:1;
}
/* Staggered by index — max 20 words per headline */
.split-revealed .split-word:nth-child(1)>span{transition-delay:.02s}
.split-revealed .split-word:nth-child(2)>span{transition-delay:.09s}
.split-revealed .split-word:nth-child(3)>span{transition-delay:.16s}
.split-revealed .split-word:nth-child(4)>span{transition-delay:.23s}
.split-revealed .split-word:nth-child(5)>span{transition-delay:.30s}
.split-revealed .split-word:nth-child(6)>span{transition-delay:.37s}
.split-revealed .split-word:nth-child(7)>span{transition-delay:.44s}
.split-revealed .split-word:nth-child(8)>span{transition-delay:.51s}
.split-revealed .split-word:nth-child(9)>span{transition-delay:.58s}
.split-revealed .split-word:nth-child(10)>span{transition-delay:.65s}
.split-revealed .split-word:nth-child(n+11)>span{transition-delay:.7s}

/* ─────────────────────────────────────────────────────────
   6. CUSTOM CURSOR — premium desktop only
───────────────────────────────────────────────────────── */
@media (hover:hover) and (pointer:fine) and (min-width:1024px){
  .cur-dot,.cur-ring{
    position:fixed;top:0;left:0;
    pointer-events:none;
    z-index:9998;
    mix-blend-mode:difference;
    transition:transform .12s ease,width .35s cubic-bezier(.34,1.56,.64,1),height .35s cubic-bezier(.34,1.56,.64,1),background .3s ease;
    will-change:transform;
  }
  .cur-dot{
    width:6px;height:6px;
    background:#f0a500;
    border-radius:50%;
    margin:-3px 0 0 -3px;
  }
  .cur-ring{
    width:32px;height:32px;
    border:1.5px solid rgba(240,165,0,.55);
    border-radius:50%;
    margin:-16px 0 0 -16px;
    transition:transform .3s cubic-bezier(.22,1,.36,1),width .4s cubic-bezier(.34,1.56,.64,1),height .4s cubic-bezier(.34,1.56,.64,1),opacity .3s ease,background .3s ease;
  }
  .cur-active .cur-ring{
    width:56px;height:56px;
    margin:-28px 0 0 -28px;
    background:rgba(240,165,0,.08);
    border-color:rgba(240,165,0,.85);
  }
  .cur-hidden .cur-dot,.cur-hidden .cur-ring{opacity:0}
  body.premium-cursor{cursor:none}
  body.premium-cursor a,body.premium-cursor button,body.premium-cursor input,body.premium-cursor textarea,body.premium-cursor select,body.premium-cursor [onclick]{cursor:none}
}
@media (hover:none),(pointer:coarse),(max-width:1023px){
  .cur-dot,.cur-ring{display:none}
}

/* ─────────────────────────────────────────────────────────
   7. STICKY PREMIUM CONSULTATION BAR (desktop scroll-in)
───────────────────────────────────────────────────────── */
.stick-lux{
  position:fixed;bottom:20px;left:50%;
  transform:translate(-50%,140%);
  z-index:900;
  display:flex;align-items:center;gap:16px;
  padding:12px 12px 12px 22px;
  background:linear-gradient(135deg,rgba(13,29,58,.94),rgba(8,18,38,.94));
  border:1px solid rgba(240,165,0,.35);
  border-radius:60px;
  box-shadow:0 24px 60px -12px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.03) inset;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transition:transform .55s cubic-bezier(.34,1.36,.64,1),opacity .3s ease;
  max-width:calc(100% - 40px);
}
.stick-lux.show{transform:translate(-50%,0)}
.stick-lux-text{
  font-family:'Inter','DM Sans',sans-serif;
  font-size:13px;
  color:#fff;
  letter-spacing:-.005em;
  white-space:nowrap;
}
.stick-lux-text strong{color:#ffc94d;font-weight:600}
.stick-lux-btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:10px 20px;
  background:linear-gradient(135deg,#f0a500,#ffc94d);
  color:#0a1628;
  font-family:'Inter','DM Sans',sans-serif;
  font-size:12.5px;font-weight:600;letter-spacing:.2px;
  border-radius:40px;text-decoration:none;
  border:none;cursor:pointer;
  transition:all .3s ease;
  white-space:nowrap;
}
.stick-lux-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(240,165,0,.5);
}
.stick-lux-close{
  width:26px;height:26px;
  background:transparent;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;
  color:rgba(255,255,255,.5);
  cursor:pointer;
  font-size:13px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
  transition:all .3s ease;
  flex-shrink:0;
}
.stick-lux-close:hover{color:#fff;border-color:rgba(255,255,255,.3)}
@media (max-width:640px){
  .stick-lux{
    padding:10px 10px 10px 16px;
    gap:10px;
    bottom:80px;
  }
  .stick-lux-text{font-size:11.5px;white-space:normal;line-height:1.35}
  .stick-lux-btn{padding:8px 14px;font-size:11.5px}
  .stick-lux-close{width:22px;height:22px}
}

/* ─────────────────────────────────────────────────────────
   8. LUXURY LINK UNDERLINE (in-body content)
───────────────────────────────────────────────────────── */
.cms-card a,.faq-item-body-inner a,.tia-cap-title:hover{
  background-image:linear-gradient(currentColor,currentColor);
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:100% 1px;
  transition:background-size .35s cubic-bezier(.4,0,.2,1);
}
.cms-card a:hover,.faq-item-body-inner a:hover{
  background-size:0 1px;
}

/* ─────────────────────────────────────────────────────────
   9. HOVER-LIFT UPGRADE — all premium cards
───────────────────────────────────────────────────────── */
.prog-card,.why-card,.aud-card-lux,.tia-card{
  transition:transform .6s cubic-bezier(.16,1,.3,1),
             border-color .4s ease,
             box-shadow .5s ease,
             background .4s ease;
}
.prog-card:hover,.why-card:hover,.aud-card-lux:hover,.tia-card:hover{
  transform:translateY(-6px);
}

/* ─────────────────────────────────────────────────────────
   10. LUXURY SPACING — extra breathing room
───────────────────────────────────────────────────────── */
@media (min-width:1024px){
  .hero-lux{padding-top:110px;padding-bottom:130px}
  .btn-section{padding:100px 0}
  .prog-section,.why-section,.trainer-section,.aud-section,.faq-section{padding:130px 0}
  .cta-final{padding:140px 0}
}

/* ─────────────────────────────────────────────────────────
   11. IMAGE REFINEMENT — cinematic grade
───────────────────────────────────────────────────────── */
.tia-img-wrap img{
  filter:saturate(.92) contrast(1.06) brightness(.98);
  transition:transform 1.4s cubic-bezier(.2,0,.2,1),filter .6s ease;
}
.tia-card:hover .tia-img-wrap img{
  transform:scale(1.05);
  filter:saturate(1) contrast(1.08) brightness(1);
}

/* ─────────────────────────────────────────────────────────
   12. CLIENT LOGO STRIP — subtle "press-kit card" treatment
   Raster press-kit logos (PNG/JPG on white bg) get a clean
   light backing plate so they read cleanly on the dark site.
───────────────────────────────────────────────────────── */
.client-strip-row{
  gap:20px !important;
  align-items:center;
}
.cl-item{
  display:flex;align-items:center;justify-content:center;
  min-width:140px;height:92px;
  padding:14px 26px !important;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  transition:transform .4s ease,filter .4s ease;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.4));
  opacity:1;
}
.cl-item:hover{
  transform:translateY(-3px) scale(1.05);
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.55));
}
.cl-item img{
  max-height:64px;max-width:160px;
  width:auto;height:auto;
  object-fit:contain;display:block;
  transition:transform .4s ease;
}
@media (max-width:640px){
  .cl-item{min-width:110px;height:70px;padding:10px 16px !important}
  .cl-item img{max-height:48px;max-width:120px}
}
.cl-item .cl-fallback{
  color:#0a1628;
  max-height:26px;
}
.cl-divider{display:none !important}
.client-strip-label{
  opacity:.7 !important;
  color:#c8d3e8 !important;
}
@media (max-width:640px){
  .client-strip-row{gap:12px !important}
  .cl-item{min-width:90px;height:48px;padding:8px 14px !important}
  .cl-item img{max-height:28px;max-width:100px}
}

/* ─────────────────────────────────────────────────────────
   13. REDUCED-MOTION RESPECT
───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  .hero-orb,.stick-lux,.split-word > span{
    animation:none !important;
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
  }
  .hero-particles{display:none}
}
