/* ============================================================
   SEVER FITNESS — Premium Design System
   Dark · Ember · Glass · Motion
============================================================ */

:root{
    --ink:#070708;
    --ash:#0f0f12;
    --ember:#e6ff00;
    --ember-soft:#f5ff66;
    --gold:#fff27a;
    --neon:#d4ff00;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--ink); color:#fff}

::selection{background:var(--neon); color:#0a0a0a}

.global-bg{overflow:hidden}
.glow-orb{
    position:absolute; border-radius:50%; filter:blur(120px); opacity:.35;
    animation: orbFloat 18s ease-in-out infinite;
}
.glow-orb.orb1{width:520px; height:520px; background:#d4ff00; top:-10%; left:-8%; opacity:.18}
.glow-orb.orb2{width:600px; height:600px; background:#a8ff00; bottom:-15%; right:-10%; animation-delay:-6s; opacity:.14}
.glow-orb.orb3{width:420px; height:420px; background:#ffee00; top:40%; left:50%; transform:translateX(-50%); animation-delay:-12s; opacity:.10}

/* ===== Fireflies ===== */
.fireflies{position:absolute; inset:0; overflow:hidden; pointer-events:none}
.firefly{
    position:absolute; width:4px; height:4px; border-radius:50%;
    background: #e6ff00;
    box-shadow: 0 0 10px #e6ff00, 0 0 20px #e6ff00, 0 0 40px rgba(230,255,0,.6);
    animation: ffFloat 14s linear infinite, ffPulse 3s ease-in-out infinite;
    opacity: 0;
}
@keyframes ffFloat{
    0%{transform: translate(0,100vh) scale(.6)}
    10%{opacity:1}
    90%{opacity:1}
    100%{transform: translate(var(--dx,40px), -10vh) scale(1)}
}
@keyframes ffPulse{
    0%,100%{filter:brightness(1)}
    50%{filter:brightness(1.6)}
}
@keyframes orbFloat{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(40px,-30px) scale(1.08)}
}
.grid-overlay{
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
    -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
}

.nav-link{position:relative; color:rgba(255,255,255,.7); transition:color .25s}
.nav-link:hover{color:#fff}
.nav-link::after{
    content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px;
    background:var(--ember); transition:width .3s
}
.nav-link:hover::after{width:100%}

.btn-primary{
    display:inline-flex; align-items:center; gap:.5rem;
    padding:1rem 2rem; border-radius:9999px;
    background:linear-gradient(135deg, var(--neon), var(--ember-soft));
    color:#0a0a0a; font-weight:800; letter-spacing:.02em; text-decoration:none;
    box-shadow: 0 12px 40px -10px rgba(212,255,0,.55), inset 0 1px 0 rgba(255,255,255,.4);
    transition: transform .25s, box-shadow .25s, filter .25s;
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 20px 50px -10px rgba(212,255,0,.8); filter:brightness(1.05)}
.btn-ghost{
    display:inline-flex; align-items:center; gap:.5rem;
    padding:1rem 2rem; border-radius:9999px;
    background:rgba(255,255,255,.06); color:#fff; font-weight:600; text-decoration:none;
    border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(10px);
    transition:background .25s, border-color .25s
}
.btn-ghost:hover{background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.25)}

.hero-display{
    font-family:'Unbounded', sans-serif;
    font-weight:900;
    font-size: clamp(3.5rem, 11vw, 9rem);
    line-height:.9; letter-spacing:-.04em;
    background: linear-gradient(180deg, #fff 0%, #fff 50%, rgba(255,255,255,.4) 100%);
    -webkit-background-clip: text; background-clip:text;
    -webkit-text-fill-color: transparent;
}
.hero-display .em{
    background: linear-gradient(135deg, var(--ember) 0%, var(--gold) 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color: transparent;
}
.hero-img-wrap{
    position:relative; border-radius:32px; overflow:hidden;
    box-shadow: 0 40px 80px -30px rgba(212,255,0,.4);
}
.hero-img-wrap img{display:block; width:100%; height:100%; object-fit:cover}
.hero-img-wrap::after{
    content:''; position:absolute; inset:0;
    background: linear-gradient(180deg, transparent 50%, rgba(10,10,15,.7) 100%);
}

.section{padding: 7rem 1.5rem; max-width:1280px; margin:0 auto}
.section-eyebrow{
    display:inline-flex; align-items:center; gap:.5rem;
    padding:.4rem 1rem; border-radius:9999px;
    background:rgba(212,255,0,.12); color:var(--ember-soft);
    border:1px solid rgba(212,255,0,.3);
    font-size:.75rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
}
.section-title{
    font-family:'Unbounded',sans-serif; font-weight:900;
    font-size: clamp(2rem, 5vw, 3.5rem); line-height:1; letter-spacing:-.03em;
    margin-top:1rem;
}
.section-sub{color:rgba(255,255,255,.55); font-size:1.05rem; max-width:42rem; margin-top:1rem}

.glass-card{
    background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    transition: transform .35s, border-color .35s, background .35s;
}
.glass-card:hover{
    transform: translateY(-6px);
    border-color: rgba(212,255,0,.4);
    background: linear-gradient(180deg, rgba(212,255,0,.08), rgba(255,255,255,.02));
}

.trainer-card{position:relative; overflow:hidden; border-radius:24px; aspect-ratio:3/4}
.trainer-card img{width:100%; height:100%; object-fit:cover; transition: transform .8s}
.trainer-card:hover img{transform:scale(1.08)}
.trainer-card::after{
    content:''; position:absolute; inset:0;
    background: linear-gradient(180deg, transparent 35%, rgba(10,10,15,.95) 100%);
    pointer-events:none;
}
.trainer-info-overlay{
    position:absolute; left:0; right:0; bottom:0; padding:1.5rem; z-index:2;
}
.trainer-initial{
    width:100%; height:100%;
    display:grid; place-items:center;
    background:
        radial-gradient(ellipse at 30% 20%, rgba(212,255,0,.18), transparent 60%),
        linear-gradient(160deg, #1a1a22 0%, #0a0a10 100%);
    font-family:'Unbounded',sans-serif; font-weight:900;
    font-size: clamp(4rem, 8vw, 7rem);
    color: transparent;
    background-clip:text; -webkit-background-clip:text;
    -webkit-text-fill-color: transparent;
    position:relative;
}
.trainer-initial::before{
    content: attr(data-letter);
    position:absolute; inset:0; display:grid; place-items:center;
    background: linear-gradient(135deg, #e6ff00, #fff27a);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
    filter: drop-shadow(0 0 30px rgba(212,255,0,.4));
}
.trainer-initial::after{
    content:''; position:absolute; inset:0;
    background:
        radial-gradient(circle at 80% 80%, rgba(212,255,0,.08), transparent 50%);
}

.slider{position:relative; max-width:1100px; margin:0 auto; border-radius:32px; overflow:hidden}
.slides-track{display:flex; transition: transform .8s cubic-bezier(.7,0,.2,1)}
.slide{min-width:100%; aspect-ratio:16/8; position:relative}
.slide img{width:100%; height:100%; object-fit:cover; display:block}
.slider-arrow{
    position:absolute; top:50%; transform:translateY(-50%);
    width:56px; height:56px; border-radius:50%;
    background:rgba(255,255,255,.1); color:#fff; font-size:1.5rem; cursor:pointer;
    backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.2);
    transition: background .25s
}
.slider-arrow:hover{background:var(--ember); color:#0a0a0a; border-color:var(--ember)}
.slider-arrow.prev{left:24px}
.slider-arrow.next{right:24px}
.slider-dots{position:absolute; bottom:24px; left:50%; transform:translateX(-50%); display:flex; gap:8px}
.slider-dots .dot{width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.3); cursor:pointer; transition: all .3s}
.slider-dots .dot.active{background:var(--ember); width:28px; border-radius:6px}

.price-card{
    padding: 2.5rem; border-radius: 28px; position:relative; overflow:hidden;
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
    border:1px solid rgba(255,255,255,.08);
}
.price-card.featured{
    background: linear-gradient(180deg, rgba(212,255,0,.18), rgba(212,255,0,.04));
    border-color: rgba(212,255,0,.45);
    box-shadow: 0 30px 60px -20px rgba(212,255,0,.35);
}
.price-row{display:flex; justify-content:space-between; align-items:center; padding:.9rem 0; border-bottom:1px dashed rgba(255,255,255,.08)}
.price-row:last-child{border:none}
.price-row .name{color:rgba(255,255,255,.7)}
.price-row .val{font-family:'Unbounded',sans-serif; font-weight:700; font-size:1.05rem}

.stat-num{
    font-family:'Unbounded',sans-serif; font-weight:900;
    font-size: clamp(2.5rem, 5vw, 4rem); line-height:1;
    background: linear-gradient(135deg, var(--ember), var(--gold));
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
}

.gallery-grid{display:grid; grid-template-columns: repeat(12, 1fr); gap:1rem}
.gallery-item{position:relative; overflow:hidden; border-radius:20px; min-height:220px}
.gallery-item img{width:100%; height:100%; object-fit:cover; transition: transform .8s}
.gallery-item:hover img{transform:scale(1.1)}
.gallery-item::after{
    content:''; position:absolute; inset:0;
    background: linear-gradient(180deg, transparent 55%, rgba(10,10,15,.85) 100%);
    pointer-events:none;
}
.gallery-item .caption{
    position:absolute; left:1.25rem; bottom:1.25rem; z-index:2;
    font-family:'Unbounded',sans-serif; font-weight:700;
}
.gi-1{grid-column: span 8; min-height:480px}
.gi-2{grid-column: span 4}
.gi-3{grid-column: span 4}
.gi-4{grid-column: span 8; min-height:320px}
@media (max-width:768px){
    .gi-1,.gi-2,.gi-3,.gi-4{grid-column: span 12}
    .gi-1{min-height:300px}
}

.reveal,.reveal-left,.reveal-right,.reveal-zoom{
    opacity:0; transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}
.reveal{transform: translateY(40px)}
.reveal-left{transform: translateX(-40px)}
.reveal-right{transform: translateX(40px)}
.reveal-zoom{transform: scale(.92)}
.reveal.active,.reveal-left.active,.reveal-right.active,.reveal-zoom.active{
    opacity:1; transform:none;
}
.delay-1{transition-delay:.1s} .delay-2{transition-delay:.2s} .delay-3{transition-delay:.3s} .delay-4{transition-delay:.4s}

.marquee{overflow:hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent)}
.marquee-track{display:flex; gap:4rem; animation: marqueeMove 30s linear infinite; white-space:nowrap; width:max-content}
.marquee-track span{font-family:'Unbounded',sans-serif; font-weight:900; font-size:clamp(2rem,5vw,4rem); color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.25)}
.marquee-track span.fill{color:var(--ember); -webkit-text-stroke:0}
@keyframes marqueeMove{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

.page-hero{
    padding: 8rem 1.5rem 4rem; max-width:1280px; margin:0 auto; text-align:center;
}
.page-hero .breadcrumb{
    display:inline-flex; gap:.5rem; font-size:.8rem; color:rgba(255,255,255,.4); margin-bottom:1.5rem;
}
.page-hero h1{
    font-family:'Unbounded',sans-serif; font-weight:900;
    font-size: clamp(2.5rem, 7vw, 5.5rem); line-height:.95; letter-spacing:-.04em;
}

.text-balance{text-wrap:balance}

/* ===== Social buttons ===== */
.social-btn{
    display:inline-grid; place-items:center;
    width:42px; height:42px; border-radius:50%;
    background: rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.8);
    transition: all .25s;
}
.social-btn:hover{
    background: var(--neon);
    color:#0a0a0a;
    border-color: var(--neon);
    box-shadow: 0 0 24px rgba(212,255,0,.5);
    transform: translateY(-2px);
}

/* ===== Neon text accents ===== */
.text-neon{color:var(--neon); text-shadow: 0 0 20px rgba(212,255,0,.5)}

/* ===== Lenis smooth scroll ===== */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}