/* ZeoFit public landing page styles */

.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:18px 0;
}
.nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 22px; border-radius:18px;
  position:relative;
}
.logo{font-family:'Outfit',sans-serif; font-weight:800; font-size:19px; display:flex; align-items:center; gap:8px;}
.logo .dotmark{width:10px; height:10px; border-radius:3px; background:linear-gradient(135deg,var(--ember),var(--steel)); display:inline-block;}
.nav-links{display:flex; gap:28px; font-size:14.5px; font-weight:500; color:var(--text-dim);}
.nav-links a:hover{color:var(--text);}
.nav-cta{display:flex; gap:10px;}
.nav-burger{display:none; flex-direction:column; gap:4px; cursor:pointer; background:none; border:none; padding:6px;}
.nav-burger span{width:22px; height:2px; background:var(--text); border-radius:2px;}

.hero{
  padding:170px 0 90px; position:relative; overflow:hidden;
  min-height:clamp(620px,56.25vw,820px);
  display:flex; align-items:center;
}
.hero-bg-video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; z-index:0;
  background:#05080d;
  filter:brightness(1.18) saturate(1.08) contrast(1.02);
}
.hero-video-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(10,14,19,.78) 0%, rgba(10,14,19,.54) 46%, rgba(10,14,19,.24) 100%),
    linear-gradient(180deg, rgba(10,14,19,.56) 0%, rgba(10,14,19,.12) 48%, rgba(10,14,19,.76) 100%);
}
.hero:not(.has-hero-video)::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,107,53,.18), transparent 38%),
    radial-gradient(circle at 78% 28%, rgba(77,168,218,.18), transparent 42%);
}
.hero > .container{position:relative; z-index:2; width:100%;}
.hero-sound-fab{
  position:absolute; right:24px; bottom:24px; z-index:4;
  width:44px; height:44px; border-radius:999px; border:1px solid var(--glass-brd);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  color:var(--text); background:rgba(10,14,19,.6);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}
.hero-sound-fab:hover{transform:translateY(-2px); background:rgba(255,255,255,.11); border-color:rgba(255,255,255,.24);}
.hero-sound-fab .svg-icon{width:20px; height:20px;}
.hero-sound-fab .sound-on{display:none;}
.hero-sound-fab.is-sound-on .sound-off{display:none;}
.hero-sound-fab.is-sound-on .sound-on{display:block;}
.hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center;}
.eyebrow{display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:99px; background:var(--ember-soft); color:var(--ember); font-size:12.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase;}
.eyebrow .svg-icon{width:15px; height:15px;}
.hero h1{font-size:54px; line-height:1.05; margin:18px 0 18px;}
.hero h1 .accent{background:linear-gradient(90deg,var(--ember),var(--steel)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;}
.hero p.lead{font-size:17px; color:var(--text-dim); max-width:480px; line-height:1.65;}
.hero-actions{display:flex; gap:14px; margin-top:30px; flex-wrap:wrap;}

.pulse-card{padding:30px; text-align:center; position:relative;}
.pulse-ring-wrap{width:180px; height:180px; margin:0 auto 18px; position:relative;}
.pulse-num{font-family:'Outfit',sans-serif; font-weight:800; font-size:42px;}
.pulse-label{color:var(--muted); font-size:13px; margin-top:4px;}
.pulse-meta{display:flex; justify-content:space-around; margin-top:22px; padding-top:18px; border-top:1px solid var(--glass-brd);}
.pulse-meta div{text-align:center;}
.pulse-meta b{display:block; font-family:'Outfit',sans-serif; font-size:18px;}
.pulse-meta span{font-size:11.5px; color:var(--muted);}

.section{padding:80px 0;}
.section-head{max-width:600px; margin:0 auto 44px; text-align:center;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-size:34px; margin-bottom:12px;}
.section-head p{color:var(--text-dim); font-size:15.5px;}

.feature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.feature-card .icon{width:48px; height:48px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:16px;}
.feature-card .icon .svg-icon{width:24px; height:24px;}
.feature-card h3{font-size:17px; margin-bottom:8px;}
.feature-card p{color:var(--muted); font-size:14px; line-height:1.6; margin:0;}

.plans-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.plan-card{padding:30px; text-align:center; position:relative;}
.plan-card.popular{border-color:var(--ember); box-shadow:0 0 0 1px var(--ember), var(--shadow-soft);}
.plan-card .tag{position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:linear-gradient(90deg,var(--ember),#ff8a5c); color:#0a0e13; font-size:11.5px; font-weight:700; padding:5px 14px; border-radius:99px;}
.plan-card h3{font-size:18px; margin-bottom:6px;}
.plan-price{font-family:'Outfit',sans-serif; font-weight:800; font-size:36px; margin:14px 0 4px;}
.plan-price span{font-size:14px; color:var(--muted); font-weight:500;}
.plan-duration{color:var(--muted); font-size:13px; margin-bottom:20px;}
.plan-features{list-style:none; padding:0; margin:0 0 24px; text-align:left;}
.plan-features li{padding:8px 0; font-size:13.5px; color:var(--text-dim); display:flex; gap:8px; align-items:flex-start;}
.plan-features li::before{content:'\2713'; color:var(--ok); font-weight:700;}

.steps-row{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.step-item{text-align:center; padding:10px;}
.step-num{width:46px; height:46px; border-radius:50%; background:var(--glass-strong); border:1px solid var(--glass-brd); display:flex; align-items:center; justify-content:center; font-family:'Outfit',sans-serif; font-weight:700; margin:0 auto 14px;}
.step-item h4{font-size:15px; margin-bottom:6px;}
.step-item p{color:var(--muted); font-size:13px; margin:0;}

.trainers-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.trainer-card{padding:18px; text-align:center;}
.trainer-card img,.trainer-card .ph{width:100%; aspect-ratio:1; border-radius:14px; object-fit:cover; margin-bottom:14px; background:var(--glass-strong); display:flex; align-items:center; justify-content:center; font-size:32px; font-family:'Outfit',sans-serif; font-weight:700; color:var(--steel);}
.trainer-card h4{font-size:14.5px; margin-bottom:3px;}
.trainer-card span{font-size:12px; color:var(--muted);}

.cta-band{padding:60px; text-align:center; border-radius:28px; position:relative; overflow:hidden;}
.cta-band h2{font-size:30px; margin-bottom:14px;}
.cta-band p{color:var(--text-dim); margin-bottom:26px;}

footer{padding:50px 0 30px; border-top:1px solid var(--glass-brd-soft); margin-top:40px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px;}
.footer-grid h5{font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin-bottom:14px;}
.footer-grid a{display:block; font-size:13.5px; color:var(--text-dim); padding:5px 0;}
.footer-bottom{display:flex; justify-content:space-between; margin-top:40px; padding-top:20px; border-top:1px solid var(--glass-brd-soft); font-size:12.5px; color:var(--muted); flex-wrap:wrap; gap:10px;}

@media (max-width: 900px){
  .hero{min-height:100svh;}
  .hero-grid{grid-template-columns:1fr;}
  .feature-grid,.plans-grid,.trainers-grid{grid-template-columns:repeat(2,1fr);}
  .steps-row{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:repeat(2,1fr);}
  .nav-inner{padding:12px 14px;}
  .logo{font-size:16px; min-width:0;}
  .nav-links{
    display:none; position:absolute; left:12px; right:12px; top:calc(100% + 10px);
    flex-direction:column; gap:0; padding:10px;
    background:rgba(10,14,19,.92); border:1px solid var(--glass-brd);
    border-radius:14px; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    box-shadow:var(--shadow-soft);
  }
  .nav-links.mobile-open{display:flex !important;}
  .nav-links a{padding:12px 10px; border-radius:10px;}
  .nav-links a:hover{background:rgba(255,255,255,.06);}
  .nav-cta{margin-left:auto;}
  .nav-burger{display:flex;}
}
@media (max-width:580px){
  .hero{padding:130px 0 60px;}
  .hero h1{font-size:36px;}
  .nav{padding:10px 0;}
  .nav-inner{gap:10px;}
  .nav-cta .btn{padding:8px 11px; font-size:12px;}
  .hero-sound-fab{right:16px; bottom:16px; width:40px; height:40px;}
  .hero-video-overlay{background:linear-gradient(180deg, rgba(10,14,19,.72) 0%, rgba(10,14,19,.38) 48%, rgba(10,14,19,.84) 100%);}
  .feature-grid,.plans-grid,.trainers-grid,.steps-row,.footer-grid{grid-template-columns:1fr;}
}