/* ═══════════════════════════════════════════════════════════════════════════════
   ASTRIX GYM — ULTRA PREMIUM MASCULINE OVERHAUL v5.0
   The absolute peak of digital masculinity and premium UI/UX
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ═════ CSS RESET & BASE ═════ */
*,::before,::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --max-w:1400px;
  --bg:#000000;
  --bg-alt:#050505;
  --surface:#0a0a0a;
  --accent:#D4AF37; /* Premium Gold */
  --accent-rgb:212,175,55;
  --red-bright:#FF0000; /* Bright Aggressive Red */
  --red-bright-rgb:255,0,0;
  --red:#8B0000; /* Deep Blood Red */
  --red-rgb:139,0,0;
  --red-dark:#4a0000;
  --text:#ffffff;
  --text-dim:rgba(255,255,255,0.5);
  --font-heading:'Bebas Neue',sans-serif;
  --font-body:'Inter',sans-serif;
  --font-accent:'Syne',sans-serif;
  --font-premium:'Playfair Display',serif;
}

html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:var(--font-body);
  background:var(--bg);color:var(--text);line-height:1.6;
  overflow-x:hidden;cursor:none;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--red),var(--red-dark));border-radius:10px}
::selection{background:var(--red);color:#fff}

.container{max-width:var(--max-w);margin:0 auto;padding:0 40px;position:relative;z-index:2}
@media(max-width:768px){.container{padding:0 20px}}

/* ═════ PRELOADER ═════ */
#preloader{
  position:fixed;inset:0;z-index:99999;
  background:#000;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:30px;transition:opacity 1s cubic-bezier(.4,0,.2,1),visibility 1s;
}
#preloader.hidden{opacity:0;visibility:hidden;pointer-events:none}
.preloader-logo{
  font-family:var(--font-heading);font-size:10rem;font-weight:400;
  letter-spacing:50px;opacity:0;animation:preFade 2.5s ease forwards;
  text-transform:uppercase;position:relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.preloader-logo span{color:var(--red-bright);text-shadow:0 0 60px rgba(var(--red-bright-rgb),0.9)}
@keyframes preFade{0%{opacity:0;letter-spacing:100px;filter:blur(30px);transform:scale(0.7)}50%{opacity:0.5;letter-spacing:70px;filter:blur(15px);transform:scale(0.9)}100%{opacity:1;letter-spacing:50px;filter:blur(0);transform:scale(1)}}

.preloader-logo::after {
  content: 'ASTRIX';
  position: absolute;
  top: 0; left: 0;
  color: var(--red-bright);
  opacity: 0.6;
  z-index: -1;
  animation: glitch 0.2s infinite;
  display: block;
}

@keyframes glitch {
  0% { transform: translate(0); clip-path: inset(44% 0 1% 0); }
  10% { transform: translate(-10px, -10px); clip-path: inset(10% 0 58% 0); }
  20% { transform: translate(10px, 10px); clip-path: inset(67% 0 20% 0); }
  30% { transform: translate(-10px, 10px); clip-path: inset(5% 0 80% 0); }
  40% { transform: translate(10px, -10px); clip-path: inset(80% 0 5% 0); }
  50% { transform: translate(-10px, -10px); clip-path: inset(10% 0 58% 0); }
  60% { transform: translate(10px, 10px); clip-path: inset(67% 0 20% 0); }
  70% { transform: translate(-10px, 10px); clip-path: inset(5% 0 80% 0); }
  80% { transform: translate(10px, -10px); clip-path: inset(80% 0 5% 0); }
  90% { transform: translate(-10px, -10px); clip-path: inset(10% 0 58% 0); }
  100% { transform: translate(0); clip-path: inset(44% 0 1% 0); }
}

.preloader-bar{
  width:400px;height:4px;background:rgba(255,255,255,0.02);border-radius:0;overflow:hidden;
  position:relative;border: 1px solid rgba(255,255,255,0.05);
}
.preloader-bar-inner{
  width:0%;height:100%;background:linear-gradient(90deg,transparent,var(--red-bright),var(--red),transparent);
  background-size:200% 100%;border-radius:0;
  animation:preloadBar 3s cubic-bezier(.4,0,.2,1) forwards,shimmer 1.5s infinite;
}
@keyframes preloadBar{0%{width:0%}100%{width:100%}}
.preloader-text{
  font-family:var(--font-accent);font-size:.85rem;text-transform:uppercase;letter-spacing:15px;
  color:var(--red-bright);animation:fadeIn 1s 1.5s backwards, pulse 1.5s infinite;
  text-shadow: 0 0 15px var(--red-bright);
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ═════ CUSTOM CURSOR ═════ */
.cursor-dot,.cursor-ring{
  position:fixed;pointer-events:none;z-index:99998;border-radius:50%;
  transform:translate(-50%,-50%);transition:width .4s,height .4s,background .4s,border .4s,opacity .4s;
}
.cursor-dot{width:12px;height:12px;background:var(--red-bright);box-shadow:0 0 25px var(--red-bright)}
.cursor-ring{
  width:60px;height:60px;border:2px solid rgba(var(--red-bright-rgb),0.6);
  backdrop-filter:blur(3px);
}
.cursor-ring.hover{width:120px;height:120px;border-color:rgba(var(--red-bright-rgb),1);background:rgba(var(--red-bright-rgb),0.15)}
.cursor-dot.hover{width:20px;height:20px;background:#fff;box-shadow:0 0 40px #fff}

/* ═════ GRAIN & NOISE OVERLAY ═════ */
.grain{
  position:fixed;inset:0;z-index:99997;pointer-events:none;opacity:.08;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:256px;mix-blend-mode:overlay;animation:grainShift .4s steps(4) infinite;
}
@keyframes grainShift{0%,100%{transform:translate(0,0)}25%{transform:translate(-2%,-2%)}50%{transform:translate(2%,2%)}75%{transform:translate(-3%,3%)}}

@keyframes pulse {
  0% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.05); filter: brightness(1.5); }
  100% { opacity: 1; transform: scale(1); }
}

.hero-video-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  opacity: 0.15;
  z-index: 1;
  pointer-events: none;
}


/* ═════ SPOTLIGHT EFFECT ═════ */
.spotlight{
  position:fixed;inset:0;z-index:99996;pointer-events:none;
  background:radial-gradient(circle 500px at var(--x,50%) var(--y,50%),transparent 0%,rgba(0,0,0,0.8) 100%);
  opacity:0;transition:opacity .5s ease;
}
.spotlight.active{opacity:1}

/* ═════ NAVBAR ═════ */
.navbar{
  position:fixed;top:0;width:100%;z-index:9997;padding:32px 0;
  transition:all .8s cubic-bezier(.16,1,.3,1);
}
.navbar.scrolled{
  background:rgba(0,0,0,0.9);backdrop-filter:blur(30px) saturate(1.5);
  -webkit-backdrop-filter:blur(30px) saturate(1.5);
  padding:16px 0;box-shadow:0 10px 40px rgba(0,0,0,0.8),0 1px 0 rgba(139,0,0,0.2);
}
.navbar.hidden{transform:translateY(-100%)}
.nav-container{
  max-width:var(--max-w);margin:0 auto;padding:0 60px;
  display:flex;align-items:center;justify-content:space-between;
}
.nav-logo{display:flex;align-items:center;gap:18px;position:relative;z-index:1001;text-decoration:none}
.nav-logo-mark{
  width:50px;height:50px;position:relative;display:flex;align-items:center;justify-content:center;
  transition:all .5s cubic-bezier(.16,1,.3,1);
}
.nav-logo-mark i{transition:all .5s;filter:drop-shadow(0 0 10px rgba(var(--red-rgb),0.6))}
.nav-logo-text{
  font-family:var(--font-heading);font-size:2.2rem;font-weight:400;
  letter-spacing:8px;line-height:1;text-transform:uppercase;color:#fff;
}
.nav-logo-text span{color:var(--red);text-shadow:0 0 20px rgba(var(--red-rgb),0.6)}
.nav-menu{display:flex;gap:40px;list-style:none}
.nav-link{
  font-family:var(--font-accent);font-size:.68rem;font-weight:700;text-transform:uppercase;
  letter-spacing:4px;position:relative;padding:10px 0;transition:all .4s;color:rgba(255,255,255,0.5);
  text-decoration:none;
}
.nav-link::after{
  content:'';position:absolute;bottom:0;left:0;width:0;height:1px;
  background:var(--red);transition:width .5s cubic-bezier(.16,1,.3,1);
}
.nav-link:hover,.nav-link.active{color:var(--text);letter-spacing:5px}
.nav-link:hover::after,.nav-link.active::after{width:100%}
.nav-cta{
  padding:14px 36px;background:var(--red);color:#fff;
  border-radius:2px;font-family:var(--font-heading);font-size:1.1rem;font-weight:400;
  text-transform:uppercase;letter-spacing:3px;transition:all .5s cubic-bezier(.16,1,.3,1);
  border:none;cursor:none;position:relative;overflow:hidden;
}
.nav-cta:hover{transform:translateY(-3px);background:var(--accent);color:#000;box-shadow:0 15px 40px rgba(var(--red-rgb),0.4)}
.nav-toggle{display:none;font-size:1.5rem;cursor:none;z-index:10001;color:var(--text);background:none;border:none;position:relative;}

/* ═════ HERO SECTION ═════ */
.hero{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;background:#000;
}
.hero-video-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-video-bg img{
  width:100%;height:100%;object-fit:cover;opacity:.3;
  transform:scale(1.1);transition:transform 1s cubic-bezier(.16,1,.3,1);
  filter:contrast(1.2) saturate(0.5) brightness(0.7);
}
.hero-video-bg::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at center,transparent 0%,rgba(0,0,0,0.6) 50%,#000 100%);
}
.hero-content{text-align:center;z-index:2;padding:0 20px;position:relative;max-width:1200px}
.hero-badge{
  display:inline-flex;align-items:center;gap:12px;
  background:rgba(139,0,0,0.1);backdrop-filter:blur(20px);
  border:1px solid rgba(139,0,0,0.3);
  padding:12px 32px;border-radius:100px;font-family:var(--font-accent);
  font-size:.65rem;text-transform:uppercase;letter-spacing:6px;color:var(--red);
  margin-bottom:40px;font-weight:700;
}
.hero-badge i{color:var(--red);filter:drop-shadow(0 0 8px var(--red))}
.hero-title-wrap{margin-bottom:20px;perspective:1000px}
.hero-title-line{
  display:block;font-family:var(--font-heading);
  font-size:clamp(5rem,15vw,13rem);font-weight:400;text-transform:uppercase;
  letter-spacing:10px;line-height:.85;transform-origin:center;
  text-shadow:0 10px 50px rgba(0,0,0,0.8);
}
.hero-title-line:nth-child(2){color:var(--red-bright);text-shadow:0 0 100px rgba(var(--red-bright-rgb),0.7), 0 0 20px rgba(var(--red-bright-rgb),0.5)}
.hero-title-line:nth-child(3){
  font-size:clamp(1.5rem,4vw,3.5rem);letter-spacing:25px;color:var(--accent);
  margin-top:10px;font-family:var(--font-accent);font-weight:800;
  text-shadow:0 0 20px rgba(212,175,55,0.4), 0 0 50px rgba(212,175,55,0.2);
}
.hero-sub{
  font-family:var(--font-body);font-size:clamp(1.1rem,1.8vw,1.25rem);color:rgba(255,255,255,0.6);
  margin:40px auto 60px;max-width:850px;font-weight:300;letter-spacing:1.5px;line-height:1.8;
  text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.hero-actions{display:flex;gap:24px;justify-content:center;flex-wrap:wrap}
.btn-primary,.btn-ghost{
  padding:24px 50px;border-radius:2px;font-family:var(--font-heading);
  font-size:1.2rem;text-transform:uppercase;letter-spacing:4px;
  transition:all .6s cubic-bezier(.16,1,.3,1);cursor:none;border:none;
}
.btn-primary{
  background:var(--red);color:#fff;
  box-shadow:0 15px 40px rgba(139,0,0,0.3);
}
.btn-primary:hover{transform:translateY(-5px);background:var(--accent);color:#000;box-shadow:0 20px 60px rgba(212,175,55,0.4)}
.btn-ghost{
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.2);
  backdrop-filter:blur(10px);
}
.btn-ghost:hover{border-color:var(--red);color:var(--red);background:rgba(139,0,0,0.1);transform:translateY(-5px)}

/* ═════ SECTION BASE ═════ */
.section{padding:200px 0;position:relative;overflow:hidden}
.section-header{text-align:center;margin-bottom:120px;position:relative}
.section-label{
  font-family:var(--font-accent);font-size:.65rem;font-weight:800;
  text-transform:uppercase;letter-spacing:8px;color:var(--accent);margin-bottom:24px;
  display:block;
}
.section-title{
  font-family:var(--font-heading);font-size:clamp(4rem,10vw,8rem);
  font-weight:400;text-transform:uppercase;letter-spacing:8px;line-height:.85;
}
.section-title .accent{color:var(--red);text-shadow:0 0 40px rgba(var(--red-rgb),0.4)}
.section-subtitle{
  font-size:1.2rem;color:rgba(255,255,255,0.5);max-width:800px;margin:32px auto 0;
  font-weight:300;line-height:2;letter-spacing:1px;
}

/* ═════ IRON CREED SECTION ═════ */
.creed{background:var(--bg-alt);border-top:1px solid rgba(139,0,0,0.1)}
.creed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.creed-item{
  padding:60px 40px;border:1px solid rgba(255,255,255,0.03);
  background:rgba(255,255,255,0.01);transition:all .6s cubic-bezier(.16,1,.3,1);
  position:relative;overflow:hidden;
}
.creed-item::before {
  content: '';
  position: absolute;
  top: 0; left: 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--red-bright), transparent);
  transform: translateX(-100%);
  transition: transform 0.6s;
}
.creed-item:hover::before {
  transform: translateX(100%);
}
.creed-item:hover{background:rgba(255,0,0,0.05);border-color:var(--red-bright);transform:translateY(-10px) scale(1.02)}
.creed-num{
  font-family:var(--font-heading);font-size:5rem;color:rgba(139,0,0,0.15);
  position:absolute;top:20px;right:30px;line-height:1;
}
.creed-item h3{
  font-family:var(--font-heading);font-size:2rem;text-transform:uppercase;
  letter-spacing:3px;margin-bottom:24px;color:var(--accent);
}
.creed-item p{font-size:1rem;color:rgba(255,255,255,0.6);font-weight:300;line-height:2}

/* ═════ ARSENAL SECTION ═════ */
.arsenal{background:var(--bg)}
.arsenal-grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:100px;align-items:center}
.arsenal-image-wrap{
  position:relative;border-radius:2px;overflow:hidden;
  aspect-ratio:16/10;background:var(--surface);
  border: 1px solid rgba(139,0,0,0.2);
}
.arsenal-image-wrap img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.3) brightness(0.8);transition:all 1s ease}
.arsenal-image-wrap:hover img{filter:grayscale(0.5) contrast(1.1) brightness(1);transform:scale(1.05)}
.arsenal-content h3{
  font-family:var(--font-heading);font-size:3.5rem;text-transform:uppercase;
  letter-spacing:4px;line-height:1;margin-bottom:32px;
}
.arsenal-list{list-style:none}
.arsenal-list li{
  padding:24px 0;border-bottom:1px solid rgba(255,255,255,0.05);
  display:flex;align-items:flex-start;gap:24px;transition:all .4s;
}
.arsenal-list li:hover{padding-left:15px;background:rgba(139,0,0,0.03)}
.arsenal-list li i{color:var(--red);font-size:1.2rem;margin-top:5px}
.arsenal-list h4{font-family:var(--font-heading);font-size:1.4rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;color:var(--accent)}
.arsenal-list p{font-size:.95rem;color:rgba(255,255,255,0.5);font-weight:300}

/* ═════ ABOUT SECTION ═════ */
.about{background:var(--bg)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}
.about-media{
  position:relative;border-radius:2px;overflow:hidden;aspect-ratio:4/5;
  background:var(--surface);border: 1px solid rgba(139,0,0,0.2);
}
.about-media img{width:100%;height:100%;object-fit:cover;transition:transform 2s ease;filter: brightness(0.7) contrast(1.2);}
.about-media:hover img{transform:scale(1.05)}
.about-media .badge-float{
  position:absolute;bottom:0;right:0;z-index:2;
  background:var(--red);color:#fff;
  padding:30px 40px;display:flex;flex-direction:column;gap:5px;
}
.badge-float-num{font-family:var(--font-heading);font-size:4rem;line-height:1}
.badge-float-text{font-family:var(--font-accent);font-size:.65rem;text-transform:uppercase;letter-spacing:4px;font-weight:800;color:var(--accent)}
.about-content h3{
  font-family:var(--font-heading);font-size:4rem;text-transform:uppercase;
  letter-spacing:4px;line-height:.95;margin-bottom:32px;
}
.about-content p{color:rgba(255,255,255,0.6);font-size:1.1rem;line-height:2;margin-bottom:40px;font-weight:300}
.about-quote{
  border-left:3px solid var(--red);padding-left:32px;margin:40px 0;
  font-family:var(--font-premium);font-size:1.6rem;font-style:italic;
  color:#fff;line-height:1.6;
}

/* Stats row */
.stats-wrap{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.stat-item{
  padding:40px;background:rgba(255,255,255,0.01);
  border:1px solid rgba(255,255,255,0.03);transition:all .5s cubic-bezier(.16,1,.3,1);
}
.stat-item:hover{background:rgba(139,0,0,0.05);border-color:var(--red);transform:translateY(-5px)}
.stat-num{
  font-family:var(--font-heading);font-size:4.5rem;color:var(--red);line-height:1;
}
.stat-label{font-family:var(--font-accent);font-size:.65rem;text-transform:uppercase;letter-spacing:4px;color:rgba(255,255,255,0.4);margin-top:10px;font-weight:700}

/* ═════ SERVICES SECTION ═════ */
.services{background:var(--bg-alt)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(139,0,0,0.1);border:1px solid rgba(139,0,0,0.1)}
.srv-card{
  background:var(--bg-alt);padding:80px 50px;text-align:left;
  position:relative;transition:all .6s cubic-bezier(.16,1,.3,1);
  overflow:hidden;
}
.srv-card:hover{background:var(--red-bright);box-shadow: 0 0 50px rgba(var(--red-bright-rgb),0.4);}
.srv-card:hover *{color:#000 !important; font-weight: 900;}
.srv-card:hover .srv-icon{filter: brightness(0); transform: scale(1.2) rotate(5deg);}
.srv-icon{
  font-size:3rem;color:var(--red-bright);margin-bottom:32px;transition:all .4s;
  filter: drop-shadow(0 0 10px var(--red-bright));
}
.srv-card h3{
  font-family:var(--font-heading);font-size:2.2rem;text-transform:uppercase;
  letter-spacing:3px;margin-bottom:20px;color:var(--accent);
}
.srv-card p{color:rgba(255,255,255,0.5);font-size:.95rem;line-height:1.8;font-weight:300;transition:all .4s}
.srv-index{
  position:absolute;top:40px;right:40px;font-family:var(--font-heading);
  font-size:1.2rem;color:rgba(139,0,0,0.2);letter-spacing:2px;
}

/* ═════ SCHEDULE SECTION ═════ */
.schedule{background:var(--bg)}
.schedule-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
.schedule-card{
  background:rgba(255,255,255,0.01);padding:50px;
  border:1px solid rgba(255,255,255,0.03);transition:all .5s cubic-bezier(.16,1,.3,1);
}
.schedule-card:hover{background:rgba(139,0,0,0.03);border-color:var(--red);transform:translateY(-10px)}
.schedule-card .day{
  font-family:var(--font-heading);font-size:2rem;text-transform:uppercase;
  letter-spacing:3px;margin-bottom:32px;color:var(--red);
}
.class-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:20px 0;border-bottom:1px solid rgba(255,255,255,0.05);
}
.class-row:last-child{border-bottom:none}
.class-row .name{font-family:var(--font-heading);font-size:1.3rem;text-transform:uppercase;letter-spacing:1px;color:var(--accent)}
.class-row .time{font-family:var(--font-accent);font-size:.75rem;color:rgba(255,255,255,0.4);font-weight:700;letter-spacing:2px}

/* ═════ GALLERY SHOWCASE ═════ */
.showcase{background:var(--bg-alt);padding:100px 0}
.showcase-overflow{
  overflow:hidden;
  width:100%;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  touch-action:pan-y;
}
.showcase-overflow.is-dragging{cursor:grabbing;}
.showcase-track{
  display:flex;gap:20px;
  width:max-content;
  will-change:transform;
}
.showcase-item{
  width:580px;height:680px;position:relative;overflow:hidden;
  border-radius:2px;filter:grayscale(1) contrast(1.3) brightness(0.6);
  transition:filter .8s cubic-bezier(.16,1,.3,1);
  border: 1px solid rgba(139,0,0,0.3);
  flex-shrink:0;
}
.showcase-item:hover{filter:grayscale(0.4) contrast(1.2) brightness(1);border-color:var(--red)}
.showcase-item img{width:100%;height:100%;object-fit:cover;transition:transform 1s ease;pointer-events:none;}
.showcase-item:hover img{transform:scale(1.08)}
.showcase-item .overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,0.9),transparent);
  display:flex;flex-direction:column;justify-content:flex-end;padding:40px;
  opacity:0;transform:translateY(20px);transition:all .5s ease;
}
.showcase-item:hover .overlay{opacity:1;transform:translateY(0)}

/* ═════ PRICING SECTION ═════ */
.pricing{background:var(--bg)}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  align-items: stretch;
}
.prc-card{
  background:var(--bg-alt);
  padding:60px 40px;
  border:1px solid rgba(255,255,255,0.03);
  position:relative;
  transition:all .6s cubic-bezier(.16,1,.3,1);
  display: flex;
  flex-direction: column;
  text-align: center;
}
.prc-image{
  width: 100%;
  height: 200px;
  margin-bottom: 30px;
  overflow: hidden;
  border: 1px solid rgba(139,0,0,0.2);
}
.prc-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1) brightness(0.6);
  transition: 0.5s;
}
.prc-card:hover .prc-image img{
  filter: grayscale(0) brightness(1);
  transform: scale(1.1);
}
.prc-card.featured{
  border-color:var(--red-bright);
  background:rgba(139,0,0,0.05);
  box-shadow:0 0 50px rgba(139,0,0,0.3);
  transform: scale(1.05);
  z-index: 5;
}
.prc-card.featured::before{
  content: 'MOST AGGRESSIVE';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background: var(--red-bright);
  color: #fff;
  padding: 10px 30px;
  font-family: var(--font-heading);
  font-size: 1.1rem;
  letter-spacing: 3px;
  white-space: nowrap;
}
.prc-card:hover{transform:translateY(-15px);border-color:var(--red-bright)}
.prc-price{
  font-family:var(--font-heading);font-size:5rem;line-height:1;margin:30px 0;color:#fff;
}
.prc-price span{font-size:2rem;color:var(--red-bright);vertical-align:top;margin-right:5px}
.prc-features{list-style:none;margin-bottom:40px; flex-grow: 1; text-align: left;}
.prc-features li{
  padding:12px 0;border-bottom:1px solid rgba(255,255,255,0.03);
  font-size:.95rem;color:rgba(255,255,255,0.5);display:flex;align-items:center;gap:15px;
}
.prc-features li i{color:var(--red-bright);font-size:.8rem}
.prc-action{
  width:100%;padding:20px;background:transparent;border:2px solid var(--red-bright);
  color:var(--red-bright);font-family:var(--font-heading);font-size:1.3rem;
  text-transform:uppercase;letter-spacing:3px;transition:all .4s;
  cursor: none;
}
.prc-card:hover .prc-action,.prc-card.featured .prc-action{background:var(--red-bright);color:#fff}

/* ═════ TRAINERS SECTION ═════ */
.trainers{background:var(--bg-alt)}
.trainers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.tr-card{
  background:var(--bg);
  padding:40px 20px;
  text-align:center;
  border:1px solid rgba(255,255,255,0.03);
  transition:all .6s cubic-bezier(.16,1,.3,1);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.tr-card:hover{transform:translateY(-15px);border-color:var(--red-bright);background: rgba(139,0,0,0.05);}
.tr-avatar{
  width:200px;
  height:250px;
  margin-bottom:30px;
  filter:grayscale(1) contrast(1.2);
  transition:all .5s ease;
  overflow:hidden;
  border: 1px solid rgba(139,0,0,0.3);
  position: relative;
}
.tr-avatar img{width:100%;height:100%;object-fit:cover}
.tr-card:hover .tr-avatar{filter:grayscale(0.3) contrast(1.1);transform:scale(1.05);border-color:var(--red-bright)}
.tr-card h3{
  font-family:var(--font-heading);font-size:2.2rem;text-transform:uppercase;
  letter-spacing:2px;margin-bottom:10px;color:var(--accent);
}
.tr-role{color:var(--red-bright);font-family:var(--font-accent);font-size:.7rem;font-weight:800;letter-spacing:4px;text-transform:uppercase}


/* ═════ TESTIMONIALS SECTION ═════ */
.testimonials{background:var(--bg);padding:100px 0}
.tm-track{display:flex;gap:40px;width:max-content}
.tm-card{
  width:450px;padding:60px;background:var(--bg-alt);
  border:1px solid rgba(255,255,255,0.03);
}
.tm-text{
  font-family:var(--font-premium);font-size:1.5rem;font-style:italic;
  line-height:1.6;margin-bottom:32px;color:#fff;
}
.tm-author{font-family:var(--font-heading);font-size:1.5rem;text-transform:uppercase;letter-spacing:2px;color:var(--accent)}

/* ═════ QUOTE SECTION ═════ */
.quote-section{
  background:var(--bg);padding:150px 0;text-align:center;
  border-top:1px solid rgba(139,0,0,0.1);
}
.quote-text{
  font-family:var(--font-heading);font-size:clamp(3rem,8vw,6.5rem);
  text-transform:uppercase;line-height:.85;letter-spacing:-2px;
}
.quote-text .accent{color:var(--red);-webkit-text-stroke:1px var(--red);-webkit-text-fill-color:transparent;text-shadow: 0 0 30px rgba(139,0,0,0.3);}

/* ═════ CONTACT SECTION ═════ */
.contact{background:var(--bg-alt)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}
.cform input,.cform select,.cform textarea{
  width:100%;padding:25px 0;background:transparent;
  border:none;border-bottom:1px solid rgba(255,255,255,0.1);
  color:#fff;font-family:var(--font-body);font-size:1.1rem;transition:all .4s;
}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--red)}
.cinfo-item{display:flex;gap:30px;margin-bottom:40px}
.cinfo-item i{font-size:1.5rem;color:var(--red)}
.cinfo-item h4{font-family:var(--font-heading);font-size:1.4rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:5px;color:var(--accent)}
.cinfo-item p{color:rgba(255,255,255,0.5);font-size:1rem;line-height:1.6}

/* ═════ FOOTER ═════ */
.footer{background:var(--bg);padding:120px 0 60px;border-top:1px solid rgba(139,0,0,0.1)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:80px;margin-bottom:80px}
.footer h4{font-family:var(--font-heading);font-size:1.5rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:32px;color:var(--red)}
.footer-links a{display:block;color:rgba(255,255,255,0.4);text-decoration:none;margin-bottom:15px;transition:all .3s;font-size:0.9rem;text-transform:uppercase;letter-spacing:1px}
.footer-links a:hover{color:var(--red);padding-left:10px}
.nl-form{display:flex;border-bottom:1px solid rgba(255,255,255,0.1)}
.nl-form input{flex:1;padding:15px 0;background:transparent;border:none;color:#fff}
.nl-form button{background:transparent;border:none;color:var(--red);padding:0 15px;cursor:none}
.footer-bottom{text-align:center;padding:28px 0;color:rgba(255,255,255,0.1);font-size:.85rem;font-weight:300;letter-spacing:2px}

/* ═════ BACK TO TOP ═════ */
#btt{
  position:fixed;bottom:35px;right:35px;z-index:9996;
  width:52px;height:52px;border-radius:50%;
  background:rgba(139,0,0,0.1);backdrop-filter:blur(20px);
  border:1.5px solid rgba(139,0,0,0.3);color:#fff;
  font-size:1.2rem;cursor:none;opacity:0;visibility:hidden;
  transform:translateY(20px);transition:all .5s cubic-bezier(.4,0,.2,1);
  display:flex;align-items:center;justify-content:center;
}
#btt.visible{opacity:1;visibility:visible;transform:translateY(0)}
#btt:hover{background:var(--red);border-color:var(--red);transform:translateY(-6px);box-shadow:0 12px 40px rgba(139,0,0,0.4)}

/* ═════ RESPONSIVE ═════ */
@media(max-width:1200px){
  .pricing-grid{grid-template-columns:repeat(2,1fr); gap:20px;}
  .trainers-grid{grid-template-columns:repeat(2,1fr); gap:20px;}
  .creed-grid{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:991px){
  .about-grid, .arsenal-grid, .contact-grid{grid-template-columns:1fr; gap:50px;}
  .section{padding:100px 0;}
  .hero-title-line{font-size: clamp(3.5rem, 11vw, 8rem);}
  .footer-grid{grid-template-columns:1fr 1fr; gap:50px;}
  .nav-container{padding:0 30px;}
}

/* ═════ TABLET & MOBILE (≤768px) ═════ */
@media(max-width:768px){
  /* === Base === */
  body{cursor:auto; overflow-x:hidden;}
  .cursor-dot,.cursor-ring{display:none}

  /* === Container === */
  .container{padding:0 18px;}

  /* === Navbar === */
  .navbar{padding:18px 0;}
  .nav-container{padding:0 18px;}
  .nav-logo-text{font-size:1.6rem; letter-spacing:5px;}
  .nav-logo-mark{width:36px; height:36px;}
  .nav-logo-mark i{font-size:1.5rem !important;}
  .nav-cta{
    display:none; /* Hide desktop CTA, shown inside menu */
  }
  .nav-menu{
    position:fixed;top:0;right:-100%;width:100%;height:100vh;
    background:rgba(0,0,0,0.98);backdrop-filter:blur(20px);
    flex-direction:column;align-items:center;justify-content:center;
    transition:right 0.5s cubic-bezier(.16,1,.3,1); gap:28px;
    z-index:9999;
  }
  .nav-menu.active{right:0;}
  .nav-menu .nav-link{font-size:1rem; letter-spacing:6px; color:rgba(255,255,255,0.85);}
  /* Mobile CTA button inside menu */
  .nav-menu::after{
    content:'BECOME A BEAST';
    margin-top:20px;
    padding:16px 40px;
    background:var(--red);
    color:#fff;
    font-family:var(--font-heading);
    font-size:1.2rem;
    letter-spacing:3px;
    text-transform:uppercase;
    border-radius:2px;
  }
  .nav-toggle{display:flex; align-items:center; justify-content:center; font-size:1.4rem; padding:8px;}
  .navbar.scrolled{padding:12px 0;}

  /* === Preloader === */
  .preloader-logo{font-size:6rem; letter-spacing:20px;}
  .preloader-logo::after{content:'ASTRIX';}
  .preloader-bar{width:80%; max-width:320px;}
  .preloader-text{font-size:.7rem; letter-spacing:8px;}

  /* === Hero === */
  .hero{min-height:100svh; padding:0;}
  .hero-content{padding:0 18px; padding-top:100px; padding-bottom:60px;}
  .hero-badge{
    font-size:.55rem; letter-spacing:4px; padding:10px 20px;
    margin-bottom:28px;
  }
  .hero-title-line{
    font-size:clamp(3rem,13vw,5.5rem);
    letter-spacing:4px; line-height:.9;
  }
  .hero-title-line:nth-child(3){
    font-size:clamp(0.9rem,3.5vw,1.6rem); letter-spacing:10px; margin-top:8px;
  }
  .hero-sub{
    font-size:.95rem; margin:24px auto 36px; letter-spacing:.5px;
    line-height:1.7; max-width:100%;
  }
  .hero-actions{flex-direction:column; gap:14px; align-items:center;}
  .btn-primary,.btn-ghost{
    width:100%; max-width:340px; padding:20px 30px;
    font-size:1.1rem; letter-spacing:3px; text-align:center;
    cursor:pointer;
  }

  /* === Sections General === */
  .section{padding:70px 0;}
  .section-header{margin-bottom:60px;}
  .section-title{font-size:clamp(2.8rem,10vw,5rem); letter-spacing:4px;}
  .section-label{font-size:.6rem; letter-spacing:5px; margin-bottom:16px;}
  .section-subtitle{font-size:1rem; line-height:1.8; margin-top:20px;}

  /* === Beast Code (Creed) === */
  .creed-grid{grid-template-columns:1fr; gap:20px;}
  .creed-item{padding:40px 28px;}
  .creed-item h3{font-size:1.6rem;}
  .creed-item p{font-size:.92rem;}
  .creed-num{font-size:3.5rem; top:14px; right:18px;}

  /* === Quote Section === */
  .quote-section{padding:80px 0;}
  .quote-text{
    font-size:clamp(1.8rem,7vw,3rem);
    letter-spacing:-1px; line-height:1;
  }

  /* === About === */
  .about-grid{gap:36px;}
  .about-media{aspect-ratio:4/3;}
  .badge-float{padding:20px 24px;}
  .badge-float-num{font-size:2.8rem;}
  .badge-float-text{font-size:.55rem; letter-spacing:2px;}
  .about-content h3{font-size:2.6rem; letter-spacing:2px;}
  .about-content p{font-size:.95rem; line-height:1.8; margin-bottom:28px;}
  .about-quote{font-size:1.2rem; padding-left:20px; margin:28px 0;}
  .stats-wrap{grid-template-columns:1fr 1fr; gap:16px;}
  .stat-item{padding:28px 20px;}
  .stat-num{font-size:3rem;}
  .stat-label{font-size:.6rem; letter-spacing:2px;}

  /* === Arsenal === */
  .arsenal-grid{gap:36px;}
  .arsenal-content h3{font-size:2.6rem; letter-spacing:2px;}
  .arsenal-list li{gap:16px; padding:18px 0;}
  .arsenal-list h4{font-size:1.1rem;}
  .arsenal-list p{font-size:.88rem;}
  .arsenal-image-wrap{aspect-ratio:16/9;}

  /* === Services (Beast Zones) === */
  .services-grid{grid-template-columns:1fr; gap:2px;}
  .srv-card{padding:50px 30px;}
  .srv-card h3{font-size:1.8rem;}
  .srv-card p{font-size:.92rem;}
  .srv-icon{font-size:2.4rem; margin-bottom:22px;}
  .srv-index{font-size:1rem; top:28px; right:28px;}

  /* === Schedule === */
  .schedule-grid{grid-template-columns:1fr; gap:24px;}
  .schedule-card{padding:36px 24px;}
  .schedule-card .day{font-size:1.5rem; margin-bottom:20px;}
  .class-row{padding:16px 0;}
  .class-row .name{font-size:1rem;}
  .class-row .time{font-size:.68rem;}

  /* === Showcase Gallery === */
  .showcase{padding:60px 0;}
  .showcase-overflow{cursor:default; touch-action:pan-y;}
  .showcase-track{gap:14px;}
  .showcase-item{width:220px; height:290px;}
  .showcase-item .overlay{padding:18px;}

  /* === Pricing === */
  .pricing-grid{grid-template-columns:1fr; gap:24px;}
  .prc-card{padding:44px 28px;}
  .prc-card.featured{transform:none; margin:0;}
  .prc-card.featured::before{font-size:.9rem; padding:8px 20px; letter-spacing:2px;}
  .prc-image{height:160px;}
  .prc-price{font-size:3.8rem; margin:22px 0;}
  .prc-price span{font-size:1.6rem;}
  .prc-features li{font-size:.88rem; gap:12px;}
  .prc-action{padding:18px; font-size:1.1rem; cursor:pointer;}

  /* === Trainers === */
  .trainers-grid{grid-template-columns:1fr 1fr; gap:16px;}
  .tr-card{padding:28px 14px;}
  .tr-avatar{width:130px; height:170px; margin-bottom:18px;}
  .tr-card h3{font-size:1.4rem; letter-spacing:1px;}
  .tr-role{font-size:.6rem; letter-spacing:2px;}

  /* === Testimonials === */
  .testimonials{padding:70px 0;}
  .tm-track{gap:20px;}
  .tm-card{width:300px; padding:36px 28px;}
  .tm-text{font-size:1.1rem;}
  .tm-author{font-size:1.1rem;}

  /* === Contact === */
  .contact-grid{gap:40px;}
  .cinfo-item{gap:18px; margin-bottom:28px;}
  .cinfo-item i{font-size:1.2rem;}
  .cinfo-item h4{font-size:1.1rem;}
  .cinfo-item p{font-size:.9rem;}
  .cform input,.cform select,.cform textarea{
    font-size:.95rem; padding:20px 0;
  }
  .cform select option{background:#111; color:#fff;}

  /* === Footer === */
  .footer{padding:70px 0 40px;}
  .footer-grid{grid-template-columns:1fr; gap:36px; margin-bottom:50px;}
  .footer h4{font-size:1.2rem; margin-bottom:20px;}
  .footer-links a{font-size:.85rem; margin-bottom:12px;}

  /* === Back to Top === */
  #btt{width:46px; height:46px; bottom:24px; right:20px; font-size:1rem; cursor:pointer;}

  /* === Fix cursor for touch === */
  a,button,.prc-action,.nav-cta,.btn-primary,.btn-ghost{cursor:pointer;}
}

/* ═════ SMALL PHONES (≤480px) ═════ */
@media(max-width:480px){
  .hero-title-line{font-size:clamp(2.4rem,12vw,4.5rem); letter-spacing:2px;}
  .hero-title-line:nth-child(3){font-size:clamp(.75rem,3.5vw,1.1rem); letter-spacing:6px;}
  .hero-badge{font-size:.5rem; letter-spacing:3px; padding:8px 16px;}
  .hero-sub{font-size:.88rem;}

  .section-title{font-size:clamp(2.2rem,10vw,3.5rem); letter-spacing:2px;}
  .quote-text{font-size:clamp(1.5rem,7vw,2.5rem);}

  .preloader-logo{font-size:4.5rem; letter-spacing:10px;}
  .preloader-logo i{font-size:4rem !important;}

  .trainers-grid{grid-template-columns:1fr; gap:20px;}
  .tr-avatar{width:160px; height:200px;}

  .tm-card{width:260px; padding:28px 20px;}

  .stats-wrap{grid-template-columns:1fr; gap:16px;}

  .about-content h3{font-size:2.2rem;}
  .arsenal-content h3{font-size:2.2rem;}

  .prc-price{font-size:3.2rem;}

  .showcase-item{width:240px; height:310px;}

  .footer-grid{gap:28px;}
  .nav-logo-text{font-size:1.35rem; letter-spacing:4px;}
}

/* ═════ VERY SMALL (≤360px) ═════ */
@media(max-width:360px){
  .hero-title-line{font-size:clamp(2rem,11vw,3.8rem);}
  .section-title{font-size:clamp(2rem,10vw,3rem);}
  .container{padding:0 14px;}
  .btn-primary,.btn-ghost{padding:18px 20px; font-size:1rem;}
}