/* Exen Gym — site-specific styles. Loaded after base.css. */

h1,h2,.bigtype,.price,.display{font-stretch:118%;font-weight:800;letter-spacing:-.01em}
h3{font-stretch:110%;font-weight:800}
body{font-stretch:100%}
.btn{font-weight:700;border-radius:var(--radius)}
.btn-wa svg{width:20px;height:20px}

/* ---- Header: dark, like the rooms ------------------------------- */
.site-header{background:#0d0d0f;border-bottom:1px solid #1e1e22;color:#fff}
.site-header .brand img{height:34px;width:auto;filter:invert(1)}
.nav a{color:#d6d6d9}
.nav a:hover,.nav a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:.35em}
.nav-toggle{color:#fff}
@media(max-width:860px){
  .nav{background:#0d0d0f;border-bottom-color:#1e1e22}
  .nav a{border-bottom-color:#26262b}
}

/* ---- Hero: their own room, full bleed --------------------------- */
.hero-exen{position:relative;color:#fff;background:#0d0d0f;min-height:min(86svh,780px);display:grid;align-items:end;overflow:hidden;padding:0}
.hero-exen>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;animation:hero-in 1.6s var(--ease) both}
.hero-exen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,13,15,.15) 0%,rgba(13,13,15,.35) 45%,rgba(13,13,15,.92) 100%)}
.hero-exen .container{position:relative;z-index:1;padding-block:var(--s-8) clamp(2rem,6vw,4.5rem)}
.hero-exen h1{font-size:clamp(2.4rem,1.4rem + 4.6vw,5.4rem);line-height:1;max-width:14ch;margin-bottom:var(--s-5)}
.hero-exen .lede{color:#e4e4e7;max-width:52ch}
.hero-exen .cluster{margin-top:var(--s-6)}
.btn-light{background:#fff;color:#0d0d0f}
.btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.btn-line:hover{border-color:#fff;background:rgba(255,255,255,.08)}
@keyframes hero-in{from{transform:scale(1.06)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.hero-exen>img{animation:none}}

/* ---- Page heads (inner pages) ----------------------------------- */
.page-head{background:#0d0d0f;color:#fff;padding-block:clamp(3rem,7vw,5.5rem) clamp(2rem,5vw,3.5rem)}
.page-head h1{font-size:clamp(2.2rem,1.5rem + 3.4vw,4.4rem);line-height:1.02;max-width:18ch}
.page-head .lede{color:#cfcfd3}

/* ---- Planes: the price is the argument -------------------------- */
.planes{display:grid;gap:var(--s-5);grid-template-columns:1fr;align-items:stretch}
@media(min-width:900px){.planes{grid-template-columns:5fr 7fr}}
.plan{border:1px solid var(--line);padding:clamp(1.5rem,4vw,2.75rem);display:flex;flex-direction:column;gap:var(--s-4);background:#fff}
.plan h3{font-size:var(--fs-xl);margin:0}
.plan .for{color:var(--ink-2);margin:0}
.price{font-family:var(--font-display);line-height:.9;margin:var(--s-3) 0 0;font-size:clamp(2.4rem,1.6rem + 2.4vw,3.3rem);white-space:nowrap}
.price small{font-size:.32em;font-weight:600;font-stretch:100%;letter-spacing:0;color:inherit}
.price-note{font-size:var(--fs-sm);color:var(--ink-2);margin:0}
.plan ul{list-style:none;padding:0;margin:var(--s-2) 0 0;display:grid;gap:.6em}
.plan li{padding-left:1.6em;position:relative}
.plan li::before{content:"";position:absolute;left:0;top:.55em;width:.8em;height:2px;background:var(--brand)}
.plan .btn{margin-top:auto;align-self:flex-start}
.plan.platinum{background:#0d0d0f;color:#fff;border-color:#0d0d0f;position:relative}
.plan.platinum .for,.plan.platinum .price-note{color:#c9c9ce}
.plan.platinum .price{font-size:clamp(3rem,.9rem + 7vw,6.4rem);margin-top:var(--s-4)}
.badge{display:inline-block;align-self:flex-start;background:var(--brand);color:#fff;font-weight:700;font-size:var(--fs-sm);padding:.3em .7em}
.planes-foot{margin-top:var(--s-5);color:var(--ink-2);font-size:var(--fs-sm)}

/* ---- Sedes: editorial rows -------------------------------------- */
.sedes{list-style:none;margin:0;padding:0;display:grid;gap:clamp(2.5rem,6vw,4.5rem)}
.sede{display:grid;gap:var(--s-5);grid-template-columns:1fr;align-items:center}
@media(min-width:820px){.sede{grid-template-columns:6fr 5fr;gap:var(--s-7)}.sede:nth-child(even) .sede-photo{order:2}}
.sede-photo{aspect-ratio:3/2;overflow:hidden;background:#1a1a1d}
.sede-photo img{width:100%;height:100%;object-fit:cover}
.sede h3{font-size:clamp(1.7rem,1.2rem + 2vw,2.6rem);margin-bottom:var(--s-2)}
.sede h3 a{color:inherit;text-decoration:none}
.sede h3 a:hover{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--brand)}
.sede .addr{font-weight:600;margin-bottom:var(--s-4)}
.sede .hours{margin-bottom:var(--s-4)}
.sede .mods{color:var(--ink-2);font-size:var(--fs-sm)}
.sede .cluster{margin-top:var(--s-4)}
.link-strong{font-weight:700;color:var(--ink);text-decoration-color:var(--brand);text-decoration-thickness:2px}

/* ---- Actividades: names, set in type ---------------------------- */
.clases-wrap{display:grid;gap:var(--s-7);grid-template-columns:1fr}
@media(min-width:900px){.clases-wrap{grid-template-columns:7fr 5fr;align-items:start}}
.clases{list-style:none;margin:0;padding:0;columns:2;column-gap:var(--s-6);border-top:1px solid var(--line)}
.clases li{break-inside:avoid;font-family:var(--font-display);font-stretch:112%;font-weight:800;font-size:clamp(1.2rem,1rem + 1vw,1.75rem);padding:.45em 0;border-bottom:1px solid var(--line)}
.clases-photos{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3)}
.clases-photos img{aspect-ratio:2/3;object-fit:cover;width:100%}
.clases-photos img:last-child{margin-top:var(--s-7)}

/* ---- Socios: real reviews --------------------------------------- */
.socios{background:#0d0d0f;color:#fff}
.socios .pullquote{font-size:clamp(1.6rem,1.1rem + 2.4vw,3rem);max-width:24ch;font-stretch:110%;font-weight:800;line-height:1.12}
.socios .pullquote+p{color:#b9b9be}
.quotes{display:grid;gap:var(--s-6);grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));margin-top:var(--s-8);padding-top:var(--s-6);border-top:1px solid #2a2a2e}
.quotes blockquote{margin:0;font-size:var(--fs-lg);line-height:1.4}
.quotes p.by{margin-top:var(--s-3);color:#9d9da3;font-size:var(--fs-sm)}

/* ---- Contact / map ---------------------------------------------- */
.map{aspect-ratio:16/10;border-radius:0}
.contact-grid{display:grid;gap:var(--s-7);grid-template-columns:1fr}
@media(min-width:880px){.contact-grid{grid-template-columns:1fr 1fr}}
.gallery{display:grid;gap:var(--s-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%}

/* ---- Footer ----------------------------------------------------- */
.site-footer{background:#0d0d0f}
.site-footer .brand img{height:34px;width:auto;filter:invert(1)}
.site-footer address{font-style:normal}
.contact-grid h2{font-size:var(--fs-xl)}
