/* =====================================================================
   FUMIGADOR BONITO · PCD Solutions — fumigadorbonito.com · styles.css
   Sistema «En Vivo» (propuesta 03 aprobada) · Raptor Marketer
   Catálogo de componentes y cómo usarlos: fuente-sitio/COMPONENTES.md
   Estados iniciales de los efectos SOLO bajo html.fx (lo pone el <head> si no hay
   prefers-reduced-motion y lo quita a los 4 s si main.js no cargó): sin JS nada queda oculto.
   ===================================================================== */

/* ======= 1. FUENTES AUTOALOJADAS (Regla 11) ======= */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/anton-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/anton-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Rubik';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/rubik-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Rubik';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/rubik-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ======= 2. TOKENS ======= */
:root{
  --estudio:#012F4A;--pcd:#016597;--senal:#0A86C7;--cian:#25F4EE;--magenta:#FE2C55;--rec:#FF3B30;
  --madrugada:#001B2E;--niebla:#A9C7DA;--bruma:#D5E8F2;--gris:#3B5B70;--hielo:#EAF5FB;--wa:#25D366;
  --f-display:'Anton',Impact,'Arial Narrow',sans-serif;--f-body:'Rubik','Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);--snap:cubic-bezier(.7,0,.2,1);
  --wrap:1320px;--gut:2rem;--hdr:76px;--sec:clamp(5rem,10vw,9rem);--muted:var(--niebla)
}
@property --prog{syntax:'<number>';inherits:false;initial-value:0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ======= 3. BASE ======= */
*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:clip}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 12px);background:var(--estudio)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font-family:var(--f-body);font-size:1.0625rem;line-height:1.6;color:#fff;background:var(--estudio);-webkit-font-smoothing:antialiased;font-synthesis:none;text-rendering:optimizeLegibility}
img,svg,video,iframe{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--f-display);font-weight:400;line-height:.95;letter-spacing:.006em;text-transform:uppercase}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}
strong{font-weight:600}
main:focus{outline:none}
.container{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:1rem;top:-80px;z-index:3000;background:var(--cian);color:var(--estudio);padding:.75rem 1.1rem;font-weight:700;text-decoration:none;border-radius:10px;transition:top .2s}
.skip:focus{top:1rem}
:focus-visible{outline:3px solid var(--focus,var(--cian));outline-offset:3px}
.ico{width:24px;height:24px;flex:none}

/* superficies */
.sec{padding-block:var(--sec);position:relative}
.s-estudio{background:var(--estudio);color:#fff;--muted:var(--niebla)}
.s-pcd{background:var(--pcd);color:#fff;--muted:var(--bruma)}
.s-senal{background:var(--senal);color:#fff;--muted:#fff}
.s-night{background:var(--madrugada);color:#fff;--muted:var(--niebla)}
.s-light{background:#fff;color:var(--estudio);--muted:var(--gris);--focus:var(--pcd)}
.s-hielo{background:var(--hielo);color:var(--estudio);--muted:var(--gris);--focus:var(--pcd)}

/* ======= 4. TIPOGRAFÍA DE SECCIÓN ======= */
.head{display:flex;flex-direction:column;gap:.9rem;margin-bottom:clamp(2rem,4vw,3.2rem)}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--eb,var(--cian))}
.eb-tc{display:inline-block;font-variant-numeric:tabular-nums;letter-spacing:.06em;padding:.3rem .5rem;border:1.5px solid currentColor;border-radius:7px;line-height:1}
.s-light .eyebrow,.s-hielo .eyebrow{--eb:var(--pcd)}
.h2{font-size:clamp(2.5rem,6vw,6rem);max-width:16ch}
.h2 em{font-style:normal;color:var(--acc,var(--cian))}
.s-light .h2 em,.s-hielo .h2 em{--acc:var(--magenta)}
.h3{font-size:clamp(1.7rem,2.6vw,2.4rem)}
.lead{font-size:clamp(1.05rem,1.3vw,1.22rem);line-height:1.6;color:var(--muted);max-width:60ch}
.lead strong,.lead a{color:var(--ink,currentColor)}
.s-estudio .lead strong,.s-pcd .lead strong,.s-night .lead strong{color:#fff}
.s-light .lead strong,.s-hielo .lead strong{color:var(--estudio)}
.lnk{color:inherit;font-weight:600;text-decoration:underline;text-decoration-color:var(--lc,var(--cian));text-decoration-thickness:2px;text-underline-offset:.22em}
.s-light .lnk,.s-hielo .lnk{--lc:var(--magenta)}
.lnk:hover{text-decoration-color:currentColor}

/* ======= 5. EFECTOS DE TEXTO: corte de edición · aberración · reveal ======= */
.cut{position:relative}
.fx .cut{clip-path:inset(-.3em 100% -.3em -.3em)}
.fx .cut::after{content:"";position:absolute;top:-.08em;bottom:-.08em;left:0;width:100%;pointer-events:none;background:linear-gradient(90deg,transparent calc(100% - 6px),var(--ph,var(--cian)) calc(100% - 6px));transform:translateX(-100%);opacity:0}
.fx .cut.is-in{animation:cutWipe .78s cubic-bezier(.77,0,.18,1) forwards,glitch .24s steps(3) .74s 1 both}
.fx .cut.is-in::after{animation:playhead .78s cubic-bezier(.77,0,.18,1) forwards}
.s-light .cut,.s-hielo .cut{--ph:var(--magenta)}
@keyframes cutWipe{to{clip-path:inset(-.3em -.3em -.3em -.3em)}}
@keyframes playhead{0%{transform:translateX(-100%);opacity:1}90%{opacity:1}100%{transform:translateX(0);opacity:0}}
@keyframes glitch{0%{text-shadow:-.05em 0 var(--cian),.05em 0 var(--magenta);transform:translateX(3px)}34%{text-shadow:.04em 0 var(--cian),-.04em 0 var(--magenta);transform:translateX(-2px)}67%{text-shadow:-.02em 0 var(--cian),.02em 0 var(--magenta);transform:translateX(1px)}100%{text-shadow:none;transform:none}}
.ab{position:relative;display:block;isolation:isolate;width:max-content;max-width:100%}
.ab::before,.ab::after{content:attr(data-text);content:attr(data-text) / "";position:absolute;left:0;top:0;width:100%;z-index:-1;pointer-events:none}
.ab::before{color:var(--cian);transform:translate(-.022em,0)}
.ab::after{color:var(--magenta);transform:translate(.022em,0)}
.ab--inline{display:inline-block}
.fx [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform 1.05s var(--ease);transition-delay:calc(var(--d,0) * 1ms)}
.fx [data-reveal].is-in{opacity:1;transform:none}
.fx [data-reveal="pop"]{transform:translateY(30px) scale(.94) rotate(-1.5deg)}

/* ======= 6. BOTONES ======= */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:56px;padding:.85rem 1.5rem;border:0;border-radius:999px;font:700 1rem/1.1 var(--f-body);text-decoration:none;cursor:pointer;transition:transform .35s var(--ease),background-color .3s,color .3s,box-shadow .35s}
.btn svg{width:22px;height:22px;flex:none}
.btn .arr{fill:none;stroke:currentColor;stroke-width:2;transition:transform .4s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn-love{background:var(--magenta);color:#fff;font-size:1.1875rem;padding:.55rem 1.7rem .55rem .55rem;min-height:62px;box-shadow:0 14px 34px -12px rgba(254,44,85,.75)}
.btn-love .hb{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.2);flex:none}
.btn-love .hb svg{width:24px;height:24px;fill:#fff}
.btn-love::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.45) 50%,transparent 75%);transform:translateX(-120%);transition:transform .9s var(--ease)}
.btn-love:hover::before{transform:translateX(120%)}
.btn-love:hover{transform:translateY(-2px)}
.btn-love:active{transform:scale(.96)}
@media (prefers-reduced-motion:no-preference){.btn-love:hover .hb svg,.btn-love:focus-visible .hb svg{animation:beat .9s var(--ease) infinite}}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.28)}30%{transform:scale(.94)}45%{transform:scale(1.16)}60%{transform:scale(1)}}
.btn-cian{background:var(--cian);color:var(--estudio)}
.btn-white{background:#fff;color:var(--estudio)}
.btn-dark{background:var(--estudio);color:#fff}
.btn-dark svg{fill:#fff}
.btn-cian:hover,.btn-white:hover,.btn-dark:hover{transform:translateY(-2px)}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 2px color-mix(in srgb,currentColor 55%,transparent)}
.btn-ghost:hover{box-shadow:inset 0 0 0 2px currentColor}
.btn-sm{min-height:46px;padding:.55rem 1.1rem;font-size:.92rem}
.btn-story{display:inline-flex;align-items:center;gap:.85rem;min-height:64px;padding:.3rem 1.4rem .3rem .3rem;border:0;border-radius:999px;text-decoration:none;color:#fff;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.24);cursor:pointer;transition:background-color .3s,transform .35s var(--ease)}
.btn-story:hover{background:rgba(255,255,255,.12);transform:translateY(-2px)}
.ring{position:relative;width:58px;height:58px;border-radius:50%;flex:none;display:grid;place-items:center}
.ring::before,.ring::after{content:"";position:absolute;inset:0;border-radius:50%;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px))}
.ring::before{background:conic-gradient(from 20deg,var(--cian),var(--magenta),#fff,var(--cian))}
.ring::after{background:conic-gradient(#fff calc(var(--prog) * 1%),transparent 0);opacity:0}
.ring-in{width:46px;height:46px;border-radius:50%;background:var(--estudio);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.ring-in svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.bs-t{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.bs-t small{font-size:.74rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--niebla)}
.bs-t b{font-size:1.18rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.01em}
@media (prefers-reduced-motion:no-preference){.btn-story:hover .ring::before,.btn-story:focus-visible .ring::before{animation:spin 2.2s linear infinite}.btn-story:hover .ring::after,.btn-story:focus-visible .ring::after{opacity:1;animation:prog 1.5s linear forwards}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes prog{to{--prog:100}}
.s-light .btn-story,.s-hielo .btn-story{color:var(--estudio);background:var(--hielo);box-shadow:inset 0 0 0 1.5px rgba(1,47,74,.18)}
.s-hielo .btn-story{background:#fff}
.s-light .btn-story .bs-t small,.s-hielo .btn-story .bs-t small{color:var(--gris)}
.s-light .ring::after,.s-hielo .ring::after{background:conic-gradient(var(--estudio) calc(var(--prog) * 1%),transparent 0)}
.ctas{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.1rem;margin-top:1.7rem}

/* corazones (capa decorativa) */
.hearts{position:fixed;inset:0;z-index:2500;pointer-events:none;overflow:hidden}
.hrt{position:absolute;left:0;top:0;width:26px;height:26px;margin:-13px 0 0 -13px;will-change:transform,opacity}
.hrt svg{width:100%;height:100%;fill:currentColor;filter:drop-shadow(0 3px 8px rgba(0,0,0,.25))}

/* insignias y chips */
.badge-live{position:relative;display:inline-flex;align-items:center;gap:.55rem;padding:.45rem .85rem .45rem .7rem;border-radius:9px;background:rgba(255,59,48,.16);box-shadow:inset 0 0 0 1.5px var(--rec);font-weight:700;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;line-height:1}
.rec-dot{position:relative;width:10px;height:10px;border-radius:50%;background:var(--rec);flex:none}
.rec-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--rec)}
@media (prefers-reduced-motion:no-preference){.rec-dot::after{animation:recPulse 1.4s ease-out infinite}.rec-dot{animation:recBlink 1.4s steps(1) infinite}}
@keyframes recPulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.2);opacity:0}}
@keyframes recBlink{0%,60%{opacity:1}61%,100%{opacity:.35}}
.chip{display:inline-flex;align-items:center;gap:.55rem;padding:.3rem .85rem .3rem .3rem;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);font-size:.86rem;line-height:1.15}
.chip .av{width:30px;height:30px;border-radius:50%;padding:2px;background:conic-gradient(var(--cian),var(--magenta),var(--cian));flex:none}
.chip .av span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--pcd)}
.chip .av img{width:70%;height:auto}
.chip b{font-weight:600}
.chip small{color:var(--niebla);font-size:.8rem}
.chip--plain{padding:.42rem .85rem;gap:.4rem}
.chip--plain svg{width:16px;height:16px;fill:none;stroke:var(--cian);stroke-width:2}
.live-row{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem .8rem;margin-bottom:1.5rem}
.kicker{font-size:clamp(.8rem,.95vw,.9rem);font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--cian);margin-bottom:1rem}

/* ======= 7. HEADER · NAV · DESPLEGABLE · MENÚ MÓVIL ======= */
.hdr{position:fixed;inset:0 0 auto;z-index:1000;height:var(--hdr);color:#fff;transition:background-color .45s var(--ease),box-shadow .45s}
.hdr.is-scrolled,.menu-open .hdr{background:rgba(1,47,74,.9);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 1px 0 rgba(255,255,255,.08)}
.hdr-in{height:100%;display:flex;align-items:center;gap:1.1rem}
.brand{display:flex;align-items:center;gap:.85rem;text-decoration:none;flex:none;min-width:0}
.brand img{height:34px;width:auto}
.brand-sep{width:1px;height:30px;background:rgba(255,255,255,.3);flex:none}
.handle{display:flex;flex-direction:column;line-height:1.18;min-width:0}
.handle b{font-weight:600;font-size:.86rem;letter-spacing:.01em}
.handle span{font-size:.74rem;color:var(--niebla)}
.nav{margin-left:auto}
.nav>ul{display:flex;align-items:center;gap:clamp(.9rem,1.35vw,1.5rem)}
.nav>ul>li>a,.dd-btn{position:relative;display:flex;align-items:center;gap:.35rem;padding:.45rem 0;font-size:.9rem;font-weight:500;text-decoration:none;background:none;border:0;cursor:pointer;white-space:nowrap}
.nav>ul>li>a::after,.dd-btn::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--cian);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav>ul>li>a:hover::after,.nav>ul>li>a[aria-current]::after,.dd-btn:hover::after,.dd.is-current .dd-btn::after{transform:scaleX(1);transform-origin:left}
.dd-btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .35s var(--ease)}
.dd{position:relative}
.dd.open .dd-btn svg{transform:rotate(180deg)}
.dd-panel{position:absolute;top:calc(100% + 16px);left:-1.4rem;width:560px;padding:.7rem;border-radius:22px;background:#fff;color:var(--estudio);box-shadow:0 30px 70px -20px rgba(0,17,29,.6),0 0 0 1px rgba(1,47,74,.08);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,transform .4s var(--ease),visibility 0s .4s;--focus:var(--pcd)}
.dd-panel::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.dd.open .dd-panel{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .4s var(--ease)}
.dd-list{display:grid;grid-template-columns:1fr 1fr;gap:.25rem}
.dd-item{display:grid;grid-template-columns:46px minmax(0,1fr);gap:.1rem .8rem;align-items:center;width:100%;padding:.65rem;border:0;border-radius:14px;background:none;color:inherit;text-align:left;text-decoration:none;cursor:pointer;transition:background-color .25s}
.dd-item:hover,.dd-item[aria-current]{background:var(--hielo)}
.dd-ic{grid-row:span 2;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--estudio)}
.dd-ic svg{width:34px;height:34px;fill:none;stroke:#fff;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.dd-item:hover .dd-ic svg{stroke:var(--cian)}
.dd-item b{font-weight:600;font-size:.95rem;line-height:1.2}
.dd-item small{font-size:.8rem;color:var(--gris);line-height:1.3}
.dd-item--otras .dd-ic{background:var(--magenta)}
/* «EN VIVO» del header (solo escritorio): discreto, a la derecha junto a «Contacto»; abre el modal de WhatsApp */
.hdr-live{display:inline-flex;align-items:center;gap:.5rem;margin-left:clamp(1rem,1.7vw,1.7rem);padding:.45rem .78rem .45rem .64rem;border:0;border-radius:8px;background:rgba(255,59,48,.14);box-shadow:inset 0 0 0 1.5px var(--rec);color:#fff;font:700 .72rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;cursor:pointer;flex:none;transition:background-color .3s}
.hdr-live:hover{background:rgba(255,59,48,.3)}
.hdr-live:focus-visible{outline:2px solid var(--cian);outline-offset:3px}
.hdr-live .rec-dot{width:8px;height:8px}
/* botón del menú: SOLO icono. Un ▶ de proporción real (22×24) partido en tres franjas horizontales: se lee como
   reproducir y, a la vez, como las tres líneas del menú. Aberración cian/magenta horizontal, como el H1.
   Área táctil de 48 px. Abierto: las dos franjas de las orillas se vuelven barras y se cruzan en X; la de en medio
   se apaga. Nombre accesible: «Menú» (.sr-only) + aria-expanded. */
.menu-btn{display:none;position:relative;width:48px;height:48px;margin:0 -13px 0 auto;padding:0;border:0;background:none;color:#fff;cursor:pointer;flex:none;-webkit-tap-highlight-color:transparent}
.menu-btn:focus-visible{outline:2px solid var(--cian);outline-offset:0;border-radius:12px}
.mb-ic{position:absolute;left:13px;top:12px;width:22px;height:24px;filter:drop-shadow(-1.6px 0 0 rgba(37,244,238,.95)) drop-shadow(1.6px 0 0 rgba(254,44,85,.9))}
.mb-ic i{position:absolute;left:0;height:5.6px;background:#fff;transition:transform .45s var(--ease),top .45s var(--ease),width .45s var(--ease),height .45s var(--ease),clip-path .45s var(--ease),opacity .25s}
.mb-ic i:nth-child(1){top:0;width:11px;clip-path:polygon(0 0,9.7% 0,100% 100%,0 100%)}
.mb-ic i:nth-child(2){top:9.2px;width:22px;clip-path:polygon(0 0,77.4% 0,100% 50%,77.4% 100%,0 100%)}
.mb-ic i:nth-child(3){top:18.4px;width:11px;clip-path:polygon(0 0,100% 0,9.7% 100%,0 100%)}
.menu-btn[aria-expanded="true"] .mb-ic i:nth-child(1){top:10px;width:24px;height:4px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translateX(-1px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .mb-ic i:nth-child(2){opacity:0;transform:scaleX(.2)}
.menu-btn[aria-expanded="true"] .mb-ic i:nth-child(3){top:10px;width:24px;height:4px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translateX(-1px) rotate(-45deg)}
@media (prefers-reduced-motion:no-preference){
  .menu-btn[aria-expanded="false"]:hover .mb-ic,.menu-btn[aria-expanded="false"]:focus-visible .mb-ic{animation:mbPlay .8s var(--ease)}
}
@keyframes mbPlay{0%,100%{transform:none}35%{transform:translateX(4px)}65%{transform:translateX(-1px)}}
.tl{position:absolute;left:0;right:0;bottom:-3px;height:3px;background:rgba(255,255,255,.1);opacity:0;transition:opacity .4s;pointer-events:none}
.hdr.is-scrolled .tl{opacity:1}
.tl-fill{position:absolute;inset:0;background:linear-gradient(90deg,var(--magenta),var(--rec));transform-origin:0 50%;transform:scaleX(0)}
.tl-dot{position:absolute;left:-6px;top:-4.5px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(254,44,85,.45)}
/* menú móvil: pantalla que se abre en círculo desde el botón */
.mnav{position:fixed;inset:0;z-index:990;overflow-y:auto;background:var(--estudio);padding:calc(var(--hdr) + 1.2rem) 0 2.5rem;visibility:hidden;clip-path:circle(0 at var(--mx,calc(100% - 4rem)) var(--my,2.4rem));transition:clip-path .6s var(--snap),visibility 0s .6s}
.mnav.open{visibility:visible;clip-path:circle(150% at var(--mx,calc(100% - 4rem)) var(--my,2.4rem));transition:clip-path .7s var(--snap)}
.mnav-list>li{border-bottom:1px solid rgba(255,255,255,.12)}
.mnav-list>li>a,.mnav-sub-btn{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;padding:.85rem 0;border:0;background:none;color:#fff;font:400 clamp(1.9rem,8vw,2.6rem)/1 var(--f-display);text-transform:uppercase;text-decoration:none;text-align:left;cursor:pointer}
.mnav-list>li>a span,.mnav-sub-btn span{font:600 .78rem/1 var(--f-body);letter-spacing:.12em;color:var(--cian);padding:.3rem .45rem;border:1.5px solid currentColor;border-radius:7px}
.mnav-sub-btn svg{width:18px;height:18px;fill:none;stroke:var(--cian);stroke-width:2.2;transition:transform .35s var(--ease)}
.mnav-sub-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.mnav-sub{display:grid;gap:.15rem;padding:0 0 1rem}
.mnav-sub a,.mnav-sub button{display:block;width:100%;padding:.55rem 0;border:0;background:none;color:var(--bruma);font-size:1.08rem;font-weight:500;text-align:left;text-decoration:none;cursor:pointer}
.mnav-sub a[aria-current]{color:var(--cian)}
.mnav-foot{display:grid;gap:.8rem;margin-top:1.8rem}
.mnav-foot .btn{width:100%;justify-content:flex-start}
.mnav-foot p{font-size:.88rem;color:var(--niebla)}
.menu-open{overflow:hidden}
@media (max-width:1240px){.handle{display:none}.brand-sep{display:none}}
@media (max-width:1100px){.nav,.hdr-live{display:none}.menu-btn{display:inline-flex}.handle{display:flex}.brand-sep{display:block}}
@media (max-width:560px){.handle,.brand-sep{display:none}.brand img{height:28px}.hdr-in{gap:.6rem}}

/* migas de pan */
.crumbs{margin-bottom:clamp(1.9rem,3vw,2.6rem)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .5rem;font-size:.84rem;color:var(--niebla)}
.crumbs li+li::before{content:"/";margin-right:.5rem;opacity:.6}
.crumbs a{color:#fff;text-decoration:underline;text-decoration-color:rgba(37,244,238,.6);text-underline-offset:.2em}
.crumbs [aria-current]{color:var(--bruma)}

/* ======= 8. HERO DEL INICIO (feed en vivo) ======= */
.hero,.phero{position:relative;isolation:isolate;overflow:hidden;background:var(--estudio)}
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:calc(var(--hdr) + 1.1rem) 0 2.6rem}
/* primer pantallazo: título, texto, los dos CTA y la calificación de Google tienen que verse sin bajar */
.hero .kicker{margin-bottom:.75rem}.hero .h1{margin-bottom:1.15rem}.hero .ctas{margin-top:1.25rem}
.hero .btn-love{min-height:58px}.hero .btn-love .hb{width:44px;height:44px}.hero .btn-story{min-height:58px}.hero .ring{width:52px;height:52px}.hero .ring-in{width:42px;height:42px}
.hero .g-pill{margin-top:.95rem}
.hero::before,.phero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px)}
.glow{position:absolute;z-index:-3;border-radius:50%;pointer-events:none;filter:blur(10px)}
.glow-a{width:70vmax;height:70vmax;right:-22vmax;top:-26vmax;background:radial-gradient(circle,rgba(10,134,199,.75),rgba(1,101,151,.25) 45%,transparent 68%)}
.glow-b{width:46vmax;height:46vmax;left:-18vmax;bottom:-24vmax;background:radial-gradient(circle,rgba(254,44,85,.26),transparent 64%)}
.glow-c{width:30vmax;height:30vmax;right:18%;bottom:-12vmax;background:radial-gradient(circle,rgba(37,244,238,.18),transparent 64%)}
@media (prefers-reduced-motion:no-preference){.glow-a{animation:drift 16s ease-in-out infinite alternate}.glow-b{animation:drift 19s ease-in-out infinite alternate-reverse}}
@keyframes drift{to{transform:translate3d(-4vmax,3vmax,0) scale(1.08)}}
.hero-word{position:absolute;right:-1vw;bottom:-3.5vw;z-index:-2;margin:0;font-family:var(--f-display);font-size:24vw;line-height:.8;text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(37,244,238,.13);white-space:nowrap;pointer-events:none;user-select:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,.68fr);gap:clamp(2rem,4.5vw,5rem);align-items:center}
.h1{font-size:clamp(3.6rem,8.3vw,8rem);line-height:.9;letter-spacing:.012em;margin:0 0 1.7rem}
.h1-2{display:inline-block;max-width:100%;margin-top:.1em;padding:.03em .16em .05em;background:var(--magenta);transform:rotate(-1.6deg);transform-origin:0 100%;box-shadow:.07em .07em 0 rgba(0,0,0,.25)}
.h1-2 .ab::after{color:var(--estudio)}
.fx .h1 .ab{animation:focusIn 1.15s var(--ease) .1s both}
.fx .h1 .ab::before{animation:abL 1.35s cubic-bezier(.2,.9,.2,1) .1s both}
.fx .h1 .ab::after{animation:abR 1.35s cubic-bezier(.2,.9,.2,1) .1s both}
.fx .h1 .h1-2{animation:stickIn .9s cubic-bezier(.3,1.4,.4,1) .45s both}
.fx .h1 .h1-2 .ab,.fx .h1 .h1-2 .ab::before,.fx .h1 .h1-2 .ab::after{animation-delay:.5s}
.h1.ab-done .ab,.h1.ab-done .ab::before,.h1.ab-done .ab::after,.h1.ab-done .h1-2{animation:none}
.h1.ab-done .ab.glitching::before{animation:jitL .26s steps(3) 1}
.h1.ab-done .ab.glitching::after{animation:jitR .26s steps(3) 1}
@keyframes focusIn{from{filter:blur(12px);opacity:.2}to{filter:blur(0);opacity:1}}
@keyframes abL{0%{transform:translate(-.24em,.03em);opacity:.95}62%{transform:translate(-.005em,0)}80%{transform:translate(-.06em,0)}100%{transform:translate(-.022em,0)}}
@keyframes abR{0%{transform:translate(.24em,-.03em);opacity:.95}62%{transform:translate(.005em,0)}80%{transform:translate(.06em,0)}100%{transform:translate(.022em,0)}}
@keyframes stickIn{from{transform:rotate(-9deg) scale(.6);opacity:0}to{transform:rotate(-1.6deg) scale(1);opacity:1}}
@keyframes jitL{0%{transform:translate(-.09em,.02em)}50%{transform:translate(.03em,-.02em)}100%{transform:translate(-.022em,0)}}
@keyframes jitR{0%{transform:translate(.09em,-.02em)}50%{transform:translate(-.03em,.02em)}100%{transform:translate(.022em,0)}}
.hero-lead{max-width:62ch;font-size:clamp(1.04rem,1.3vw,1.2rem);line-height:1.62;color:#D9E8F1}
.hero-lead strong{color:#fff}
/* calificación de Google bajo los CTA del hero (las cifras las actualiza resenas.js con el Worker) */
.g-pill{display:inline-flex;align-items:center;gap:.6rem;margin-top:1.1rem;color:#fff;font-size:.95rem;line-height:1.2;text-decoration:none}
.g-pill:hover .g-pill-t{color:#fff;text-decoration:underline;text-decoration-color:rgba(37,244,238,.6);text-underline-offset:.2em}
.g-pill:focus-visible{outline:2px solid var(--cian);outline-offset:4px;border-radius:4px}
.g-pill-g{display:block;flex:none;line-height:0}
.g-pill-g svg{width:22px;height:22px;display:block}
.g-pill .gs{position:relative;display:block;width:85px;height:16px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 17'%3E%3Cpath fill='%23DADCE0' d='M9 .9l2.5 5.3 5.8.7-4.3 4 1.1 5.7L9 13.7 3.9 16.6 5 10.9.7 6.9l5.8-.7z'/%3E%3C/svg%3E") 0 0/17px 16px repeat-x}
.g-pill .gs::after{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--n,5) * 17px);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 17'%3E%3Cpath fill='%23FBBC04' d='M9 .9l2.5 5.3 5.8.7-4.3 4 1.1 5.7L9 13.7 3.9 16.6 5 10.9.7 6.9l5.8-.7z'/%3E%3C/svg%3E") 0 0/17px 16px repeat-x}
.g-pill b{font-weight:700;font-variant-numeric:tabular-nums}
.g-pill-t{color:var(--bruma)}
.fx .hero .g-pill{animation:fadeUp 1.1s var(--ease) .98s both}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,auto));justify-content:start;margin-top:2rem;border-top:1px solid rgba(255,255,255,.14)}
.stat{padding:1.1rem 1.8rem 0 0;display:flex;flex-direction:column;gap:.3rem}
.stat+.stat{padding-left:1.8rem;border-left:1px solid rgba(255,255,255,.14)}
.stat b{font-family:var(--f-display);font-weight:400;font-size:clamp(1.9rem,2.7vw,2.7rem);line-height:1;letter-spacing:.01em;font-variant-numeric:tabular-nums;color:#fff;white-space:nowrap}
.stat b i{font-style:normal;color:var(--cian)}
.stat>span{font-size:.86rem;color:var(--niebla);line-height:1.35;max-width:21ch}
.fx .hero .kicker,.fx .hero .live-row,.fx .phero .live-row{animation:fadeUp 1s var(--ease) both}
.fx .hero .kicker{animation-delay:.2s}
.fx .hero-lead,.fx .hero .ctas,.fx .stats{animation:fadeUp 1.1s var(--ease) both}
.fx .hero-lead{animation-delay:.75s}.fx .hero .ctas{animation-delay:.9s}.fx .stats{animation-delay:1.05s}
.fx .phone-wrap{animation:phoneIn 1.4s var(--ease) .3s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}}
@keyframes phoneIn{from{opacity:0;transform:translateY(60px) rotate(4deg)}}
/* teléfono con feed vertical (componente .phone[data-feed]) */
.phone-wrap{position:relative;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:.9rem}
.phone{position:relative;width:clamp(258px,23.5vw,336px);aspect-ratio:9/18.7;padding:10px;border-radius:48px;background:linear-gradient(150deg,#123A57,#00111D 60%);box-shadow:0 0 0 1.5px rgba(255,255,255,.16),inset 0 0 0 1px rgba(255,255,255,.08),0 50px 90px -30px rgba(0,0,0,.7),0 0 140px -30px rgba(37,244,238,.45);transform:rotate(2.5deg)}
.phone::before{content:"";position:absolute;right:-3px;top:22%;width:3px;height:64px;border-radius:0 3px 3px 0;background:#1E4867}
.screen{position:relative;width:100%;height:100%;border-radius:38px;overflow:hidden;background:#000;isolation:isolate;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.island{position:absolute;top:9px;left:50%;z-index:6;width:32%;height:25px;border-radius:20px;background:#000;transform:translateX(-50%)}
.feed{position:absolute;inset:0;transition:transform .7s var(--snap);will-change:transform}
.clip{position:relative;height:100%;overflow:hidden}
.clip img{width:100%;height:100%;object-fit:cover}
.clip::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,0) 18%,rgba(0,0,0,0) 52%,rgba(0,0,0,.78) 100%);pointer-events:none}
.feed-top{position:absolute;top:44px;left:0;right:0;z-index:4;display:flex;justify-content:center;align-items:center;gap:1rem;font-size:.82rem;font-weight:600;color:rgba(255,255,255,.75);pointer-events:none}
.feed-top b{position:relative;color:#fff}
.feed-top b::after{content:"";position:absolute;left:25%;right:25%;bottom:-6px;height:2px;border-radius:2px;background:#fff}
.ft-live{position:absolute;left:14px;display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .45rem;border-radius:6px;background:rgba(0,0,0,.6);box-shadow:inset 0 0 0 1px var(--rec);color:#fff;font-size:.62rem;letter-spacing:.12em;font-weight:700}
.ft-live i{width:6px;height:6px;border-radius:50%;background:var(--rec)}
.rail{position:absolute;right:9px;bottom:20%;z-index:4;display:flex;flex-direction:column;align-items:center;gap:1rem;pointer-events:none}
.rail .r-av{position:relative;width:42px;height:42px;border-radius:50%;border:2px solid #fff;background:var(--pcd);display:grid;place-items:center}
.rail .r-av img{width:68%;height:auto}
.rail .r-av::after{content:"+";position:absolute;left:50%;bottom:-9px;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:var(--magenta);color:#fff;font:700 14px/18px var(--f-body);text-align:center}
.rail svg{width:30px;height:30px;fill:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}
.rail .r-disc{width:34px;height:34px;border-radius:50%;background:conic-gradient(#222,#555,#222,#555,#222);display:grid;place-items:center;box-shadow:0 0 0 6px rgba(0,0,0,.25)}
.rail .r-disc span{width:14px;height:14px;border-radius:50%;background:var(--pcd)}
@media (prefers-reduced-motion:no-preference){.rail .r-disc{animation:spin 4s linear infinite}}
.cap{position:absolute;left:12px;right:64px;bottom:22px;z-index:3;font-size:.8rem;line-height:1.35;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5);pointer-events:none}
.cap b{display:block;font-weight:700;font-size:.86rem;margin-bottom:.2rem}
.cap p{font-weight:500}
.cap .views,.cap .snd{display:flex;align-items:center;gap:.3rem;margin-top:.35rem;font-size:.72rem;font-weight:600;opacity:.92;white-space:nowrap;overflow:hidden}
.cap svg{width:12px;height:12px;fill:#fff;flex:none}
.feed-prog{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:5;background:rgba(255,255,255,.22);pointer-events:none}
.feed-prog i{position:absolute;inset:0;background:#fff;transform-origin:0 50%;transform:scaleX(0)}
.feed-prog i.run{animation:feedProg var(--fd,2.9s) linear forwards}
@keyframes feedProg{to{transform:scaleX(1)}}
.lh{position:absolute;right:16px;bottom:44%;z-index:5;width:24px;height:24px;pointer-events:none;color:var(--magenta);animation:lhUp 2.6s ease-out forwards}
.lh svg,.tap-heart svg{width:100%;height:100%;fill:currentColor}
@keyframes lhUp{0%{transform:translate(0,0) scale(.3);opacity:0}12%{opacity:1;transform:translate(calc(var(--dx) * .2),-22px) scale(1)}100%{transform:translate(var(--dx),-230px) scale(.85) rotate(var(--rot));opacity:0}}
.tap-heart{position:absolute;z-index:6;width:96px;height:96px;margin:-48px 0 0 -48px;color:var(--magenta);pointer-events:none;filter:drop-shadow(0 6px 16px rgba(0,0,0,.35))}
.float-chip{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem .55rem .55rem;border-radius:16px;background:rgba(1,47,74,.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 16px 30px -12px rgba(0,0,0,.5);font-size:.8rem;line-height:1.2;white-space:nowrap}
.float-chip i{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;flex:none;background:var(--c,var(--magenta))}
.float-chip i svg{width:16px;height:16px;fill:#fff}
.float-chip b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.15rem;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.fc-a{left:-4rem;top:56%}
.fc-b{right:-4.4rem;top:24%;--c:var(--senal)}
@media (prefers-reduced-motion:no-preference){.fc-a{animation:bob 5s ease-in-out infinite}.fc-b{animation:bob 6s ease-in-out .8s infinite reverse}}
@keyframes bob{50%{transform:translateY(-12px)}}
.phone-ctrl{display:flex;align-items:center;gap:.7rem}
.feed-toggle{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.4rem .9rem;border:0;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);color:#fff;font-size:.8rem;font-weight:600;cursor:pointer}
.feed-toggle svg{width:14px;height:14px;fill:#fff}
.feed-toggle .i-play,.feed-toggle[aria-pressed="true"] .i-pause{display:none}
.feed-toggle[aria-pressed="true"] .i-play{display:block}

/* ======= 9. HERO DE PÁGINA INTERNA (.phero) ======= */
.phero{padding:calc(var(--hdr) + 2rem) 0 clamp(3.5rem,7vw,6rem)}
.phero-grid>*{min-width:0}
.phero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(2rem,4.5vw,5rem);align-items:center}
.phero .h1{font-size:clamp(3rem,6.6vw,6.4rem);margin-bottom:1.4rem}
.phero .hero-word{font-size:19vw;bottom:-2.6vw}
.phero-media{position:relative;justify-self:center;width:100%}
.phero-media .shot{position:relative;margin:0;border-radius:28px;overflow:hidden;box-shadow:0 0 0 10px rgba(255,255,255,.06),0 40px 80px -30px rgba(0,0,0,.6)}
.phero-media .shot img{width:100%;height:100%;object-fit:cover}

/* ======= 10. CINTAS (marquesina que acelera con el scroll) ======= */
.tapes{position:relative;overflow:hidden;padding:3.4rem 0 3.8rem;background:var(--estudio)}
.tape{position:relative;width:114%;margin-left:-7%;box-shadow:0 16px 40px -18px rgba(0,0,0,.6)}
.tape--a{z-index:2;background:var(--cian);color:var(--estudio);transform:rotate(-1.8deg)}
.tape--b{z-index:1;margin-top:2.2rem;background:var(--magenta);color:#fff;transform:rotate(1.3deg)}
.tape-track{display:flex;width:max-content;will-change:transform}
.tape ul{display:flex;align-items:center;flex:none}
.tape li{display:flex;align-items:center;gap:1.1rem;padding:.72rem 0 .72rem 1.1rem;font-family:var(--f-display);font-size:clamp(1.6rem,2.9vw,2.6rem);line-height:1;text-transform:uppercase;white-space:nowrap}
/* (antes .o era contorno con currentColor sobre texto transparente: el trazo también salía transparente e invisible) */
.tape li .o{color:inherit}
.tape li svg{width:.62em;height:.62em;fill:currentColor;flex:none}
.tape-note{position:relative;z-index:3;margin:1.6rem auto 0;text-align:center;font-size:.82rem;color:var(--niebla)}

/* ======= 11. OBTURADOR (iris de cámara, .shut) ======= */
.shut{position:relative;background:var(--estudio);--cx:.507;--cy:.2}
.shut__stage{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;isolation:isolate;display:flex;align-items:flex-end}
.shut__word{position:absolute;left:0;top:47%;z-index:-4;margin:0;white-space:nowrap;font:400 clamp(8rem,25vw,25rem)/.8 var(--f-display);text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(37,244,238,.3);transform:translate3d(4vw,-50%,0);pointer-events:none;user-select:none}
.shut__photo{position:absolute;inset:0;z-index:-3}
.shut__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;transform-origin:calc(var(--cx) * 100%) calc(var(--cy) * 100%)}
.shut__shade{position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(0deg,rgba(1,47,74,.98) 0%,rgba(1,47,74,.93) 30%,rgba(1,47,74,.6) 46%,rgba(1,47,74,0) 64%),linear-gradient(90deg,rgba(1,47,74,.8) 0%,rgba(1,47,74,.35) 38%,rgba(1,47,74,0) 60%)}
.shut__iris{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:visible;display:none}
.shut__iris .blades{fill:none;stroke:var(--cian);stroke-width:1.2;opacity:.5;vector-effect:non-scaling-stroke}
.shut__iris .edge{fill:none;stroke:var(--cian);stroke-width:2;filter:drop-shadow(0 0 8px rgba(37,244,238,.85))}
.shut__iris .focus{fill:none;stroke:#fff;stroke-width:1.2;stroke-dasharray:2 11;opacity:.55}
.shut__iris .focus2{fill:none;stroke:var(--magenta);stroke-width:1;stroke-dasharray:1 5;opacity:.55}
.shut__hud{position:absolute;left:clamp(14px,2vw,28px);right:clamp(14px,2vw,28px);top:calc(var(--hdr) + 14px);bottom:clamp(14px,2vw,28px);z-index:0;pointer-events:none;font:600 .78rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.hud-c{position:absolute;width:34px;height:34px;border:2px solid rgba(255,255,255,.85)}
.hud-c.tl{left:0;top:0;border-right:0;border-bottom:0}.hud-c.tr{right:0;top:0;border-left:0;border-bottom:0}
.hud-c.bl{left:0;bottom:0;border-right:0;border-top:0}.hud-c.br{right:0;bottom:0;border-left:0;border-top:0}
.hud-rec{position:absolute;left:50px;top:10px;display:flex;align-items:center;gap:.55rem;font-variant-numeric:tabular-nums;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.hud-meta{position:absolute;right:50px;top:10px;display:flex;align-items:center;gap:.9rem;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.hud-bat{display:inline-flex;align-items:center;gap:2px}
.hud-bat span{display:block;width:30px;height:14px;border:1.6px solid #fff;border-radius:3px;padding:1.5px}
.hud-bat span i{display:block;height:100%;width:78%;background:var(--cian);border-radius:1px}
.hud-bat::after{content:"";width:3px;height:6px;border-radius:0 2px 2px 0;background:#fff}
.shut__copy{position:relative;z-index:1;width:100%;padding-top:calc(var(--hdr) + 3rem);padding-bottom:clamp(3.4rem,10vh,6rem)}
.shut__copy .h2{max-width:13ch;margin-top:.9rem}
.shut__fill{margin-top:1.3rem;max-width:30ch;font:400 clamp(1.6rem,3.1vw,3rem)/1.06 var(--f-display);text-transform:uppercase;color:#fff}
.shut__fill .fw{transition:color .45s var(--ease),text-shadow .45s}
.shut__fill .hl .fw{color:var(--cian)}
.shut__note{margin-top:1.1rem;font-size:.86rem;color:var(--niebla)}
.shut--vivo .shut__pin{height:290vh}
.shut--vivo .shut__stage{position:sticky;top:0;height:100vh;height:100svh}
.shut--vivo .shut__photo{clip-path:circle(16vmin at calc(var(--cx) * 100%) calc(var(--cy) * 100%))}
.shut--vivo .shut__photo img{transform:scale(1.22);filter:blur(6px)}
.shut--vivo .shut__shade{opacity:0}
.shut--vivo .shut__iris{display:block}
.shut--vivo .shut__fill .fw{color:rgba(255,255,255,.24)}
.shut--vivo .shut__fill .fw.lit{color:#fff}
.shut--vivo .shut__fill .hl .fw.lit{color:var(--cian);text-shadow:0 0 30px rgba(37,244,238,.55)}

/* ======= 12. EPISODIOS (tira horizontal anclada, .pl) ======= */
.pl{position:relative;background:var(--pcd);color:#fff;--muted:var(--bruma)}
.pl-pin{padding-block:var(--sec) calc(var(--sec) - 1rem)}
.pl-intro{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);margin-bottom:2.4rem}
.pl-intro .head{margin-bottom:1.2rem}
.pl-intro .h2{max-width:11ch}
.pl-hint{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.4rem;font-size:.86rem;font-weight:600}
.pl-hint svg{width:20px;height:20px;fill:none;stroke:var(--cian);stroke-width:2}
.pl-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut) 1.2rem;scroll-padding-inline:var(--gut);scrollbar-width:none}
.pl-track::-webkit-scrollbar{display:none}
.ep,.ep-end{position:relative;flex:0 0 min(72vw,330px);aspect-ratio:9/16;scroll-snap-align:start;border-radius:22px;overflow:hidden}
.ep{display:block;isolation:isolate;background:var(--estudio);color:#fff;text-decoration:none;box-shadow:0 26px 50px -24px rgba(0,0,0,.6);transition:transform .5s var(--ease)}
.ep-media{position:absolute;inset:0;z-index:-2}
.ep-media img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ep::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(1,27,46,.55) 0%,rgba(1,27,46,0) 22%,rgba(1,27,46,.1) 45%,rgba(1,27,46,.92) 76%,#001B2E 100%)}
.ep-art{position:absolute;inset:0;z-index:-2;display:grid;place-items:start center;padding-top:16%;background:radial-gradient(circle at 50% 30%,rgba(37,244,238,.32),transparent 52%),radial-gradient(rgba(255,255,255,.14) 1.2px,transparent 1.6px) 0 0/12px 12px,linear-gradient(165deg,var(--g1,var(--senal)),var(--g2,var(--estudio)) 72%)}
.ep-art svg{width:72%;height:auto;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:4.5}
.ep-art .l-c{stroke:var(--cian);transform:translate(-4px,1px);opacity:.9}
.ep-art .l-m{stroke:var(--magenta);transform:translate(4px,-1px);opacity:.9}
.ep-art .l-w{stroke:#fff}
.ep-art--chinche{--g1:#0F7C86;--g2:#012F4A}.ep-art--cucaracha{--g1:#8A5A12;--g2:#012F4A}.ep-art--rata{--g1:#0A86C7;--g2:#012F4A}.ep-art--termita{--g1:#8A1F43;--g2:#012F4A}.ep-art--garrapata{--g1:#016597;--g2:#001B2E}.ep-art--alacran{--g1:#3A2A6B;--g2:#012F4A}
.ep-top{position:absolute;left:12px;right:12px;top:12px;display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.ep-n,.ep-dur{display:inline-flex;align-items:center;gap:.3rem;padding:.32rem .55rem;border-radius:8px;background:rgba(0,17,29,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.ep-dur svg{width:10px;height:10px;fill:#fff}
.ep-body{position:absolute;left:0;right:0;bottom:0;padding:0 16px 22px;display:flex;flex-direction:column;gap:.55rem}
.ep-views{align-self:flex-start;display:inline-flex;align-items:center;gap:.4rem;padding:.38rem .65rem;border-radius:999px;background:var(--cian);color:var(--estudio);font-size:.76rem;font-weight:700;line-height:1}
.ep-views svg{width:11px;height:11px;fill:var(--estudio)}
.ep-tag{font-size:.82rem;font-weight:600;color:var(--cian);letter-spacing:.02em}
.ep-title{font-size:clamp(1.65rem,2.1vw,2.15rem);line-height:.98;text-shadow:0 3px 0 rgba(0,0,0,.28)}
.ep-title span{color:var(--cian)}
.ep-cta{display:inline-flex;align-items:center;gap:.45rem;margin-top:.3rem;font-size:.86rem;font-weight:700}
.ep-cta svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .4s var(--ease)}
.ep-prog{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.18)}
.ep-prog i{position:absolute;inset:0;background:linear-gradient(90deg,var(--magenta),var(--cian));transform-origin:0 50%;transform:scaleX(.08);transition:transform .5s var(--ease)}
.ep:hover,.ep:focus-visible{transform:translateY(-6px)}
.ep:hover .ep-media img,.ep:focus-visible .ep-media img{transform:scale(1.06)}
.ep:hover .ep-cta svg{transform:translateX(4px)}
@media (prefers-reduced-motion:no-preference){.ep:hover .ep-prog i,.ep:focus-visible .ep-prog i,.ep.is-live .ep-prog i{transform:scaleX(1);transition:transform 3.2s linear}.ep:hover .ep-art svg,.ep.is-live .ep-art svg{animation:wiggle 1.4s ease-in-out infinite}}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg) translateY(-3px)}75%{transform:rotate(4deg) translateY(2px)}}
.ep-end{display:flex;flex-direction:column;justify-content:flex-end;gap:1rem;padding:1.6rem;background:var(--estudio);box-shadow:inset 0 0 0 2px rgba(37,244,238,.4)}
.ep-end h3{font-size:clamp(2.2rem,3vw,3rem)}
.ep-end h3 span{color:var(--cian)}
.ep-end p{color:var(--niebla);font-size:.98rem}
.ep-end ul{display:flex;flex-wrap:wrap;gap:.45rem}
.ep-end li{padding:.35rem .7rem;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font-size:.86rem;font-weight:600}
.ep-end .btn-love{align-self:stretch;justify-content:flex-start}
.pl-hud{display:none}
.pl.is-pin .pl-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hdr) + .6rem) 0 4.2rem}
.pl.is-pin .pl-rail{display:flex;align-items:center;gap:clamp(1.6rem,2.4vw,2.4rem);width:max-content;padding-inline:max(var(--gut),calc((100vw - var(--wrap)) / 2 + var(--gut)));will-change:transform}
.pl.is-pin .pl-intro{flex:0 0 min(31vw,440px);width:auto;max-width:none;margin:0;padding:0}
.pl.is-pin .pl-track{overflow:visible;scroll-snap-type:none;padding:0;gap:clamp(1.2rem,1.8vw,1.8rem)}
.pl.is-pin .ep,.pl.is-pin .ep-end{flex:0 0 auto;height:min(calc(100vh - var(--hdr) - 6.6rem),640px);width:auto}
.pl.is-pin .pl-hint{display:none}
.pl.is-pin .pl-hud{position:absolute;left:0;right:0;bottom:1.5rem;display:block}
/* celular (.is-pin-m, lo pone main.js): la fila de episodios se queda fija bajo el header y el scroll la recorre.
   El ::after del riel es el recorrido: mide lo mismo que la fila tiene de ancho de sobra (--pl-dist). */
.pl.is-pin-m .pl-rail::after{content:"";display:block;height:var(--pl-dist,0px)}
.pl.is-pin-m .pl-track{position:sticky;top:calc(var(--hdr) + 1rem);overflow-x:hidden;scroll-snap-type:none;touch-action:pan-y;padding-bottom:1rem}
.pl.is-pin-m .ep,.pl.is-pin-m .ep-end{flex:0 0 auto;width:auto;height:min(calc(100vh - var(--hdr) - 4.5rem),calc(72vw * 16 / 9),587px);height:min(calc(100svh - var(--hdr) - 4.5rem),calc(72vw * 16 / 9),587px)}
.pl.is-pin-m .pl-hint{display:none}
.pl-hud .container{display:flex;align-items:center;gap:1.2rem;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.pl-hud b{font-variant-numeric:tabular-nums;color:var(--cian);min-width:6.5ch}
.pl-bar{position:relative;flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.2);overflow:hidden}
.pl-bar i{position:absolute;inset:0;background:linear-gradient(90deg,var(--magenta),var(--cian));transform-origin:0 50%;transform:scaleX(0)}

/* ======= 13. RESPUESTA DIRECTA · PROSA · TARJETAS · LISTAS ======= */
.answer{position:relative;max-width:74ch;padding:1.3rem 1.5rem 1.4rem 1.6rem;border-radius:6px 22px 22px 6px;background:var(--ans-bg,rgba(255,255,255,.07));box-shadow:inset 4px 0 0 var(--ans,var(--cian));font-size:clamp(1.05rem,1.25vw,1.18rem);line-height:1.6}
.answer>b:first-child{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:.45rem;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ans-k,var(--cian))}
.answer>b:first-child::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--rec)}
.answer p+p{margin-top:.7rem}
.s-light .answer,.s-hielo .answer{--ans:var(--magenta);--ans-k:var(--pcd);--ans-bg:var(--hielo)}
.s-hielo .answer{--ans-bg:#fff}
.prose{max-width:70ch;font-size:1.06rem;line-height:1.7;color:var(--muted)}
.prose>*+*{margin-top:1rem}
.prose h3{margin-top:2rem;font-size:clamp(1.6rem,2.3vw,2.2rem);color:var(--h3c,#fff)}
.s-light .prose h3,.s-hielo .prose h3{--h3c:var(--estudio)}
.prose strong{color:var(--ink,inherit)}
.s-estudio .prose strong,.s-pcd .prose strong,.s-night .prose strong{--ink:#fff}
.s-light .prose strong,.s-hielo .prose strong{--ink:var(--estudio)}
.prose a{color:inherit;font-weight:600;text-decoration:underline;text-decoration-color:var(--lc,var(--cian));text-decoration-thickness:2px;text-underline-offset:.2em}
.s-light .prose a,.s-hielo .prose a{--lc:var(--magenta)}
.prose ul{display:grid;gap:.55rem}
.prose ul li{position:relative;padding-left:1.4rem}
.prose ul li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--lc,var(--cian))}
.prose ol{counter-reset:p;display:grid;gap:.7rem}
.prose ol li{counter-increment:p;position:relative;padding-left:2.4rem}
.prose ol li::before{content:counter(p,decimal-leading-zero);position:absolute;left:0;top:0;font:400 1.3rem/1.3 var(--f-display);color:var(--lc,var(--cian))}
@media (min-width:1024px){.cols-2{columns:2;column-gap:clamp(2.5rem,5vw,4.5rem);max-width:none}.cols-2>*{break-inside:auto}.cols-2 h3,.cols-2 .span{column-span:all}.cols-2 li,.cols-2 .answer,.cols-2 .note{break-inside:avoid}.cols-2 p{orphans:2;widows:2}}
.grid-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.note{padding:1rem 1.2rem;border-radius:16px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font-size:.98rem;color:var(--muted)}
.s-light .note,.s-hielo .note{background:var(--hielo);box-shadow:inset 0 0 0 1px rgba(1,47,74,.1)}
.s-hielo .note{background:#fff}
.checks{display:grid;gap:.6rem}
.checks li{display:flex;gap:.65rem;align-items:flex-start;font-weight:500}
.checks svg{width:22px;height:22px;flex:none;margin-top:.1rem;fill:none;stroke:var(--chk,var(--cian));stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.s-light .checks,.s-hielo .checks{--chk:var(--magenta)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1rem}
.card{position:relative;display:flex;flex-direction:column;gap:.6rem;padding:1.4rem 1.4rem 1.5rem;border-radius:22px;background:rgba(0,27,46,.32);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:transform .45s var(--ease),background-color .3s}
.s-estudio .card,.s-night .card{background:rgba(255,255,255,.05)}
.s-light .card{background:var(--hielo);box-shadow:inset 0 0 0 1px rgba(1,47,74,.08)}
.s-hielo .card{background:#fff;box-shadow:0 20px 40px -30px rgba(1,47,74,.5)}
.card h3{font-size:clamp(1.45rem,2vw,1.8rem)}
.card p{font-size:.97rem;line-height:1.55;color:var(--muted)}
.card>svg{width:38px;height:38px;fill:none;stroke:var(--chk,var(--cian));stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.s-light .card>svg,.s-hielo .card>svg{--chk:var(--pcd)}
a.card{text-decoration:none;color:inherit}
a.card:hover{transform:translateY(-4px)}
.tabla{width:100%;border-collapse:collapse;font-size:.97rem}
.tabla th,.tabla td{padding:.8rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid rgba(128,160,180,.3)}
.tabla th{font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--eb,var(--cian))}
.s-light .tabla th,.s-hielo .tabla th{--eb:var(--pcd)}
.tabla-wrap{overflow-x:auto}
/* plagas relacionadas ({{PLAGAS_RELACIONADAS}}) */
.rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1rem}
.rel a{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 22px;gap:1rem;align-items:center;padding:.9rem 1.1rem .9rem .9rem;border-radius:20px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);color:inherit;text-decoration:none;transition:transform .45s var(--ease),background-color .3s}
.rel a:hover{transform:translateY(-3px);background:rgba(255,255,255,.1)}
.rel .rel-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:linear-gradient(165deg,var(--senal),var(--estudio))}
.rel .rel-ic svg{width:46px;height:46px;fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.rel b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.35rem;line-height:1;text-transform:uppercase}
.rel small{display:block;margin-top:.3rem;font-size:.86rem;color:var(--muted)}
.rel a>svg{width:22px;height:22px;fill:none;stroke:var(--cian);stroke-width:2}
.s-light .rel a,.s-hielo .rel a{background:var(--hielo);box-shadow:inset 0 0 0 1px rgba(1,47,74,.1)}
.s-hielo .rel a{background:#fff}
.s-light .rel a>svg,.s-hielo .rel a>svg{stroke:var(--magenta)}

/* ======= 14. PRECIOS · COTIZADOR ======= */
.price-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(2rem,4vw,4.5rem);align-items:end;margin-bottom:clamp(2rem,4vw,3rem)}
.price-top .head{margin-bottom:0}
.price-top .h2{max-width:13ch}
.factors{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem;margin-bottom:clamp(2.4rem,4vw,3.4rem)}
.factor{position:relative;display:flex;flex-direction:column;gap:.45rem;padding:1.2rem 1.2rem 1.3rem;border-radius:20px;background:var(--estudio);color:#fff;overflow:hidden}
.factor b{font-family:var(--f-display);font-weight:400;font-size:2.4rem;line-height:.9;color:var(--cian)}
.factor h3{font:600 1.04rem/1.25 var(--f-body);text-transform:none;letter-spacing:0}
.factor p{font-size:.9rem;line-height:1.45;color:var(--niebla)}
.factor:nth-child(even){background:var(--pcd)}
.factor:nth-child(even) p{color:var(--bruma)}
.price-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(2rem,4vw,4rem);align-items:start}
.polls{display:grid;gap:1.1rem}
.poll{margin:0;padding:1.3rem 1.4rem 1.4rem;border:0;border-radius:24px;background:var(--hielo);box-shadow:inset 0 0 0 1px rgba(1,47,74,.08)}
.poll legend{float:left;width:100%;display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .75rem;margin-bottom:.95rem;padding:0;font-family:var(--f-display);font-size:clamp(1.5rem,2vw,1.85rem);line-height:1;text-transform:uppercase;color:var(--estudio)}
.poll legend b{font-weight:400;color:var(--magenta)}
.poll legend small{font-family:var(--f-body);font-size:.85rem;font-weight:500;color:var(--gris);text-transform:none;letter-spacing:0}
.opts{clear:both;display:flex;flex-wrap:wrap;gap:.55rem}
.opt{position:relative}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt span{display:inline-flex;align-items:center;gap:.45rem;min-height:46px;padding:.55rem 1.05rem;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(1,47,74,.18);font-size:.95rem;font-weight:600;color:var(--estudio);cursor:pointer;transition:background-color .25s,color .25s,box-shadow .25s,transform .3s var(--ease)}
.opt span:hover{box-shadow:inset 0 0 0 1.5px var(--pcd);transform:translateY(-1px)}
.opt input:checked+span{background:var(--estudio);color:#fff;box-shadow:inset 0 0 0 1.5px var(--estudio)}
.opt input:checked+span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cian)}
.opt input:focus-visible+span{outline:3px solid var(--pcd);outline-offset:3px}
.quote{position:sticky;top:calc(var(--hdr) + 1.5rem);display:flex;flex-direction:column;gap:1.1rem;padding:1.6rem;border-radius:28px;background:var(--estudio);color:#fff}
.quote h3{font-size:clamp(1.8rem,2.6vw,2.4rem)}
.quote h3 em{font-style:normal;color:var(--cian)}
.wa-bubble{position:relative;padding:.9rem 1rem 1.6rem;border-radius:16px 16px 4px 16px;background:#DCF8C6;color:#0B2B1A;font-size:.96rem;line-height:1.45;min-height:5.4rem;white-space:pre-line}
.wa-bubble small{position:absolute;right:.8rem;bottom:.45rem;font-size:.7rem;color:#2F5C44;display:inline-flex;align-items:center;gap:.25rem}
.wa-bubble small svg{width:16px;height:12px;fill:none;stroke:#2E8BC0;stroke-width:2}
.quote-note{font-size:.9rem;color:var(--niebla)}
.quote .btn-love{justify-content:flex-start}
.pull{margin-bottom:1.4rem;padding-left:1rem;border-left:4px solid var(--pl,var(--cian));font:400 clamp(1.7rem,2.6vw,2.4rem)/1.05 var(--f-display);text-transform:uppercase;max-width:22ch}
.pull small{display:block;margin-top:.6rem;font:600 .8rem/1.3 var(--f-body);letter-spacing:.12em;color:var(--muted)}
.s-light .pull,.s-hielo .pull{--pl:var(--magenta)}
.price-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,5rem);align-items:start;margin-top:clamp(3.4rem,6vw,5rem)}
.price-faq .sheet{box-shadow:0 0 0 1px rgba(1,47,74,.1),0 40px 70px -40px rgba(1,47,74,.5)}

/* ======= 15. EMPRESAS (post de colaboración PCD) ======= */
.biz-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2.5rem,5vw,5.5rem);align-items:start}
.collab{display:inline-flex;align-items:center;gap:.55rem;align-self:flex-start;padding:.38rem .75rem .38rem .45rem;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px rgba(1,101,151,.25);font-size:.78rem;font-weight:600;letter-spacing:.06em;color:var(--pcd)}
.collab img{width:22px;height:22px}
.iso{display:flex;align-items:center;gap:1.1rem;margin:2rem 0 2.2rem;padding:1.2rem 1.4rem;border-radius:20px;background:var(--estudio);color:#fff}
.iso-badge{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:var(--cian);color:var(--estudio);flex:none}
.iso-badge svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.iso b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.45rem;letter-spacing:.02em;text-transform:uppercase;line-height:1.05}
.iso div span{font-size:.92rem;color:var(--niebla)}
.biz-tiles{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.tile{display:flex;flex-direction:column;gap:.55rem;padding:1.3rem 1.3rem 1.4rem;border-radius:20px;background:#fff;box-shadow:0 18px 40px -30px rgba(1,47,74,.6);transition:transform .45s var(--ease)}
.tile svg{width:36px;height:36px;fill:none;stroke:var(--pcd);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tile h3{font-size:1.55rem;color:var(--estudio)}
.tile p{font-size:.94rem;color:var(--gris);line-height:1.5}
.tile:hover{transform:translateY(-4px)}
.post-stage{position:relative;padding:2.2rem 0 0}
.post-wrap{position:relative;padding:0 0 3rem}
.post{position:relative;z-index:1;border-radius:26px;background:#fff;color:var(--estudio);box-shadow:0 0 0 1px rgba(1,47,74,.1),0 40px 70px -34px rgba(1,47,74,.45);overflow:hidden}
.post-h{display:flex;align-items:center;gap:.75rem;padding:.95rem 1.1rem}
.post-av{width:44px;height:44px;border-radius:50%;padding:2.5px;background:conic-gradient(var(--cian),var(--magenta),var(--pcd),var(--cian));flex:none}
.post-av span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff}
.post-av img{width:72%;height:auto}
.post-h b{display:block;font-weight:700;font-size:.98rem;line-height:1.2}
.post-h small{display:block;font-size:.8rem;color:var(--gris)}
.post-tag{margin-left:auto;padding:.3rem .6rem;border-radius:8px;background:var(--estudio);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.post-media{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden}
.post-media img{width:100%;height:100%;object-fit:cover}
.post-media figcaption{position:absolute;left:.9rem;bottom:.9rem;padding:.35rem .7rem;border-radius:8px;background:rgba(1,47,74,.82);color:#fff;font-size:.8rem;font-weight:600}
.post-act{display:flex;gap:1rem;padding:.9rem 1.1rem .4rem}
.post-act svg{width:26px;height:26px;fill:none;stroke:var(--estudio);stroke-width:1.8;stroke-linejoin:round}
.post-act .pa-save{margin-left:auto}
.post-feats{display:grid;gap:.5rem;padding:.4rem 1.1rem 1.3rem}
.post-feats li{display:flex;align-items:center;gap:.6rem;font-size:.95rem;font-weight:500}
.post-feats svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--magenta);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.cert{position:absolute;z-index:2;right:-1.2rem;bottom:0;width:min(260px,62%);padding:1.1rem 1.1rem 1.2rem;border-radius:16px;background:#fff;color:var(--estudio);box-shadow:0 0 0 1px rgba(1,47,74,.12),0 30px 50px -20px rgba(1,47,74,.5);transform:rotate(3.5deg)}
.cert-k{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pcd)}
.cert-k img{width:64px;height:auto}
.cert b{display:block;margin:.55rem 0 .7rem;font:400 1.45rem/1 var(--f-display);text-transform:uppercase}
.cert i{display:block;height:7px;border-radius:4px;background:#E2EEF5;margin-top:.45rem}
.cert i:nth-of-type(2){width:82%}.cert i:nth-of-type(3){width:64%}
.cert-ok{display:flex;align-items:center;gap:.45rem;margin-top:.85rem;font-size:.8rem;font-weight:700}
.cert-ok svg{width:18px;height:18px;fill:none;stroke:var(--magenta);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.polaroid{position:absolute;z-index:2;left:-2.6rem;top:44%;width:min(200px,40%);margin:0;padding:.55rem .55rem .9rem;border-radius:10px;background:#fff;box-shadow:0 0 0 1px rgba(1,47,74,.1),0 24px 40px -20px rgba(1,47,74,.45);transform:rotate(-5deg)}
.polaroid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
.polaroid figcaption{display:block;margin-top:.5rem;font-size:.78rem;font-weight:600;text-align:center;color:var(--gris)}

/* ======= 16. ASÍ TRABAJO (tarjetas que se apilan + historias) ======= */
.how-stack{position:relative;display:grid;gap:clamp(1.4rem,3vh,2.2rem);padding-bottom:1rem}
.how-card{position:sticky;top:calc(var(--hdr) + 18px + var(--i) * 22px)}
.how-in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.62fr);grid-template-areas:"txt story";gap:clamp(1.6rem,4vw,4rem);align-items:center;min-height:min(70vh,600px);padding:clamp(1.6rem,3.6vw,3.4rem);border-radius:34px;background:var(--bg);color:var(--fg);box-shadow:0 -24px 60px -28px rgba(0,0,0,.6);transform-origin:50% 0;overflow:hidden}
.how-dim{position:absolute;inset:0;border-radius:inherit;background:#00111D;opacity:0;pointer-events:none;z-index:3}
.how-txt{grid-area:txt;display:flex;flex-direction:column;gap:1rem;position:relative;z-index:1}
.how-num{display:flex;align-items:baseline;gap:.9rem;font-family:var(--f-display);line-height:.8}
.how-num b{font-weight:400;font-size:clamp(4.6rem,10vw,9.5rem);color:var(--acc)}
.how-num span{font-size:clamp(1rem,1.4vw,1.25rem);letter-spacing:.14em;text-transform:uppercase}
.how-in h3{font-size:clamp(2.6rem,5.2vw,5rem)}
.how-in p{max-width:46ch;font-size:clamp(1.02rem,1.2vw,1.15rem);line-height:1.6;color:var(--fg2)}
.how-in .explain{display:flex;gap:.75rem;align-items:flex-start;align-self:flex-start;max-width:46ch;margin-top:.5rem;padding:.95rem 1.15rem;border-radius:20px 20px 20px 6px;background:var(--bub);color:var(--bubfg)}
.how-in .explain svg{width:22px;height:22px;flex:none;margin-top:2px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.how-in .explain b{display:block;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:.15rem}
.how-in .explain span{font-size:.98rem;line-height:1.45;font-weight:500}
.c1{--bg:var(--pcd);--fg:#fff;--fg2:var(--bruma);--acc:var(--cian);--bub:#fff;--bubfg:var(--estudio)}
.c2{--bg:#fff;--fg:var(--estudio);--fg2:var(--gris);--acc:var(--magenta);--bub:var(--estudio);--bubfg:#fff}
.c3{--bg:#00223A;--fg:#fff;--fg2:var(--niebla);--acc:var(--cian);--bub:var(--cian);--bubfg:var(--estudio)}
.c4{--bg:var(--cian);--fg:var(--estudio);--fg2:#0E3F5E;--acc:var(--estudio);--bub:var(--estudio);--bubfg:#fff}
.c3 .how-in{box-shadow:0 -24px 60px -28px rgba(0,0,0,.6),inset 0 0 0 1.5px rgba(37,244,238,.35)}
.story{grid-area:story;position:relative;justify-self:center;width:min(100%,290px);aspect-ratio:9/16;border-radius:28px;overflow:hidden;background:var(--sbg,#001B2E);box-shadow:0 0 0 8px rgba(0,0,0,.18),0 30px 50px -24px rgba(0,0,0,.55);color:#fff}
.c2 .story,.c4 .story{--sbg:var(--estudio)}
.segs{position:absolute;left:12px;right:12px;top:12px;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.segs i{position:relative;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.segs i::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:0 50%;transform:scaleX(0)}
.segs i.done::after{transform:scaleX(1)}
.story.is-on .segs i.now::after{transform:scaleX(1);transition:transform 3.4s linear}
.st-user{position:absolute;left:12px;top:26px;z-index:3;display:flex;align-items:center;gap:.45rem;font-size:.74rem;font-weight:600}
.st-user span{width:26px;height:26px;border-radius:50%;background:var(--pcd);display:grid;place-items:center;box-shadow:0 0 0 1.5px #fff}
.st-user img{width:70%;height:auto}
.st-art{position:absolute;inset:0;display:grid;place-items:center;padding:3.5rem 1.4rem 5.5rem}
.st-art svg{width:72%;height:auto;overflow:visible;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.st-art .ac{stroke:var(--cian)}.st-art .am{stroke:var(--magenta)}
.st-photo{position:absolute;inset:0}
.st-photo img{width:100%;height:100%;object-fit:cover}
.st-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 55%,rgba(0,17,29,.85))}
.how-in .st-cap{max-width:none;position:absolute;left:12px;right:12px;bottom:14px;z-index:3;padding:.6rem .8rem;border-radius:14px;background:rgba(255,255,255,.95);color:var(--estudio);font-size:.8rem;font-weight:600;line-height:1.35;text-align:center}
@media (prefers-reduced-motion:no-preference){
  .story.is-on .ic-scan{animation:scan 3.2s ease-in-out infinite}
  .story.is-on .ic-tick{stroke-dasharray:16;stroke-dashoffset:16;animation:tick 3.6s var(--ease) infinite}
  .story.is-on .ic-tick.t2{animation-delay:.4s}.story.is-on .ic-tick.t3{animation-delay:.8s}
  .story.is-on .ic-chk{stroke-dasharray:40;stroke-dashoffset:40;animation:chk 3.4s var(--ease) infinite}
  .st-art svg *{transform-box:fill-box}
}
@keyframes scan{0%,100%{transform:translate(0,0)}25%{transform:translate(14px,6px)}50%{transform:translate(6px,16px)}75%{transform:translate(-8px,6px)}}
@keyframes tick{0%,10%{stroke-dashoffset:16}35%,100%{stroke-dashoffset:0}}
@keyframes chk{0%,15%{stroke-dashoffset:40}45%,100%{stroke-dashoffset:0}}

/* ======= 17. QUIÉN SOY + MEDIOS ======= */
.me-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2.4rem,5vw,5.5rem);align-items:center}
.me-photo{position:relative;margin:0;aspect-ratio:3/4;border-radius:30px;overflow:hidden;box-shadow:0 0 0 10px rgba(255,255,255,.08),0 40px 80px -30px rgba(0,0,0,.6)}
.me-photo img{width:100%;height:100%;object-fit:cover;object-position:40% 30%}
.me-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0) 22%,rgba(0,0,0,0) 62%,rgba(1,47,74,.85));pointer-events:none}
.me-photo .segs,.me-photo .st-user,.me-photo figcaption{z-index:2}
.me-photo .segs i:first-child::after{transform:scaleX(1)}
.me-photo .st-user{top:28px}
.me-photo figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;display:flex;flex-wrap:wrap;gap:.5rem}
.me-photo figcaption span{padding:.4rem .75rem;border-radius:999px;background:rgba(255,255,255,.95);color:var(--estudio);font-size:.8rem;font-weight:700}
.me-photo figcaption span:last-child{background:var(--cian)}
.prof{display:flex;align-items:center;gap:1.3rem;margin-bottom:1.6rem}
.prof-av{position:relative;width:104px;height:104px;border-radius:50%;padding:4px;background:conic-gradient(var(--cian),var(--magenta),#fff,var(--cian));flex:none}
.prof-av img{width:100%;height:100%;border-radius:50%;border:3px solid var(--pcd);object-fit:cover}
.prof-av::after{content:"";position:absolute;right:6px;bottom:6px;width:20px;height:20px;border-radius:50%;background:var(--rec);box-shadow:0 0 0 3px var(--pcd)}
.prof h3{font-size:clamp(2.2rem,3.4vw,3.2rem)}
.prof p{font-size:.95rem;color:var(--bruma);margin-top:.35rem}
.prof p b{color:#fff;font-weight:600}
.me-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:1.8rem 0;border-block:1px solid rgba(255,255,255,.2)}
.me-stats li{padding:1rem 1rem 1.1rem 0}
.me-stats li+li{padding-left:1.2rem;border-left:1px solid rgba(255,255,255,.2)}
.me-stats b{display:block;font-family:var(--f-display);font-weight:400;font-size:clamp(1.8rem,3vw,2.8rem);line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.me-stats li>span{font-size:.86rem;color:var(--bruma)}
.me-bio{display:grid;gap:1rem;max-width:58ch;font-size:1.06rem;color:var(--bruma)}
.me-bio strong{color:#fff}
.me-quote{margin-top:1.5rem;padding-left:1rem;border-left:4px solid var(--cian);font-family:var(--f-display);font-size:clamp(1.4rem,2vw,1.85rem);line-height:1.08;text-transform:uppercase;max-width:28ch}
.me-quote em{font-style:normal;color:var(--cian)}
.me-links{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.follow{display:inline-flex;align-items:center;gap:.55rem;min-height:48px;padding:.6rem 1.1rem;border-radius:12px;background:#fff;color:var(--estudio);font-weight:700;font-size:.92rem;text-decoration:none;transition:transform .35s var(--ease)}
.follow:hover{transform:translateY(-2px)}
.follow svg{width:18px;height:18px;fill:var(--magenta)}
.follow--ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55)}
.follow--ghost svg{fill:var(--cian)}
.media{margin-top:clamp(4.5rem,8vw,7rem)}
.media-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.4rem;margin-bottom:clamp(2rem,4vw,3rem)}
.media-top .head{margin-bottom:0}
.media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}
.mcard{display:flex;flex-direction:column;gap:.7rem;padding:1.4rem 1.4rem 1.5rem;border-radius:24px;background:rgba(0,27,46,.32);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:transform .45s var(--ease),background-color .3s}
.mcard:hover{transform:translateY(-4px);background:rgba(0,27,46,.5)}
.mc-top{display:flex;align-items:center;gap:.85rem}
.hl-ring{width:62px;height:62px;border-radius:50%;padding:3px;background:conic-gradient(var(--cian),var(--magenta),#fff,var(--cian));flex:none}
.hl-ring span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--estudio);font-family:var(--f-display);font-size:1.05rem;letter-spacing:.03em;line-height:.9;text-align:center;color:#fff;border:3px solid var(--pcd)}
.mc-top small{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cian)}
.mc-top h3{font-size:1.5rem;line-height:1}
.mcard p{font-size:.96rem;color:var(--bruma);line-height:1.5}
.mcard .mc-num{margin-top:auto;padding-top:.6rem;font:400 2rem/1 var(--f-display);font-variant-numeric:tabular-nums;color:#fff}
.mc-num small{font-family:var(--f-body);font-size:.82rem;color:var(--bruma);margin-left:.35rem;text-transform:none}

/* ======= 18. TELÓN (marco que se abre, .marco) ======= */
:where(.marco){--mc-bg:#012F4A;--mc-bg-rgb:1,47,74;--mc-texto:#fff;--mc-texto-2:#D9E8F1;--mc-palabra:rgba(255,255,255,.8);--mc-encabezado:76px;--mc-iy:24;--mc-ix:18}
@media (max-width:900px){:where(.marco){--mc-iy:21;--mc-ix:9;--mc-encabezado:64px}}
.marco{position:relative;background:var(--mc-bg);color:var(--mc-texto)}
.marco__stage{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;isolation:isolate;overflow:hidden}
.marco__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.marco__media .mc-bg{position:absolute;left:-8%;top:-8%;width:116%;height:116%;max-width:none;object-fit:cover;filter:blur(26px) saturate(1.35) brightness(.6)}
.marco__media .mc-fg{position:absolute;left:50%;top:var(--fg-top,45%);width:var(--fg-w,100%);max-width:none;height:auto;transform:translate(-50%,-50%) scale(1.06);-webkit-mask-image:linear-gradient(180deg,transparent 9.5%,#000 17%,#000 83%,transparent 90.5%);mask-image:linear-gradient(180deg,transparent 9.5%,#000 17%,#000 83%,transparent 90.5%)}
.marco__shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(var(--mc-bg-rgb),.75) 0%,rgba(var(--mc-bg-rgb),.1) 22%,rgba(var(--mc-bg-rgb),0) 40%,rgba(var(--mc-bg-rgb),.82) 62%,var(--mc-bg) 90%),linear-gradient(90deg,rgba(var(--mc-bg-rgb),.55),rgba(var(--mc-bg-rgb),0) 55%)}
.marco__palabra{position:absolute;left:50%;top:50%;z-index:0;margin:0;transform:translate(-50%,-50%);pointer-events:none;font:400 clamp(4rem,17vw,17rem)/.8 var(--f-display);letter-spacing:.01em;white-space:nowrap;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px var(--mc-palabra);opacity:0}
.marco__chrome{position:absolute;z-index:0;top:calc(var(--iy,0) * 1%);bottom:calc(var(--iy,0) * 1%);left:calc(var(--ix,0) * 1%);right:calc(var(--ix,0) * 1%);display:none;flex-direction:column;justify-content:space-between;padding:14px 16px;pointer-events:none;font-size:.8rem;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.6);opacity:var(--co,1)}
.mcr-top{display:flex;align-items:center;gap:.6rem}
.mcr-top span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#E11D48;font-family:var(--f-display);font-size:.8rem;text-shadow:none}
.mcr-bot{display:flex;flex-direction:column;gap:.55rem}
.mcr-bar{position:relative;height:4px;border-radius:4px;background:rgba(255,255,255,.35)}
.mcr-bar i{position:absolute;left:0;top:0;bottom:0;width:36%;border-radius:4px;background:var(--magenta)}
.mcr-bar i::after{content:"";position:absolute;right:-6px;top:-4px;width:12px;height:12px;border-radius:50%;background:var(--magenta)}
.mcr-row{display:flex;align-items:center;gap:.9rem}
.mcr-row svg{width:18px;height:18px;fill:#fff}
.mcr-row b{margin-left:auto;font-variant-numeric:tabular-nums}
.marco__copy{position:relative;z-index:1;width:100%;padding-block:calc(var(--mc-encabezado) + 3rem) clamp(2.8rem,6vw,4.6rem)}
.marco__copy .eyebrow{margin:0 0 14px}
.marco__h{font-size:clamp(2.7rem,5.6vw,6rem);line-height:.92;max-width:13ch}
.marco__h em{font-style:normal;color:var(--cian)}
.marco__cols{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:3.4rem;align-items:end;margin-top:1.5rem}
.marco__cols p{font-size:1.08rem;line-height:1.65;color:var(--mc-texto-2);max-width:56ch}
.marco__facts{display:grid;gap:.7rem}
.marco__facts li{display:flex;gap:.8rem;align-items:baseline;padding-bottom:.6rem;border-bottom:1px solid rgba(255,255,255,.2);font-size:.98rem}
.marco__facts b{font-family:var(--f-display);font-weight:400;color:var(--cian);min-width:1.8rem;font-size:1.05rem}
.marco__cta{margin-top:1.6rem}
.marco--vivo .marco__stage{position:sticky;top:0;height:100vh;height:100svh}
.marco--vivo .marco__palabra{opacity:1;-webkit-text-stroke:1.4px var(--mc-palabra)}
.marco--vivo .marco__copy{opacity:0;will-change:transform,opacity}
.marco--vivo .marco__chrome{display:flex}

/* ======= 19. VIDEOS (fachadas de YouTube, .yt[data-yt]) ======= */
.vid-top{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);align-items:end;margin-bottom:clamp(2rem,4vw,3rem)}
.vid-top .head{margin-bottom:0}
.yt{position:relative;display:block;width:100%;padding:0;border:0;border-radius:22px;overflow:hidden;background:#000;cursor:pointer;color:#fff;text-align:left;isolation:isolate;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.yt img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.yt::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,17,29,.85));pointer-events:none}
.yt-play{position:absolute;left:50%;top:50%;z-index:2;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;display:grid;place-items:center;background:var(--magenta);box-shadow:0 12px 30px -8px rgba(254,44,85,.7);transition:transform .45s var(--ease)}
.yt-play svg{width:30px;height:30px;fill:#fff;margin-left:4px}
.yt-play::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(255,255,255,.55);opacity:0;transform:scale(.8);transition:transform .5s var(--ease),opacity .4s}
.yt:hover .yt-play,.yt:focus-visible .yt-play{transform:scale(1.08)}
.yt:hover .yt-play::before,.yt:focus-visible .yt-play::before{opacity:1;transform:scale(1)}
.yt:hover img{transform:scale(1.04)}
.yt-meta{position:absolute;left:1.1rem;right:1.1rem;bottom:1rem;z-index:2;display:flex;flex-direction:column;gap:.3rem}
.yt-meta b{font-weight:700;font-size:1rem;line-height:1.3}
.yt-meta small{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--cian)}
.yt-meta small svg{width:11px;height:11px;fill:var(--cian)}
.yt-feat{aspect-ratio:16/9}
.yt-feat::after{background:linear-gradient(180deg,rgba(0,17,29,.55),rgba(0,0,0,0) 30%)}
.yt-feat .yt-meta{top:1rem;bottom:auto}
.yt-feat .yt-meta b{display:none}
.yt-feat .yt-meta small{align-self:flex-start;padding:.4rem .7rem;border-radius:999px;background:rgba(0,17,29,.8)}
.yt-short{aspect-ratio:9/16}
.yt-short .yt-play{width:58px;height:58px;margin:-29px 0 0 -29px}
.yt-short .yt-play svg{width:22px;height:22px}
.yt-frame{position:relative;border-radius:22px;overflow:hidden;background:#000}
.yt-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-frame.f-feat{aspect-ratio:16/9}
.yt-frame.f-short{aspect-ratio:9/16}
.yt-sum{margin-top:.9rem;font-size:.95rem;line-height:1.55;color:var(--muted)}
.vid-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(1.2rem,2.4vw,2rem);align-items:start}
.vid-side{display:flex;flex-direction:column;gap:1.2rem;padding:1.6rem;border-radius:22px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.vid-side h3{font-size:clamp(1.8rem,2.6vw,2.5rem)}
.vid-side h3 em{font-style:normal;color:var(--cian)}
.vid-side p{color:var(--niebla);font-size:1rem}
.vid-side ul{display:grid;gap:.6rem}
.vid-side li{display:flex;justify-content:space-between;gap:1rem;padding-bottom:.6rem;border-bottom:1px solid rgba(255,255,255,.12);font-size:.95rem}
.vid-side li b{font:400 1.25rem/1.2 var(--f-display);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.shorts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(.8rem,1.4vw,1.2rem);margin-top:clamp(1.2rem,2.4vw,2rem)}
@media (max-width:1023px){.shorts{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) .6rem;scroll-padding-inline:var(--gut);scrollbar-width:none}.shorts::-webkit-scrollbar{display:none}.shorts>*{flex:0 0 min(46vw,230px);scroll-snap-align:start}}

/* ======= 20. RESEÑAS (carrusel-resenas-raptor adaptado a En Vivo) ======= */
.rev-sec{--gutter:var(--gut);--rv-acento:var(--cian);--rv-borde:rgba(37,244,238,.55);--rv-fondo:var(--estudio);--rv-texto:#fff;--rv-texto-2:var(--bruma);--rv-oscuro:var(--madrugada);--rv-oscuro-texto:#fff;--rv-oscuro-texto-2:rgba(255,255,255,.78);--rv-icono:var(--cian);--rv-radio:22px;--rv-fuente:var(--f-body);--rv-fuente-titulo:var(--f-display);--rv-fuente-ui:var(--f-body);--rv-panel-texto:#fff;--rv-panel-acento:var(--cian);--rv-ancho:clamp(230px,30%,280px);--rv-alto-esqueleto:290px;--rv-panel-ancho:300px}
.rev-sec .head{align-items:flex-start}
.rev-sec .rev-layout{gap:clamp(2rem,4vw,3.4rem)}
.rev-car .rev .rev-g{width:22px;height:22px;background:none}
.rev-car .rev .rev-g svg{width:22px;height:22px}
.rev-car .rev figcaption{padding-right:2.1rem}
.rev-car .rev{box-shadow:0 24px 40px -26px rgba(0,0,0,.6)}
.rev-car .rev.sk{background:linear-gradient(100deg,#012F4A 30%,#0B4466 50%,#012F4A 70%) 0 0/220% 100%}
.rev-car .rev .av,.rev-car .rev-btn{box-shadow:inset 0 0 0 1px rgba(37,244,238,.7)}
.rev-car .rev blockquote{font:400 1rem/1.5 var(--f-body);color:inherit;padding:0;border:0;margin:0 0 .7rem}
.rev-panel .rev-etq{font-size:clamp(2rem,3vw,2.6rem);text-transform:uppercase}
.rev-panel .rev-num{font-size:4.4rem}

/* ======= 21. ZONAS (radar) ======= */
.zone-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2.4rem,5vw,5rem);align-items:center}
.radar{position:relative;width:min(100%,520px);aspect-ratio:1;justify-self:center}
.radar svg{width:100%;height:100%;overflow:visible}
.radar .rg{fill:none;stroke:rgba(37,244,238,.28);stroke-width:1}
.radar .rx{stroke:rgba(255,255,255,.12);stroke-width:1}
.radar .sweep{transform-origin:260px 260px}
@media (prefers-reduced-motion:no-preference){.radar .sweep{animation:spin 5.5s linear infinite}.radar .ping{transform-box:fill-box;transform-origin:center;animation:ping 2.6s ease-out infinite}.radar .ping.p2{animation-delay:1.3s}}
@keyframes ping{0%{transform:scale(1);opacity:.8}100%{transform:scale(4.5);opacity:0}}
.radar .lbl{font:600 15px var(--f-body);fill:#fff}
.radar .lbl-s{font:500 12.5px var(--f-body);fill:var(--niebla)}
.zones h3{font-size:1.5rem;margin:0 0 .9rem;display:flex;align-items:center;gap:.6rem}
.zones h3 svg{width:22px;height:22px;fill:none;stroke:var(--cian);stroke-width:2}
.zblock+.zblock{margin-top:2rem}
.zchips{display:flex;flex-wrap:wrap;gap:.5rem}
.zchips li{padding:.45rem .85rem;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);font-size:.92rem;font-weight:500}
.zchips li.hq{background:var(--cian);color:var(--estudio);font-weight:700;box-shadow:none}
.zchips--big li{font-size:1.02rem;padding:.6rem 1.05rem;background:var(--pcd);box-shadow:none}
.zone-links{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}

/* ======= 22. PREGUNTAS COMO COMENTARIOS (details.qa → FAQPage) ======= */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2.4rem,5vw,5rem);align-items:start}
.faq-side{position:sticky;top:calc(var(--hdr) + 2rem)}
.faq-side .btn{margin-top:1.8rem}
.sheet{border-radius:30px;background:#fff;color:var(--estudio);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);overflow:hidden;--focus:var(--pcd)}
.sheet-h{position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1.3rem 1.2rem 1rem;border-bottom:1px solid #E3EEF5;font-weight:700;font-size:.98rem}
.sheet-h::before{content:"";position:absolute;left:50%;top:.55rem;width:44px;height:4px;margin-left:-22px;border-radius:4px;background:#D2E2EC}
.sheet-h small{font-weight:500;color:var(--gris)}
.qa{border-bottom:1px solid #EEF4F8}
.qa:last-child{border-bottom:0}
.qa summary{list-style:none;cursor:pointer;padding:1.2rem 1.3rem}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{background:#F6FAFC}
.qa .q{display:block;font:600 1.08rem/1.35 var(--f-body);letter-spacing:0;text-transform:none;color:var(--estudio)}
.qa-a{padding:0 1.3rem 1.4rem;font-size:1rem;line-height:1.6;color:#18435E}
.qa-a p+p{margin-top:.6rem}
.qa-a a{color:var(--estudio);font-weight:600;text-decoration:underline;text-decoration-color:var(--magenta);text-decoration-thickness:2px;text-underline-offset:.2em}
.qa.cm summary{display:grid;grid-template-columns:44px minmax(0,1fr) 24px;gap:.9rem;align-items:start}
.cm-av{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c,#DCEAF3);color:var(--estudio);font-weight:700;font-size:.92rem;letter-spacing:.02em;flex:none}
.cm-who{display:block;font-size:.8rem;font-weight:600;color:var(--gris)}
.qa.cm .q{margin-top:.2rem}
.cm-more{display:inline-flex;align-items:center;gap:.5rem;margin-top:.55rem;font-size:.84rem;font-weight:600;color:var(--gris)}
.cm-more::before{content:"";width:22px;height:1.5px;background:#B9CEDC}
.qa[open] .cm-more .t-open,.qa:not([open]) .cm-more .t-close{display:none}
.cm-heart{width:22px;height:22px;margin-top:.7rem;fill:none;stroke:#9FB6C6;stroke-width:1.8;transition:fill .3s,stroke .3s,transform .4s var(--ease)}
.qa[open] .cm-heart{fill:var(--magenta);stroke:var(--magenta);transform:scale(1.12)}
.cm-reply{display:grid;grid-template-columns:36px minmax(0,1fr);gap:.8rem;padding:0 1.3rem 1.4rem 4.6rem}
.cm-reply .cm-av{width:36px;height:36px;background:var(--pcd)}
.cm-reply .cm-av img{width:70%;height:auto}
.cm-rb{padding:.8rem 1rem .95rem;border-radius:6px 18px 18px 18px;background:var(--hielo)}
.cm-rb .cm-who{display:flex;align-items:center;gap:.45rem;color:var(--estudio)}
.cm-rb .qa-a{padding:.35rem 0 0}
.creator{padding:.12rem .45rem;border-radius:6px;background:var(--estudio);color:#fff;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.typing{display:none;gap:4px;align-items:center;height:22px;margin-top:.3rem}
.typing i{width:7px;height:7px;border-radius:50%;background:#7E9AAD}
.qa.is-typing .typing{display:inline-flex}
.qa.is-typing .qa-a{display:none}
.qa-a .tw{transition:opacity .25s}
.qa-a .tw.off{opacity:0}
@media (prefers-reduced-motion:no-preference){.typing i{animation:dots 1s ease-in-out infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}}
@keyframes dots{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

/* ======= 23. UBICACIÓN · NAP ======= */
.loc-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(2rem,4vw,3.6rem);align-items:start}
.map{position:relative;border-radius:26px;overflow:hidden;background:#00223A;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.map-bar{display:flex;align-items:center;gap:.6rem;padding:.8rem 1.1rem;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;background:#00223A}
.map-bar span:last-child{margin-left:auto;color:var(--niebla);letter-spacing:.04em;text-transform:none;font-weight:500}
.map iframe{width:100%;height:450px;border:0}
.nap{display:flex;flex-direction:column;gap:1.4rem}
.nap h3{font-size:clamp(2rem,3vw,2.8rem)}
.nap h3 span{color:var(--cian)}
.nap address{font-style:normal;font-size:1.05rem;line-height:1.6;color:#D9E8F1}
.nap .tel{align-self:flex-start;padding:0;border:0;background:none;color:#fff;font:400 clamp(2.2rem,3.4vw,3rem)/1 var(--f-display);letter-spacing:.02em;font-variant-numeric:tabular-nums;cursor:pointer}
.nap .tel:hover{color:var(--cian)}
.hours{display:grid;margin:0;border-top:1px solid rgba(255,255,255,.16)}
.hours div{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.16);font-size:.98rem}
.hours dt{color:var(--niebla)}
.hours dd{margin:0;font-variant-numeric:tabular-nums;text-align:right;font-weight:600}
.hours .closed dd{color:var(--niebla);font-weight:500}

/* ======= 24. PIE ======= */
.foot{position:relative;z-index:1;background:var(--madrugada);color:#fff}
.f-cta{position:relative;overflow:hidden;padding-block:clamp(5rem,10vw,8.5rem) clamp(3.5rem,7vw,5rem);border-bottom:1px solid rgba(255,255,255,.1)}
.f-cta-t{font:400 clamp(2.8rem,7.5vw,7.4rem)/.95 var(--f-display);text-transform:uppercase;max-width:15ch}
.f-cta-t em{font-style:normal;color:var(--cian)}
.f-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr 1.15fr;gap:2.4rem;padding-block:3.6rem}
.foot .f-col-t{margin:0 0 1rem;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cian)}
.f-grid li+li{margin-top:.45rem}
.f-grid a,.f-link{display:inline-block;padding:.25rem 0;border:0;background:none;color:#C8DCE8;font-size:.95rem;text-align:left;text-decoration:none;cursor:pointer;transition:color .25s}
.f-grid a:hover,.f-link:hover{color:#fff;text-decoration:underline;text-underline-offset:.2em}
.f-brand img{width:210px;height:auto}
.f-brand .handle{display:flex;margin-top:.9rem}
.f-brand p{margin-top:1rem;max-width:34ch;font-size:.92rem;color:#C8DCE8}
.f-contact address{font-style:normal;color:#C8DCE8;font-size:.95rem;line-height:1.65}
.f-contact p{margin-top:.8rem;font-size:.92rem;color:#C8DCE8}
.f-contact .f-link{color:#fff;font-weight:600;text-decoration:underline;text-decoration-color:var(--cian);text-underline-offset:.2em}
.f-social{display:flex;flex-wrap:wrap;gap:.5rem;padding-block:0 2.6rem}
.f-social a{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.45rem .9rem;border-radius:999px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);color:#fff;font-size:.88rem;font-weight:600;text-decoration:none;transition:background-color .3s}
.f-social a:hover{background:rgba(255,255,255,.12)}
.f-social svg{width:16px;height:16px;fill:var(--cian)}
.f-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem 2rem;padding-block:1.6rem 6.8rem;border-top:1px solid rgba(255,255,255,.1);font-size:.86rem;color:var(--niebla)}
.f-legal{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.f-bottom a{color:#fff;text-decoration:underline;text-underline-offset:.2em}

/* ======= 25. CONVERSIÓN: flotantes + modales (botones-conversion) ======= */
/* WhatsApp flotante «EN VIVO» (Fumigador Bonito, 2026-10-19): el avatar de Daniel transmitiendo.
   Círculo NEGRO (Alberto, 2026-10-19) con el icono OFICIAL en contorno blanco (botones-conversion) + aro de historia cian/magenta que gira + etiqueta «EN VIVO»
   + corazones (data-love). Encima, una vez por visita, le «llega» al visitante un mensaje de Daniel (.fab-msg). */
.fab{position:fixed;right:22px;bottom:24px;z-index:2000;display:flex;flex-direction:column;align-items:flex-end;gap:16px;pointer-events:none}
.fab>*{pointer-events:auto}
.floating-wa-btn{position:relative;display:grid;place-items:center;width:62px;height:62px;padding:0;border:0;border-radius:50%;background:#000;box-shadow:0 0 0 3px var(--estudio),0 14px 30px rgba(0,0,0,.4);cursor:pointer;transition:transform .35s var(--ease)}
.fab-ring{position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(from 0deg,var(--cian),var(--magenta),#fff,var(--cian));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));pointer-events:none}
.fab-live{position:absolute;left:50%;bottom:-9px;translate:-50% 0;padding:3px 6px 2px;border-radius:5px;background:#D92D20;box-shadow:0 0 0 2px var(--estudio);color:#fff;font:800 .58rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;pointer-events:none}
.floating-wa-btn:hover{transform:scale(1.07)}
.floating-wa-btn:active{transform:scale(.94)}
@media (prefers-reduced-motion:no-preference){
  .fab-ring{animation:fabGira 6s linear infinite}
  .floating-wa-btn:hover .fab-ring{animation-duration:1.6s}
  .fab-live::before{content:"";display:inline-block;width:5px;height:5px;margin:0 4px 1px 0;border-radius:50%;background:#fff;vertical-align:middle;animation:recBlink 1.4s steps(1) infinite}
}
@keyframes fabGira{to{transform:rotate(1turn)}}
/* el mensaje entrante: burbuja de WhatsApp (blanca, con cola hacia el botón) */
.fab-msg{position:relative;width:min(262px,calc(100vw - 7rem));filter:drop-shadow(0 14px 26px rgba(0,0,0,.35));transform-origin:calc(100% - 28px) 100%}
.fab-msg[hidden]{display:none}
.fab-msg-b{display:block;width:100%;padding:.75rem 2.2rem .8rem .95rem;border:0;border-radius:16px 16px 4px 16px;background:#fff;color:#111B21;text-align:left;font:400 .92rem/1.4 var(--f-body);cursor:pointer}
.fab-msg-b::after{content:"";position:absolute;right:20px;bottom:-9px;width:18px;height:10px;background:#fff;clip-path:polygon(0 0,100% 0,100% 100%)}
.fab-msg-top{display:block;margin-bottom:.2rem;font-size:.78rem;color:#54656F}
.fab-msg-top b{color:#008069;font-weight:700}
.fab-typing{display:none;gap:4px;padding:.35rem 0 .15rem}
.fab-typing i{width:7px;height:7px;border-radius:50%;background:#8696A0}
.fab-msg-t{display:block}
.fab-msg.is-typing .fab-typing{display:inline-flex}
.fab-msg.is-typing .fab-msg-t{display:none}
.fab-msg:not(.is-typing) .fab-estado{display:none}
.fab-msg-b:hover .fab-msg-t{text-decoration:underline;text-decoration-color:rgba(0,128,105,.5);text-underline-offset:.2em}
.fab-msg-b:focus-visible,.fab-x:focus-visible{outline:3px solid var(--cian);outline-offset:3px}
.fab-x{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:#54656F;cursor:pointer}
.fab-x:hover{background:#F0F2F5}
.fab-x svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
@media (prefers-reduced-motion:no-preference){
  .fab-msg.is-in{animation:fabEntra .55s var(--ease) both}
  .fab-typing i{animation:fabPunto 1.1s ease-in-out infinite}
  .fab-typing i:nth-child(2){animation-delay:.15s}.fab-typing i:nth-child(3){animation-delay:.3s}
}
@keyframes fabEntra{from{opacity:0;transform:translateY(12px) scale(.86)}to{opacity:1;transform:none}}
@keyframes fabPunto{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.floating-wa-btn:focus-visible,.floating-call-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.wa-icon{position:relative;width:34px;height:34px;object-fit:contain}
.floating-call-btn{position:fixed;left:20px;bottom:20px;z-index:2000;display:none;place-items:center;width:58px;height:58px;padding:0;border:2px solid #fff;border-radius:50%;background:var(--magenta);color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.35);cursor:pointer;transition:transform .35s var(--ease)}
.floating-call-btn:hover{transform:scale(1.08)}
@media (max-width:768px){.floating-call-btn{display:grid}}
.menu-open .fab,.menu-open .floating-call-btn{visibility:hidden}
.wa-modal,.call-modal{display:none;position:fixed;inset:0;z-index:2100;justify-content:center;align-items:center;padding:1rem;background:rgba(0,17,29,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow-y:auto}
.wa-modal.active,.call-modal.active{display:flex}
.wa-modal-content,.call-modal-content{position:relative;width:100%;max-width:440px;margin:auto;border-radius:28px;background:#fff;color:var(--estudio);box-shadow:0 40px 90px -30px rgba(0,0,0,.7);overflow:hidden;animation:modalIn .4s var(--ease);--focus:var(--pcd)}
@keyframes modalIn{from{opacity:0;transform:translateY(24px) scale(.97)}}
.m-chat{display:flex;align-items:center;gap:.75rem;padding:1rem 3.6rem 1rem 1.2rem;background:var(--estudio);color:#fff}
.m-chat .post-av span{background:var(--pcd)}
.m-chat b{display:block;font-size:.98rem;line-height:1.2}
.m-chat small{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--niebla)}
.m-chat small::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--wa)}
.wa-modal-close{position:absolute;top:.9rem;right:.9rem;z-index:2;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer;--focus:var(--cian)}
.wa-modal-close:hover{background:rgba(255,255,255,.22)}
.m-body{padding:1.4rem 1.4rem 1.5rem}
.m-body h2,.call-modal-content h2{font-size:clamp(1.9rem,6vw,2.4rem);line-height:1}
.m-body h2 em{font-style:normal;color:var(--magenta)}
.m-body>p{margin:.6rem 0 1.2rem;font-size:.95rem;color:var(--gris)}
.form-group{margin-bottom:1rem}
.form-group label{display:block;margin-bottom:.4rem;font-weight:600;font-size:.9rem}
.form-group input,.form-group select,.form-group textarea{width:100%;min-height:50px;padding:.75rem .9rem;border:1.5px solid #C9DCE7;border-radius:14px;background:#fff;color:var(--estudio);font:400 1rem/1.4 var(--f-body);transition:border-color .2s,box-shadow .2s}
.form-group textarea{min-height:84px;resize:vertical}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--pcd);box-shadow:0 0 0 3px rgba(1,101,151,.18);outline:none}
.form-group.is-invalid label{color:#B4301F}
.form-group.is-invalid input,.form-group.is-invalid select{border-color:#E03E2F!important;box-shadow:0 0 0 3px rgba(224,62,47,.14);animation:fieldShake .35s cubic-bezier(.36,.07,.19,.97) both}
.form-error{display:none;margin-top:.35rem;font-size:.8rem;color:#B4301F;letter-spacing:.02em}
.form-group.is-invalid .form-error{display:block}
@keyframes fieldShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.btn-wa-submit{width:100%;justify-content:center;margin-top:.3rem}
.btn-wa-submit svg{fill:#fff}
.m-legal{margin-top:1rem;font-size:.76rem;line-height:1.5;color:var(--gris)}
.m-legal a{color:var(--estudio);font-weight:600}
.call-modal-content{padding:2rem 1.6rem 1.6rem;text-align:center}
.call-ic{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 1rem;border-radius:50%;background:var(--hielo)}
.call-ic svg{width:32px;height:32px;fill:none;stroke:var(--magenta);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.call-num{margin-top:.7rem;font:400 2.4rem/1 var(--f-display);letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--pcd)}
.modal-subtitle{margin:.6rem 0 1.5rem;font-size:.92rem;color:var(--gris)}
.call-modal-buttons{display:flex;flex-direction:column;gap:.7rem}
.call-modal-buttons .btn{width:100%}
.call-modal-buttons .btn svg{fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn-call-cancel{min-height:50px;padding:.8rem;border:1.5px solid #C9DCE7;border-radius:999px;background:transparent;color:var(--gris);font-weight:600;cursor:pointer;transition:background-color .2s,color .2s}
.btn-call-cancel:hover{background:var(--hielo);color:var(--estudio)}

/* ======= 26. RESPONSIVO ======= */
@media (max-width:1023px){
  .hero{min-height:0;padding-bottom:4rem}
  .hero-grid,.phero-grid,.biz-grid,.me-grid,.price-grid,.price-top,.price-faq,.zone-grid,.faq-grid,.loc-grid,.vid-top,.vid-grid,.grid-2{grid-template-columns:minmax(0,1fr)}
  .hero-grid{gap:3.2rem}
  .phone{transform:rotate(1.5deg)}
  .faq-side,.quote{position:static}
  .factors{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-grid{grid-template-columns:1fr 1fr}
  .f-grid{grid-template-columns:1fr 1fr}
  .post-wrap{max-width:560px}
  .me-photo{max-width:460px}
}
@media (max-width:900px){
  .shut{--cx:.5;--cy:.2}
  .shut__photo img{object-position:50.5% 20%}
  .shut__shade{background:linear-gradient(0deg,rgba(1,47,74,.98) 0%,rgba(1,47,74,.95) 42%,rgba(1,47,74,.5) 56%,rgba(1,47,74,0) 70%)}
  .shut--vivo .shut__pin{height:240vh}
  .hud-meta .hide-sm{display:none}
  .hud-rec{left:44px}.hud-meta{right:44px}
  .hud-c{width:26px;height:26px}
  .how-in{grid-template-columns:minmax(0,1fr) auto;align-items:start;min-height:0;gap:1rem;padding:1.4rem;border-radius:26px}
  .story{width:96px;border-radius:16px;box-shadow:0 0 0 4px rgba(0,0,0,.18)}
  .story .st-user,.story .st-cap{display:none}
  .st-art{padding:1.2rem .6rem}
  .segs{left:7px;right:7px;top:7px;gap:2px}
  .how-num b{font-size:4.2rem}
  .how-in h3{font-size:2.5rem}
  .how-in p{font-size:1rem}
  .how-in .explain{grid-column:1 / -1}
  .how-card{top:calc(var(--hdr) + 10px + var(--i) * 12px)}
  .marco{--fg-w:150%;--fg-top:31%}
  .marco__facts{display:none}
  .marco__h{font-size:clamp(2.4rem,11vw,3.4rem)}
  .marco__cols{grid-template-columns:1fr;gap:1.6rem;margin-top:1.2rem}
  .marco__cols p{font-size:1rem}
  .marco__copy{padding-block:calc(var(--mc-encabezado) + 1.5rem) 2rem}
  .marco__copy .eyebrow{font-size:.72rem}
  .marco--vivo .marco__shade{background:linear-gradient(180deg,rgba(var(--mc-bg-rgb),.4) 0%,rgba(var(--mc-bg-rgb),.2) 22%,rgba(var(--mc-bg-rgb),.75) 48%,rgba(var(--mc-bg-rgb),.94) 70%,var(--mc-bg) 100%)}
  .marco:not(.marco--vivo) .marco__stage{display:block;min-height:0}
  .marco:not(.marco--vivo) .marco__media{position:relative;height:64vh;height:64svh;z-index:0}
  .marco:not(.marco--vivo) .marco__shade{bottom:auto;height:64vh;height:64svh;z-index:0;background:linear-gradient(180deg,rgba(var(--mc-bg-rgb),.35) 0%,rgba(var(--mc-bg-rgb),0) 28%,rgba(var(--mc-bg-rgb),0) 58%,var(--mc-bg) 100%)}
  .marco:not(.marco--vivo) .marco__copy{margin-top:-5.5rem;padding-top:0}
  .marco__chrome{font-size:.7rem;padding:10px 12px}
  .mcr-top em{display:none}
}
@media (max-width:768px){
  :root{--gut:1.4rem;--hdr:66px}
  .map iframe{height:380px}
  .media-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .hero{padding-top:calc(var(--hdr) + 1.3rem)}
  .hero .h1,.phero .h1{margin-bottom:1.1rem}
  .ctas{flex-direction:column;align-items:stretch;gap:.6rem}
  .hero .ctas,.phero .ctas{margin-top:1.25rem}
  .ctas .btn-love{min-height:52px;padding:.32rem 1.3rem .32rem .32rem;font-size:1.06rem}
  .ctas .btn-love .hb{width:40px;height:40px}.ctas .btn-love .hb svg{width:20px;height:20px}
  .ctas .btn-story{min-height:52px;gap:.7rem;padding:.2rem 1.2rem .2rem .2rem}
  .ctas .ring{width:46px;height:46px}.ctas .ring-in{width:36px;height:36px}.ctas .ring-in svg{width:18px;height:18px}
  .ctas .bs-t small{font-size:.66rem}.ctas .bs-t b{font-size:1.06rem}
  .g-pill{margin-top:.85rem;font-size:.88rem;gap:.5rem}
  .ctas .btn,.ctas .btn-story{width:100%;justify-content:flex-start}
  .stats{grid-template-columns:1fr 1fr}
  .stat{padding:1rem 1rem 0 0}
  .stat+.stat{padding-left:1rem}
  .stat:nth-child(3){grid-column:1 / -1;padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.14);margin-top:1rem}
  .phone{width:min(74vw,290px)}
  .fc-a{left:-1.1rem;top:58%}
  .fc-b{right:-1.1rem;top:20%}
  .hero-word{font-size:34vw;bottom:auto;top:58%}
  .map iframe{height:320px}
  .biz-tiles,.factors{grid-template-columns:1fr}
  .factor{display:grid;grid-template-columns:auto 1fr;gap:.2rem 1rem;align-items:baseline}
  .factor b{grid-row:span 2;font-size:2rem}
  .f-grid{grid-template-columns:1fr}
  .me-stats li{padding-right:.6rem}
  .me-stats li+li{padding-left:.8rem}
  .me-stats b{font-size:1.65rem}
  .cert{right:-.4rem;width:68%}
  .polaroid{left:-.6rem;top:40%}
  .qa.cm summary{grid-template-columns:40px minmax(0,1fr) 22px;padding:1.1rem 1rem;gap:.75rem}
  .cm-av{width:40px;height:40px}
  .cm-reply{padding:0 1rem 1.2rem 1.6rem}
  .quote .btn-love,.zone-links .btn{width:100%}
  .f-bottom{padding-bottom:7.4rem}
}
@media (max-width:480px){
  :root{--gut:1rem}
  .h1{font-size:min(4rem,16.3vw)}
  .phero .h1{font-size:min(3.4rem,13.6vw)}
  .stat b{font-size:1.75rem}
  .float-chip{font-size:.72rem;padding:.45rem .7rem .45rem .45rem}
  .float-chip b{font-size:1rem}
  .float-chip i{width:26px;height:26px}
  .map-bar span:last-child{display:none}
  .map iframe{height:280px}
  .fab{right:16px;bottom:18px}
  .floating-wa-btn{width:56px;height:56px}
  .floating-call-btn{left:14px;bottom:14px;width:54px;height:54px}
  .m-body{padding:1.2rem 1.1rem 1.3rem}
}
.rev-car .rev.hl blockquote p{font:600 1.06rem/1.45 var(--f-body);font-style:normal}