/* ===========================================================
   REVO — "AMANECER" direction
   Faithful re-skin in the language of amaterasu.ai (Exo Ape):
   a living gradient canvas that morphs its palette section by
   section (teal-cyan → white → deep blue → royal navy), light
   Neue Haas Grotesk Display headlines, teal-dot micro labels,
   indigo pill buttons, a wavy vertical connector, custom cursor
   and slow fade+rise reveals. Same REVO content & layout.
   =========================================================== */

@font-face{
  font-family:"NHaas Display";
  src:url("fonts/NHaasGroteskDSPro-65Md.otf") format("opentype");
  font-weight:400 600; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Neue Haas";
  src:url("fonts/NeueHaasGrotesk-Medium.otf") format("opentype");
  font-weight:400 700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Noto Serif Hi";
  src:url("fonts/NotoSerif-Italic.ttf") format("truetype");
  font-weight:100 900; font-style:italic; font-display:swap;
}

/* animatable gradient stops + angle (smoothly transition between palettes) */
@property --c1{ syntax:"<color>"; inherits:true; initial-value:#16245f; }
@property --c2{ syntax:"<color>"; inherits:true; initial-value:#3650cf; }
@property --c3{ syntax:"<color>"; inherits:true; initial-value:#6881fc; }
@property --deg{ syntax:"<angle>"; inherits:true; initial-value:144deg; }

:root{
  --ink-light:#ffffff;       /* text on dark sections */
  --ink-dark:#14161c;        /* navy text on light sections */
  --teal:#6881fc;            /* accent dot */
  --indigo:#6881fc;          /* pill button — Revo blue */
  --indigo-2:#5269f3;

  --c1:#16245f; --c2:#3650cf; --c3:#6881fc; --deg:144deg;

  --sans:"Neue Haas","Helvetica Neue",Arial,sans-serif;
  --display:"NHaas Display","Neue Haas","Helvetica Neue",Arial,sans-serif;
  --serif:"Noto Serif Hi",Georgia,serif;
  --maxw:1340px;
  --edge:max(56px, calc((100vw - 1340px) / 2 + 56px));
  --ease:cubic-bezier(.22,.61,.25,1);
  --gradT:1.1s;
}

*{ box-sizing:border-box; }
::selection{ background:#6881fc; color:#fff; }
::-moz-selection{ background:#6881fc; color:#fff; }
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; scroll-behavior:smooth; background-color:#0a0d1e; }
body{
  margin:0; color:var(--ink-light); background-color:#0a0d1e;
  font-family:var(--sans); font-weight:500; font-size:16.5px; line-height:1.55;
  overflow-x:clip;
  transition:background-color var(--gradT) var(--ease);
}

/* ---------- living gradient canvas ---------- */
.bg{ position:fixed; inset:-12% -12% -12% -12%; z-index:0; pointer-events:none;
  background:linear-gradient(var(--deg), var(--c1) 0%, var(--c2) 52%, var(--c3) 100%);
  transition:--c1 var(--gradT) var(--ease), --c2 var(--gradT) var(--ease), --c3 var(--gradT) var(--ease), --deg var(--gradT) var(--ease), transform .5s var(--ease);
  will-change:transform; }
.bg-grain{ position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.05; mix-blend-mode:soft-light;
  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='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* wavy vertical connector — the Exo Ape signature thread */
.thread{ position:fixed; left:50%; top:0; height:100%; width:240px; transform:translateX(-50%); z-index:1; pointer-events:none; opacity:.35; }
.thread path{ fill:none; stroke:rgba(255,255,255,.5); stroke-width:1; }
@media (prefers-reduced-motion:no-preference){
  .thread path{ stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 2.6s var(--ease); }
  .thread.drawn path{ stroke-dashoffset:0; }
}

/* custom cursor */
.cursor{ display:none !important; }
@media (hover:none){ body{ cursor:auto; } .cursor{ display:none; } }

a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
img,video{ display:block; max-width:100%; }
main,.site-header,.site-footer{ position:relative; z-index:2; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 56px; }
.section{ padding-block:clamp(120px,16vh,200px); position:relative; }
.section--tight{ padding-block:clamp(96px,12vh,150px); position:relative; }
/* light vs dark text contexts */
.on-light{ color:var(--ink-dark); }
.on-light .eyebrow{ color:var(--ink-dark); }
.on-light .eyebrow::before{ background:var(--teal); }

/* ---------- type ---------- */
.display{ font-family:var(--display); font-weight:400; line-height:1.02; letter-spacing:0em; margin:0; text-wrap:balance; }
.eyebrow{ font-family:var(--sans); font-weight:600; font-size:17px; letter-spacing:5px; text-transform:uppercase;
  color:var(--ink-light); margin:0; display:inline-flex; align-items:flex-start; gap:11px; line-height:1.2; }
.eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--teal); box-shadow:0 0 10px rgba(104,129,252,.6); flex:none; margin-top:calc((1.2em - 7px) / 2 - 1px); }
.ser{ font-family:var(--serif); font-style:italic; font-weight:500; letter-spacing:-.05em; }

/* ---------- reveal engine ---------- */
.reveal{ opacity:1; transform:none; }
@media (prefers-reduced-motion:no-preference){
  .reveal{ opacity:0; transform:translateY(40px); filter:blur(10px);
    transition:opacity 1.1s var(--ease), transform 1.1s var(--ease), filter 1.1s var(--ease);
    transition-delay:var(--d,0s); will-change:opacity,transform,filter; }
  .reveal.in{ opacity:1; transform:none; filter:none; will-change:auto; }
  .anim-lines .hl-line{ display:block; clip-path:inset(-50% -8% 150% -8%); transform:translateY(.42em);
    transition:clip-path 1.25s var(--ease), transform 1.25s var(--ease); transition-delay:var(--d,0s); }
  .anim-lines.in .hl-line{ clip-path:inset(-50% -8% -50% -8%); transform:none; }
  .anim-lines.in .hl-line:nth-child(2){ transition-delay:calc(var(--d,0s) + .14s); }
}

/* ---------- header ---------- */
.site-header{ position:fixed; inset:0 0 auto 0; z-index:90; color:#fff;
  border-bottom:1px solid transparent;
  padding-top:env(safe-area-inset-top, 0px);
  transition:transform .6s var(--ease), color .6s, border-color .5s, box-shadow .5s; }
.site-header::before{ content:""; position:absolute; inset:0; z-index:0;
  background:rgba(13,17,38,.28); backdrop-filter:blur(26px) saturate(1.2); -webkit-backdrop-filter:blur(26px) saturate(1.2);
  transition:background .5s var(--ease); }
.site-header.is-hidden{ transform:translateY(-100%); }
.header-inner{ width:100%; margin:0; padding:11px 64px; display:flex; align-items:center; gap:40px; position:relative; z-index:1; transition:padding .5s var(--ease); }
.logo{ display:inline-flex; align-items:center; }
.logo-img{ height:34px; width:auto; display:block; filter:invert(1); transition:filter .6s; }
.nav{ display:flex; gap:42px; margin-left:auto; }
.nav a{ font-size:12px; letter-spacing:.18em; text-transform:uppercase; white-space:nowrap; position:relative; opacity:.9; transition:opacity .4s; }
.nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:-6px; height:1px; background:currentColor; transition:right .45s var(--ease); }
.nav a:hover{ opacity:1; }
.nav a:hover::after{ right:0; }
/* ---- nav dropdown (Studios → sede) — mínimo, en el lenguaje del header ---- */
.nav-drop{ position:relative; display:flex; align-items:center; }
.nav-trigger{ font-family:var(--sans); font-weight:500; font-size:12px; letter-spacing:.18em; text-transform:uppercase;
  white-space:nowrap; background:none; border:0; padding:0; margin:0; color:inherit; cursor:pointer; opacity:.9;
  position:relative; transition:opacity .4s; }
.nav-trigger::after{ content:""; position:absolute; left:0; right:100%; bottom:-6px; height:1px; background:currentColor; transition:right .45s var(--ease); }
.nav-drop:hover .nav-trigger,.nav-drop:focus-within .nav-trigger{ opacity:1; }
.nav-drop:hover .nav-trigger::after,.nav-drop:focus-within .nav-trigger::after{ right:0; }
/* desplegable compacto pegado al header: del ancho del contenido, misma materia, parece que cuelga de la barra */
.nav-menu{ position:absolute; top:calc(100% + 27px); left:50%; transform:translate(-50%,0); min-width:max-content;
  display:flex; flex-direction:column; gap:2px; padding:8px;
  background:rgba(12,16,36,.9); box-shadow:none;
  border:0; border-bottom:1px solid rgba(255,255,255,.16); border-radius:0 0 13px 13px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .26s var(--ease), visibility .26s; }
.nav-menu::before{ content:""; position:absolute; left:-16px; right:-16px; top:-46px; height:46px; }
.nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu{ opacity:1; visibility:visible; pointer-events:auto; }
/* sin costura entre la barra y el desplegable: se ven como una sola pieza */
.site-header:has(.nav-drop:hover),.site-header:has(.nav-drop:focus-within){ border-bottom-color:transparent; }
.nav .nav-loc{ display:flex; flex-direction:column; gap:4px; padding:10px 16px; border-radius:8px; white-space:nowrap;
  text-transform:none; letter-spacing:0; opacity:0; transform:translateY(5px);
  transition:opacity .42s var(--ease), transform .42s var(--ease), background .35s var(--ease); }
.nav .nav-loc{ position:relative; }
.nav .nav-loc::after{ content:""; position:absolute; left:16px; right:calc(100% - 16px); bottom:6px; height:1px; background:currentColor; opacity:.85; transition:right .4s var(--ease); }
.nav .nav-loc:hover::after{ right:16px; }
.nav-drop:hover .nav-loc,.nav-drop:focus-within .nav-loc{ opacity:.9; transform:none; }
.nav .nav-loc:hover{ background:transparent; opacity:1; color:#fff; }
.nav-loc-name{ font-family:var(--sans); font-weight:500; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; line-height:1; }
.nav-loc-city{ font-family:var(--sans); font-weight:500; font-size:9px; letter-spacing:.18em; text-transform:uppercase; opacity:.5; line-height:1; }
.nav-drop:hover .nav-loc:nth-child(1),.nav-drop:focus-within .nav-loc:nth-child(1){ transition-delay:.03s; }
.nav-drop:hover .nav-loc:nth-child(2),.nav-drop:focus-within .nav-loc:nth-child(2){ transition-delay:.06s; }
.nav-drop:hover .nav-loc:nth-child(3),.nav-drop:focus-within .nav-loc:nth-child(3){ transition-delay:.09s; }
.nav-drop:hover .nav-loc:nth-child(4),.nav-drop:focus-within .nav-loc:nth-child(4){ transition-delay:.12s; }
.nav-drop:hover .nav-loc:nth-child(5),.nav-drop:focus-within .nav-loc:nth-child(5){ transition-delay:.15s; }
.nav-drop:hover .nav-loc:nth-child(6),.nav-drop:focus-within .nav-loc:nth-child(6){ transition-delay:.18s; }
.nav-drop:hover .nav-loc:nth-child(7),.nav-drop:focus-within .nav-loc:nth-child(7){ transition-delay:.21s; }
/* estado abierto controlado por JS (evita el parpadeo del hover-gap) */
.nav-drop.open .nav-trigger{ opacity:1; }
.nav-drop.open .nav-trigger::after{ right:0; }
.nav-drop.open .nav-menu{ opacity:1; visibility:visible; pointer-events:auto; }
.nav-drop.open .nav-loc{ opacity:.9; transform:none; }
.site-header:has(.nav-drop.open){ border-bottom-color:transparent; }
.site-header.over-light .nav-menu{ background:rgba(12,16,36,.9); box-shadow:none; border-bottom-color:rgba(255,255,255,.16); }
.site-header.over-light .nav .nav-loc:hover{ background:transparent; }
/* premium scrolled state: glass appears + condenses */
.site-header.scrolled{ border-bottom-color:transparent; box-shadow:none; }
.site-header.scrolled .header-inner{ padding:11px 64px; }
.site-header.scrolled .logo-img{ height:34px; }
/* header: SIEMPRE blanco — mantiene el cristal oscuro también sobre secciones claras */
.site-header.over-light{ color:#fff; border-bottom-color:transparent; }
.site-header.over-light::before{ background:rgba(13,17,38,.28); }
.site-header.over-light.scrolled{ border-bottom-color:transparent; box-shadow:none; }
.site-header.over-light .btn--hero{ color:#fff; border-color:rgba(255,255,255,.7); background:rgba(255,255,255,.04); }
.site-header.over-light .btn--hero:hover{ background:#fff; color:var(--ink-dark); border-color:#fff; box-shadow:0 20px 50px -12px rgba(255,255,255,.55); }
/* teléfono en el header */
.header-tel{ display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-weight:500; font-size:13px;
  letter-spacing:.02em; white-space:nowrap; color:inherit; opacity:.85; position:relative; transition:opacity .35s; }
.header-tel svg{ width:14px; height:14px; opacity:.8; }
.header-tel:hover{ opacity:1; }
.header-tel::after{ content:""; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:currentColor; transition:right .45s var(--ease); }
.header-tel:hover::after{ right:0; }
@media (max-width:820px){ .header-tel{ display:none; } }
/* selector de idioma */
.lang-switch{ font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:inherit; opacity:.65; white-space:nowrap; transition:opacity .35s; }
.lang-switch:hover{ opacity:1; }
.site-header.over-light .logo-img{ filter:invert(1); }

/* ============ NAV MÓVIL (hamburguesa + panel) ============ */
.nav-toggle{ display:none; }
.mobile-nav{ display:none; }
@media (max-width:860px){
  .nav{ display:none !important; }
  .header-tel{ display:none; }
  .header-inner,
  .site-header.scrolled .header-inner{ padding:9px 20px; gap:14px; }
  .site-header .logo-img{ height:28px; }
  .header-inner > .btn--hero{ display:none; }
  .nav-toggle{ display:inline-flex; align-items:center; justify-content:center; margin-left:auto;
    width:40px; height:40px; padding:0; background:none; border:0; cursor:pointer; color:inherit; }
  .nav-toggle svg{ display:none; }
  .nav-toggle::before{ content:""; display:block; width:24px; height:9px;
    background:
      linear-gradient(currentColor,currentColor) left top/100% 1.5px no-repeat,
      linear-gradient(currentColor,currentColor) left bottom/100% 1.5px no-repeat; }
  /* header móvil: base transparente sobre el hero; cristal oscuro sobre secciones claras para que el blanco siga legible */
  .site-header::before{ background:transparent; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  .site-header.over-light::before{ background:rgba(13,17,38,.5); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  .site-header.over-light{ border-bottom-color:transparent; }
  .mobile-nav{ display:flex; }
}
.mobile-nav{ position:fixed; inset:0; z-index:200; background:#0a0d1e;
  flex-direction:column; padding:84px 26px 34px; overflow-y:auto; -webkit-overflow-scrolling:touch;
  transform:translateX(100%); transition:transform .42s var(--ease); visibility:hidden; color:#fff; }
.mobile-nav.open{ transform:none; visibility:visible; }
body.menu-open{ overflow:hidden; }
.mobile-nav-close{ position:fixed; top:22px; right:22px; width:44px; height:44px; background:none; border:0; cursor:pointer; }
.mobile-nav-close::before,.mobile-nav-close::after{ content:""; position:absolute; left:11px; right:11px; top:50%; height:2px; background:#fff; border-radius:2px; }
.mobile-nav-close::before{ transform:rotate(45deg); }
.mobile-nav-close::after{ transform:rotate(-45deg); }
.mobile-nav a{ color:#fff; }
.mnav-link{ display:block; font-family:var(--display); font-weight:400; font-size:21px; letter-spacing:-.01em; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.09); }
.mnav-group{ border-bottom:1px solid rgba(255,255,255,.09); padding:14px 0; }
.mnav-group-label{ display:flex; align-items:center; justify-content:space-between; gap:14px; cursor:pointer;
  font-family:var(--display); font-weight:400; font-size:21px; letter-spacing:-.01em; text-transform:none; color:#fff; margin:0; padding:4px 0; }
.mnav-group-label::after{ content:""; width:9px; height:9px; flex:none;
  border-right:2px solid rgba(255,255,255,.55); border-bottom:2px solid rgba(255,255,255,.55);
  transform:translateY(-2px) rotate(45deg); transition:transform .32s var(--ease), border-color .32s var(--ease); }
.mnav-group.open .mnav-group-label::after{ transform:translateY(2px) rotate(-135deg); border-color:#fff; }
.mnav-sub{ display:flex; flex-direction:column; gap:0; max-height:0; opacity:0; overflow:hidden; margin-top:0;
  transition:max-height .42s var(--ease), opacity .3s var(--ease), margin-top .42s var(--ease); }
.mnav-group.open .mnav-sub{ max-height:460px; opacity:1; margin-top:8px; }
.mnav-sub a{ font-family:var(--sans); font-weight:500; font-size:12px; letter-spacing:.13em; text-transform:uppercase; padding:7px 0; color:rgba(255,255,255,.55); }
.mobile-nav-foot{ margin-top:auto; padding-top:30px; display:flex; flex-direction:column; align-items:stretch; gap:18px; }
.mobile-nav-foot .btn{ justify-content:center; text-align:center; }
.mnav-tel{ font-family:var(--sans); font-size:15px; color:rgba(255,255,255,.7); letter-spacing:.02em; text-align:center; }

/* ---------- buttons (pill + leading dot) ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.7em;
  font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  padding:17px 30px; border-radius:100px; border:1px solid rgba(255,255,255,.45); background:transparent; color:#fff;
  cursor:pointer; transition:transform .4s var(--ease), background .4s, color .4s, border-color .4s, box-shadow .4s, letter-spacing .4s var(--ease); white-space:nowrap; position:relative; overflow:hidden; }
/* destello que barre el botón al pasar por encima */
.btn::after{ content:""; position:absolute; top:0; left:-65%; width:45%; height:100%; pointer-events:none; opacity:0;
  background:linear-gradient(100deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%); transform:skewX(-18deg); }
@media (prefers-reduced-motion:no-preference){ .btn:hover::after{ animation:btnsheen .75s var(--ease); } }
@keyframes btnsheen{ 0%{ left:-65%; opacity:0; } 12%{ opacity:1; } 100%{ left:135%; opacity:0; } }
/* hover base (outline sobre fondo oscuro): se rellena en blanco + sube + glow */
.btn:hover{ transform:translateY(-3px) scale(1.035); background:#fff; color:var(--ink-dark); border-color:#fff;
  letter-spacing:.2em; box-shadow:0 18px 46px -14px rgba(255,255,255,.5); }
.btn:active{ transform:translateY(-1px) scale(.99); }
.btn--primary{ background:var(--indigo); border-color:var(--indigo); color:#fff; box-shadow:0 12px 34px -14px rgba(104,129,252,.8); }
.btn--primary:hover{ transform:translateY(-3px) scale(1.04); background:var(--indigo-2); color:#fff; border-color:var(--indigo-2);
  letter-spacing:.2em; box-shadow:0 26px 60px -12px rgba(104,129,252,1), 0 0 0 4px rgba(104,129,252,.18); filter:brightness(1.06); }
.btn--ghost-light{ border-color:rgba(255,255,255,.45); }
.on-light .btn{ color:var(--ink-dark); border-color:rgba(17,19,24,.3); }
/* hover en secciones claras: se rellena en oscuro */
.on-light .btn:hover{ background:var(--ink-dark); color:#fff; border-color:var(--ink-dark);
  box-shadow:0 20px 48px -14px rgba(20,22,40,.5); }
.on-light .btn--primary{ color:#fff; border-color:var(--indigo); }
.on-light .btn--primary:hover{ background:var(--indigo-2); color:#fff; border-color:var(--indigo-2);
  box-shadow:0 26px 60px -12px rgba(104,129,252,.95), 0 0 0 4px rgba(104,129,252,.16); }
.btn--lg{ padding:20px 38px; }
/* hero CTA — transparent rectangle so it reads over the blue video */
.btn--hero{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.7); border-radius:3px; color:#fff; backdrop-filter:blur(5px); box-shadow:none; }
.btn--hero:hover{ transform:translateY(-3px) scale(1.035); background:#fff; color:var(--ink-dark); border-color:#fff;
  letter-spacing:.2em; box-shadow:0 20px 50px -12px rgba(255,255,255,.55); }
.on-light .btn--hero{ background:rgba(17,19,24,.02); border-color:rgba(17,19,24,.32); color:var(--ink-dark); }
.on-light .btn--hero:hover{ background:var(--ink-dark); color:#fff; border-color:var(--ink-dark);
  box-shadow:0 20px 48px -14px rgba(20,22,40,.5); }
/* CTA del hero (sección) — fondo blanco sólido para máxima visibilidad sobre el vídeo azul.
   Scoped a .hero-cta para no afectar al CTA del header. La especificidad (0,2,0) gana
   también a la regla global .btn de móvil. */
.hero-cta .btn--hero{ background:#fff; border:1px solid #fff; border-radius:3px; color:var(--ink-dark);
  backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:0 16px 44px -16px rgba(0,0,0,.55); }
.hero-cta .btn--hero:hover{ transform:translateY(-3px) scale(1.035); background:var(--indigo); color:#fff;
  border-color:var(--indigo); letter-spacing:.2em; box-shadow:0 24px 56px -14px rgba(104,129,252,.9); }

/* round chevron / scroll button */
.round-btn{ width:58px; height:58px; border-radius:50%; border:1px solid rgba(255,255,255,.4);
  display:grid; place-items:center; color:inherit; background:transparent; cursor:pointer;
  transition:transform .4s var(--ease), border-color .4s, background .4s; }
.round-btn:hover{ transform:scale(1.08); border-color:rgba(255,255,255,.85); }
.round-btn svg{ width:16px; height:16px; }
.scroll-top{ position:fixed; right:40px; bottom:38px; z-index:80; opacity:0; pointer-events:none; transition:opacity .5s; }
.scroll-top.show{ opacity:1; pointer-events:auto; }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:stretch; overflow:hidden; }
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-media video,.hero-media img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.02); }
.hero-media::after{ content:""; position:absolute; inset:0; background:
  linear-gradient(180deg, rgba(10,12,20,.42) 0%, rgba(10,12,20,.12) 34%, rgba(10,12,20,.18) 62%, rgba(10,12,20,.55) 100%); }
.hero-inner{ position:relative; z-index:2; width:100%; margin:0; padding:150px 64px 120px;
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.hero-lead{ max-width:none; }
.hero .eyebrow{ margin-bottom:34px; }
/* salto de línea del eyebrow del hero: oculto en escritorio (una sola línea),
   visible en móvil para partir en dos líneas equilibradas y no dejar una palabra colgada */
.hero .eyebrow .eb-br{ display:none; }
.hero h1{ font-family:var(--display); font-weight:400; font-size:clamp(50px,8.7vw,140px); line-height:.96; letter-spacing:-.022em; color:#fff; }
.hl-line{ display:block; white-space:nowrap; width:max-content; max-width:100%; }
.hero-sub{ margin-top:36px; font-size:clamp(17px,1.55vw,23px); line-height:1.5; color:rgba(255,255,255,.88); font-weight:400; }
.hero-cta{ display:flex; gap:13px; margin-top:40px; flex-wrap:wrap; }
.hero-benefits{ position:absolute; right:56px; bottom:96px; display:flex; flex-direction:column; align-items:flex-end; gap:13px; }
.ben-row{ display:flex; gap:13px; justify-content:flex-end; }
.chip{ font-size:15px; letter-spacing:.05em; text-transform:uppercase; color:#fff; padding:15px 26px;
  border:1px solid rgba(255,255,255,.4); border-radius:100px; white-space:nowrap; background:rgba(255,255,255,.06); backdrop-filter:blur(6px); }
.hero-foot{ position:absolute; left:56px; bottom:46px; z-index:2; display:flex; align-items:center; gap:12px;
  font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.85); }
.hero-foot svg{ width:13px; height:13px; }

/* ---------- method (white moment) ---------- */
.method-head{ max-width:920px; margin:0 0 76px; }
.method-head .eyebrow{ margin-bottom:26px; }
.method-head h2{ font-size:clamp(36px,5.4vw,78px); }
.steps{ position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:0; padding-top:0; }
/* progressive scroll rail — fills left→right */
.steps-rail{ position:absolute; top:0; left:0; right:0; height:3px; border-radius:0; background:rgba(17,19,24,.12); opacity:0; transition:opacity .6s var(--ease); }
.steps.flow .steps-rail{ opacity:1; }
.steps-rail-fill{ display:block; height:100%; width:calc(var(--p,0)*100%); border-radius:0; position:relative;
  background:linear-gradient(90deg, rgba(104,129,252,.2), #6881fc);
  box-shadow:0 0 16px rgba(104,129,252,.55); transition:width .18s linear; }
.steps-rail-fill::after{ display:none; }
.step{ position:relative; padding:40px 30px 44px 0; border-right:1px solid rgba(17,19,24,.12);
  transition:background .6s var(--ease), border-color .6s var(--ease); }
.step:last-child{ border-right:0; }
.step:not(:first-child){ padding-left:30px; }
.step h3{ display:flex; flex-direction:column; gap:14px; font-size:24px; font-weight:500; margin:0 0 16px; letter-spacing:-.012em; color:#14161c; transition:color .6s var(--ease); }
.step-num{ font-family:var(--display); font-weight:400; font-size:56px; line-height:1; color:#6881fc; letter-spacing:-.02em; transition:color .6s var(--ease), text-shadow .6s var(--ease); }
.step-body{ color:rgba(17,19,24,.66); font-size:16.5px; line-height:1.62; transition:opacity .6s var(--ease); }
/* JS-driven flow: dim every step until the rail reaches it, then ignite in blue */
.steps.flow .step:not(.lit) h3{ color:rgba(20,22,28,.42); }
.steps.flow .step:not(.lit) .step-num{ color:rgba(20,22,28,.2); }
.steps.flow .step:not(.lit) .step-body{ opacity:.45; }
.steps.flow .step.lit{ background:linear-gradient(180deg, rgba(104,129,252,.08) 0%, rgba(104,129,252,0) 62%); border-right-color:rgba(104,129,252,.22); }
.steps.flow .step.lit .step-num{ text-shadow:0 0 28px rgba(104,129,252,.5); }
.step-body ul{ margin-top:12px; }
.step-body li{ position:relative; padding-left:18px; margin:6px 0; }
.step-body li::before{ content:""; position:absolute; left:0; top:.62em; width:8px; height:1px; background:var(--teal); }

/* ---------- therapies (deep-blue moment, cards) ---------- */
.therapies-head{ display:block; margin-bottom:68px; max-width:1000px; }
.therapies-head .eyebrow{ margin-bottom:26px; }
.therapies-head h2{ font-size:clamp(42px,6vw,92px); }
.therapies-head p{ font-size:clamp(17px,1.5vw,22px); color:rgba(255,255,255,.72); margin:22px 0 0; max-width:40ch; font-weight:400; }
.cards{ display:flex; gap:22px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity; scroll-padding-inline:var(--edge); padding:8px var(--edge) 26px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.3) transparent; -webkit-overflow-scrolling:touch; }
.cards::-webkit-scrollbar{ height:5px; }
.cards::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.3); border-radius:3px; }
.card{ flex:0 0 312px; scroll-snap-align:start; position:relative; display:flex; flex-direction:column; overflow:hidden;
  height:auto; min-height:420px; border-radius:18px; padding:24px; isolation:isolate;
  /* liquid glass tokens */
  --lg-blur:1px; --lg-sat:130%; --lg-bright:1.16; --lg-rim:1.6; --lg-tint:rgba(255,255,255,.06); --lg-scale:150;
  background:var(--lg-tint);
  backdrop-filter:var(--lg-refract,none) blur(var(--lg-blur)) saturate(var(--lg-sat)) brightness(var(--lg-bright));
  -webkit-backdrop-filter:blur(15px) saturate(1.3);
  box-shadow:
    0 34px 70px -28px rgba(6,9,32,.6),
    0 10px 24px -12px rgba(6,9,32,.45),
    inset 1px 1px 0     rgba(255,255,255, calc(var(--lg-rim) * .28)),
    inset 1.5px 1.5px 1px rgba(255,255,255, calc(var(--lg-rim) * .15)),
    inset -1px -1px 0   rgba(255,255,255, calc(var(--lg-rim) * .12)),
    inset 0 0 20px      rgba(255,255,255, calc(var(--lg-rim) * .05));
  transition:transform .5s var(--ease), box-shadow .5s; }
.card::before{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:1;
  background:linear-gradient(125deg, rgba(255,255,255,.26) 0%, rgba(255,255,255,.06) 20%, rgba(255,255,255,0) 42%, rgba(255,255,255,0) 88%, rgba(255,255,255,.06) 100%);
  mix-blend-mode:screen; }
.card::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:4;
  border:1px solid rgba(255,255,255,.18); }
.card > *{ position:relative; z-index:2; }
.card:hover{ transform:translateY(-10px);
  box-shadow:0 54px 96px -30px rgba(6,9,32,.62), 0 14px 28px -12px rgba(6,9,32,.5),
    inset 1px 1px 0 rgba(255,255,255, calc(var(--lg-rim) * .34)),
    inset 1.5px 1.5px 1px rgba(255,255,255, calc(var(--lg-rim) * .18)),
    inset -1px -1px 0 rgba(255,255,255, calc(var(--lg-rim) * .14)),
    inset 0 0 22px rgba(255,255,255, calc(var(--lg-rim) * .06)); }
.card-tag{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; margin-bottom:22px;
  font-size:10px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; padding:8px 14px; border-radius:100px;
  background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.28); white-space:nowrap; }
.card-tag .blip{ width:6px; height:6px; border-radius:50%; background:#6881fc; box-shadow:0 0 8px rgba(104,129,252,.8); }
.card-body{ display:flex; flex-direction:column; flex:1; }
.card-body h3{ font-family:var(--display); font-size:26px; font-weight:500; letter-spacing:-.012em; line-height:1.06; margin:0 0 14px; color:#fff; }
.card-desc{ color:rgba(255,255,255,.78); font-size:13px; line-height:1.62; margin:0 0 18px; }
.card-list{ margin-top:auto; display:flex; flex-wrap:wrap; gap:7px; }
.card-list li{ font-size:9.5px; letter-spacing:.07em; text-transform:uppercase; color:rgba(255,255,255,.85); padding:6px 12px; border:1px solid rgba(255,255,255,.26); border-radius:100px; white-space:nowrap; }
.scroll-hint{ display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--teal); }

/* ---------- therapies: pinned horizontal scroll ---------- */
.therapies-pin{ position:relative; }
.strip-photo{ position:absolute; top:0; left:0; width:100%; height:auto; min-height:100%; object-fit:cover; object-position:top center; z-index:0; pointer-events:none; }
.therapies-sticky{ position:relative; background:linear-gradient(180deg, #1a2666 0%, #3f53d6 46%, #6881fc 100%); }
.ther-scrim{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(8,12,40,.6) 0%, rgba(8,12,40,.2) 40%, transparent 68%),
    linear-gradient(0deg, rgba(8,12,40,.5) 0%, transparent 44%),
    radial-gradient(140% 120% at 50% -8%, transparent 60%, rgba(6,9,28,.5) 100%); }
.therapies-pan{ position:relative; z-index:2; }
.t-screen{ display:flex; flex-direction:column; gap:46px; padding:clamp(110px,15vh,190px) 0; position:relative; z-index:1; }
.therapies-pin .therapies-head{ padding:0 var(--edge); max-width:1000px; margin:0; }
.therapies-pin.pinned .therapies-sticky{ position:sticky; top:0; height:100vh; padding:0; overflow:hidden; }
.therapies-pin.pinned .therapies-pan{ display:flex; gap:var(--pan-gap,0px); height:100%; width:max-content; transform:translate3d(var(--pan,0px),0,0); will-change:transform; }
.therapies-pin.pinned .t-screen{ width:100vw; height:100%; flex:none; padding:0; justify-content:center; gap:40px; }
.therapies-pin.pinned .cards-track{ transform:translate3d(var(--tx,0px),0,0); will-change:transform; }
.therapies-pin.pinned .cards{ overflow:visible; scroll-snap-type:none; }
/* Carrusel NO fijado (móvil/tablet): el carril recorta en vertical (overflow-y:hidden
   por el scroll horizontal), así que la sombra de la tarjeta se cortaba. La contenemos
   con una sombra más ajustada + padding-bottom suficiente para que quepa entera. */
.therapies-pin:not(.pinned) .cards{ padding-bottom:52px; }
.therapies-pin:not(.pinned) .card{ box-shadow:
    0 20px 44px -22px rgba(6,9,32,.6),
    0 6px 16px -10px rgba(6,9,32,.45),
    inset 1px 1px 0     rgba(255,255,255, calc(var(--lg-rim) * .28)),
    inset 1.5px 1.5px 1px rgba(255,255,255, calc(var(--lg-rim) * .15)),
    inset -1px -1px 0   rgba(255,255,255, calc(var(--lg-rim) * .12)),
    inset 0 0 20px      rgba(255,255,255, calc(var(--lg-rim) * .05)); }

/* ---------- joy panel: slides in from the right as the therapies scroll ends ---------- */
.joy-panel{ position:relative; z-index:1; min-height:88vh; overflow:hidden; display:flex; align-items:flex-end; color:#fff; }
.joy-panel img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 0%; }
.joy-panel::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,16,40,.16) 0%, rgba(10,16,40,.04) 42%, rgba(10,16,40,.5) 74%, rgba(10,16,40,.84) 100%); }
.joy-inner{ position:relative; z-index:2; padding:0 var(--edge) 86px; max-width:1100px; }
.joy-inner .eyebrow{ margin-bottom:24px; color:#fff; }
.joy-eyebrow{ font-size:14px; letter-spacing:.28em; }
.joy-eyebrow::before{ display:none; }
.joy-inner h2{ font-family:var(--display); font-weight:400; font-size:clamp(46px,6.4vw,104px); line-height:1.02; letter-spacing:-.02em; margin:0; text-wrap:pretty; }
/* el salto explícito mantiene SIEMPRE el titular en 2 líneas (independiente del ancho) */
.joy-inner h2 br{ display:block; }
.therapies-pin.pinned .joy-panel{ width:100vw; height:100%; flex:none; min-height:0; }
@media(max-width:760px){ .joy-inner{ padding:0 28px 60px; } }

/* ---------- medical direction (white) — centered tiers: title → director feature → teams ---------- */
.med-head{ max-width:940px; margin:0; text-align:left; }
.med-head .eyebrow{ justify-content:flex-start; margin-bottom:26px; }
.med-head h2{ font-size:clamp(30px,3.7vw,56px); margin:0; line-height:1.05; max-width:26ch; }
.p-avatar{ width:50px; height:50px; border-radius:50%; flex:none; display:grid; place-items:center;
  background:rgba(104,129,252,.09); border:1px solid rgba(104,129,252,.3); color:var(--indigo); overflow:hidden; }
.p-avatar svg{ width:54%; height:54%; }
.p-avatar img{ width:100%; height:100%; object-fit:cover; }

/* director feature — full-width horizontal anchor */
.med-director{ position:relative; overflow:hidden; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:50px;
  margin:58px 0 0; padding:46px 54px; border:1px solid rgba(104,129,252,.28); border-radius:20px;
  background:linear-gradient(118deg, rgba(104,129,252,.08), rgba(104,129,252,.02)); }
.med-director::after{ content:""; position:absolute; inset:0; border-radius:inherit; padding:2px; pointer-events:none; z-index:3;
  background:conic-gradient(from calc(var(--ang,0deg) - 35deg) at 50% 50%, transparent 0deg, rgba(255,255,255,.95) 16deg, rgba(104,129,252,.55) 30deg, transparent 58deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; will-change:background; }
@media(prefers-reduced-motion:reduce){ .med-director::after{ display:none; } }
.dir-avatar{ width:124px; height:124px; border-radius:50%; flex:none; display:grid; place-items:center;
  background:rgba(104,129,252,.12); border:1px solid rgba(104,129,252,.34); color:var(--indigo); }
.dir-avatar svg{ width:52%; height:52%; }
.dir-person{ display:flex; flex-direction:column; align-items:flex-start; gap:22px; padding-right:50px; border-right:1px solid rgba(17,19,24,.16); }
.dir-id{ padding-right:0; }
.dir-id .doc-name{ font-family:var(--display); font-weight:400; font-size:30px; letter-spacing:-.01em; white-space:nowrap; }
.dir-id .doc-role{ color:var(--indigo); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; margin-top:9px; white-space:nowrap; }
.dir-detail{ display:flex; flex-direction:column; gap:22px; }
.med-director .doc-bio{ color:rgba(17,19,24,.7); font-size:16px; line-height:1.66; margin:0; max-width:58ch; text-wrap:pretty; }
.dir-creds{ display:flex; flex-wrap:wrap; gap:10px; }
.dir-creds span{ font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--indigo);
  padding:9px 16px; border:1px solid rgba(104,129,252,.34); border-radius:100px; background:rgba(104,129,252,.06); }

/* two equal team cards below */
.med-teams{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px; }
.team-box{ display:flex; flex-direction:column; padding:26px 28px 12px; border:1px solid rgba(17,19,24,.14); border-radius:16px; background:#fff; }
.team-label{ font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--indigo); margin-bottom:4px; }
.p-row{ display:flex; align-items:center; gap:16px; padding:18px 0; border-bottom:1px solid rgba(17,19,24,.1); }
.p-row:first-of-type{ padding-top:14px; }
.p-row:last-child{ border-bottom:0; padding-bottom:14px; }
.p-text .r-name{ font-size:17px; font-weight:600; letter-spacing:-.01em; }
.p-text .r-role{ font-size:12.5px; color:rgba(17,19,24,.58); margin-top:4px; }
@media(max-width:900px){
  .med-director{ grid-template-columns:1fr; justify-items:start; gap:26px; text-align:left; }
  .dir-person{ flex-direction:row; align-items:center; gap:20px; border-right:0; padding-right:0;
    border-bottom:1px solid rgba(17,19,24,.14); padding-bottom:24px; width:100%; }
  .dir-avatar{ width:84px; height:84px; }
  /* el nombre no debe forzar el ancho de la tarjeta: que parta línea en móvil */
  .dir-id{ min-width:0; }
  .dir-id .doc-name{ white-space:normal; font-size:23px; line-height:1.1; }
  .dir-id .doc-role{ white-space:normal; }
  .med-teams{ grid-template-columns:1fr; gap:18px; }
}

/* ---------- members / testimonial (the big white statement) ---------- */
.members{ position:relative; }
.members-inner{ position:relative; z-index:2; padding:40px 0; text-align:center; max-width:1200px; margin:0 auto; }
.members .eyebrow{ justify-content:center; }
.quote{ font-family:var(--display); font-weight:400; font-size:clamp(22px,2.8vw,40px); line-height:1.22; letter-spacing:-.014em; max-width:24ch; margin:36px auto 0; text-wrap:balance; }
.quote .qw{ opacity:.12; transition:opacity .14s linear; }
.quote .qw-hl{ transition:opacity .14s linear, background .16s var(--ease), color .16s var(--ease); padding:.05em 0; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.quote .qw-hl.hl{ background:#6881fc; color:#fff; }
@media(prefers-reduced-motion:reduce){ .quote .qw{ opacity:1 !important; } .quote .qw-hl{ background:#6881fc; color:#fff; } }
.quote .ser{ font-style:italic; }
.quote-author{ display:flex; align-items:center; justify-content:center; gap:13px; margin-top:46px; }
.quote-author .dot{ width:44px; height:44px; border-radius:50%; background:rgba(17,19,24,.06); border:1px solid rgba(17,19,24,.16); }
.qa-name{ font-size:14.5px; font-weight:600; text-align:left; }
.qa-role{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--indigo); text-align:left; }
.quote-next{ position:absolute; right:0; top:50%; transform:translateY(-50%); }

/* ---------- club (curtain rise + light sweep, over white) ---------- */
.club{ position:relative; overflow:hidden; }
.club-panel{ position:absolute; inset:0; z-index:1; clip-path:inset(100% 0 0 0); will-change:clip-path;
  background:linear-gradient(180deg, #1a2666 0%, #3f53d6 46%, #6881fc 100%); }
.club-sheen{ position:absolute; inset:-40% -12%; z-index:3; pointer-events:none; opacity:0; mix-blend-mode:screen;
  background:linear-gradient(105deg, transparent 38%, rgba(255,255,255,.5) 50%, transparent 62%); transform:translateX(-120%); will-change:transform,opacity; }
.club-inner{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; padding:clamp(96px,12vh,150px) 56px; text-align:center; opacity:0; will-change:opacity,filter; }
@media(prefers-reduced-motion:reduce){ .club-panel{ clip-path:inset(0)!important; } .club-inner{ opacity:1!important; filter:none!important; } }
.club-inner > *{ max-width:760px; margin-left:auto; margin-right:auto; }
.club-inner h2{ font-family:var(--display); font-weight:400; font-size:clamp(64px,10vw,150px); letter-spacing:-.02em; margin:0; line-height:.92; text-transform:capitalize; }
.club-limit{ display:inline-flex; align-items:center; gap:10px; margin-top:24px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.78); }
.club-limit .blip{ width:8px; height:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 12px rgba(104,129,252,.7); }
.club-list{ margin:44px auto 0; max-width:540px; }
.club-list li{ display:flex; gap:14px; align-items:baseline; justify-content:center; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.14); font-size:18px; }
.club-list li .arr{ color:var(--teal); }
.club-cta{ display:flex; gap:13px; margin-top:46px; flex-wrap:wrap; justify-content:center; }

/* ---------- faqs (white) ---------- */
.faqs{ padding-bottom:clamp(48px,6vh,80px); }
.faqs h2{ font-family:var(--display); font-size:clamp(40px,5.4vw,78px); font-weight:400; letter-spacing:-.012em; margin:0 0 52px; }
.faq-list{ max-width:940px; border-top:1px solid rgba(17,19,24,.22); }
.faq-item{ border-bottom:1px solid rgba(17,19,24,.12); }
.faq-q{ width:100%; text-align:left; background:transparent; border:0; cursor:pointer; font-family:var(--sans); color:var(--ink-dark);
  display:flex; align-items:center; gap:16px; padding:28px 2px; font-size:18px; font-weight:500; transition:padding-left .4s var(--ease), color .3s; }
.faq-q .ico{ margin-left:auto; width:18px; height:18px; position:relative; flex:none; }
.faq-q .ico::before,.faq-q .ico::after{ content:""; position:absolute; background:var(--ink-dark); transition:transform .35s var(--ease), background .3s; }
.faq-q .ico::before{ left:0; right:0; top:8px; height:1.5px; }
.faq-q .ico::after{ top:0; bottom:0; left:8px; width:1.5px; }
.faq-item.open .faq-q .ico::after{ transform:scaleY(0); }
.faq-item.open .faq-q{ color:var(--indigo); }
.faq-item.open .faq-q .ico::before{ background:var(--indigo); }
.faq-q:hover{ padding-left:12px; color:var(--indigo); }
.faq-a{ overflow:hidden; max-height:0; transition:max-height .5s var(--ease); }
.faq-item.open .faq-a{ max-height:260px; }
.faq-a-inner{ padding:0 2px 30px; color:rgba(17,19,24,.62); font-size:15.5px; line-height:1.75; max-width:66ch; }
.faq-cta{ text-align:center; margin-top:70px; }

/* ---------- footer (compacto · sobrio) ---------- */
.site-footer{ position:relative; z-index:2; color:var(--ink-dark);
  padding-bottom:env(safe-area-inset-bottom, 0px); }
.site-footer.section--tight{ padding-block:0; }
.footer-inner{ max-width:var(--maxw); margin:0 auto; padding:clamp(30px,3.4vw,44px) 56px clamp(18px,2vw,24px);
  border-top:1px solid rgba(17,19,24,.1); position:relative; overflow:hidden; }
.footer-inner > *{ position:relative; z-index:1; }
/* marca de agua: logo REVO (recortado) a sangre, súper translúcido */
.footer-inner::before{ content:""; position:absolute; z-index:0; inset:0; pointer-events:none; user-select:none;
  background:url('assets/revo-wordmark.png') center/cover no-repeat; opacity:.05; }
.site-footer.on-light .footer-inner::before{ filter:invert(1); opacity:.05; }
.footer-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:clamp(30px,5vw,80px); flex-wrap:wrap; }
.footer-brand{ max-width:30ch; }
.site-footer .logo-img{ height:21px; filter:invert(1); }
.footer-tag{ margin-top:13px; color:rgba(17,19,24,.48); max-width:28ch; font-size:12.5px; line-height:1.5; }
.footer-cols{ display:flex; gap:clamp(34px,4vw,68px); flex-wrap:wrap; }
.footer-col h4{ font-family:var(--sans); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:rgba(17,19,24,.36); margin:0 0 12px; font-weight:600; }
.footer-col a{ display:block; width:fit-content; color:rgba(17,19,24,.62); font-size:13px; padding:4px 0; transition:color .3s var(--ease); }
.footer-col a:hover{ color:var(--ink-dark); }
.footer-bottom{ display:flex; justify-content:space-between; gap:16px; margin-top:clamp(24px,2.8vw,38px); padding-top:16px; border-top:1px solid rgba(17,19,24,.1); color:rgba(17,19,24,.36); font-size:10px; letter-spacing:.1em; text-transform:uppercase; flex-wrap:wrap; }
/* ---- footer oscuro de marca (texto claro). No aplica al cierre fluido (wallpaper) ---- */
.site-footer{ background:#0a0d1e; color:#fff; }
.footer--fluid .site-footer{ background:transparent; }
.site-footer .footer-inner{ border-top-color:rgba(255,255,255,.12); }
.site-footer .logo-img{ filter:none; }
.site-footer .footer-inner::before,
.site-footer.on-light .footer-inner::before{ filter:none; opacity:.06; }
.site-footer .footer-tag{ color:rgba(255,255,255,.55); }
.site-footer .footer-col h4{ color:rgba(255,255,255,.42); }
.site-footer .footer-col a{ color:rgba(255,255,255,.66); }
.site-footer .footer-col a:hover{ color:#fff; }
.site-footer .footer-bottom{ color:rgba(255,255,255,.42); border-top-color:rgba(255,255,255,.12); }

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .steps{ grid-template-columns:1fr 1fr; }
  .step{ border-bottom:1px solid rgba(17,19,24,.12); }
  .med-teams{ grid-template-columns:1fr; }
  .thread{ display:none; }
}
@media (max-width:600px){
  body{ cursor:auto; }
  .cursor{ display:none; }
  .wrap,.header-inner,.footer-inner,.hero-inner{ padding-left:24px; padding-right:24px; }
  :root{ --edge:24px; }
  /* ritmo vertical móvil: secciones más juntas, todo más integrado */
  .section{ padding-block:62px; }
  .section--tight{ padding-block:52px; }
  /* método: timeline VERTICAL en móvil (la barra baja por la izquierda y se enciende paso a paso) */
  .steps{ grid-template-columns:1fr; padding-left:22px; }
  .step{ position:relative; border:0; border-top:1px solid rgba(17,19,24,.1); padding:18px 16px 30px 18px; }
  .step:first-child{ border-top:0; }
  .step:last-child{ padding-bottom:10px; }
  /* línea pegada al borde izquierdo de los recuadros */
  .steps-rail{ top:0; bottom:0; left:20px; right:auto; width:2px; height:auto; background:rgba(104,129,252,.32); }
  .steps-rail-fill{ width:100%; height:calc(var(--p,0)*100%);
    background:linear-gradient(180deg, rgba(104,129,252,.25), #6881fc); }
  .steps-rail-fill::after{ right:auto; top:auto; left:50%; bottom:-7px; transform:translateX(-50%);
    width:2px; height:22px;
    background:linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 50%, rgba(255,255,255,0) 100%); }
  /* nodo sobre la línea */
  .step::before{ content:""; position:absolute; left:-8px; top:21px; width:13px; height:13px; border-radius:50%;
    background:#fff; border:2px solid rgba(17,19,24,.22); z-index:2;
    transition:background .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease); }
  .steps.flow .step.lit::before{ background:#6881fc; border-color:#6881fc;
    box-shadow:0 0 0 4px rgba(104,129,252,.16), 0 0 14px rgba(104,129,252,.7); }
  /* glow azul lateral: degradado horizontal RECTO a todo el alto (sin esquinas, sin corte) */
  .steps.flow .step.lit{ background:none; border-top-color:rgba(104,129,252,.22); }
  .step::after{ content:""; position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(104,129,252,.14) 0%, rgba(104,129,252,.045) 44%, transparent 74%);
    opacity:0; transition:opacity .5s var(--ease); pointer-events:none; }
  .steps.flow .step.lit::after{ opacity:1; }
  .step h3, .step .step-body{ position:relative; z-index:1; }
  .step h3{ flex-direction:row; align-items:baseline; gap:12px; font-size:21px; margin-bottom:10px; }
  .step-num{ font-size:30px; }
  .step-body{ font-size:15.5px; }
  .card{ flex-basis:82vw; }
  /* móvil (no pinned): terapias = al menos pantalla completa (área visible real),
     contenido desde arriba; si la tarjeta es alta, la sección crece y se hace scroll
     (así el botón Reservar NUNCA queda detrás de la barra de Safari) */
  .therapies-pin:not(.pinned) .therapies-sticky{ min-height:100svh; display:flex; flex-direction:column; }
  .therapies-pin:not(.pinned) .therapies-pan{ flex:1; display:flex; flex-direction:column; }
  .t-screen{ flex:1; justify-content:flex-start;
    padding:calc(72px + env(safe-area-inset-top,0px)) 0 calc(26px + env(safe-area-inset-bottom,0px));
    gap:14px; }
  /* la sombra inferior de las tarjetas se cortaba con overflow-y:hidden;
     alineamos el margen lateral con el del título (24px) y ampliamos el padding
     vertical del carril para que la sombra quepa dentro del recorte */
  .cards{ padding:18px 24px 52px; scroll-padding-inline:24px; }
  .joy-panel{ min-height:44vh; }
  /* "nuestros miembros": sección compacta (poco contenido, sin huecos grandes) */
  section[data-screen-label="Nuestros miembros"]{ padding-block:30px; }
  .members-inner{ padding:6px 0; }
  /* menos aire antes de FAQs */
  .faqs{ padding-top:34px; }
  /* FAQs móvil: compactas, discretas y elegantes */
  .faqs h2{ margin-bottom:20px; }
  .faq-q{ padding:15px 2px; font-size:15px; gap:12px; line-height:1.34; }
  .faq-q .ico{ width:15px; height:15px; }
  .faq-q .ico::before{ top:6.75px; }
  .faq-q .ico::after{ left:6.75px; }
  .faq-a-inner{ padding-bottom:20px; font-size:14.5px; line-height:1.65; }
  .faq-item.open .faq-a{ max-height:360px; }
  .med-director{ margin-top:34px; }
  .nav{ display:none; }
  .club-inner{ padding:58px 24px; } /* nota: el padding móvil real lo fija la regla inline de #club en index.html */
  .hero-foot{ display:none; }
  .hero .eyebrow .eb-br{ display:inline; }
  .hl-line{ white-space:normal; }
  .hero-benefits{ position:static; align-items:flex-start; margin-top:20px; }
  .ben-row{ flex-wrap:wrap; justify-content:flex-start; }
  /* móvil: el hero llena SIEMPRE la pantalla completa (también bajo la barra de Safari),
     así el notch muestra el hero y no asoma el azul de la sección siguiente por abajo */
  .hero{ min-height:100svh; min-height:100lvh; }
  .hero-inner{ padding:calc(96px + env(safe-area-inset-top,0px)) 24px calc(72px + env(safe-area-inset-bottom,0px)); justify-content:flex-start; }
  .hero-media::after{ background:linear-gradient(180deg, rgba(10,12,20,.6) 0%, rgba(10,12,20,.22) 42%, rgba(10,12,20,.34) 72%, rgba(10,12,20,.6) 100%); }
  .scroll-top{ right:20px; bottom:20px; }
  /* ---- footer móvil: editorial, centrado, con aire (lujo) ---- */
  .footer-inner{ padding:40px 24px 38px; text-align:center; }
  .footer-inner::before{ background-size:86% auto; background-position:center 30px; opacity:.05; }
  .footer-top{ flex-direction:column; align-items:center; gap:0; }
  .footer-brand{ max-width:none; padding-bottom:20px; display:flex; flex-direction:column; align-items:center; }
  .site-footer .logo-img{ height:22px; }
  .footer-tag{ margin-top:11px; max-width:30ch; text-align:center; font-size:11px; line-height:1.45; color:rgba(17,19,24,.5); }
  .footer-cols{ width:100%; display:grid; grid-template-columns:1fr 1fr; gap:13px 14px; text-align:left;
    padding-top:16px; padding-bottom:10px; border-top:1px solid rgba(17,19,24,.08); }
  .footer-col{ width:auto; display:block; padding:0; border-top:0; }
  .footer-col h4{ margin:0 0 6px; font-size:7.5px; letter-spacing:.2em; color:rgba(17,19,24,.38); }
  .footer-col a{ font-size:10px; line-height:1.2; padding:1.5px 0; color:rgba(17,19,24,.62); }
  .footer-bottom{ flex-direction:column; align-items:center; text-align:center; gap:4px;
    margin-top:0; padding-top:14px; font-size:9.5px; letter-spacing:.04em; }
  /* ---- todos los CTA en móvil con el lenguaje del hero: rectángulo outline a ancho completo ---- */
  .btn{ width:100%; justify-content:center; border-radius:3px; padding:18px 30px; letter-spacing:.16em;
    background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.7); color:#fff;
    backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); box-shadow:none; }
  .on-light .btn{ background:rgba(17,19,24,.02); border-color:rgba(17,19,24,.34); color:var(--ink-dark); }
  .eyebrow{ max-width:100%; align-items:flex-start; font-size:11px; letter-spacing:.2em; }
  .therapies-pin .therapies-head{ padding-left:24px; padding-right:24px; }
  /* titulares grandes → más pequeños en móvil */
  .method-head h2{ font-size:clamp(28px,8.2vw,40px); }
  .therapies-head h2{ font-size:clamp(29px,8.4vw,40px); }
  .joy-inner h2{ font-size:clamp(29px,8.4vw,40px); }
  .med-head h2{ font-size:clamp(25px,7vw,33px); }
  /* las dos cajetillas de equipo, lado a lado y comprimidas */
  .med-teams{ grid-template-columns:1fr 1fr; gap:12px; }
  .team-box{ padding:18px 15px 6px; border-radius:13px; }
  .team-label{ font-size:9.5px; letter-spacing:.13em; margin-bottom:2px; }
  .p-row{ gap:11px; padding:13px 0; }
  .p-row:first-of-type{ padding-top:11px; }
  .p-row:last-child{ padding-bottom:11px; }
  .p-avatar{ width:38px; height:38px; flex:none; }
  .p-text .r-name{ font-size:15px; }
  .p-text .r-role{ font-size:11px; margin-top:2px; }
  .club-big{ font-size:clamp(44px,13.5vw,60px); }
  .club-inner h2{ font-size:clamp(46px,13.5vw,62px); }
  .faqs h2{ font-size:clamp(28px,8vw,38px); }
  .quote{ font-size:clamp(21px,5.6vw,28px); }
}
/* CTAs a ancho completo en pantallas estrechas (tablet y móvil) */
@media (max-width:1024px){
  .cta-btns, .st-hero-cta{ flex-direction:column; align-items:stretch; width:100%; }
  .cta-btns .btn, .st-hero-cta .btn{ width:100%; }
  .visit-card .btn{ width:100%; align-self:stretch; }
}