/* Demo Tuscape para Rekovery Clinic · propuesta de diseño, no es la web oficial · v2 «futurista» */
@font-face{font-family:"Raleway";src:url("/assets/fonts/raleway-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Orbitron";src:url("/assets/fonts/orbitron-var.woff2") format("woff2");font-weight:400 900;font-display:swap}

@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-sale .55s cubic-bezier(.7,0,.3,1) both}
::view-transition-new(root){animation:vt-entra .75s cubic-bezier(.2,.8,.2,1) both}
@keyframes vt-sale{to{opacity:0;transform:scale(.96);filter:blur(6px)}}
@keyframes vt-entra{from{clip-path:circle(0% at 50% 100%)}to{clip-path:circle(150% at 50% 100%)}}

:root{
  --verde:#116333; --verde-2:#31602b; --verde-luz:#61a74e; --verde-vivo:#6cc04a;
  --lima:#9fdc7c; --lima-2:#c9f0b0;
  --noche:#04150b; --noche-2:#072816; --noche-3:#0b2a18;
  --tinta:#0f1f16; --texto:#27352c; --suave:#4d5a52; --fondo:#f4f5f2; --linea:#dfe5dc;
  --claro:#e6f2e8; --claro-suave:#a9c2b0; --linea-osc:rgba(159,220,124,.16);
  --radio:24px; --ancho:1240px;
  --ease:cubic-bezier(.2,.7,.2,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --hud:"Orbitron",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:130px;background:var(--noche)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;font-family:"Raleway",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:1.0625rem;line-height:1.6;color:var(--claro);background:var(--noche);overflow-x:clip;font-feature-settings:"lnum"}
img,svg,canvas{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{line-height:1.04;margin:0 0 .45em;letter-spacing:-.02em;font-weight:300}
h1{font-size:clamp(2.6rem,9.2vw,6.4rem)}
h2{font-size:clamp(2rem,5.6vw,4rem)}
h3{font-size:1.25rem;font-weight:700;letter-spacing:0;line-height:1.2}
strong,b{font-weight:800}
.brilla{font-weight:800;background:linear-gradient(100deg,var(--lima) 0%,var(--lima-2) 35%,var(--verde-vivo) 70%,var(--lima) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.clara .brilla{background:linear-gradient(100deg,var(--verde) 0%,#2a8a44 50%,var(--verde) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text}
.contenedor{width:min(100% - 2.5rem,var(--ancho));margin-inline:auto}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:1rem;top:-100px;z-index:200;background:var(--lima);color:var(--noche);padding:.7rem 1rem;border-radius:10px;font-weight:800}
.saltar:focus{top:1rem}
:focus-visible{outline:3px solid var(--lima);outline-offset:3px;border-radius:8px}
.clara :focus-visible{outline-color:var(--verde)}
.hud{font-family:var(--hud);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}

/* ---------- Franja y cabecera ---------- */
.fija{position:fixed;top:0;left:0;right:0;z-index:90}
.franja-demo{margin:0;background:#000;color:#e9f1ea;font-size:.78rem;line-height:1.35;text-align:center;padding:.42rem 1rem;font-weight:600}
.franja-demo span{color:var(--lima)}
.cabecera{position:relative;background:rgba(4,21,11,.88);backdrop-filter:saturate(1.5) blur(16px);-webkit-backdrop-filter:saturate(1.5) blur(16px);border-bottom:1px solid var(--linea-osc);transition:transform .45s var(--ease),background .3s}
.cabecera .contenedor{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:66px}
.marca{display:flex;align-items:center;text-decoration:none;flex:none}
.marca svg{height:44px;width:auto}
.nav{display:flex;align-items:center;gap:.2rem}
.nav a{position:relative;color:var(--claro);text-decoration:none;font-weight:600;font-size:.97rem;padding:.6rem .9rem;border-radius:999px;transition:color .25s,background .25s}
.nav a:hover{background:rgba(159,220,124,.1)}
.nav a[aria-current="page"]{color:var(--lima)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:.25rem;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--lima);box-shadow:0 0 10px var(--lima)}
.boton-menu{display:none}
.progreso{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--verde),var(--lima));box-shadow:0 0 12px var(--lima)}

/* ---------- Botones ---------- */
.boton{--bg:var(--lima);--fg:var(--noche);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:52px;padding:.85rem 1.5rem;border-radius:999px;border:1.5px solid transparent;background:var(--bg);color:var(--fg);font:inherit;font-weight:800;font-size:1rem;line-height:1.1;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;transition:box-shadow .4s var(--ease),background .25s,color .25s}
.boton::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.boton:hover{box-shadow:0 0 34px -4px rgba(159,220,124,.65)}
.boton:hover::before{transform:translateX(120%)}
.boton svg{width:20px;height:20px;flex:none}
.boton.linea{--bg:transparent;--fg:var(--claro);border-color:rgba(159,220,124,.4)}
.boton.linea:hover{--bg:rgba(159,220,124,.1)}
.clara .boton.linea{--fg:var(--verde);border-color:#b9cfb5}
.clara .boton:not(.linea){--bg:var(--verde);--fg:#fff}
.boton.peq{min-height:46px;padding:.6rem 1.1rem;font-size:.95rem}
.boton[aria-disabled="true"],a[aria-disabled="true"]{cursor:default}
.boton[aria-disabled="true"]{--bg:transparent;--fg:var(--claro-suave);border:1.5px dashed rgba(159,220,124,.3);box-shadow:none}
.clara .boton[aria-disabled="true"]{--bg:transparent;--fg:var(--suave);border-color:#bccbb9}
.boton[aria-disabled="true"]::before{display:none}
.demo-chip{font-family:var(--hud);font-size:.56rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:.2rem .42rem;border-radius:6px;background:rgba(159,220,124,.14);color:var(--lima)}
.clara .demo-chip{background:#e6f1e2;color:var(--verde)}
.fila-botones{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}

/* ---------- Portada con cuerpo 3D ---------- */
.heroe{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;background:radial-gradient(70rem 50rem at 75% 40%,rgba(17,99,51,.55),transparent 60%),radial-gradient(40rem 30rem at 10% 100%,rgba(97,167,78,.18),transparent 60%),var(--noche)}
.heroe::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(159,220,124,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(159,220,124,.06) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 70% 45%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 70% 45%,#000 20%,transparent 70%)}
.heroe canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.heroe-texto{position:relative;z-index:2;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--alto-cab,104px) + 2rem) 0 4rem;pointer-events:none}
.heroe-texto .contenedor>*{pointer-events:auto}
.heroe h1{max-width:11.5ch;color:#fff;text-shadow:0 2px 40px rgba(4,21,11,.6)}
.heroe .entradilla{color:#c9dccd;max-width:32rem;text-shadow:0 1px 20px rgba(4,21,11,.9)}
.hud-esquina{position:absolute;z-index:2;color:var(--lima);opacity:.9;pointer-events:none;display:grid;gap:.35rem}
.hud-esquina span{color:var(--claro-suave)}
.hud-esquina.ai{right:1.4rem;top:calc(var(--alto-cab,104px) + 1.4rem);text-align:right}
.hud-esquina.bd{right:1.4rem;bottom:1.6rem;text-align:right}
.hud-lectura{font-family:var(--hud);font-size:2.2rem;font-weight:800;color:#fff;letter-spacing:.02em;line-height:1;font-variant-numeric:tabular-nums}
.marco{position:absolute;inset:calc(var(--alto-cab,104px) + .6rem) .6rem .6rem;z-index:1;pointer-events:none}
.marco i{position:absolute;width:26px;height:26px;border:2px solid rgba(159,220,124,.55)}
.marco i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.marco i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.marco i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.marco i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.heroe-2{position:absolute;z-index:2;left:0;right:0;bottom:14%;pointer-events:none;visibility:hidden}
.heroe-2 p.grande{font-size:clamp(2.1rem,6vw,4.6rem);font-weight:300;line-height:1.05;color:#fff;margin:0 0 .6rem;max-width:13ch}
.heroe-2 p.hud{color:var(--lima);margin:0}
.baja{position:absolute;z-index:2;left:50%;bottom:1.4rem;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--claro-suave)}
.baja i{width:2px;height:38px;background:linear-gradient(var(--lima),transparent);border-radius:2px}

.etiqueta{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--hud);font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--lima);margin-bottom:1.1rem}
.etiqueta::before{content:"";width:22px;height:2px;background:currentColor;box-shadow:0 0 8px currentColor}
.clara .etiqueta{color:var(--verde)}
.entradilla{font-size:clamp(1.08rem,2.2vw,1.3rem);max-width:36rem;margin-bottom:1.9rem}
.pildora{display:flex;width:fit-content;align-items:center;gap:.55rem;border:1px solid rgba(159,220,124,.35);background:rgba(4,21,11,.5);border-radius:999px;padding:.4rem .95rem .4rem .45rem;font-weight:700;font-size:.9rem;color:var(--claro);margin-bottom:1.4rem;max-width:100%}
.pildora i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--lima);color:var(--noche);font-style:normal;flex:none}
.pildora i svg{width:14px;height:14px}
.datos-rapidos{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:1.6rem 0 0;padding:0;list-style:none;color:var(--claro-suave);font-size:.95rem;font-weight:600}
.datos-rapidos li{display:flex;align-items:center;gap:.45rem}
.datos-rapidos svg{width:18px;height:18px;color:var(--lima)}

/* ---------- Cinta gigante ---------- */
.cinta{position:relative;overflow:hidden;padding:clamp(1.6rem,4vw,3rem) 0;background:var(--noche);border-block:1px solid var(--linea-osc);display:grid;gap:1rem}
.cinta-fila{display:flex;width:max-content;gap:3rem;font-family:var(--hud);font-weight:900;font-size:clamp(2.4rem,8vw,6.5rem);line-height:1;text-transform:uppercase;white-space:nowrap;will-change:transform}
.cinta-fila span{display:flex;align-items:center;gap:3rem;color:transparent;-webkit-text-stroke:1.5px rgba(159,220,124,.55)}
.cinta-fila span:nth-child(3n+1){color:var(--lima);-webkit-text-stroke:0;text-shadow:0 0 30px rgba(159,220,124,.35)}
.cinta-fila span::after{content:"";width:.26em;height:.26em;border-radius:50%;background:var(--verde-vivo);box-shadow:0 0 18px var(--verde-vivo)}
.cinta-fila.b{font-size:clamp(1.4rem,4vw,3rem)}
.cinta-fila.b span{-webkit-text-stroke-color:rgba(108,192,74,.4)}
.cinta-fila.b span:nth-child(3n+1){color:transparent;-webkit-text-stroke:1.5px rgba(108,192,74,.4);text-shadow:none}

/* ---------- Secciones ---------- */
.seccion{position:relative;padding:clamp(4.5rem,10vw,9rem) 0;overflow-x:clip}
.clara{background:var(--fondo);color:var(--texto)}
.clara h1,.clara h2,.clara h3{color:var(--tinta)}
.clara.blanca{background:#fff}
.oscura{background:var(--noche);color:var(--claro)}
.oscura h2,.oscura h3{color:#fff}
.oscura p{color:#c3d6c7}
.cabeza-seccion{max-width:48rem;margin-bottom:clamp(2.2rem,5vw,4rem)}
.cabeza-seccion p{font-size:1.14rem}
.clara .cabeza-seccion p{color:var(--suave)}

/* ---------- Tratamientos en horizontal (fijado) ---------- */
.horiz{position:relative;background:linear-gradient(180deg,var(--noche),#06200f);overflow:hidden;min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.horiz-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem 1.5rem;flex-wrap:wrap;padding-top:calc(var(--alto-cab,104px) + clamp(1rem,3vh,2.5rem))}
.horiz-cab h2{margin:0}
.contador-h{font-family:var(--hud);font-weight:800;font-size:clamp(1.4rem,3vw,2rem);color:var(--lima);font-variant-numeric:tabular-nums}
.contador-h span{color:var(--claro-suave);font-size:.6em}
.horiz-pista{display:flex;gap:clamp(1rem,2vw,1.6rem);padding:clamp(1.5rem,4vh,2.5rem) max(1.25rem,calc((100vw - var(--ancho)) / 2)) clamp(3rem,7vh,4.5rem);width:max-content}
.sin-gsap .horiz-pista{width:auto;overflow-x:auto;scroll-snap-type:x mandatory}
.sin-gsap .horiz-pista>*{scroll-snap-align:start}
.zcard{position:relative;flex:none;width:min(80vw,380px);min-height:clamp(330px,48vh,470px);display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem;padding:1.6rem;border-radius:28px;background:linear-gradient(160deg,rgba(17,99,51,.38),rgba(4,21,11,.5));border:1px solid var(--linea-osc);text-decoration:none;color:var(--claro);overflow:hidden;isolation:isolate;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:border-color .3s,transform .5s var(--spring)}
.zcard::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(159,220,124,.2),transparent 45%);opacity:0;transition:opacity .3s}
.zcard:hover{border-color:rgba(159,220,124,.55)}
.zcard:hover::before{opacity:1}
.zcard .arriba{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.zcard .num{font-family:"Raleway",sans-serif;font-feature-settings:"lnum";font-weight:800;font-size:clamp(3.6rem,9vw,6rem);line-height:.8;color:transparent;-webkit-text-stroke:1.5px rgba(159,220,124,.55)}
.zcard .ico{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:rgba(159,220,124,.1);color:var(--lima);box-shadow:inset 0 0 0 1px rgba(159,220,124,.2)}
.zcard .ico svg{width:32px;height:32px}
.zcard h3{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:300;color:#fff;margin:0 0 .2rem}
.zcard .sub{color:var(--lima);font-weight:700;margin:0 0 .9rem}
.zcard ul{display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;list-style:none}
.zcard li{font-size:.84rem;font-weight:600;padding:.3rem .7rem;border-radius:999px;border:1px solid var(--linea-osc);color:#d6e7da}
.zcard .ir{display:flex;align-items:center;gap:.5rem;font-weight:800;color:var(--lima)}
.zcard .ir svg{width:20px;height:20px;transition:transform .3s var(--ease)}
.zcard:hover .ir svg{transform:translateX(6px)}
.zcard.destacada{background:linear-gradient(160deg,var(--verde),#0a3d1f);border-color:rgba(159,220,124,.5)}
.zcard.destacada .num{-webkit-text-stroke-color:var(--lima)}
.horiz-barra{position:absolute;left:max(1.25rem,calc((100vw - var(--ancho)) / 2));right:max(1.25rem,calc((100vw - var(--ancho)) / 2));bottom:1.6rem;height:2px;background:rgba(159,220,124,.15)}
.horiz-barra i{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(var(--hp,0));background:var(--lima);box-shadow:0 0 12px var(--lima)}
.sin-gsap .horiz-barra{display:none}

/* ---------- Cifras y horario ---------- */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden}
.cifra{background:#fff;padding:2rem 1.6rem;position:relative}
.cifra b{display:block;font-family:"Raleway",sans-serif;font-weight:800;font-size:clamp(2.8rem,6vw,4.2rem);line-height:1;color:var(--verde);letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-bottom:.7rem}
.cifra b small{font-size:.42em;margin-left:.12em}
.cifra>span{font-weight:700;color:var(--tinta)}
.cifra em{display:block;font-style:normal;color:var(--suave);font-size:.86rem;margin-top:.3rem}
.horas{margin-top:clamp(2.5rem,6vw,4rem);display:grid;gap:1.4rem}
.barras{display:grid;grid-template-columns:repeat(5,1fr);gap:.6rem;align-items:end;height:240px;padding:3rem 1.2rem 0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio)}
.barra{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:.4rem}
.barra i{display:block;width:100%;max-width:56px;height:var(--h);border-radius:10px 10px 0 0;background:linear-gradient(180deg,var(--verde-vivo),var(--verde));transform-origin:50% 100%;box-shadow:0 -6px 24px -8px rgba(108,192,74,.8)}
.barra.cerrado i{height:6px;background:#dfe5dc;box-shadow:none}
.barra small{font-family:var(--hud);font-size:.66rem;font-weight:700;color:var(--suave);padding-bottom:.7rem}
.barra b{position:absolute;bottom:calc(var(--h) + 2.4rem);font-size:.72rem;color:var(--tinta);white-space:nowrap;font-weight:700}
.nota{font-size:.88rem;color:var(--suave)}
.oscura .nota{color:var(--claro-suave)}

/* ---------- Recorrido de rodilla ---------- */
.recorrido{display:grid;gap:2rem;align-items:start}
.visor{position:relative;border-radius:32px;background:radial-gradient(circle at 50% 45%,rgba(17,99,51,.7),var(--noche) 70%);border:1px solid var(--linea-osc);aspect-ratio:1/1;overflow:hidden;width:100%;margin-inline:auto;isolation:isolate}
.visor::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(159,220,124,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(159,220,124,.07) 1px,transparent 1px);background-size:32px 32px}
.visor svg.pierna{position:absolute;inset:6% 8% 4%;width:84%;height:90%}
.visor .lectura{position:absolute;left:1.2rem;top:1.1rem;color:var(--lima)}
.visor .lectura b{display:block;font-family:var(--hud);font-size:2.6rem;color:#fff;line-height:1;font-variant-numeric:tabular-nums;margin-top:.3rem}
.visor .fase-act{position:absolute;right:1.2rem;bottom:1.1rem;color:var(--claro-suave);text-align:right}
.visor .fase-act b{display:block;color:#fff;font-size:1rem;margin-top:.2rem}
.tibia{transform-box:view-box;transform-origin:180px 178px}
.arco{transform-box:view-box;transform-origin:180px 178px;transform:rotate(90deg)}
.pasos{list-style:none;margin:0;padding:0 0 0 2.4rem;position:relative}
.pasos::before{content:"";position:absolute;left:.62rem;top:.4rem;bottom:.4rem;width:2px;background:rgba(159,220,124,.15)}
.pasos .relleno{position:absolute;left:.62rem;top:.4rem;width:2px;height:calc(100% - .8rem);transform-origin:50% 0;transform:scaleY(var(--avance,1));background:linear-gradient(var(--lima),var(--verde-vivo));box-shadow:0 0 12px var(--lima)}
.paso{position:relative;padding:0 0 clamp(2.5rem,10vh,6rem)}
.paso:last-child{padding-bottom:0}
.paso::before{content:"";position:absolute;left:-2.4rem;top:.15rem;width:1.3rem;height:1.3rem;border-radius:50%;background:var(--noche);border:2px solid rgba(159,220,124,.35);transition:background .3s,border-color .3s,box-shadow .3s}
.paso.hecho::before{background:var(--lima);border-color:var(--lima);box-shadow:0 0 16px var(--lima)}
.paso .num{display:block;text-transform:uppercase;font-family:var(--hud);font-size:.74rem;font-weight:800;letter-spacing:.2em;color:var(--lima);margin-bottom:.4rem}
.paso h3{font-size:clamp(1.6rem,3.4vw,2.3rem);font-weight:300;margin-bottom:.45rem}
.paso p{margin:0;max-width:34rem}

/* ---------- Tarjetas ---------- */
.rejilla{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.tarjeta{position:relative;border-radius:var(--radio);padding:1.7rem;overflow:hidden;isolation:isolate;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--spring),border-color .3s,box-shadow .4s;background:#fff;border:1px solid var(--linea)}
.tarjeta::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%),rgba(159,220,124,.22),transparent 45%);opacity:0;transition:opacity .3s}
.tarjeta:hover::after{opacity:1}
.tarjeta .icono{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#e6f1e2;color:var(--verde);margin-bottom:1.1rem}
.tarjeta .icono svg{width:28px;height:28px}
.tarjeta p{margin:0;color:var(--suave)}
.oscura .tarjeta{background:linear-gradient(160deg,rgba(159,220,124,.07),rgba(159,220,124,.02));border-color:var(--linea-osc)}
.oscura .tarjeta:hover{border-color:rgba(159,220,124,.5);box-shadow:0 30px 60px -30px rgba(108,192,74,.35)}
.oscura .tarjeta p{color:#bcd0c1}
.oscura .tarjeta .icono{background:rgba(159,220,124,.1);color:var(--lima);box-shadow:inset 0 0 0 1px rgba(159,220,124,.25)}
.tarjeta .hud{display:block;color:var(--verde);margin-bottom:.8rem}
.oscura .tarjeta .hud{color:var(--lima)}

/* ---------- Banda final ---------- */
.banda{position:relative;overflow:hidden;border-radius:36px;padding:clamp(2.4rem,7vw,5.5rem);background:radial-gradient(60rem 30rem at 100% 0%,rgba(159,220,124,.3),transparent 50%),linear-gradient(135deg,var(--verde),var(--noche-2));color:#fff;isolation:isolate;border:1px solid rgba(159,220,124,.3)}
.banda h2{color:#fff;max-width:14ch}
.banda p{color:#d9e7db;max-width:36rem;font-size:1.12rem}
.banda .orbe{position:absolute;z-index:-1;border-radius:50%;border:1px solid rgba(159,220,124,.25);pointer-events:none}
.banda .orbe.a{width:520px;height:520px;right:-140px;top:-180px}
.banda .orbe.b{width:340px;height:340px;right:-40px;top:-80px;border-style:dashed}

/* ---------- Páginas interiores ---------- */
.cabeza-pagina{position:relative;overflow:hidden;isolation:isolate;padding:calc(var(--alto-cab,104px) + clamp(3rem,8vw,6rem)) 0 clamp(3rem,7vw,5rem);background:radial-gradient(60rem 40rem at 90% 0%,rgba(17,99,51,.55),transparent 60%),var(--noche)}
.cabeza-pagina::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(159,220,124,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(159,220,124,.06) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
.cabeza-pagina h1{color:#fff;max-width:14ch}
.cabeza-pagina .entradilla{color:#c9dccd;margin-bottom:0}
.migas{font-size:.9rem;margin-bottom:1rem;color:var(--claro-suave)}
.migas a{color:var(--claro-suave)}
.capas{position:absolute;inset:0;z-index:-1;pointer-events:none}
.capas i{position:absolute;border-radius:50%;border:1px solid rgba(159,220,124,.22)}
.capas i.s{background:radial-gradient(circle,rgba(159,220,124,.3),transparent 65%);border:0}
.cab-grid{display:grid;gap:1.5rem;align-items:center}
.cab-canvas{position:relative;height:clamp(300px,50vh,560px)}
.cab-canvas canvas{position:absolute;inset:0;width:100%;height:100%}

.indice-zonas{position:sticky;top:var(--alto-cab,104px);z-index:30;background:rgba(244,245,242,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--linea)}
.indice-zonas ul{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;list-style:none;margin:0;padding:.7rem 0}
.indice-zonas ul::-webkit-scrollbar{display:none}
.indice-zonas a{display:inline-flex;align-items:center;min-height:44px;padding:.4rem 1rem;border-radius:999px;background:#fff;border:1px solid var(--linea);color:var(--tinta);text-decoration:none;font-weight:700;font-size:.92rem;white-space:nowrap;transition:background .25s,color .25s,border-color .25s}
.indice-zonas a.activo,.indice-zonas a:hover{background:var(--verde);border-color:var(--verde);color:#fff}
.trat-grid{display:grid;gap:2rem}
.trat-visor{display:none}
.zona{display:grid;gap:1.2rem;padding:clamp(2.5rem,6vw,4rem) 0;border-top:1px solid var(--linea);scroll-margin-top:190px}
.zona:first-child{border-top:0}
.zona-titulo{display:flex;align-items:flex-start;gap:1rem}
.icono-zona{flex:none;width:64px;height:64px;border-radius:20px;background:linear-gradient(145deg,var(--verde),var(--noche-2));display:grid;place-items:center;color:var(--lima);box-shadow:0 14px 30px -14px rgba(11,58,32,.7)}
.icono-zona svg{width:34px;height:34px}
.zona h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:.25rem}
.zona .sub{color:var(--suave);font-weight:600;margin:0}
.zona .hud{color:var(--verde)}
.lista-lesiones{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0 0 1.4rem;list-style:none}
.lista-lesiones li{background:#fff;border:1px solid var(--linea);border-radius:999px;padding:.4rem .85rem;font-weight:600;font-size:.93rem;color:var(--tinta)}
.enlace-flecha{display:inline-flex;align-items:center;gap:.45rem;font-weight:800;color:var(--verde);text-decoration:none;min-height:44px}
.enlace-flecha svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.enlace-flecha:hover{text-decoration:underline;text-underline-offset:4px}
.enlace-flecha:hover svg{transform:translate(3px,-3px)}
.oscura .enlace-flecha{color:var(--lima)}
.zona.destacada{background:#fff;border:1px solid var(--linea);border-radius:32px;padding:clamp(1.6rem,5vw,3rem);box-shadow:0 30px 60px -40px rgba(11,58,32,.5)}
.sello{display:inline-block;background:var(--lima);color:var(--noche);font-family:var(--hud);font-weight:800;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;padding:.35rem .65rem;border-radius:8px;margin-bottom:.9rem}

/* Equipo */
.rol{display:flex;flex-direction:column;gap:.9rem}
.avatar{position:relative;aspect-ratio:4/3;border-radius:18px;background:radial-gradient(circle at 50% 40%,rgba(159,220,124,.2),transparent 60%),linear-gradient(160deg,#0b2a18,#04150b);overflow:hidden;display:grid;place-items:center}
.avatar::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(159,220,124,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(159,220,124,.08) 1px,transparent 1px);background-size:20px 20px}
.avatar svg{position:relative;width:40%;height:auto;color:var(--lima);filter:drop-shadow(0 0 16px rgba(159,220,124,.5))}
.avatar .hueco{position:absolute;left:.7rem;bottom:.7rem;font-family:var(--hud);font-size:.58rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lima);padding:.3rem .5rem;border-radius:6px;border:1px dashed rgba(159,220,124,.6)}
.valores{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.valor{background:#fff;padding:2rem 1.6rem}
.valor .n{font-family:var(--hud);font-size:3.2rem;font-weight:800;color:transparent;-webkit-text-stroke:1.5px var(--verde-luz);line-height:1;display:block;margin-bottom:.9rem}

/* Contacto */
.cita-grande{display:grid;gap:1.5rem;align-items:stretch}
.tarjeta-cita{position:relative;overflow:hidden;border-radius:32px;padding:clamp(1.8rem,5vw,3.2rem);background:radial-gradient(40rem 20rem at 100% 0%,rgba(159,220,124,.3),transparent 55%),linear-gradient(145deg,var(--verde),var(--noche-2));color:#fff;isolation:isolate;border:1px solid rgba(159,220,124,.3)}
.tarjeta-cita h2{color:#fff;font-size:clamp(1.9rem,4.5vw,3rem)}
.tarjeta-cita p{color:#d4e3d6}
.canales{display:grid;gap:.8rem}
.canal{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;background:#fff;border:1px solid var(--linea);border-radius:18px;text-decoration:none;color:var(--tinta);transition:transform .35s var(--spring),box-shadow .3s,border-color .3s}
a.canal[href]:hover{transform:translateX(4px);box-shadow:0 20px 40px -24px rgba(11,58,32,.5);border-color:var(--verde)}
.canal .ic{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#e6f1e2;color:var(--verde)}
.canal .ic svg{width:24px;height:24px}
.canal>span:nth-child(2){min-width:0}
.canal b{display:block;font-size:1.05rem;overflow-wrap:anywhere}
.canal small{color:var(--suave);font-size:.9rem}
.canal .demo-chip{margin-left:auto;flex:none}
.horario{width:100%;border-collapse:collapse;font-size:1rem}
.horario th,.horario td{text-align:left;padding:.85rem 0;border-bottom:1px solid var(--linea)}
.horario td{text-align:right;font-weight:800;color:var(--tinta);font-variant-numeric:tabular-nums}
.llegar{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:.7rem}
.llegar li{display:flex;gap:.8rem;align-items:flex-start}
.llegar .hud{flex:none;min-width:5.4rem;padding:.35rem .55rem;border-radius:8px;background:var(--verde);color:#fff;text-align:center;font-size:.6rem}
.mapa{position:relative;border-radius:28px;overflow:hidden;background:#0b2a18;aspect-ratio:4/3;border:1px solid var(--linea-osc)}
.mapa svg{width:100%;height:100%}
.preguntas{display:grid;gap:.7rem}
.preguntas details{background:#fff;border:1px solid var(--linea);border-radius:18px;overflow:hidden;transition:border-color .3s,box-shadow .3s}
.preguntas details[open]{border-color:#bcd1b8;box-shadow:0 20px 40px -30px rgba(11,58,32,.5)}
.preguntas summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 1.3rem;font-weight:700;color:var(--tinta);min-height:56px}
.preguntas summary::-webkit-details-marker{display:none}
.preguntas summary i{flex:none;position:relative;width:30px;height:30px;border-radius:50%;background:#e6f1e2}
.preguntas summary i::before,.preguntas summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--verde);border-radius:2px;transition:transform .35s var(--spring)}
.preguntas summary i::after{transform:rotate(90deg)}
.preguntas details[open] summary i::after{transform:rotate(0)}
.preguntas .resp{padding:0 1.3rem 1.2rem;color:var(--suave)}
.preguntas .resp p:last-child{margin:0}

/* ---------- Pie ---------- */
.pie{position:relative;background:#020d06;color:#bfd0c3;padding:5rem 0 8rem;font-size:.95rem;overflow:hidden}
.pie a{color:#e4efe6}
.pie-grande{margin-bottom:3rem}
.pie-grande svg{width:min(100%,760px);height:auto}
.pie-rejilla{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));margin-bottom:2.5rem}
.pie h3{font-family:var(--hud);color:var(--lima);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem;font-weight:700}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.aviso-demo{border-top:1px solid var(--linea-osc);padding-top:1.6rem;font-size:.86rem;color:#a9bdaf;max-width:64rem}
.aviso-demo strong{color:#fff}

/* ---------- Barra móvil ---------- */
.barra-movil{position:fixed;left:.6rem;right:.6rem;bottom:calc(.6rem + env(safe-area-inset-bottom));z-index:80;display:grid;grid-template-columns:1fr 1fr 1.6fr;gap:.4rem;padding:.4rem;border-radius:22px;background:rgba(2,13,6,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--linea-osc);box-shadow:0 20px 40px -12px rgba(0,0,0,.6);transform:translateY(160%);transition:transform .55s var(--spring)}
.barra-movil.visible{transform:none}
.barra-movil a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;min-height:54px;border-radius:16px;color:var(--claro-suave);text-decoration:none;font-weight:700;font-size:.78rem}
.barra-movil a svg{width:20px;height:20px}
.barra-movil a small{font-family:var(--hud);font-size:.5rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lima);font-weight:800}
.barra-movil a.cita{background:var(--lima);color:var(--noche);flex-direction:row;gap:.5rem;font-size:.98rem;font-weight:800;box-shadow:0 0 24px -6px var(--lima)}

/* ---------- Cursor y cortina ---------- */
.cursor{position:fixed;left:0;top:0;z-index:300;pointer-events:none;display:none}
.con-cursor .cursor{display:block}
.cursor-punto,.cursor-aro{position:fixed;left:0;top:0;border-radius:50%;pointer-events:none}
.cursor-punto{width:8px;height:8px;margin:-4px 0 0 -4px;background:var(--lima);box-shadow:0 0 12px var(--lima)}
.cursor-aro{width:44px;height:44px;margin:-22px 0 0 -22px;border:1.5px solid rgba(159,220,124,.75);display:grid;place-items:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .3s,border-color .3s}
.cursor-aro span{font-family:var(--hud);font-size:.58rem;font-weight:800;letter-spacing:.12em;color:var(--noche);opacity:0;transition:opacity .2s}
.cursor.sobre .cursor-aro{width:70px;height:70px;margin:-35px 0 0 -35px;background:rgba(159,220,124,.14)}
.cursor.con-texto .cursor-aro{width:86px;height:86px;margin:-43px 0 0 -43px;background:var(--lima);border-color:var(--lima)}
.cursor.con-texto .cursor-aro span{opacity:1}
.cursor.con-texto .cursor-punto{opacity:0}
.con-cursor body,.con-cursor a[href],.con-cursor button,.con-cursor summary{cursor:none}
.cortina{position:fixed;inset:0;z-index:250;pointer-events:none;background:linear-gradient(160deg,var(--verde),var(--noche));transform:scaleY(0);transform-origin:50% 100%}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  @view-transition{navigation:none}
  .tarjeta,.zcard{transform:none!important}
  .heroe-2{display:none}
}

/* ---------- Tamaños ---------- */
@media (min-width:900px){
  .recorrido{grid-template-columns:1fr 1fr;gap:4.5rem}
  .recorrido .visor{position:sticky;top:calc(var(--alto-cab,104px) + 2rem);max-width:540px}
  .cita-grande{grid-template-columns:1.1fr .9fr;gap:2rem}
  .dos-col{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:start}
  .cab-grid{grid-template-columns:1.05fr .95fr}
  .trat-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:3.5rem;align-items:start}
  .trat-visor{display:block;position:sticky;top:calc(var(--alto-cab,104px) + 5rem);height:calc(100vh - var(--alto-cab,104px) - 7rem);max-height:680px;border-radius:32px;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(17,99,51,.65),var(--noche) 70%);border:1px solid var(--linea-osc);margin-top:2.5rem}
  .trat-visor canvas{position:absolute;inset:0;width:100%;height:100%}
  .trat-visor .hud{position:absolute;left:1.2rem;top:1.1rem;color:var(--lima);z-index:1}
  .trat-visor .hud b{display:block;font-size:1.5rem;color:#fff;letter-spacing:.06em;margin-top:.3rem}
  .barra-movil{display:none}
  .pie{padding-bottom:4rem}
  .horas{grid-template-columns:1.2fr .8fr;align-items:center}
}
@media (max-width:899px){
  .dos-col>*+*{margin-top:2.5rem}
  .recorrido .visor{position:sticky;top:calc(var(--alto-cab,104px) + .5rem);z-index:2;aspect-ratio:auto;height:30vh;min-height:190px;border-radius:24px}
  .recorrido .visor svg.pierna{inset:4% 22%;width:56%;height:92%}
  .recorrido .visor .lectura b{font-size:1.7rem}
  .hud-esquina.ai{display:none}
  .heroe-texto{justify-content:flex-end;padding-bottom:5.5rem}
  .heroe h1{font-size:clamp(2.4rem,11vw,4rem)}
  .hud-esquina.bd{left:1.25rem;right:auto;bottom:auto;top:calc(var(--alto-cab,104px) + 1rem);text-align:left}
  .hud-lectura{font-size:1.5rem}
  .baja{display:none}
  .heroe-2{bottom:auto;top:calc(var(--alto-cab,104px) + 5.5rem)}
}
@media (max-width:1023px){
  .boton-menu{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:14px;border:1px solid var(--linea-osc);background:rgba(159,220,124,.06);color:var(--claro);cursor:pointer}
  .boton-menu svg{width:24px;height:24px}
  .boton-menu .l{transition:transform .35s var(--ease),opacity .2s;transform-box:fill-box;transform-origin:center}
  .boton-menu[aria-expanded="true"] .l1{transform:translateY(6px) rotate(45deg)}
  .boton-menu[aria-expanded="true"] .l2{opacity:0}
  .boton-menu[aria-expanded="true"] .l3{transform:translateY(-6px) rotate(-45deg)}
  .nav{position:fixed;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:.2rem;padding:1.2rem 1.25rem 2rem;background:var(--noche);height:calc(100dvh - var(--alto-cab,104px));overflow-y:auto;visibility:hidden;opacity:0;transform:translateY(-12px);transition:opacity .3s var(--ease),transform .35s var(--ease),visibility 0s .35s}
  .nav.abierta{visibility:visible;opacity:1;transform:none;transition:opacity .3s var(--ease),transform .35s var(--ease)}
  .nav a{font-size:2rem;font-weight:300;padding:.85rem .5rem;border-radius:14px;border-bottom:1px solid var(--linea-osc)}
  .nav a[aria-current="page"]{font-weight:700}
  .nav a[aria-current="page"]::after{left:auto;right:.8rem;top:50%;bottom:auto;margin:-4px 0 0;width:8px;height:8px}
  .nav .boton,.nav .boton:hover{margin-top:1.2rem;font-size:1.1rem;border-bottom:0;background:var(--lima);color:var(--noche)}
  .cabecera .cita-cab{display:none}
}
@media (min-width:1024px){.nav .solo-movil{display:none}}
@media (max-width:480px){
  .contenedor{width:min(100% - 2rem,var(--ancho))}
  .marca svg{height:36px}
  .fila-botones .boton{flex:1 1 100%}
  .pildora{font-size:.82rem}
  .icono-zona{width:52px;height:52px}
  .barras{height:210px;gap:.3rem;padding:3.2rem .5rem 0}
  .barra b{font-size:.58rem;bottom:calc(var(--h) + 2.2rem);writing-mode:vertical-rl;transform:rotate(180deg)}
  .banda,.tarjeta-cita{padding:2.2rem 1.3rem}
  .canal{padding:1rem;gap:.8rem}
  .zcard{padding:1.35rem}
}
@media print{.fija,.barra-movil,.cursor,.cortina{display:none}}
/* Estado inicial de lo que entra animado (solo con JS y sin movimiento reducido) */
.anima:not(.listo) [data-split],.anima:not(.listo) [data-sube],.anima:not(.listo) .heroe .pildora,.anima:not(.listo) .heroe .etiqueta{visibility:hidden}
[data-split] .brilla{background:none;color:var(--lima);text-shadow:0 0 28px rgba(159,220,124,.35)}
.clara [data-split] .brilla{color:var(--verde);text-shadow:none}
[data-split] .linea-sp{overflow:clip;padding-bottom:.06em;margin-bottom:-.06em}
/* Anillo HUD de La clínica y mapa */
.hud-centro{position:relative;width:min(100%,440px);margin-inline:auto}
.anillo-hud{width:100%;height:auto}
.hud-dato{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:.4rem}
.hud-dato b{font-family:var(--hud);font-weight:800;font-size:clamp(3rem,9vw,5rem);line-height:1;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 30px rgba(159,220,124,.5)}
.hud-dato b small{font-size:.4em;margin-left:.1em;color:var(--lima)}
.hud-dato .hud{color:var(--lima);font-size:.6rem;max-width:12rem}
.gira-a,.gira-b,.gira-c{transform-box:view-box;transform-origin:200px 200px}
.pin{transform-box:fill-box;transform-origin:50% 100%}
@media (prefers-reduced-motion:no-preference){
  .gira-a{animation:gira 40s linear infinite}
  .gira-b{animation:gira 18s linear infinite reverse}
  .gira-c{animation:gira 90s linear infinite}
  .pin{animation:bota 2.2s cubic-bezier(.34,1.56,.64,1) infinite}
  .ruta{stroke-dasharray:6 9;animation:ruta 1.2s linear infinite}
}
@keyframes gira{to{transform:rotate(360deg)}}
@keyframes bota{50%{transform:translateY(-10px)}}
@keyframes ruta{to{stroke-dashoffset:-15}}
/* Bloques oscuros dentro de secciones claras */
.banda .etiqueta,.tarjeta-cita .etiqueta{color:var(--lima)}
.banda .brilla,.tarjeta-cita .brilla,.banda [data-split] .brilla{background:none;color:var(--lima);-webkit-text-fill-color:var(--lima)}
.clara .banda .boton:not(.linea):not([aria-disabled]),.clara .tarjeta-cita .boton:not(.linea){--bg:var(--lima);--fg:var(--noche)}
.clara .banda .boton.linea,.clara .banda .boton[aria-disabled="true"]{--fg:#e6f2e8;border-color:rgba(159,220,124,.45)}
.clara .banda .demo-chip{background:rgba(159,220,124,.14);color:var(--lima)}
.visor{background:radial-gradient(circle at 50% 45%,rgba(17,99,51,.7),var(--noche) 70%),var(--noche)}
@media (max-width:899px){
  .heroe::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent 0%,transparent 28%,rgba(4,21,11,.75) 50%,var(--noche) 78%)}
  .hud-esquina.bd{display:none}
  .heroe .datos-rapidos{display:none}
  .heroe-texto{padding-bottom:2.2rem}
  .horiz{justify-content:flex-start}
  .zcard{min-height:clamp(300px,46vh,420px)}
}
@media (max-height:820px) and (min-width:900px){.horiz-cab p:not(.contador-h):not(.etiqueta){display:none}.zcard{min-height:300px;gap:.8rem}.horiz-pista{padding-top:1.2rem}}

.cinta-fila.b span,.cinta-fila.b span:nth-child(3n+1){color:rgba(159,220,124,.8);-webkit-text-stroke:0}
