/* =========================================================================
   CROSS FORCE · sistema visual
   Negro carbón + amarillo de marca. Titulares: Archivo (condensada itálica
   como el logo / expandida como los posts). Texto: Instrument Sans.
   ========================================================================= */

:root {
  color-scheme: dark; /* look único: oscuro de marca */
  /* Paleta */
  --ink: #0d0d0d;
  --ink-2: #141414;
  --carbon: #1c1c1c;
  --carbon-2: #242424;
  --line: #2e2e2e;
  --bone: #efeae1;
  --mute: #a9a49b;
  --force: #ffc700;
  --force-2: #ffd84d;
  --ember: #ff9f1c;
  --warm-bg: #ece3d5;
  --warm-bg-2: #e2d6c3;
  --warm-ink: #2b2219;
  --warm-mute: #6b5c4b;
  --oak: #a8774c;

  /* Tipografía */
  --ff-d: "Archivo", "Arial Narrow", system-ui, sans-serif;
  --ff-b: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-xs: .78rem;
  --fs-s: .9rem;
  --fs-b: 1.0625rem;
  --fs-l: clamp(1.1rem, 1rem + .5vw, 1.3rem);
  --fs-h3: clamp(1.3rem, 1.1rem + 1vw, 1.7rem);
  --fs-h2: clamp(1.65rem, .55rem + 5.4vw, 4.4rem);
  --fs-hero: clamp(2.6rem, 13.8vw, 5.6rem);

  /* Espaciado */
  --s1: .25rem; --s2: .5rem; --s3: .75rem; --s4: 1rem; --s5: 1.5rem;
  --s6: 2rem; --s7: 3rem; --s8: 4.5rem;
  --sec: clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --gut: 16px;

  /* Radios y sombras */
  --r-s: 6px; --r-m: 14px; --r-l: 24px; --r-pill: 999px;
  --sh-1: 0 18px 40px -22px rgba(0,0,0,.8);
  --sh-y: 0 14px 34px -14px rgba(255,199,0,.55);

  /* Movimiento */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --t-fast: .18s;
  --t: .45s;
  --nav-h: 80px;
}
@media (min-width: 768px) { :root { --gut: 32px; --nav-h: 102px; } }

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + 8px); }
body {
  margin: 0; background: var(--ink); color: var(--bone);
  font-family: var(--ff-b); font-size: var(--fs-b); line-height: 1.6;
  overflow-x: clip; -webkit-font-smoothing: antialiased;
}
body::before { /* grano de film */
  content: ""; position: fixed; inset: 0; z-index: 90; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p { margin: 0 0 var(--s4); }
h1, h2, h3 { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--force); color: var(--ink); }
:focus-visible { outline: 3px solid var(--force); outline-offset: 3px; border-radius: 4px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: 12px; top: -60px; z-index: 200; background: var(--force); color: var(--ink); padding: .6rem 1rem; border-radius: var(--r-s); font-weight: 700; text-decoration: none; transition: top var(--t-fast); }
.skip:focus { top: 12px; }
.wrap { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--gut); }
.y { color: var(--force); }

/* Placeholders visibles */
.ph {
  font-family: var(--ff-b); font-style: normal; font-weight: 600; letter-spacing: 0; text-transform: none;
  color: var(--force-2); background: rgba(255,199,0,.08); border: 1px dashed rgba(255,199,0,.6);
  padding: .1em .5em; border-radius: 6px; font-size: .8rem; line-height: 1.55;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
p.ph, b.ph, li.ph { display: inline-block; }
.ph--inline { margin-left: .4rem; font-size: .7rem; }
.pilates .ph { color: #7a4a10; background: rgba(168,119,76,.12); border-color: rgba(122,74,16,.5); }
.bx--y .ph, .ig .ph { color: var(--ink); background: rgba(13,13,13,.06); border-color: rgba(13,13,13,.5); }
.tag { font-size: var(--fs-xs); }
.tag--ph { position: absolute; left: 10px; bottom: 10px; z-index: 3; margin: 0; color: var(--force-2); background: rgba(13,13,13,.78); border: 1px dashed rgba(255,199,0,.6); padding: .2rem .55rem; border-radius: 6px; font-weight: 600; }
.pilates .tag--ph { color: #7a4a10; background: rgba(236,227,213,.9); border-color: rgba(122,74,16,.5); }

/* ---------- Botones ---------- */
.btn {
  --bg: transparent; --fg: var(--bone); --bd: var(--line);
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 48px; padding: .8rem 1.35rem; border-radius: var(--r-pill);
  background: var(--bg); color: var(--fg); border: 1.5px solid var(--bd);
  font-family: var(--ff-d); font-weight: 800; font-stretch: 105%; text-transform: uppercase; letter-spacing: .02em; font-size: .9rem;
  text-decoration: none; cursor: pointer; overflow: hidden; isolation: isolate;
  transition: transform var(--t-fast) var(--ease), box-shadow var(--t) var(--ease), color var(--t-fast), border-color var(--t-fast), background-color var(--t-fast);
  will-change: transform;
}
.btn::after { /* barrido */
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sweep, var(--bone));
  transform: translateY(101%); transition: transform .4s var(--ease-out);
}
.btn:hover::after { transform: translateY(0); }
.btn:active { transform: scale(.97); }
.btn__arw { display: inline-block; transition: transform .3s var(--ease-out); }
.btn:hover .btn__arw { transform: translateX(4px); }
.btn--y { --bg: var(--force); --fg: var(--ink); --bd: var(--force); --sweep: var(--bone); box-shadow: var(--sh-y); }
.btn--ghost { --bd: rgba(239,234,225,.28); --sweep: var(--bone); }
.btn--ghost:hover { color: var(--ink); border-color: var(--bone); }
.btn--k { --bg: var(--warm-ink); --fg: var(--warm-bg); --bd: var(--warm-ink); --sweep: var(--oak); }
.btn--line { --fg: var(--warm-ink); --bd: rgba(43,34,25,.35); --sweep: var(--warm-ink); }
.btn--line:hover { color: var(--warm-bg); }
.btn--wa { --bg: var(--force); --fg: var(--ink); --bd: var(--force); --sweep: var(--bone); }
.btn--sm { min-height: 40px; padding: .5rem 1rem; font-size: .8rem; }
.btn--lg { min-height: 56px; padding: 1rem 1.7rem; font-size: 1rem; }
.btn--block { width: 100%; }
.ico { width: 18px; height: 18px; flex: none; }

/* ---------- Logo ---------- */
.logo {
  display: inline-flex; flex-direction: column; text-decoration: none; line-height: .86;
  font-family: var(--ff-d); font-style: italic; font-weight: 900; font-stretch: 84%; letter-spacing: -.015em;
  font-size: clamp(2.35rem, 1.8rem + 1.5vw, 3.1rem); color: var(--bone);
  transform-origin: left center; transition: transform .45s var(--ease-out);
}
.logo__row { display: flex; align-items: flex-end; }
.logo__x { width: 1em; height: .85em; margin: 0 .02em .02em 0; color: var(--force); flex: none; overflow: visible; }
.logo__force { color: var(--force); padding-left: .09em; }
.logo--lg { font-size: 2.6rem; }
.logo:hover .logo__x { animation: run .5s steps(2) 2; }
@keyframes run { 50% { transform: translateY(-.06em) rotate(-4deg); } }

/* ---------- Nav ---------- */
.nav {
  position: fixed; inset: 0 0 auto; z-index: 100;
  height: calc(var(--nav-h) + env(safe-area-inset-top, 0px)); padding-top: env(safe-area-inset-top, 0px);
  transition: background-color .35s, border-color .35s, transform .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.nav.is-solid { background: rgba(13,13,13,.92); border-color: var(--line); }
.nav.is-solid .logo { transform: scale(.8); }
.nav__progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--force); transform: scaleX(var(--p, 0)); transform-origin: left; z-index: 2; }
@supports (backdrop-filter: blur(10px)) { .nav.is-solid { background: rgba(13,13,13,.72); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); } }
.nav.is-hidden { transform: translateY(-100%); }
.menu-open .nav { background: var(--ink); border-color: var(--line); transform: none; }
.nav__inner { height: 100%; display: flex; align-items: center; gap: var(--s4); }
.nav__links { display: none; margin-left: auto; gap: .2rem; }
.nav__links a {
  position: relative; padding: .5rem .75rem; text-decoration: none; font-weight: 700; font-size: 1.02rem; color: #d9d4ca;
  transition: color var(--t-fast);
}
.nav__links a::after { content: ""; position: absolute; left: .8rem; right: .8rem; bottom: .25rem; height: 2px; background: var(--force); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease-out); }
.nav__links a:hover, .nav__links a.is-active { color: var(--bone); }
.nav__links a:hover::after, .nav__links a.is-active::after { transform: scaleX(1); }
.nav__wa { margin-left: auto; }
.nav__wa span { display: none; }
.nav__burger {
  height: 44px; padding: 0 .95rem 0 .8rem; border-radius: var(--r-pill); border: 1.5px solid rgba(239,234,225,.35); background: rgba(13,13,13,.35); cursor: pointer;
  display: inline-flex; align-items: center; gap: .55rem; position: relative; z-index: 120; color: var(--bone);
  font-family: var(--ff-d); font-weight: 800; font-size: .9rem; text-transform: uppercase; letter-spacing: .04em;
}
.nav__burger-ico { display: grid; gap: 5px; }
.nav__burger:hover { border-color: var(--bone); }
.nav__burger i { display: block; width: 18px; height: 2px; background: var(--bone); transition: transform .35s var(--ease-out); }
.nav__burger[aria-expanded="true"] i:first-of-type { transform: translateY(3.5px) rotate(45deg); }
.nav__burger[aria-expanded="true"] i:last-of-type { transform: translateY(-3.5px) rotate(-45deg); }
@media (min-width: 420px) { .nav__wa span { display: inline; } }
@media (min-width: 1024px) {
  .nav__links { display: flex; }
  .nav__wa { margin-left: var(--s3); }
  .nav__burger { display: none; }
}

.menu {
  position: fixed; inset: 0; z-index: 99; background: var(--ink); padding: calc(var(--nav-h) + 1.5rem) var(--gut) 2rem;
  display: flex; flex-direction: column; justify-content: space-between;
  clip-path: inset(0 0 100% 0); transition: clip-path .55s var(--ease-out);
}
.menu.is-open { clip-path: inset(0 0 0 0); }
.menu[hidden] { display: none; }
.menu nav { display: flex; flex-direction: column; }
.menu a {
  display: flex; align-items: baseline; gap: .8rem; padding: .55rem 0; text-decoration: none; border-bottom: 1px solid var(--line);
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 75%; text-transform: uppercase; font-size: clamp(1.9rem, 9vw, 2.6rem); line-height: 1.05;
  opacity: 0; transform: translateY(14px); transition: opacity .4s, transform .5s var(--ease-out), color .2s;
}
.menu a small { font-family: var(--ff-b); font-style: normal; font-size: .75rem; color: var(--force); font-weight: 600; }
.menu a:hover { color: var(--force); }
.menu.is-open a { opacity: 1; transform: none; }
.menu.is-open a:nth-child(2) { transition-delay: .04s; } .menu.is-open a:nth-child(3) { transition-delay: .08s; }
.menu.is-open a:nth-child(4) { transition-delay: .12s; } .menu.is-open a:nth-child(5) { transition-delay: .16s; }
.menu.is-open a:nth-child(6) { transition-delay: .2s; } .menu.is-open a:nth-child(7) { transition-delay: .24s; }
.menu__foot { color: var(--mute); font-size: var(--fs-s); margin: 1.5rem 0 0; }

/* ---------- Hero ---------- */
.hero { position: relative; padding-top: calc(var(--nav-h) + clamp(1.5rem, 4vw, 3.5rem)); padding-bottom: var(--s7); isolation: isolate; }
.hero::before { /* resplandor neón */
  content: ""; position: absolute; z-index: -1; width: 70vmax; height: 70vmax; right: -25vmax; top: -30vmax; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255,159,28,.16), rgba(255,199,0,.06) 55%, transparent 72%);
  pointer-events: none;
}
/* Fondo del hero: foto real del gym, desenfocada y oscura, para "entrar" al gym sin robar protagonismo */
.hero__bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; background: var(--ink); }
.hero__bg img {
  position: absolute; inset: -4%; width: 108%; height: 108%; max-width: none; object-fit: cover; object-position: 50% 50%;
  filter: blur(4px) saturate(.9) brightness(.8); transform: scale(1.04);
  animation: bgDrift 28s ease-in-out infinite alternate;
}
@keyframes bgDrift { to { transform: scale(1.12) translate3d(-1.5%, -1%, 0); } }
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(13,13,13,.86) 0%, rgba(13,13,13,.6) 40%, rgba(13,13,13,.34) 100%),
    linear-gradient(180deg, rgba(13,13,13,.5) 0%, rgba(13,13,13,0) 22%, rgba(13,13,13,.4) 70%, var(--ink) 100%);
}
@media (max-width: 899px) {
  .hero__bg::after { background: linear-gradient(180deg, rgba(13,13,13,.55) 0%, rgba(13,13,13,.7) 55%, var(--ink) 100%); }
}
.hero__grid { display: grid; gap: var(--s6); align-items: center; }
.kicker { display: inline-flex; align-items: center; gap: .6rem; font-size: var(--fs-s); font-weight: 600; color: var(--mute); text-transform: uppercase; letter-spacing: .12em; margin-bottom: var(--s5); }
.kicker__ico { width: 1.35em; height: 1.15em; color: var(--force); flex: none; }

.hero__title {
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 68%;
  font-size: var(--fs-hero); line-height: .86; text-transform: uppercase; letter-spacing: -.01em;
  display: flex; flex-direction: column; margin-bottom: var(--s5);
}
.hero__line { display: block; }
.hero__line:first-of-type { color: var(--mute); font-size: .62em; margin-bottom: .06em; -webkit-text-stroke: 0; }
.hero__brk { display: flex; align-items: flex-start; white-space: nowrap; }
.brk { font-weight: 400; font-style: normal; color: var(--force); font-stretch: 62%; transform: scaleY(1.06); display: inline-block; }
.brk:first-child { animation: brkL .9s var(--ease-out) both .15s; }
.brk:last-child { animation: brkR .9s var(--ease-out) both .15s; }
@keyframes brkL { from { transform: translateX(.6em) scaleY(1.06); opacity: 0; } }
@keyframes brkR { from { transform: translateX(-.6em) scaleY(1.06); opacity: 0; } }
/* Rodillo: sin JS (o con movimiento reducido) queda fijo en "Not a gym".
   Con JS, main.js lo pasa palabra por palabra y ajusta el ancho de los corchetes. */
.roll {
  display: inline-block; height: .96em; overflow: hidden; padding-inline: .06em; transition: width .55s cubic-bezier(.65,0,.25,1);
  /* fundido arriba y abajo: en el cambio de palabra no se ve nada cortado */
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 91%, transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.roll__track { display: flex; flex-direction: column; align-items: flex-start; transform: translateY(-4.8em); }
.roll__track.is-moving { transition: transform .55s cubic-bezier(.7,0,.2,1); }
.roll__track > span { display: block; height: .96em; line-height: .96; padding-top: .02em; }
.roll__track .is-y { color: var(--force); }

.hero__lema {
  font-family: var(--ff-d); font-weight: 800; font-stretch: 118%; text-transform: uppercase;
  font-size: clamp(1.25rem, 1rem + 1.6vw, 2rem); line-height: 1.05; margin-bottom: var(--s4); letter-spacing: -.01em;
}
.hero__lema em { font-style: normal; color: var(--force); }
.hero__lead { color: var(--mute); max-width: 46ch; font-size: var(--fs-l); line-height: 1.55; }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
.hero__cta .btn { flex: 1 1 auto; }
@media (min-width: 480px) { .hero__cta .btn { flex: 0 0 auto; } }

.hero__media {
  position: relative; margin: 0; border-radius: var(--r-l); aspect-ratio: 4 / 3.4; max-height: 74svh;
  box-shadow: var(--sh-1);
}
.hero__frame { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; background: var(--carbon); }
/* Carrusel del hero: fundido + zoom lento, barras tipo historias de Instagram */
.hero__slides { position: absolute; inset: -32px 0; will-change: transform; }
.hero__slides img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%;
  opacity: 0; transform: scale(1.12); transition: opacity 1.2s ease, transform 7s linear;
}
.hero__slides img.is-on { opacity: 1; transform: scale(1.02); }
.hero__slides img[src*="hero-pared"] { filter: brightness(1.15) contrast(1.05); }
.hero__bars { position: absolute; z-index: 3; left: 18px; right: 72px; bottom: 22px; display: flex; gap: 6px; }
.hero__bars i { flex: 1; height: 3px; border-radius: 3px; background: rgba(239,234,225,.28); position: relative; overflow: hidden; }
.hero__bars i::after { content: ""; position: absolute; inset: 0; background: var(--bone); transform: scaleX(0); transform-origin: left; }
.hero__bars i.is-done::after { transform: scaleX(1); }
.hero__bars i.is-on::after { animation: bar var(--slide, 5s) linear forwards; }
.hero__media:hover .hero__bars i.is-on::after { animation-play-state: paused; }
@keyframes bar { to { transform: scaleX(1); } }
[data-slides] { cursor: pointer; }
.hero__media::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, transparent 55%, rgba(13,13,13,.55)); pointer-events: none; }
.corner { position: absolute; z-index: 2; width: 44px; height: 44px; border: 3px solid var(--force); pointer-events: none; }
.corner--tl { left: 12px; top: 12px; border-right: 0; border-bottom: 0; border-radius: 10px 0 0 0; }
.corner--br { right: 12px; bottom: 12px; border-left: 0; border-top: 0; border-radius: 0 0 10px 0; }
.badge {
  position: absolute; z-index: 3; width: 104px; height: 104px; right: 10px; top: 10px;
  background: var(--force); border-radius: 50%; color: var(--ink); box-shadow: 0 10px 30px -10px rgba(0,0,0,.6);
}
.badge__ring { width: 100%; height: 100%; display: block; }
.badge text { font-family: var(--ff-d); font-weight: 800; font-size: 10.4px; letter-spacing: .14em; fill: var(--ink); transform-origin: 60px 60px; animation: spin 22s linear infinite; }
.badge__x { position: absolute; left: 50%; top: 50%; width: 34%; height: 29%; transform: translate(-50%, -50%); color: var(--ink); }
@keyframes spin { to { transform: rotate(360deg); } }

@media (min-width: 900px) {
  .hero { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding-bottom: var(--s6); }
  .hero__grid { grid-template-columns: 1.25fr .85fr; gap: clamp(2rem, 5vw, 5rem); }
  .hero__media { aspect-ratio: 595 / 760; max-height: 70svh; justify-self: end; width: 100%; max-width: 460px; }
  :root { --fs-hero: clamp(4.2rem, 8.4vw, 8rem); }
  .badge { right: auto; left: -40px; top: auto; bottom: 60px; width: 124px; height: 124px; }
}

/* Stats */
.stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin-top: var(--s7); margin-bottom: 0; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-m); overflow: hidden; }
.stat { background: var(--ink); padding: var(--s4) var(--s4) var(--s5); display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .35rem; }
.stat dt { color: var(--mute); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; line-height: 1.3; }
.stat dd { margin: 0; font-family: var(--ff-d); font-weight: 900; font-stretch: 125%; font-size: clamp(2rem, 1.4rem + 2.6vw, 3.4rem); line-height: 1; color: var(--bone); font-variant-numeric: tabular-nums; }
.stat dd small { font-size: .38em; font-stretch: 100%; margin-left: .25em; color: var(--force); text-transform: uppercase; }
@media (min-width: 768px) { .stats { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Accesos rápidos ("¿Qué estás buscando?") ---------- */
.quick { position: relative; padding-block: var(--s6) var(--s4); }
.quick__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1.5rem; margin-bottom: var(--s5); }
.quick__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 118%; text-transform: uppercase; font-size: clamp(1.7rem, 1.1rem + 2.6vw, 3rem); line-height: 1; letter-spacing: -.01em; }
.quick__p { margin: 0; color: var(--mute); font-size: var(--fs-l); }
.quick__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
@media (min-width: 760px) { .quick__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s4); } }
.qk {
  position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .75rem; row-gap: .15rem; align-items: center;
  min-height: 84px; padding: .95rem 2.2rem .95rem 1rem; border-radius: var(--r-m); text-decoration: none; color: var(--bone);
  background: var(--carbon); border: 1.5px solid var(--line);
  transition: border-color .25s, background-color .25s, transform .25s var(--ease-out), box-shadow .3s;
}
.qk::after { /* flecha */
  content: "→"; position: absolute; right: .9rem; top: 50%; transform: translateY(-50%); font-weight: 800; font-size: 1.15rem; color: var(--force);
  transition: transform .3s var(--ease-out);
}
.qk__i { grid-row: 1 / span 2; width: 34px; height: 34px; padding: 6px; border-radius: 10px; background: rgba(255,199,0,.12); color: var(--force);
  fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.qk__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 110%; text-transform: uppercase; font-size: clamp(.98rem, .9rem + .35vw, 1.2rem); line-height: 1.05; }
.qk__s { color: var(--mute); font-size: .86rem; line-height: 1.3; }
.qk:hover, .qk:focus-visible { border-color: var(--force); background: #222; transform: translateY(-3px); box-shadow: 0 18px 36px -20px rgba(0,0,0,.9); }
.qk:hover::after { transform: translate(4px, -50%); }
.qk--y { background: var(--force); border-color: var(--force); color: var(--ink); }
.qk--y .qk__i { background: rgba(13,13,13,.12); color: var(--ink); stroke: none; }
.qk--y .qk__s { color: rgba(13,13,13,.72); }
.qk--y::after { color: var(--ink); }
.qk--y:hover, .qk--y:focus-visible { background: var(--force-2); border-color: var(--force-2); }
@media (max-width: 420px) {
  .qk { grid-template-columns: 1fr; padding: .85rem 1.9rem .85rem .85rem; min-height: 112px; align-content: start; row-gap: .35rem; }
  .qk__i { grid-row: auto; width: 32px; height: 32px; }
  .qk::after { top: auto; bottom: .7rem; transform: none; }
  .qk:hover::after { transform: translateX(4px); }
}
/* ---------- Tapes / marquesina ---------- */
.tapes { position: relative; height: clamp(150px, 20vw, 220px); overflow: hidden; margin-block: var(--s4); }
.tape { position: absolute; left: -10%; width: 120%; top: 50%; padding-block: .7rem; overflow: hidden; }
.tape--y { background: var(--force); color: var(--ink); transform: translateY(-50%) rotate(-4deg); z-index: 2; box-shadow: 0 10px 30px -10px rgba(0,0,0,.7); }
.tape--k { background: var(--carbon); color: var(--mute); transform: translateY(-50%) rotate(3deg); border-block: 1px solid var(--line); }
.tape__track {
  display: flex; width: max-content; gap: 1.4rem; align-items: center;
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 72%; text-transform: uppercase;
  font-size: clamp(1.6rem, 1.1rem + 2.4vw, 2.8rem); line-height: 1; white-space: nowrap;
  animation: marquee 38s linear infinite;
}
.tape__ico { width: .78em; height: .66em; flex: none; color: var(--ink); }
.tape--k .tape__ico { color: var(--force); width: 1.1em; height: .93em; }
.tape__track--rev { animation-direction: reverse; animation-duration: 46s; }
.tape--k .tape__track { font-stretch: 110%; font-style: normal; font-size: clamp(1rem, .8rem + 1vw, 1.4rem); }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Manifiesto ---------- */
.manifesto { padding-block: var(--sec) calc(var(--sec) * .7); display: grid; gap: var(--s7); align-items: center; }
.manifesto > * { min-width: 0; }
.manifesto__q {
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 70%; text-transform: uppercase;
  font-size: clamp(2.4rem, 1.4rem + 5.4vw, 5.6rem); line-height: .92; color: var(--force); margin-bottom: var(--s5); text-wrap: balance;
}
.manifesto__a { font-size: clamp(1.1rem, 1rem + .7vw, 1.45rem); line-height: 1.5; color: var(--mute); max-width: 48ch; margin-bottom: var(--s5); }
.manifesto__a strong { color: var(--bone); font-weight: 600; }
.manifesto__fig { position: relative; margin: 0 auto; width: min(100%, 440px); }
.manifesto__fig img {
  width: 100%; aspect-ratio: 628 / 760; object-fit: cover; object-position: 50% 60%; border-radius: var(--r-l);
  box-shadow: 0 40px 80px -40px rgba(0,0,0,.9), 0 0 0 1px var(--line); transform: rotate(2deg); transition: transform .8s var(--ease-out);
}
.manifesto__fig:hover img { transform: rotate(0deg) scale(1.01); }
.manifesto__fig::before { /* marco amarillo desplazado */
  content: ""; position: absolute; inset: 0; border: 2px solid var(--force); border-radius: var(--r-l); transform: translate(14px, 14px) rotate(2deg); pointer-events: none;
}
.manifesto__fig .manifesto__mini {
  position: absolute; z-index: 2; right: -2%; bottom: -7%; width: 44%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 35%;
  border-radius: var(--r-m); border: 4px solid var(--ink); outline: 2px solid var(--force);
  box-shadow: 0 24px 50px -18px rgba(0,0,0,.9); transform: rotate(-5deg); transition: transform .8s var(--ease-out);
}
.manifesto__fig:hover .manifesto__mini { transform: rotate(-2deg) translateY(-6px); }
.manifesto__fig .manifesto__mini { height: auto; }
@media (min-width: 900px) { .manifesto__fig .manifesto__mini { right: -4%; bottom: -9%; width: 44%; } }
.sticker {
  position: absolute; left: -12px; bottom: 26px; z-index: 2; background: var(--force); color: var(--ink);
  font-family: var(--ff-d); font-weight: 800; font-stretch: 105%; text-transform: uppercase; font-size: .78rem; letter-spacing: .02em; line-height: 1.2;
  padding: .65rem .9rem; border-radius: 10px; transform: rotate(-5deg); box-shadow: 0 14px 30px -12px rgba(0,0,0,.8); max-width: 15ch;
}
.sticker b { display: block; font-size: 1.15em; font-weight: 900; font-style: italic; font-stretch: 80%; }
@media (min-width: 900px) {
  .manifesto { grid-template-columns: 1.15fr .85fr; gap: var(--s8); }
  .manifesto__fig { margin: 0; justify-self: end; }
  .sticker { left: -36px; }
}

/* ---------- Secciones ---------- */
.section { padding-block: var(--sec); position: relative; }
.section--alt { background: var(--ink-2); border-block: 1px solid #1d1d1d; }
.shead { margin-bottom: clamp(2rem, 4vw, 3.5rem); max-width: 860px; }
/* Nombre de sección grande y claro: número en amarillo + nombre */
.shead__n {
  display: inline-flex; align-items: center; gap: .65rem; margin-bottom: var(--s4);
  font-family: var(--ff-d); font-weight: 800; font-stretch: 112%; text-transform: uppercase; letter-spacing: .05em;
  font-size: clamp(1.05rem, .9rem + .7vw, 1.45rem); line-height: 1.1; color: var(--bone);
}
.shead__num {
  display: inline-grid; place-items: center; min-width: 2.3em; height: 1.85em; padding-inline: .45em; border-radius: var(--r-pill);
  background: var(--force); color: var(--ink); font-size: .78em; font-weight: 900; letter-spacing: .02em; font-variant-numeric: tabular-nums;
}
.h2 {
  font-family: var(--ff-d); font-weight: 900; font-stretch: 125%; text-transform: uppercase;
  font-size: var(--fs-h2); line-height: .95; letter-spacing: -.02em; text-wrap: balance; overflow-wrap: break-word; hyphens: manual;
}
.shead__p { color: var(--mute); font-size: var(--fs-l); margin-top: var(--s5); max-width: 58ch; }
.note { color: var(--mute); font-size: var(--fs-s); margin-top: var(--s5); }
.note a { color: var(--force); }

/* ---------- Actividades ---------- */
.cards { display: grid; gap: var(--s4); }
@media (min-width: 640px) { .cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cards { grid-template-columns: repeat(3, 1fr); gap: var(--s5); } }
.card {
  --rx: 0deg; --ry: 0deg;
  position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r-l);
  background: var(--carbon); border: 1px solid var(--line); min-height: 300px;
  display: flex; flex-direction: column; justify-content: flex-end;
  transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
  transition: transform .5s var(--ease-out), border-color .3s, box-shadow .4s;
}
.card__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;
  filter: saturate(.6) contrast(1.05) brightness(.58); transform: scale(1.06); opacity: .7;
  transition: opacity .5s, transform .8s var(--ease-out), filter .5s;
}
.card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(28,28,28,.15) 0%, rgba(28,28,28,.82) 55%, var(--carbon) 100%); }
.card::after { /* brackets */
  content: ""; position: absolute; inset: 14px; border: 2px solid var(--force); border-radius: 12px; pointer-events: none;
  -webkit-mask: linear-gradient(#000 0 0) top left / 30px 30px no-repeat, linear-gradient(#000 0 0) bottom right / 30px 30px no-repeat;
          mask: linear-gradient(#000 0 0) top left / 30px 30px no-repeat, linear-gradient(#000 0 0) bottom right / 30px 30px no-repeat;
  opacity: 0; transform: scale(1.04); transition: opacity .35s, transform .5s var(--ease-out);
}
.card__body { padding: var(--s5); position: relative; }
.card__n { font-family: var(--ff-d); font-weight: 700; color: var(--force); font-size: var(--fs-xs); letter-spacing: .14em; }
.card__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 125%; text-transform: uppercase; font-size: var(--fs-h3); line-height: 1; margin: .35rem 0 .7rem; letter-spacing: -.01em; }
.card p { color: #cfcac1; font-size: .98rem; line-height: 1.5; margin-bottom: var(--s4); }
.chips { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; padding: 0; margin: 0 0 var(--s4); }
.chips li { font-size: .75rem; font-weight: 600; padding: .2rem .6rem; border-radius: var(--r-pill); border: 1px solid rgba(239,234,225,.22); color: var(--bone); background: rgba(13,13,13,.35); }
.card__link { display: inline-flex; gap: .4rem; align-items: center; font-weight: 700; color: var(--force); text-decoration: none; font-size: .95rem; padding-block: .3rem; }
.card__link span { transition: transform .3s var(--ease-out); }
.card__link:hover span { transform: translateX(4px); }
.card__link::before { content: ""; position: absolute; inset: 0; z-index: 1; }
.card__link:focus-visible { outline: none; }
.card:has(.card__link:focus-visible) { outline: 3px solid var(--force); outline-offset: 3px; }
.card:hover { border-color: rgba(255,199,0,.45); box-shadow: 0 30px 60px -30px rgba(0,0,0,.9); }
.card:hover .card__img { opacity: .9; transform: scale(1); filter: grayscale(0) contrast(1.05) brightness(.6); }
.card:hover::after { opacity: 1; transform: none; }
.card--warm .card__n { color: var(--oak); }
.card:not(:has(> .card__img))::before { background: repeating-linear-gradient(-45deg, transparent 0 16px, rgba(255,199,0,.04) 16px 32px), radial-gradient(70% 60% at 100% 0%, rgba(255,199,0,.1), transparent 70%); }
@media (hover: none) { .card__img { opacity: .7; } }

/* ---------- Horarios ---------- */
.filters { display: grid; gap: var(--s3); margin-bottom: var(--s5); }
.filters__row { display: flex; gap: .45rem; overflow-x: auto; scrollbar-width: none; padding: 4px 2px 6px; margin-inline: -2px; -webkit-mask: linear-gradient(90deg, #000 92%, transparent); mask: linear-gradient(90deg, #000 92%, transparent); }
.filters__row::-webkit-scrollbar { display: none; }
@media (min-width: 900px) { .filters__row { flex-wrap: wrap; overflow: visible; -webkit-mask: none; mask: none; } }
.pill, .day {
  flex: none; min-height: 42px; padding: .45rem 1rem; border-radius: var(--r-pill); cursor: pointer;
  background: transparent; border: 1.5px solid var(--line); color: var(--mute); font-weight: 600; font-size: .92rem;
  transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.pill:hover, .day:hover { border-color: var(--mute); color: var(--bone); }
.pill:active, .day:active { transform: scale(.96); }
.pill.is-on { background: var(--force); border-color: var(--force); color: var(--ink); }
.day { min-width: 52px; padding-inline: .8rem; }
.day.is-on { background: var(--bone); border-color: var(--bone); color: var(--ink); }
.day.is-today:not(.is-on) { border-color: rgba(255,199,0,.6); color: var(--force); }

.sched { display: grid; gap: var(--s4); }
@media (min-width: 768px) { .sched { grid-template-columns: repeat(2, 1fr); } }
.sch {
  background: var(--carbon); border: 1px solid var(--line); border-radius: var(--r-m); padding: var(--s5);
  transition: opacity .35s, transform .45s var(--ease-out);
}
.sch.is-out { display: none; }
.sch.is-in { animation: pop .45s var(--ease-out); }
@keyframes pop { from { opacity: 0; transform: translateY(10px); } }
.sch__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 125%; text-transform: uppercase; font-size: 1.35rem; line-height: 1.05; margin-bottom: var(--s4); display: flex; flex-direction: column; gap: .3rem; }
.sch__t small { font-family: var(--ff-b); font-stretch: 100%; text-transform: none; font-weight: 500; font-size: .85rem; color: var(--mute); }
.sch ul { list-style: none; margin: 0; padding: 0; }
.sch li { display: grid; gap: .45rem; padding: .8rem 0; border-top: 1px dashed var(--line); }
.sch li.is-out { display: none; }
@media (min-width: 480px) { .sch li { grid-template-columns: 8.5rem 1fr; align-items: start; } }
.sch__d { font-weight: 700; font-size: .92rem; color: var(--bone); padding-top: .25rem; }
.sch__h { display: flex; flex-wrap: wrap; gap: .35rem; }
.sch__h b { font-weight: 700; font-size: .88rem; padding: .25rem .6rem; border-radius: var(--r-s); background: rgba(255,199,0,.1); color: var(--force); border: 1px solid rgba(255,199,0,.22); font-variant-numeric: tabular-nums; }
.sch__h b.ph { border-style: dashed; font-weight: 600; }
.sch--warm .sch__h b { background: rgba(168,119,76,.16); color: #e5c29f; border-color: rgba(168,119,76,.4); }
.sched__empty { grid-column: 1 / -1; color: var(--mute); padding: var(--s5); border: 1px dashed var(--line); border-radius: var(--r-m); margin: 0; }
.app {
  margin-top: var(--s6); padding: var(--s5); border-radius: var(--r-l); display: flex; flex-wrap: wrap; gap: var(--s4); align-items: center; justify-content: space-between;
  background: linear-gradient(110deg, var(--carbon-2), var(--carbon) 60%); border: 1px solid var(--line);
}
.app__k { margin: 0 0 .3rem; color: var(--mute); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .12em; font-weight: 600; }
.app__t { margin: 0; font-family: var(--ff-d); font-weight: 900; font-stretch: 115%; text-transform: uppercase; font-size: clamp(1.2rem, 1rem + 1.2vw, 1.8rem); line-height: 1.05; }

/* ---------- Pilates (variante cálida) ---------- */
.pilates { background: var(--warm-bg); color: var(--warm-ink); padding-block: var(--sec); position: relative; overflow: clip; }
.pilates::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 50% at 85% 20%, rgba(255,255,255,.55), transparent 70%); pointer-events: none; }
.pilates .shead__n { color: var(--warm-ink); }
.pilates .h2 { font-stretch: 112%; margin-bottom: var(--s5); }
.pilates .h2 em { font-style: italic; font-stretch: 80%; color: var(--oak); }
.pilates p { color: var(--warm-mute); font-size: var(--fs-l); max-width: 50ch; }
.pilates__grid { display: grid; gap: var(--s7); align-items: center; position: relative; }
.pilates__facts { list-style: none; padding: 0; margin: var(--s5) 0 0; display: grid; gap: 1px; background: rgba(43,34,25,.15); border-radius: var(--r-m); overflow: hidden; }
.pilates__facts li { background: var(--warm-bg); padding: .8rem 0; display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; flex-wrap: wrap; }
.pilates__facts b { font-family: var(--ff-d); font-weight: 800; font-stretch: 110%; text-transform: uppercase; font-size: .95rem; }
.pilates__facts span { color: var(--warm-mute); font-size: .92rem; }
.arches { position: relative; display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--s4); align-items: end; padding-bottom: 2.4rem; }
.arch { margin: 0; overflow: hidden; border-radius: 999px 999px var(--r-m) var(--r-m); background: var(--warm-bg-2); box-shadow: 0 30px 60px -30px rgba(43,34,25,.5); }
.arch img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.arch:hover img { transform: scale(1.05); }
.arch--a { aspect-ratio: 3 / 4.2; }
.arch--b { aspect-ratio: 3 / 3.8; transform: translateY(-14%); }
.tag--abs { position: absolute; left: 0; bottom: 0; }
@media (min-width: 900px) { .pilates__grid { grid-template-columns: 1fr 1fr; } }

/* ---------- Comunidad (bento) ---------- */
.bento { display: grid; gap: var(--s4); }
.bx { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-l); padding: var(--s5); min-height: 220px; display: flex; flex-direction: column; justify-content: flex-end; background: var(--carbon); border: 1px solid var(--line); transition: transform .5s var(--ease-out); }
.bx:hover { transform: translateY(-4px); }
.bx > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; filter: saturate(.75) contrast(1.05); transition: filter .6s, transform 1s var(--ease-out); }
.bx:hover > img { filter: none; transform: scale(1.04); }
.bx--big::before, .bx--img::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 20%, rgba(13,13,13,.92) 85%); }
.bx__k { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; color: var(--force); margin-bottom: .5rem; }
.bx__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: clamp(1.25rem, 1rem + 1.2vw, 1.9rem); line-height: 1.02; margin-bottom: var(--s3); text-wrap: balance; }
.bx--y { background: var(--force); color: var(--ink); border-color: var(--force); text-decoration: none; }
.bx__big { font-family: var(--ff-d); font-weight: 800; font-stretch: 115%; text-transform: uppercase; font-size: 1.1rem; margin: 0 0 .4rem; }
.bx__big b { display: block; font-weight: 900; font-stretch: 125%; font-size: clamp(3.4rem, 2.4rem + 3vw, 5rem); line-height: .85; letter-spacing: -.03em; }
.bx__go { font-weight: 700; display: inline-flex; gap: .4rem; }
.bx__go span { transition: transform .3s var(--ease-out); }
.bx--y:hover .bx__go span { transform: translateX(5px); }
.bx--y .bx__k { color: var(--ink); opacity: .7; }
.bx--y .ph { background: var(--ink); color: var(--force); }
.bx--line { background: transparent; border: 1.5px dashed rgba(255,199,0,.4); }
.bx--big { min-height: 380px; }
/* Social Running: mismo lenguaje que su flyer (titular ancho y blanco sobre la foto) */
.bx--run > img { object-position: 50% 20%; filter: saturate(.6) brightness(1.15); }
.bx--run:hover > img { filter: saturate(.9) brightness(1.15); }
.bx--run::before { background: linear-gradient(180deg, rgba(13,13,13,0) 0%, rgba(13,13,13,.3) 38%, rgba(13,13,13,.92) 100%); }
.run__t {
  font-family: var(--ff-d); font-weight: 900; font-stretch: 125%; text-transform: uppercase; color: var(--bone);
  font-size: clamp(2.2rem, 1.4rem + 5vw, 5.2rem); line-height: .88; letter-spacing: -.02em; margin-bottom: var(--s4);
  text-shadow: 0 6px 30px rgba(0,0,0,.45);
}
.run__t span { display: block; }
.run__p { font-size: var(--fs-l); line-height: 1.4; color: var(--bone); max-width: 34ch; margin-bottom: .4rem; }
.run__how { color: var(--force); font-weight: 600; font-size: .95rem; margin-bottom: var(--s3); }
@media (min-width: 768px) {
  .bento { grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(220px, auto); }
  .bx--big { grid-column: span 2; grid-row: span 2; min-height: 460px; }
}

/* ---------- Se viene: nuevo piso ---------- */
.obra { position: relative; background: #090909; padding-block: var(--sec); overflow: clip; border-block: 1px solid #1d1d1d; }
/* cinta de obra: cruza las fotos del nuevo piso */
.obra__tape {
  position: absolute; z-index: 4; left: -8%; right: -8%; pointer-events: none;
  background: var(--force); color: var(--ink); overflow: hidden;
  border-block: 8px solid transparent;
  border-image: repeating-linear-gradient(-45deg, var(--ink) 0 9px, var(--force) 9px 18px) 8;
  padding-block: .3rem; box-shadow: 0 16px 34px -10px rgba(0,0,0,.85);
}
.obra__tape--a { top: 14%; transform: rotate(-11deg); } /* en el celu pasa arriba del cartel de la pared */
@media (min-width: 600px) { .obra__tape--a { top: 30%; } }
.obra__tape--b { top: 64%; transform: rotate(7deg); filter: brightness(.94); }
/* en compu la cinta no invade la columna del texto (cuenta regresiva) */
@media (min-width: 900px) { .obra__tape { left: -1%; right: -14%; } }
.obra__track--rev { animation-direction: reverse; }
.obra__tape .obra__track { font-size: clamp(1.1rem, .9rem + 1vw, 1.7rem); }
.obra__track {
  display: flex; width: max-content; gap: 2rem; align-items: center; animation: marquee 34s linear infinite;
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 72%; text-transform: uppercase; font-size: clamp(1.3rem, 1rem + 1.6vw, 2.2rem); line-height: 1; white-space: nowrap;
}
.obra__track span { display: inline-flex; align-items: center; gap: 2rem; }
.obra__track span::after { content: ""; width: .5em; height: .5em; background: var(--ink); transform: rotate(45deg); }
/* Nuevo piso: título + cuenta regresiva pegada a las fotos; el detalle va abajo de las fotos */
.obra__grid { display: grid; row-gap: 10px; }
.obra__grid > * { min-width: 0; }
.obra__copy .count { margin-bottom: 0; }
.obra__more { display: grid; gap: var(--s5); margin-top: var(--s6); }
.obra__more .obra__facts { margin: 0; }
.obra__more .hero__cta { margin-top: var(--s4); }
@media (min-width: 900px) {
  .obra__grid { grid-template-columns: .95fr 1.05fr; column-gap: var(--s7); }
  /* el título arriba y la cuenta regresiva abajo, a la altura del borde de las fotos */
  .obra__copy { display: flex; flex-direction: column; justify-content: space-between; }
  .obra__copy .count { margin-top: auto; }
  .obra__more { grid-column: 1 / -1; grid-template-columns: .95fr 1.05fr; column-gap: var(--s7); align-items: start; margin-top: var(--s7); }
}
.obra__t { font-size: clamp(2.2rem, 1rem + 5vw, 5.4rem); }
.obra__status {
  display: inline-flex; align-items: center; gap: .55rem; margin: 0 0 var(--s4);
  font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--force);
  padding: .4rem .8rem; border: 1px solid rgba(255,199,0,.4); border-radius: var(--r-pill); background: rgba(255,199,0,.06);
}
.obra__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--force); animation: blink 1.6s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .25; } }
/* Cuenta regresiva (amarilla, protagonista del bloque) */
.count {
  position: relative; overflow: hidden; isolation: isolate; margin: var(--s5) 0 var(--s4);
  padding: 1.1rem 1.1rem 1.25rem; border-radius: var(--r-l); background: var(--force); color: var(--ink);
  box-shadow: 0 24px 60px -28px rgba(255,199,0,.55);
}
.count::before { /* rayas de obra muy suaves */
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: repeating-linear-gradient(-45deg, rgba(13,13,13,.06) 0 12px, transparent 12px 24px);
  -webkit-mask: linear-gradient(90deg, transparent 35%, #000); mask: linear-gradient(90deg, transparent 35%, #000);
}
.count::after { /* brillo que pasa cada tanto */
  content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%);
  transform: translateX(-120%); animation: shine 6s ease-in-out infinite 1.5s;
}
@keyframes shine { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
.count__k { display: flex; align-items: center; gap: .5rem; margin: 0 0 .7rem; font-size: var(--fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .14em; }
.count__k svg { width: 1.5em; height: 1.25em; }
.count__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .45rem; }
.count__cell {
  position: relative; display: grid; justify-items: center; gap: .15rem; padding: .7rem .25rem .55rem; border-radius: 12px;
  background: var(--ink); color: var(--force); overflow: hidden;
}
.count__cell::before { /* línea central de "reloj de paletas" */
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(255,199,0,.12);
}
.count__cell b {
  display: block; font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 68%;
  font-size: clamp(2.3rem, 1.5rem + 3.2vw, 3.6rem); line-height: .9; letter-spacing: -.01em; font-variant-numeric: tabular-nums;
}
.count__cell b.is-tick { animation: tick .45s var(--ease-out); }
@keyframes tick { from { transform: translateY(-38%); opacity: 0; } }
.count__cell span { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; color: var(--bone); opacity: .75; }
.count__cell--s b { color: var(--bone); }
.count__done { margin: .2rem 0 0; font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: 1.3rem; }

.obra__facts { list-style: none; padding: 0; margin: var(--s5) 0; border-top: 1px solid var(--line); }
.obra__facts li { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.obra__facts b { font-family: var(--ff-d); font-weight: 800; font-stretch: 110%; text-transform: uppercase; font-size: .95rem; }
.obra__facts span { color: var(--mute); font-size: .92rem; }
/* Collage del nuevo piso: dos fotos altas, una al lado de la otra */
.obra__collage { position: relative; display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 600px) {
  .obra__collage { grid-template-columns: 1.15fr 1fr; height: clamp(440px, 52vw, 640px); }
}
.obra__q {
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 70%; text-transform: uppercase;
  font-size: clamp(1.9rem, 1.2rem + 2.8vw, 3.2rem); line-height: .95; color: var(--bone); margin: var(--s5) 0 var(--s4); text-wrap: balance;
}
.obra__p { color: var(--mute); font-size: var(--fs-l); max-width: 46ch; }
.obra__fig { position: relative; margin: 0; border-radius: var(--r-m); overflow: hidden; aspect-ratio: 1 / 1; min-height: 0; box-shadow: 0 30px 60px -36px #000, 0 0 0 1px var(--line); }
.obra__fig--main { aspect-ratio: 4 / 3.6; }
@media (max-width: 599px) { .obra__fig:not(.obra__fig--main) { aspect-ratio: 16 / 10; } }
@media (min-width: 600px) { .obra__fig, .obra__fig--main { aspect-ratio: auto; height: 100%; } }
.obra__fig figcaption {
  position: absolute; left: 10px; bottom: 10px; z-index: 2; margin: 0; max-width: calc(100% - 20px);
  font-family: var(--ff-d); font-weight: 800; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  padding: .3rem .6rem; border-radius: var(--r-pill); background: rgba(13,13,13,.75); color: var(--bone);
}
.obra__fig--main figcaption { background: var(--force); color: var(--ink); }
@media (max-width: 599px) { .cap-extra { display: none; } }
/* fotos del nuevo piso desenfocadas: se ve que viene algo, sin mostrarlo del todo (al pasar se aclara un poco) */
.obra__fig img { width: 100%; height: 100%; object-fit: cover; filter: blur(7px) brightness(.82) saturate(.9); transform: scale(1.08); transition: transform 1.4s var(--ease-out), filter .8s var(--ease-out); }
.obra__fig:hover img { filter: blur(3.5px) brightness(.9) saturate(1); transform: scale(1.12); }
.obra__peek {
  position: absolute; top: 12px; right: 12px; z-index: 5; margin: 0; padding: .35rem .7rem; border-radius: var(--r-pill);
  background: rgba(13,13,13,.8); border: 1px solid rgba(255,199,0,.45); color: var(--force);
  font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.obra__glow { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen; background: radial-gradient(42% 16% at 50% 30%, rgba(255,246,228,.32), transparent 70%), radial-gradient(30% 12% at 50% 45%, rgba(255,246,228,.24), transparent 70%), radial-gradient(40% 14% at 50% 58%, rgba(255,199,0,.16), transparent 70%); animation: glow 3.6s ease-in-out infinite alternate; }
@keyframes glow { from { opacity: .35; } to { opacity: .9; } }

/* ---------- Beneficios: cupones ---------- */
.cpn-filters { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: var(--s5); }
.pill small { font-size: .75em; opacity: .7; margin-left: .25rem; }
.cpns { display: grid; gap: var(--s4); }
@media (min-width: 620px) { .cpns { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .cpns { grid-template-columns: repeat(3, 1fr); gap: var(--s5); } }
.cpn {
  --rx: 0deg; --ry: 0deg; --notch: var(--ink);
  position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-rows: auto auto 1fr; min-width: 0;
  border-radius: 18px; border: 1px solid var(--line);
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(239,234,225,.05), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E"),
    #151515;
  transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
  transition: transform .5s var(--ease-out), border-color .3s, box-shadow .4s;
}
.cpn::after { /* brillo al pasar */
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.09) 50%, transparent 65%);
  transform: translateX(-110%); transition: transform 1s var(--ease-out);
}
.cpn:hover { border-color: rgba(255,199,0,.5); box-shadow: 0 30px 60px -30px rgba(0,0,0,.9); }
.cpn:hover::after { transform: translateX(110%); }
.cpn.is-hidden { display: none; }
.cpn.is-pop { animation: pop .45s var(--ease-out); }
.cpn__top { display: grid; place-content: center; justify-items: center; text-align: center; gap: .35rem; min-height: 132px; padding: 1.4rem 1.2rem 1.1rem; }
.cpn__brand { margin: 0; font-family: var(--ff-d); font-weight: 900; font-stretch: 110%; font-size: 2.1rem; line-height: 1; color: var(--bone); letter-spacing: -.01em; }
.cpn__brand i { font-style: normal; color: var(--force); }
/* cada marca con su "voz" tipográfica (estilo en la lista BENEFICIOS) */
.cpn__brand--ancha { text-transform: uppercase; font-stretch: 122%; font-size: 2.2rem; letter-spacing: -.03em; }
.cpn__brand--angosta { font-style: italic; font-stretch: 70%; text-transform: uppercase; font-size: 2.6rem; }
.cpn__brand--fina { font-weight: 500; text-transform: uppercase; letter-spacing: .14em; font-size: 1.6rem; font-stretch: 100%; }
.cpn__brand--italica { font-style: italic; font-weight: 800; font-stretch: 86%; font-size: 2.3rem; }
.cpn__brand.is-long { font-size: 1.7rem; }
.cpn__brand--fina.is-long { font-size: 1.2rem; letter-spacing: .1em; }
.cpn__brand--angosta.is-long { font-size: 2.1rem; }
.cpn__top { position: relative; padding-top: 2.8rem; min-height: 150px; } /* lugar para las etiquetas de arriba */
.cpn__tag, .cpn__days {
  position: absolute; top: 12px; font-size: .64rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  padding: .28rem .55rem; border-radius: var(--r-pill); line-height: 1;
}
.cpn__tag { left: 12px; color: var(--mute); border: 1px solid var(--line); }
.cpn__tag--local { color: var(--force); border-color: rgba(255,199,0,.4); }
.cpn__days { right: 12px; background: rgba(239,234,225,.1); color: var(--bone); }
.cpn__days.is-today { background: var(--force); color: var(--ink); }
.cpn__how, .cpn__addr { display: flex; align-items: flex-start; gap: .45rem; margin: 0; font-size: .9rem; line-height: 1.35; color: var(--bone); font-weight: 600; }
.cpn__addr { color: var(--mute); font-weight: 500; }
.cpn__how svg, .cpn__addr svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--force); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.cpn__addr svg { stroke: var(--mute); stroke-width: 1.8; }
.cpn__fine { margin: 0; font-size: .8rem; color: var(--mute); }
.cpn__links { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: auto; padding-top: .25rem; }
.cpn .cpn__bot { display: flex; flex-direction: column; align-items: flex-start; } /* los links quedan abajo de todo */

/* Cómo se usa + agenda + herramientas */
.fam-how { list-style: none; margin: 0 0 var(--s5); padding: 0; display: grid; gap: .6rem; }
@media (min-width: 720px) { .fam-how { grid-template-columns: repeat(3, 1fr); gap: var(--s4); } }
.fam-how li { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: center; padding: .9rem 1.1rem; border-radius: var(--r-m); background: var(--carbon); border: 1px solid var(--line); }
.fam-how__n { grid-row: span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--force); color: var(--ink); font-family: var(--ff-d); font-weight: 900; font-size: 1.15rem; }
.fam-how b { font-family: var(--ff-d); font-weight: 800; font-stretch: 110%; text-transform: uppercase; font-size: 1rem; letter-spacing: .01em; }
.fam-how li > span:last-child { color: var(--mute); font-size: .9rem; line-height: 1.35; }

.fam-week { margin-bottom: var(--s5); padding: 1.1rem; border-radius: var(--r-l); border: 1px solid rgba(255,199,0,.3); background: radial-gradient(80% 140% at 100% 0%, rgba(255,199,0,.1), transparent 60%), var(--ink-2); }
.fam-week:empty { display: none; }
@media (min-width: 900px) { .fam-week { display: grid; grid-template-columns: minmax(220px, .8fr) 2fr; gap: var(--s5); align-items: center; padding: 1.3rem 1.5rem; } }
.fam-week__k { margin: 0 0 .3rem; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--force); }
.fam-week__now { margin: 0 0 var(--s4); color: #cfcac1; font-size: .95rem; line-height: 1.45; }
.fam-week__now b { color: var(--bone); }
@media (min-width: 900px) { .fam-week__now { margin: 0; } }
.fam-week__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
@media (min-width: 600px) { .fam-week__grid { grid-template-columns: repeat(4, 1fr); } }
.fam-day {
  display: grid; gap: .3rem; align-content: start; text-align: left; cursor: pointer; padding: .7rem .8rem; border-radius: var(--r-m);
  background: rgba(239,234,225,.04); border: 1.5px solid var(--line); color: var(--bone); transition: border-color .2s, background-color .2s, transform .15s;
}
.fam-day:hover { border-color: var(--mute); }
.fam-day:active { transform: scale(.97); }
.fam-day b { display: flex; align-items: center; gap: .4rem; font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: 1.05rem; }
.fam-day b i { font-style: normal; font-size: .6rem; letter-spacing: .1em; padding: .2rem .4rem; border-radius: var(--r-pill); background: var(--force); color: var(--ink); }
.fam-day span { font-size: .8rem; line-height: 1.35; color: var(--mute); }
.fam-day.is-today { border-color: rgba(255,199,0,.55); }
.fam-day.is-on { background: var(--force); border-color: var(--force); color: var(--ink); }
.fam-day.is-on span { color: rgba(13,13,13,.75); }
.fam-day.is-on b i { background: var(--ink); color: var(--force); }

.fam-tools { display: grid; gap: var(--s3); margin-bottom: var(--s4); }
@media (min-width: 900px) { .fam-tools { grid-template-columns: auto 1fr; align-items: center; } .fam-rubros { grid-column: 1 / -1; } }
.fam-tabs { display: flex; flex-wrap: wrap; gap: .45rem; }
.fam-search { position: relative; display: block; }
@media (min-width: 900px) { .fam-search { justify-self: end; width: min(340px, 100%); } }
.fam-search svg { position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); fill: none; stroke: var(--mute); stroke-width: 2; stroke-linecap: round; pointer-events: none; }
.fam-search input {
  width: 100%; min-height: 46px; padding: .6rem 1rem .6rem 2.6rem; border-radius: var(--r-pill);
  background: var(--carbon); border: 1.5px solid var(--line); color: var(--bone); font-size: 1rem; transition: border-color .2s;
}
.fam-search input::placeholder { color: #7d786f; }
.fam-search input:focus { outline: none; border-color: var(--force); }
.pill--s { min-height: 36px; padding: .3rem .85rem; font-size: .85rem; }
.fam-count { min-height: 1.2em; margin: 0 0 var(--s3); font-size: .85rem; font-weight: 600; color: var(--mute); }
.fam-more { display: flex; justify-content: center; margin-top: var(--s5); }
.fam-more .btn[hidden] { display: none; }
.fam-join {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4);
  margin-top: var(--s6); padding: 1.2rem 1.4rem; border-radius: var(--r-l); border: 1.5px dashed rgba(255,199,0,.45);
}
.fam-join__t { margin: 0; font-family: var(--ff-d); font-weight: 800; font-stretch: 108%; text-transform: uppercase; font-size: clamp(1rem, .9rem + .6vw, 1.3rem); line-height: 1.15; }
.fam-join__t .y { display: block; }
.btn--line-y { --fg: var(--force); --bd: var(--force); --sweep: var(--force); }
.btn--line-y:hover { color: var(--ink); }
.cpn__what { margin: 0; color: var(--mute); font-size: .74rem; text-transform: uppercase; letter-spacing: .12em; font-weight: 600; }
.cpn__cut { position: relative; height: 0; margin: 0 22px; border-top: 2px dashed rgba(239,234,225,.16); }
.cpn__cut::before, .cpn__cut::after { content: ""; position: absolute; top: -13px; width: 24px; height: 24px; border-radius: 50%; background: var(--notch); box-shadow: inset 0 0 0 1px var(--line); }
.cpn__cut::before { left: -35px; }
.cpn__cut::after { right: -35px; }
.cpn__bot { display: grid; gap: .75rem; align-content: start; justify-items: start; padding: 1.15rem 1.4rem 1.45rem; }
.cpn__off { display: flex; align-items: baseline; gap: .35rem; margin: 0; color: var(--force); font-family: var(--ff-d); font-stretch: 125%; }
.cpn__off b { font-weight: 900; font-size: clamp(2.8rem, 2.2rem + 2vw, 3.6rem); line-height: .85; letter-spacing: -.03em; }
.cpn__off span { font-weight: 800; font-size: 1.15rem; }
.cpn__cond { margin: 0; color: #cfcac1; font-size: .95rem; line-height: 1.45; }
.cpn__ig { font-size: .88rem; font-weight: 600; text-decoration: none; color: var(--bone); background: rgba(239,234,225,.1); padding: .38rem .8rem; border-radius: 10px; transition: background-color .2s, color .2s; }
.cpn__ig:hover { background: var(--force); color: var(--ink); }
.cpn__code {
  display: inline-flex; align-items: center; gap: .6rem; flex-wrap: wrap; cursor: pointer; min-height: 44px;
  padding: .45rem .5rem .45rem .8rem; border-radius: 10px; border: 1.5px dashed var(--force); background: rgba(255,199,0,.07); color: var(--bone);
  transition: background-color .2s, transform .15s;
}
.cpn__code:hover { background: rgba(255,199,0,.15); }
.cpn__code:active { transform: scale(.97); }
.cpn__code-k { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); }
.cpn__code b { font-family: var(--ff-d); font-weight: 800; font-stretch: 112%; letter-spacing: .08em; color: var(--force); font-size: 1.05rem; }
.cpn__copy { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; background: var(--force); color: var(--ink); padding: .25rem .55rem; border-radius: 6px; }
.cpn__code.is-copied { border-style: solid; }
.cpn__code.is-copied .cpn__copy { background: var(--bone); }
.cpn--hot { border-color: var(--force); }
.cpn--hot .cpn__top { background: var(--force); }
.cpn--hot .cpn__brand, .cpn--hot .cpn__what { color: var(--ink); }
.cpn--hot .cpn__tag { color: var(--ink); border-color: rgba(13,13,13,.35); }
.cpn--hot .cpn__top::after { content: attr(data-hot); position: absolute; top: 12px; right: 12px; font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; background: var(--ink); color: var(--force); padding: .25rem .5rem; border-radius: var(--r-pill); }

/* ---------- Pasito (app aliada) ---------- */
.pasito {
  --lime: #dcf34f;
  position: relative; overflow: hidden; isolation: isolate; display: grid; gap: var(--s5); align-items: center;
  margin-top: var(--s7); padding: clamp(1.5rem, 4vw, 3rem); border-radius: var(--r-l); border: 1px solid rgba(220,243,79,.35);
  background: radial-gradient(90% 140% at 0% 100%, rgba(220,243,79,.13), transparent 60%), var(--carbon);
}
@media (min-width: 900px) { .pasito { grid-template-columns: 1.15fr .85fr; } }
.pasito__k { margin: 0 0 .6rem; color: var(--lime); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
.pasito__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.2rem); line-height: 1; margin-bottom: var(--s4); }
.pasito__t span { display: block; color: var(--lime); font-style: italic; font-stretch: 72%; font-size: 2.1em; line-height: .9; letter-spacing: -.01em; margin-top: .1em; }
.pasito__p { color: #cfcac1; font-size: var(--fs-l); max-width: 44ch; }
.pasito__walk { position: relative; height: 170px; }
.pasito__walk .step {
  position: absolute; width: 22px; height: 36px; border-radius: 48% 48% 42% 42%; background: var(--lime); opacity: .1;
  animation: walk 3.2s ease-in-out infinite;
}
.pasito__walk .step::before { content: ""; position: absolute; left: 50%; top: -11px; width: 12px; height: 9px; border-radius: 50%; background: inherit; transform: translateX(-50%); }
.pasito__walk .step:nth-child(odd) { --r: 62deg; }
.pasito__walk .step:nth-child(even) { --r: 78deg; }
.pasito__walk .step { transform: rotate(var(--r)); }
.pasito__walk .step:nth-child(1) { left: 2%;  top: 62%; animation-delay: 0s; }
.pasito__walk .step:nth-child(2) { left: 13%; top: 40%; animation-delay: .3s; }
.pasito__walk .step:nth-child(3) { left: 25%; top: 58%; animation-delay: .6s; }
.pasito__walk .step:nth-child(4) { left: 37%; top: 35%; animation-delay: .9s; }
.pasito__walk .step:nth-child(5) { left: 49%; top: 52%; animation-delay: 1.2s; }
.pasito__walk .step:nth-child(6) { left: 61%; top: 28%; animation-delay: 1.5s; }
.pasito__walk .step:nth-child(7) { left: 73%; top: 45%; animation-delay: 1.8s; }
.pasito__walk .step:nth-child(8) { left: 85%; top: 20%; animation-delay: 2.1s; }
@keyframes walk { 0%, 100% { opacity: .1; } 12% { opacity: 1; } 45% { opacity: .1; } }

/* ---------- Equipo ---------- */
/* 6 profes: 2 columnas en celular, 3 en tablet y escritorio (sin tarjetas sueltas) */
.team { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s4); }
@media (min-width: 768px) { .team { grid-template-columns: repeat(3, 1fr); gap: var(--s5); } }

/* Promo "Traé a un amigo" */
.amigo {
  position: relative; overflow: hidden; isolation: isolate; display: grid; gap: var(--s5); align-items: center;
  margin-bottom: var(--s5); padding: clamp(1.5rem, 4vw, 2.75rem); border-radius: var(--r-l);
  background: var(--force); color: var(--ink);
}
.amigo::after { /* cinta diagonal de fondo */
  content: ""; position: absolute; z-index: -1; right: -10%; top: -40%; width: 45%; height: 180%;
  background: repeating-linear-gradient(-45deg, rgba(13,13,13,.07) 0 14px, transparent 14px 28px); transform: rotate(8deg);
}
.amigo__pct { display: grid; justify-items: start; line-height: .85; font-family: var(--ff-d); }
.amigo__pct b { font-weight: 900; font-style: italic; font-stretch: 68%; font-size: clamp(5rem, 3rem + 8vw, 8.5rem); letter-spacing: -.02em; }
.amigo__pct span { font-weight: 900; font-stretch: 125%; font-size: clamp(1.4rem, 1rem + 1.4vw, 2rem); }
.amigo__pct small { margin-top: .5rem; font-family: var(--ff-b); font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.amigo__k { margin: 0 0 .6rem; font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; opacity: .75; }
.amigo__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: clamp(1.2rem, .95rem + 1.2vw, 1.9rem); line-height: 1.08; margin-bottom: var(--s5); text-wrap: balance; max-width: 30ch; }
.amigo__cta { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem; }
.amigo .ph { color: var(--ink); background: rgba(13,13,13,.06); border-color: rgba(13,13,13,.5); }
@media (min-width: 800px) { .amigo { grid-template-columns: auto 1fr; gap: var(--s7); } }
.btn--ink { --bg: var(--ink); --fg: var(--force); --bd: var(--ink); --sweep: var(--bone); }
.btn--ink:hover { color: var(--ink); }

/* Botones de tiendas (Crossfy) */
.app__btns { display: flex; flex-wrap: wrap; gap: .6rem; }
.store {
  display: inline-flex; align-items: center; gap: .65rem; min-height: 52px; padding: .5rem 1.1rem .5rem .9rem; border-radius: 12px;
  border: 1.5px solid rgba(239,234,225,.28); color: var(--bone); text-decoration: none; background: rgba(13,13,13,.4);
  transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.store svg { width: 24px; height: 24px; flex: none; }
.store span { display: grid; line-height: 1.1; font-weight: 700; font-size: 1rem; }
.store small { font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--mute); transition: color .2s; }
.store:hover { background: var(--bone); color: var(--ink); border-color: var(--bone); }
.store:hover small { color: #555; }
.store:active { transform: scale(.97); }
.store--lime { border-color: rgba(220,243,79,.45); }
.store--lime svg { color: #dcf34f; }
.store--lime:hover { background: #dcf34f; border-color: #dcf34f; color: var(--ink); }
.store--lime:hover svg { color: var(--ink); }
.pasito .app__btns { margin-top: var(--s4); }

/* Nutricionistas dentro de la tarjeta de Nutrición */
.nutri { list-style: none; padding: 0; margin: 0 0 var(--s4); display: grid; gap: .6rem; position: relative; z-index: 2; }
.nutri li { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.nutri img { width: 46px; height: 46px; flex: none; border-radius: 50%; object-fit: cover; object-position: 50% 28%; border: 2px solid var(--force); background: var(--carbon-2); }
.nutri span { display: grid; min-width: 0; line-height: 1.25; }
.nutri b { font-family: var(--ff-d); font-weight: 800; font-stretch: 105%; text-transform: uppercase; font-size: .82rem; letter-spacing: .02em; }
.nutri a { color: var(--force); text-decoration: none; font-size: .85rem; overflow-wrap: anywhere; }
.nutri a:hover { text-decoration: underline; text-underline-offset: 3px; }
.mate p a { color: var(--force); text-decoration: none; }
.mate p a:hover { text-decoration: underline; text-underline-offset: 3px; }
.mate__tag--k { background: var(--ink); color: var(--force); border: 1px solid rgba(255,199,0,.5); }
.mate { margin: 0; min-width: 0; }
.mate__pic {
  aspect-ratio: 4 / 5; border-radius: var(--r-m); margin: 0 0 var(--s3); position: relative; overflow: hidden;
  background: var(--carbon); border: 1px solid var(--line); transition: border-color .3s, transform .5s var(--ease-out);
}
.mate__pic img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transition: transform .9s var(--ease-out); }
.mate--photo .mate__pic::after { content: ""; position: absolute; inset: auto 0 0; height: 40%; background: linear-gradient(transparent, rgba(13,13,13,.55)); }
.mate__tag {
  position: absolute; left: 10px; bottom: 10px; z-index: 2; background: var(--force); color: var(--ink);
  font-family: var(--ff-d); font-weight: 800; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  padding: .3rem .6rem; border-radius: var(--r-pill);
}
.mate__pic--ph { display: grid; place-items: center; background: repeating-linear-gradient(-45deg, var(--carbon) 0 14px, var(--carbon-2) 14px 28px); }
.mate__pic--ph svg { width: 34%; height: 29%; color: #333; transition: color .3s, transform .5s var(--ease-out); }
.mate:hover .mate__pic { border-color: rgba(255,199,0,.55); transform: translateY(-4px); }
.mate:hover .mate__pic img { transform: scale(1.05); }
.mate:hover .mate__pic--ph svg { color: var(--force); transform: translateX(6px); }
.mate h3 { font-family: var(--ff-d); font-weight: 800; font-stretch: 110%; text-transform: uppercase; font-size: 1rem; line-height: 1.15; margin-bottom: .35rem; }
.mate p { margin: 0; color: var(--mute); font-size: .9rem; }

/* ---------- Pasos + planes ---------- */
.steps { list-style: none; padding: 0; margin: 0 0 var(--s7); display: grid; gap: var(--s4); counter-reset: s; }
@media (min-width: 768px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.step { padding: var(--s5); border-top: 2px solid var(--force); background: linear-gradient(180deg, rgba(255,199,0,.06), transparent 70%); border-radius: 0 0 var(--r-m) var(--r-m); }
.step__n { font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 70%; font-size: 3.4rem; line-height: 1; color: var(--force); display: block; margin-bottom: .4rem; }
.step h3 { font-family: var(--ff-d); font-weight: 900; font-stretch: 115%; text-transform: uppercase; font-size: 1.25rem; margin-bottom: .5rem; }
.step p { color: var(--mute); margin: 0; }
.plan__k { margin: 0 0 .6rem; color: var(--force); text-transform: uppercase; letter-spacing: .14em; font-size: var(--fs-xs); font-weight: 700; }
.plancta {
  position: relative; overflow: hidden; isolation: isolate; display: grid; gap: var(--s5); align-items: center;
  padding: clamp(1.5rem, 4vw, 3rem); border-radius: var(--r-l); border: 1px solid rgba(255,199,0,.35);
  background: radial-gradient(90% 120% at 100% 0%, rgba(255,199,0,.14), transparent 60%), var(--carbon);
}
.plancta::after { /* corredor gigante de fondo */
  content: ""; position: absolute; right: -4%; bottom: -18%; width: 46%; aspect-ratio: 34 / 28.6; z-index: -1; opacity: .06;
  background: var(--force);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='76.6 40.8 34 28.6'%3E%3Cg fill='none' stroke='%23000' stroke-width='3.7' stroke-miterlimit='6'%3E%3Cpath d='M82.6 53.2 91.8 46 98.5 51.8 107 45.4'/%3E%3Cpath d='M78.8 66.6 91.8 55.6 99.2 61.8 94.4 67.4'/%3E%3C/g%3E%3Ccircle cx='99.2' cy='43.6' r='2.3'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='76.6 40.8 34 28.6'%3E%3Cg fill='none' stroke='%23000' stroke-width='3.7' stroke-miterlimit='6'%3E%3Cpath d='M82.6 53.2 91.8 46 98.5 51.8 107 45.4'/%3E%3Cpath d='M78.8 66.6 91.8 55.6 99.2 61.8 94.4 67.4'/%3E%3C/g%3E%3Ccircle cx='99.2' cy='43.6' r='2.3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.plancta__t { font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: clamp(1.3rem, 1rem + 1.5vw, 2.2rem); line-height: 1.05; margin-bottom: var(--s5); max-width: 26ch; text-wrap: balance; }
.chips--lg li { font-size: .85rem; padding: .35rem .8rem; }
.plancta__ph { margin: 0; }
.plancta .btn { justify-self: start; }
@media (min-width: 900px) { .plancta { grid-template-columns: 1fr auto; } .plancta .btn { justify-self: end; } }

/* ---------- Galería: tiras de fotos en movimiento ---------- */
.reel {
  display: grid; gap: 14px; padding-block: 4px;
  -webkit-mask: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
          mask: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.reel__row { overflow: hidden; }
.reel__track { display: flex; gap: 14px; width: max-content; animation: marquee 75s linear infinite; }
.reel__track--rev { animation-direction: reverse; animation-duration: 85s; }
.reel:hover .reel__track, .reel:focus-within .reel__track { animation-play-state: paused; }
.gi {
  --h: clamp(190px, 22vw, 270px);
  position: relative; flex: none; height: var(--h); padding: 0; border: 0; margin: 0; cursor: zoom-in;
  border-radius: var(--r-m); overflow: hidden; background: var(--carbon); color: var(--ink);
}
.gi img { height: 100%; width: auto; max-width: none; transition: transform .9s var(--ease-out), filter .5s; filter: saturate(.92); }
.gi::before { /* etiqueta */
  content: attr(data-tag); position: absolute; left: 10px; bottom: 10px; z-index: 2;
  font-family: var(--ff-d); font-weight: 800; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  padding: .3rem .6rem; border-radius: var(--r-pill); background: rgba(13,13,13,.72); color: var(--bone);
  transition: background-color .3s, color .3s;
}
.gi::after { content: "+"; position: absolute; right: 10px; top: 10px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--force); color: var(--ink); font-weight: 800; font-size: 1.3rem; transform: scale(0) rotate(-90deg); transition: transform .4s var(--ease-out); }
.gi:hover img, .gi:focus-visible img { transform: scale(1.06); filter: saturate(1.1); }
.gi:hover::before, .gi:focus-visible::before { background: var(--force); color: var(--ink); }
.gi:hover::after, .gi:focus-visible::after { transform: none; }
.reel__foot { display: flex; flex-wrap: wrap; gap: var(--s4); justify-content: space-between; align-items: center; margin-top: var(--s6); }
.reel__note { margin: 0; }

.lightbox { padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100svh; width: 100vw; height: 100svh; margin: 0; color: var(--bone); }
.lightbox[open] { display: grid; place-items: center; animation: lbIn .35s var(--ease-out); }
.lightbox::backdrop { background: rgba(8,8,8,.92); }
@keyframes lbIn { from { opacity: 0; transform: scale(.97); } }
.lightbox img { max-width: min(92vw, 720px); max-height: 78svh; width: auto; border-radius: var(--r-m); box-shadow: 0 30px 80px -20px #000; }
.lightbox__cap { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); width: min(90vw, 640px); text-align: center; color: var(--mute); font-size: var(--fs-s); margin: 0; }
.lb-btn { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid var(--line); background: rgba(20,20,20,.8); color: var(--bone); cursor: pointer; font-size: 1.2rem; transition: background-color .2s, color .2s; }
.lb-btn:hover { background: var(--force); color: var(--ink); border-color: var(--force); }
.lb-close { top: 16px; right: 16px; }
.lb-prev { left: 12px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 12px; top: 50%; transform: translateY(-50%); }

/* ---------- Instagram ---------- */
.ig { padding-block: calc(var(--sec) * .8); background: var(--force); color: var(--ink); overflow: hidden; }
.ig__inner { display: grid; gap: var(--s3); }
.ig__k { margin: 0; text-transform: uppercase; letter-spacing: .14em; font-size: var(--fs-xs); font-weight: 700; }
.ig__handle {
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 66%; text-transform: uppercase;
  font-size: clamp(2.2rem, 13vw, 10rem); line-height: .86; text-decoration: none; letter-spacing: -.01em;
  display: inline-flex; align-items: baseline; gap: .1em; transition: letter-spacing .5s var(--ease-out); white-space: nowrap;
}
.ig__handle span { font-size: .4em; transition: transform .4s var(--ease-out); }
.ig__handle:hover { letter-spacing: .01em; }
.ig__handle:hover span { transform: translate(6px, -6px); }
.ig__handle:focus-visible { outline-color: var(--ink); }
.ig__p { max-width: 56ch; margin: var(--s3) 0 0; font-size: var(--fs-l); }
.ig__p a { font-weight: 700; }
.ig a:focus-visible { outline-color: var(--ink); }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: var(--s5); }
@media (min-width: 1000px) { .faq { grid-template-columns: .8fr 1.2fr; gap: var(--s7); } .faq .shead { position: sticky; top: calc(var(--nav-h) + 24px); align-self: start; } }
.faq__list { border-top: 1px solid var(--line); }
.qa { border-bottom: 1px solid var(--line); }
.qa summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: center;
  padding: 1.15rem 0; font-weight: 600; font-size: 1.08rem; line-height: 1.35; transition: color .2s;
}
.qa summary::-webkit-details-marker { display: none; }
.qa summary::after {
  content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--line);
  background: linear-gradient(var(--bone), var(--bone)) center / 12px 2px no-repeat, linear-gradient(var(--bone), var(--bone)) center / 2px 12px no-repeat;
  transition: transform .35s var(--ease-out), background-color .2s, border-color .2s;
}
.qa summary:hover { color: var(--force); }
.qa[open] summary::after { transform: rotate(135deg); background-color: var(--force); border-color: var(--force); background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)); }
.qa__a { color: var(--mute); padding: 0 3rem 1.2rem 0; }
.qa[open] .qa__a { animation: pop .4s var(--ease-out); }
.qa__a p { margin: 0; }
.qa__a strong { color: var(--bone); }

/* ---------- Ubicación ---------- */
.loc { display: grid; gap: var(--s6); align-items: center; }
@media (min-width: 900px) { .loc { grid-template-columns: .9fr 1.1fr; gap: var(--s7); } }
.loc__addr { font-style: normal; font-size: var(--fs-l); margin: var(--s5) 0; line-height: 1.5; }
.loc__list { list-style: none; padding: 0; margin: 0 0 var(--s5); border-top: 1px solid var(--line); }
.loc__list li { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.loc__list span { color: var(--mute); font-size: .92rem; }
.loc__list b { font-weight: 600; }
.loc__map { border-radius: var(--r-l); overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4 / 3.4; background: var(--carbon); position: relative; }
.loc__map iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(1) invert(.92) contrast(.88) brightness(.95); transition: filter .5s; }
.loc__map:hover iframe { filter: grayscale(.2) invert(0); }
/* Variante sin iframe: tarjeta que abre Google Maps */
.loc__card {
  display: grid; place-content: center; justify-items: center; gap: .45rem; text-align: center; text-decoration: none; color: var(--bone);
  background:
    radial-gradient(circle at 50% 42%, rgba(255,199,0,.16), transparent 42%),
    linear-gradient(118deg, transparent 47%, rgba(255,199,0,.22) 47% 48.6%, transparent 48.6%),
    linear-gradient(32deg, transparent 62%, rgba(239,234,225,.07) 62% 63.4%, transparent 63.4%),
    repeating-linear-gradient(0deg, transparent 0 46px, rgba(239,234,225,.045) 46px 48px),
    repeating-linear-gradient(90deg, transparent 0 62px, rgba(239,234,225,.045) 62px 64px),
    var(--carbon);
  transition: border-color .3s;
}
.loc__pin { width: 68px; height: 68px; border-radius: 50%; background: var(--force); display: grid; place-items: center; margin-bottom: .6rem; box-shadow: 0 0 0 10px rgba(255,199,0,.15), 0 0 0 22px rgba(255,199,0,.06); transition: transform .5s var(--ease-out); }
.loc__pin svg { width: 58%; height: 50%; color: var(--ink); }
.loc__card-t { font-family: var(--ff-d); font-weight: 900; font-stretch: 112%; text-transform: uppercase; font-size: clamp(1.05rem, .9rem + .8vw, 1.4rem); }
.loc__card-s { color: var(--force); font-weight: 600; font-size: .95rem; }
.loc__card:hover { border-color: rgba(255,199,0,.55); }
.loc__card:hover .loc__pin { transform: translateY(-6px) scale(1.05); }

/* ---------- Contacto ---------- */
.contact { background: radial-gradient(80% 60% at 0% 100%, rgba(255,199,0,.08), transparent 70%); }
.contact__grid { display: grid; gap: var(--s6); }
.contact__grid > *, .hero__grid > *, .loc > *, .planner > *, .faq > *, .pilates__grid > * { min-width: 0; }
@media (min-width: 1000px) { .contact__grid { grid-template-columns: 1fr 1fr; gap: var(--s7); align-items: start; } }
.contact__list { list-style: none; padding: 0; margin: var(--s6) 0 0; border-top: 1px solid var(--line); }
.contact__list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.contact__list span { color: var(--mute); font-size: .92rem; }
.contact__list a, .contact__list b { font-weight: 600; color: var(--bone); text-decoration: none; }
.contact__list a { color: var(--force); }
.contact__list a:hover { text-decoration: underline; text-underline-offset: 3px; }
.form { background: var(--carbon); border: 1px solid var(--line); border-radius: var(--r-l); padding: clamp(1.25rem, 3vw, 2.25rem); display: grid; gap: var(--s4); }
.field { display: grid; gap: .45rem; }
.field label { font-weight: 600; font-size: .95rem; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 50px; padding: .8rem 1rem; border-radius: var(--r-s); border: 1.5px solid var(--line); background: var(--ink-2); color: var(--bone);
  font-size: 1rem; transition: border-color .2s, box-shadow .2s;
}
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--force) 50%), linear-gradient(135deg, var(--force) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 2.6rem; }
.field textarea { resize: vertical; line-height: 1.5; min-height: 130px; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: #444; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--force); box-shadow: 0 0 0 3px rgba(255,199,0,.25); }
.field input[aria-invalid="true"] { border-color: #ff6b5a; }
.field__err { color: #ff8a7a; font-size: .88rem; margin: 0; }
.field__hint { color: var(--mute); font-size: .85rem; margin: 0; }
.form__warn { margin: 0; font-size: .85rem; color: var(--ink); background: var(--force); padding: .6rem .8rem; border-radius: var(--r-s); }

/* ---------- CTA final ---------- */
.final { padding-block: var(--sec); text-align: center; position: relative; overflow: hidden; border-top: 1px solid var(--line); }
.final::before { content: ""; position: absolute; left: 50%; top: 55%; width: 90vmax; height: 50vmax; transform: translate(-50%, -50%); background: radial-gradient(closest-side, rgba(255,199,0,.14), transparent); pointer-events: none; }
.final__k { font-family: var(--ff-d); font-weight: 700; color: var(--mute); text-transform: uppercase; letter-spacing: .2em; font-size: var(--fs-s); position: relative; }
.final__t {
  font-family: var(--ff-d); font-weight: 900; font-style: italic; font-stretch: 66%; text-transform: uppercase;
  font-size: clamp(3rem, 1rem + 11vw, 10rem); line-height: .86; margin: 0 auto var(--s6); max-width: 12ch; text-wrap: balance; position: relative;
}
.final .btn { position: relative; }

/* ---------- Footer ---------- */
.foot { background: #090909; border-top: 1px solid var(--line); padding-top: var(--s7); font-size: .95rem; }
.foot__grid { display: grid; gap: var(--s6); grid-template-columns: 1fr; padding-bottom: var(--s7); }
@media (min-width: 640px) { .foot__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .foot__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.foot__sub { color: var(--mute); margin: .6rem 0 .4rem; text-transform: uppercase; letter-spacing: .14em; font-size: var(--fs-xs); font-weight: 600; }
.foot__ph { margin: 0; }
.foot__h { font-family: var(--ff-d); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: var(--fs-xs); color: var(--force); margin-bottom: .6rem; }
.foot p { color: var(--mute); }
.foot a { color: var(--bone); text-decoration-color: rgba(239,234,225,.3); text-underline-offset: 3px; transition: color .2s; }
.foot a:hover { color: var(--force); }
.foot__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; border-top: 1px solid var(--line); padding-block: var(--s5) calc(var(--s5) + env(safe-area-inset-bottom)); font-size: .85rem; }
.foot__bar p { margin: 0; }
.foot__bar strong { color: var(--bone); }

/* ---------- WhatsApp flotante ---------- */
.fab {
  position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 95; width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center; background: var(--force); color: var(--ink); box-shadow: 0 12px 30px -8px rgba(0,0,0,.7);
  transform: translateY(140%) scale(.8); opacity: 0; transition: transform .5s var(--ease-out), opacity .3s, box-shadow .3s;
}
.fab { border: 2px solid var(--ink); }
.fab svg { width: 28px; height: 28px; }
.fab.is-on { transform: none; opacity: 1; }
.fab:hover { box-shadow: 0 0 0 6px rgba(255,199,0,.25), 0 12px 30px -8px rgba(0,0,0,.7); }
.fab:active { transform: scale(.94); }

/* ---------- Reveal on scroll ---------- */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ease-out), transform .9s var(--ease-out); transition-delay: var(--d, 0s); }
.js .reveal.is-in { opacity: 1; transform: none; }
.rise { animation: rise .9s var(--ease-out) both; animation-delay: var(--d, 0s); }
@keyframes rise { from { opacity: 0; transform: translateY(24px); } }
.js .card.reveal.is-in, .js .cpn.reveal.is-in { transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); }
.js .arch--b.reveal.is-in { transform: translateY(-14%); }
/* Títulos: suben desde una máscara */
.js .h2.reveal { opacity: 1; clip-path: inset(0 0 100% 0); transform: translateY(.45em); transition: clip-path 1s var(--ease-out), transform 1s var(--ease-out); transition-delay: var(--d, 0s); }
.js .h2.reveal.is-in { clip-path: inset(-.25em -.25em -.35em -.25em); transform: none; }

/* ---------- Movimiento reducido ----------
   Pedido explícito del usuario: cortamos lo intrusivo (rodillo del hero,
   marquesina, parallax, giro del badge, pulso) y acortamos las entradas.
   Hover y transiciones de color quedan, porque no marean. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .brk { animation: none !important; }
  .tape__track { animation-duration: 160s; }
  .badge text { animation: none; }
  .reel__track { animation: none; }
  .reel__row { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .reel__row .gi { scroll-snap-align: start; }
  .logo:hover .logo__x { animation: none; }
  .js .reveal { transform: none; transition: opacity .35s linear; }
  .js .h2.reveal { clip-path: none; transform: none; opacity: 0; }
  .js .h2.reveal.is-in { opacity: 1; }
  .rise { animation: none; }
  .hero__slides img { transition: opacity .6s ease; transform: none !important; }
  .hero__bars { display: none; }
  .obra__track { animation-duration: 160s; }
  .obra__glow, .pasito__walk .step, .obra__dot, .hero__bg img, .count::after, .count__cell b.is-tick { animation: none; }
  .pasito__walk .step { opacity: .45; }
  .cpn { transform: none !important; }
  .hero__media img { transform: none !important; }
  .menu, .menu a { transition-duration: .01s; }
  .card { transform: none !important; }
}

/* ---------- Leaflet 1.9.4 (mapa) - estilos base de la librería ---------- */
.leaflet-image-layer,.leaflet-layer,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-pane,.leaflet-pane>canvas,.leaflet-pane>svg,.leaflet-tile,.leaflet-tile-container,.leaflet-zoom-box{position:absolute;left:0;top:0}.leaflet-container{overflow:hidden}.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile{-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.leaflet-tile::selection{background:0 0}.leaflet-safari .leaflet-tile{image-rendering:-webkit-optimize-contrast}.leaflet-safari .leaflet-tile-container{width:1600px;height:1600px;-webkit-transform-origin:0 0}.leaflet-marker-icon,.leaflet-marker-shadow{display:block}.leaflet-container .leaflet-overlay-pane svg{max-width:none!important;max-height:none!important}.leaflet-container .leaflet-marker-pane img,.leaflet-container .leaflet-shadow-pane img,.leaflet-container .leaflet-tile,.leaflet-container .leaflet-tile-pane img,.leaflet-container img.leaflet-image-layer{max-width:none!important;max-height:none!important;width:auto;padding:0}.leaflet-container img.leaflet-tile{mix-blend-mode:plus-lighter}.leaflet-container.leaflet-touch-zoom{-ms-touch-action:pan-x pan-y;touch-action:pan-x pan-y}.leaflet-container.leaflet-touch-drag{-ms-touch-action:pinch-zoom;touch-action:none;touch-action:pinch-zoom}.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom{-ms-touch-action:none;touch-action:none}.leaflet-container{-webkit-tap-highlight-color:transparent}.leaflet-container a{-webkit-tap-highlight-color:rgba(51,181,229,.4)}.leaflet-tile{filter:inherit;visibility:hidden}.leaflet-tile-loaded{visibility:inherit}.leaflet-zoom-box{width:0;height:0;-moz-box-sizing:border-box;box-sizing:border-box;z-index:800}.leaflet-overlay-pane svg{-moz-user-select:none}.leaflet-pane{z-index:400}.leaflet-tile-pane{z-index:200}.leaflet-overlay-pane{z-index:400}.leaflet-shadow-pane{z-index:500}.leaflet-marker-pane{z-index:600}.leaflet-tooltip-pane{z-index:650}.leaflet-popup-pane{z-index:700}.leaflet-map-pane canvas{z-index:100}.leaflet-map-pane svg{z-index:200}.leaflet-vml-shape{width:1px;height:1px}.lvml{behavior:url(#default#VML);display:inline-block;position:absolute}.leaflet-control{position:relative;z-index:800;pointer-events:visiblePainted;pointer-events:auto}.leaflet-bottom,.leaflet-top{position:absolute;z-index:1000;pointer-events:none}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}.leaflet-control{float:left;clear:both}.leaflet-right .leaflet-control{float:right}.leaflet-top .leaflet-control{margin-top:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{margin-right:10px}.leaflet-fade-anim .leaflet-popup{opacity:0;-webkit-transition:opacity .2s linear;-moz-transition:opacity .2s linear;transition:opacity .2s linear}.leaflet-fade-anim .leaflet-map-pane .leaflet-popup{opacity:1}.leaflet-zoom-animated{-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0}svg.leaflet-zoom-animated{will-change:transform}.leaflet-zoom-anim .leaflet-zoom-animated{-webkit-transition:-webkit-transform .25s cubic-bezier(0,0,.25,1);-moz-transition:-moz-transform .25s cubic-bezier(0,0,.25,1);transition:transform .25s cubic-bezier(0,0,.25,1)}.leaflet-pan-anim .leaflet-tile,.leaflet-zoom-anim .leaflet-tile{-webkit-transition:none;-moz-transition:none;transition:none}.leaflet-zoom-anim .leaflet-zoom-hide{visibility:hidden}.leaflet-interactive{cursor:pointer}.leaflet-grab{cursor:-webkit-grab;cursor:-moz-grab;cursor:grab}.leaflet-crosshair,.leaflet-crosshair .leaflet-interactive{cursor:crosshair}.leaflet-control,.leaflet-popup-pane{cursor:auto}.leaflet-dragging .leaflet-grab,.leaflet-dragging .leaflet-grab .leaflet-interactive,.leaflet-dragging .leaflet-marker-draggable{cursor:move;cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing}.leaflet-image-layer,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-pane>svg path,.leaflet-tile-container{pointer-events:none}.leaflet-image-layer.leaflet-interactive,.leaflet-marker-icon.leaflet-interactive,.leaflet-pane>svg path.leaflet-interactive,svg.leaflet-image-layer.leaflet-interactive path{pointer-events:visiblePainted;pointer-events:auto}.leaflet-container{background:#ddd;outline-offset:1px}.leaflet-container a{color:#0078a8}.leaflet-zoom-box{border:2px dotted #38f;background:rgba(255,255,255,.5)}.leaflet-container{font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;font-size:12px;font-size:.75rem;line-height:1.5}.leaflet-bar{box-shadow:0 1px 5px rgba(0,0,0,.65);border-radius:4px}.leaflet-bar a{background-color:#fff;border-bottom:1px solid #ccc;width:26px;height:26px;line-height:26px;display:block;text-align:center;text-decoration:none;color:#000}.leaflet-bar a,.leaflet-control-layers-toggle{background-position:50% 50%;background-repeat:no-repeat;display:block}.leaflet-bar a:focus,.leaflet-bar a:hover{background-color:#f4f4f4}.leaflet-bar a:first-child{border-top-left-radius:4px;border-top-right-radius:4px}.leaflet-bar a:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-bottom:none}.leaflet-bar a.leaflet-disabled{cursor:default;background-color:#f4f4f4;color:#bbb}.leaflet-touch .leaflet-bar a{width:30px;height:30px;line-height:30px}.leaflet-touch .leaflet-bar a:first-child{border-top-left-radius:2px;border-top-right-radius:2px}.leaflet-touch .leaflet-bar a:last-child{border-bottom-left-radius:2px;border-bottom-right-radius:2px}.leaflet-control-zoom-in,.leaflet-control-zoom-out{font:bold 18px 'Lucida Console',Monaco,monospace;text-indent:1px}.leaflet-touch .leaflet-control-zoom-in,.leaflet-touch .leaflet-control-zoom-out{font-size:22px}.leaflet-control-layers{box-shadow:0 1px 5px rgba(0,0,0,.4);background:#fff;border-radius:5px}.leaflet-control-layers-toggle{background-image:url(images/layers.png);width:36px;height:36px}.leaflet-retina .leaflet-control-layers-toggle{background-image:url(images/layers-2x.png);background-size:26px 26px}.leaflet-touch .leaflet-control-layers-toggle{width:44px;height:44px}.leaflet-control-layers .leaflet-control-layers-list,.leaflet-control-layers-expanded .leaflet-control-layers-toggle{display:none}.leaflet-control-layers-expanded .leaflet-control-layers-list{display:block;position:relative}.leaflet-control-layers-expanded{padding:6px 10px 6px 6px;color:#333;background:#fff}.leaflet-control-layers-scrollbar{overflow-y:scroll;overflow-x:hidden;padding-right:5px}.leaflet-control-layers-selector{margin-top:2px;position:relative;top:1px}.leaflet-control-layers label{display:block;font-size:13px;font-size:1.08333em}.leaflet-control-layers-separator{height:0;border-top:1px solid #ddd;margin:5px -10px 5px -6px}.leaflet-default-icon-path{background-image:url(images/marker-icon.png)}.leaflet-container .leaflet-control-attribution{background:#fff;background:rgba(255,255,255,.8);margin:0}.leaflet-control-attribution,.leaflet-control-scale-line{padding:0 5px;color:#333;line-height:1.4}.leaflet-control-attribution a{text-decoration:none}.leaflet-control-attribution a:focus,.leaflet-control-attribution a:hover{text-decoration:underline}.leaflet-attribution-flag{display:inline!important;vertical-align:baseline!important;width:1em;height:.6669em}.leaflet-left .leaflet-control-scale{margin-left:5px}.leaflet-bottom .leaflet-control-scale{margin-bottom:5px}.leaflet-control-scale-line{border:2px solid #777;border-top:none;line-height:1.1;padding:2px 5px 1px;white-space:nowrap;-moz-box-sizing:border-box;box-sizing:border-box;background:rgba(255,255,255,.8);text-shadow:1px 1px #fff}.leaflet-control-scale-line:not(:first-child){border-top:2px solid #777;border-bottom:none;margin-top:-2px}.leaflet-control-scale-line:not(:first-child):not(:last-child){border-bottom:2px solid #777}.leaflet-touch .leaflet-bar,.leaflet-touch .leaflet-control-attribution,.leaflet-touch .leaflet-control-layers{box-shadow:none}.leaflet-touch .leaflet-bar,.leaflet-touch .leaflet-control-layers{border:2px solid rgba(0,0,0,.2);background-clip:padding-box}.leaflet-popup{position:absolute;text-align:center;margin-bottom:20px}.leaflet-popup-content-wrapper{padding:1px;text-align:left;border-radius:12px}.leaflet-popup-content{margin:13px 24px 13px 20px;line-height:1.3;font-size:13px;font-size:1.08333em;min-height:1px}.leaflet-popup-content p{margin:17px 0;margin:1.3em 0}.leaflet-popup-tip-container{width:40px;height:20px;position:absolute;left:50%;margin-top:-1px;margin-left:-20px;overflow:hidden;pointer-events:none}.leaflet-popup-tip{width:17px;height:17px;padding:1px;margin:-10px auto 0;pointer-events:auto;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#fff;color:#333;box-shadow:0 3px 14px rgba(0,0,0,.4)}.leaflet-container a.leaflet-popup-close-button{position:absolute;top:0;right:0;border:none;text-align:center;width:24px;height:24px;font:16px/24px Tahoma,Verdana,sans-serif;color:#757575;text-decoration:none;background:0 0}.leaflet-container a.leaflet-popup-close-button:focus,.leaflet-container a.leaflet-popup-close-button:hover{color:#585858}.leaflet-popup-scrolled{overflow:auto}.leaflet-oldie .leaflet-popup-content-wrapper{-ms-zoom:1}.leaflet-oldie .leaflet-popup-tip{width:24px;margin:0 auto}.leaflet-oldie .leaflet-control-layers,.leaflet-oldie .leaflet-control-zoom,.leaflet-oldie .leaflet-popup-content-wrapper,.leaflet-oldie .leaflet-popup-tip{border:1px solid #999}.leaflet-div-icon{background:#fff;border:1px solid #666}.leaflet-tooltip{position:absolute;padding:6px;background-color:#fff;border:1px solid #fff;border-radius:3px;color:#222;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;box-shadow:0 1px 3px rgba(0,0,0,.4)}.leaflet-tooltip.leaflet-interactive{cursor:pointer;pointer-events:auto}.leaflet-tooltip-bottom:before,.leaflet-tooltip-left:before,.leaflet-tooltip-right:before,.leaflet-tooltip-top:before{position:absolute;pointer-events:none;border:6px solid transparent;background:0 0;content:""}.leaflet-tooltip-bottom{margin-top:6px}.leaflet-tooltip-top{margin-top:-6px}.leaflet-tooltip-bottom:before,.leaflet-tooltip-top:before{left:50%;margin-left:-6px}.leaflet-tooltip-top:before{bottom:0;margin-bottom:-12px;border-top-color:#fff}.leaflet-tooltip-bottom:before{top:0;margin-top:-12px;margin-left:-6px;border-bottom-color:#fff}.leaflet-tooltip-left{margin-left:-6px}.leaflet-tooltip-right{margin-left:6px}.leaflet-tooltip-left:before,.leaflet-tooltip-right:before{top:50%;margin-top:-6px}.leaflet-tooltip-left:before{right:0;margin-right:-12px;border-left-color:#fff}.leaflet-tooltip-right:before{left:0;margin-left:-12px;border-right-color:#fff}@media print{.leaflet-control{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* ---------- Beneficios: logos de las marcas ---------- */
.cpn__logo {
  display: grid; place-items: center; width: 76px; height: 76px; margin-bottom: .4rem; overflow: hidden;
  border-radius: 20px; background: #fff; box-shadow: 0 10px 24px -12px rgba(0,0,0,.9), 0 0 0 1px rgba(239,234,225,.12);
}
.cpn__logo img { width: 100%; height: 100%; object-fit: contain; }
.cpn--logo .cpn__brand { font-family: var(--ff-d); font-style: normal; font-weight: 800; font-stretch: 108%; text-transform: uppercase; letter-spacing: .01em; font-size: 1.3rem; }
.cpn--logo .cpn__brand.is-long { font-size: 1.12rem; letter-spacing: 0; }
.cpn--hot .cpn__logo { box-shadow: 0 10px 24px -12px rgba(0,0,0,.6), 0 0 0 2px var(--ink); }
.cpn__ig--map { border: 0; cursor: pointer; font-family: inherit; color: var(--ink); background: var(--force); }
.cpn__ig--map:hover { background: var(--bone); }
.cpn.is-flash { animation: cpnFlash 1.6s var(--ease-out); }
@keyframes cpnFlash { 0%, 40% { box-shadow: 0 0 0 4px var(--force), 0 30px 60px -30px #000; } 100% { box-shadow: 0 0 0 0 rgba(255,199,0,0); } }

/* ---------- Beneficios: mapa del barrio ---------- */
.fam-map { margin-bottom: var(--s5); padding: 1rem; border-radius: var(--r-l); border: 1px solid var(--line); background: var(--ink-2); }
.fam-map[hidden] { display: none; }
.fam-map__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin-bottom: .8rem; }
.fam-map__t { margin: 0; font-family: var(--ff-d); font-weight: 800; font-stretch: 108%; text-transform: uppercase; font-size: clamp(1rem, .9rem + .5vw, 1.25rem); line-height: 1.15; text-wrap: balance; }
.fam-map__view {
  position: relative; z-index: 0; height: 230px; border-radius: var(--r-m); overflow: hidden; cursor: zoom-in;
  background: #1b1f22; outline-offset: 3px; transition: height .45s var(--ease-out);
}
.fam-map.is-open .fam-map__view { height: min(72vh, 600px); cursor: grab; }
.fam-map:not(.is-open) .leaflet-marker-pane, .fam-map:not(.is-open) .leaflet-control-zoom { pointer-events: none; }
.fam-map:not(.is-open) .leaflet-control-zoom { opacity: 0; }
.fam-map__view::after { /* aviso sobre el mapa chico */
  content: "Tocá para abrir el mapa"; position: absolute; left: 50%; top: 12px; z-index: 500; transform: translateX(-50%);
  padding: .4rem .8rem; border-radius: var(--r-pill); background: rgba(13,13,13,.85); color: var(--bone);
  font-size: .75rem; font-weight: 700; letter-spacing: .04em; white-space: nowrap; pointer-events: none; transition: opacity .3s;
}
.fam-map.is-open .fam-map__view::after { opacity: 0; }
.fam-map__legend { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: .7rem 0 0; font-size: .8rem; color: var(--mute); }
.fam-map__dot { width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--force); }
.fam-map__dot--gym { background: var(--force); box-shadow: 0 0 0 2px var(--ink), 0 0 0 3px var(--force); }
@media (min-width: 768px) { .fam-map { padding: 1.2rem 1.4rem 1.1rem; } .fam-map__view { height: 260px; } }

/* el mapa de OpenStreetMap pasado a oscuro para que combine con la web */
.fam-map .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.45); }
.fam-map .leaflet-container { font-family: var(--ff-b); background: #1b1f22; }
.fam-map .leaflet-control-attribution { background: rgba(13,13,13,.75); color: var(--mute); font-size: .65rem; padding: 0 6px; border-top-left-radius: 6px; }
.fam-map .leaflet-control-attribution a { color: var(--bone); }
.fam-map .leaflet-bar { border: 1px solid var(--line); box-shadow: 0 10px 24px -12px #000; }
.fam-map .leaflet-bar a { width: 36px; height: 36px; line-height: 34px; background: var(--carbon); color: var(--bone); border-bottom-color: var(--line); font-size: 20px; }
.fam-map .leaflet-bar a:hover { background: var(--force); color: var(--ink); }

/* pines */
.pin { display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: #fff; border: 3px solid var(--force); box-shadow: 0 8px 18px -6px rgba(0,0,0,.85); transition: box-shadow .2s; }
.pin:hover { box-shadow: 0 0 0 5px rgba(255,199,0,.35), 0 8px 18px -6px rgba(0,0,0,.85); } /* sin transform: Leaflet ubica el pin con transform */
.fam-map .leaflet-marker-pane .pin img { width: 100% !important; height: 100% !important; object-fit: contain; } /* Leaflet fuerza width:auto en las imágenes de los pines */
.pin b { font-family: var(--ff-d); font-weight: 900; font-size: .8rem; color: var(--ink); }
.pin--hot { border-width: 4px; }
.pin--gym { overflow: visible; background: var(--force); border-color: var(--ink); color: var(--ink); }
.pin--gym svg { width: 28px; height: 24px; }
.pin--gym::after { content: ""; position: absolute; inset: -9px; border-radius: 50%; border: 2px solid var(--force); animation: pinPulse 2.2s ease-out infinite; }
@keyframes pinPulse { from { transform: scale(.8); opacity: .9; } to { transform: scale(1.5); opacity: 0; } }

/* globito del pin */
.pop-wrap .leaflet-popup-content-wrapper { background: var(--carbon); color: var(--bone); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 50px -20px #000; }
.pop-wrap .leaflet-popup-tip { background: var(--carbon); }
.pop-wrap .leaflet-popup-content { margin: 14px 16px; font-family: var(--ff-b); font-size: .9rem; line-height: 1.4; }
.pop-wrap .leaflet-popup-content p { margin: 0; }
.pop-wrap a.leaflet-popup-close-button { color: var(--mute); width: 28px; height: 28px; font-size: 20px; }
.pop-wrap a.leaflet-popup-close-button:hover { color: var(--bone); }
.pop { display: flex; gap: .8rem; align-items: flex-start; }
.pop__logo { flex: none; width: 52px; height: 52px; border-radius: 12px; background: #fff; object-fit: contain; }
.pop__body { display: grid; gap: .3rem; min-width: 0; }
.pop__name { font-family: var(--ff-d); font-weight: 800; font-stretch: 108%; text-transform: uppercase; font-size: 1rem; line-height: 1.1; padding-right: 14px; }
.pop__off { color: var(--force); font-family: var(--ff-d); font-weight: 800; font-stretch: 120%; }
.pop__off b { font-size: 1.5rem; font-weight: 900; }
.pop__txt { color: #cfcac1; font-size: .85rem; }
.pop__days { justify-self: start; padding: .15rem .5rem; border-radius: var(--r-pill); background: rgba(239,234,225,.1); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.pop__dir { color: var(--mute); font-size: .8rem; }
.pop__links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .3rem; }
.pop .pop__btn {
  display: inline-flex; align-items: center; min-height: 34px; padding: .3rem .75rem; border-radius: 10px; cursor: pointer;
  border: 1.5px solid var(--force); background: var(--force); color: var(--ink); font: 700 .8rem/1 var(--ff-b); text-decoration: none;
}
.pop .pop__btn--line { background: transparent; color: var(--bone); border-color: var(--line); }
.pop .pop__btn:hover { background: var(--bone); border-color: var(--bone); color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .pin--gym::after { animation: none; opacity: 0; } .fam-map__view { transition: none; } }
