/* =====================================================================
   LIVYO — sistema visual
   ===================================================================== */
:root{
  /* color */
  --blue:#0A66EC;
  --blue-strong:#0A7AFF;
  --blue-deep:#0A57C4;
  --blue-soft:#5E9BF7;
  --navy:#0A1834;
  --navy-soft:#12244C;
  --light-blue:#E4F0FD;
  --light-blue-2:#F0F6FE;
  --background:#F7FAFE;
  --text-muted:#59688C;
  --text-soft:#63739A;
  --border:#E6EDF7;
  --border-soft:#EFF4FB;
  --green:#22B573;
  --green-ink:#0E7A50;
  --green-wash:#EAF7F0;
  --white:#FFFFFF;

  /* radios */
  --r-xl:28px; --r-lg:22px; --r-md:18px; --r-sm:14px; --r-xs:10px;

  /* sombras */
  --sh-xs:0 1px 2px rgba(16,42,90,.04);
  --sh-sm:0 1px 2px rgba(16,42,90,.04), 0 6px 16px -8px rgba(16,42,90,.14);
  --sh-md:0 2px 4px rgba(16,42,90,.04), 0 16px 36px -18px rgba(16,42,90,.22);
  --sh-lg:0 3px 8px rgba(16,42,90,.05), 0 28px 60px -26px rgba(16,42,90,.28);
  --sh-xl:0 6px 14px rgba(16,42,90,.06), 0 44px 90px -34px rgba(16,42,90,.34);
  --sh-blue:0 10px 26px -8px rgba(11,108,246,.42);

  --ease:cubic-bezier(.16,1,.3,1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--background);
  color:var(--navy);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:16px;line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--blue);color:#fff}
a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}

/* ---------- fondo de ondas (superficie continua) ---------- */
.page-bg{position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:url("assets/fondo-ondas.png") center top/100% 100% no-repeat;
  background-color:#F7FAFE}
.page-bg::after{content:"";position:absolute;inset:0;
  background:
    /* atenuación del glow de la esquina superior derecha */
    radial-gradient(62% 46% at 97% 0%,rgba(255,255,255,.19) 0%,rgba(255,255,255,.09) 46%,transparent 74%),
    /* blanco de legibilidad: centro-izquierda, donde vive el titular */
    radial-gradient(72% 66% at 24% 44%,rgba(255,255,255,.82) 0%,rgba(255,255,255,.46) 54%,rgba(255,255,255,0) 84%),
    /* luz azul ambiental: arriba a la derecha */
    radial-gradient(95% 78% at 92% 4%,rgba(150,195,250,.125) 0%,rgba(176,211,252,.058) 46%,transparent 72%),
    /* luz azul detrás de la fotografía */
    radial-gradient(58% 62% at 74% 46%,rgba(140,188,249,.12) 0%,rgba(170,207,252,.06) 52%,transparent 76%),
    /* luz azul en la banda inferior */
    radial-gradient(148% 124% at 34% 146%,rgba(150,195,250,.10) 0%,rgba(158,199,251,.105) 24%,rgba(170,207,252,.075) 42%,rgba(182,215,252,.045) 58%,rgba(196,224,253,.02) 74%,transparent 90%),
    /* baño azul hielo general: la luz ambiental de la referencia */
    linear-gradient(180deg,rgba(226,239,253,.26) 0%,rgba(233,244,254,.20) 46%,rgba(234,245,254,.155) 72%,rgba(241,248,255,.085) 88%,rgba(246,251,255,.05) 100%)}

/* ---------- contenedor ---------- */
.wrap{width:100%;max-width:1392px;margin:0 auto;padding:0 clamp(20px,3vw,36px)}
.wrap-wide{max-width:1560px}

/* ---------- tipografía ---------- */
.serif{font-family:'Playfair Display',Georgia,'Times New Roman',serif;font-weight:400}
.hand{font-family:'Caveat',ui-rounded,cursive;font-weight:600;color:var(--blue);line-height:1.25}

.eyebrow{display:block;font-size:clamp(11.5px,.87vw,14px);font-weight:700;
  letter-spacing:.215em;text-transform:uppercase;color:var(--blue)}

h1,h2,h3,.fig{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-synthesis:none;letter-spacing:-.012em}
h1{font-size:clamp(32px,3.94vw,63px);line-height:1.22;letter-spacing:-.012em;font-weight:400;font-synthesis:none;color:var(--navy)}
h2{font-size:clamp(31px,3.6vw,58px);line-height:1.14;color:var(--navy)}
h3{font-size:clamp(20px,1.6vw,26px);line-height:1.2;color:var(--navy)}
.i-blue{font-style:italic;color:var(--blue)}
.blue{color:var(--blue)}

.lede{font-size:clamp(15.5px,1.2vw,19px);line-height:1.6;color:var(--text-muted);letter-spacing:-.008em}
.sec-sub{font-size:clamp(15.5px,1.25vw,20px);line-height:1.6;color:var(--text-muted);letter-spacing:-.01em}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:clamp(48px,3.4vw,56px);padding:0 clamp(24px,1.9vw,30px);border-radius:999px;
  font-size:clamp(15px,1.12vw,18px);font-weight:600;letter-spacing:-.01em;white-space:nowrap;
  transition:background .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease)}
.btn svg{width:1.05em;height:1.05em;flex:none}
.btn-p{background:var(--blue);color:#fff;box-shadow:var(--sh-blue)}
.btn-p:hover{background:var(--blue-deep);box-shadow:0 14px 32px -8px rgba(11,108,246,.5)}
.btn-p:active{transform:translateY(1px)}
.btn-sm{height:clamp(42px,3.2vw,52px);padding:0 clamp(18px,1.5vw,26px);font-size:clamp(14px,1.02vw,16.5px)}

/* ---------- fondo de sección ---------- */
.sec{position:relative;isolation:isolate;overflow:hidden}
.sec::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}

/* ---------- pastillas / badges ---------- */
.badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;
  padding:6px 14px;font-size:clamp(12px,.92vw,14.5px);font-weight:500;letter-spacing:-.006em}
.badge i{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.badge-green{background:var(--green-wash);color:var(--green-ink)}
.badge-grey{background:#EFF2F7;color:var(--text-muted)}
.badge-white{background:#fff;color:var(--navy);box-shadow:var(--sh-sm)}
.badge-white i{background:var(--green)}

/* ---------- tile de icono ---------- */
.tile{display:flex;align-items:center;justify-content:center;flex:none;background:linear-gradient(155deg,#E9F2FE 0%,#D8E9FC 100%);
  color:var(--blue);border-radius:var(--r-md)}
.tile svg{width:52%;height:52%}

/* ---------- check ---------- */
.chk{display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:22px;height:22px;border-radius:50%;background:var(--blue);color:#fff}
.chk svg{width:12px;height:12px}
.chk.grey{background:#C3CDDD}
.chk.green{background:var(--green)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}

/* =====================================================================
   NAV + HERO
   ===================================================================== */
.nav{position:absolute;top:0;left:0;right:0;z-index:60}
.nav-in{display:flex;align-items:center;gap:clamp(18px,2.4vw,40px);height:clamp(72px,6vw,96px)}
.logo{display:inline-flex;align-items:center;flex:none}
.logo img{height:clamp(22px,1.92vw,31px);width:auto;display:block}

/* menú: enlaces sueltos junto al logo, con subrayado azul que crece desde el centro al pasar el ratón */
.nav-links{display:flex;align-items:center;gap:clamp(26px,2.6vw,42px);margin-left:clamp(34px,4.2vw,68px)}
.nav-links a{position:relative;display:inline-flex;align-items:center;padding:8px 0;
  font-size:clamp(14.5px,1.02vw,16px);font-weight:500;color:var(--navy-soft);letter-spacing:-.01em;
  transition:color .2s ease}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;
  background:var(--blue);transform:scaleX(0);transform-origin:center;transition:transform .28s var(--ease)}
.nav-links a:hover{color:var(--blue)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-links a:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:4px}
@media (prefers-reduced-motion:reduce){.nav-links a::after{transition:none}}
.nav-right{display:flex;align-items:center;gap:clamp(14px,1.6vw,26px);margin-left:auto}
.nav-login{display:inline-flex;align-items:center;min-height:40px;font-size:clamp(14px,1vw,16px);font-weight:500;color:var(--navy-soft);transition:color .18s ease}
.nav-login:hover{color:var(--blue)}
.nav-toggle{display:none;width:42px;height:42px;border-radius:12px;align-items:center;justify-content:center;
  color:var(--navy);background:rgba(255,255,255,.7);box-shadow:var(--sh-sm)}
.nav-toggle svg{width:20px;height:20px}

/* panel del menú de móvil/tablet (lo crea menu.js a partir del menú de escritorio) */
.nav-panel{display:none}
@media(max-width:980px){
  .nav-panel{display:block;position:absolute;left:clamp(12px,3vw,24px);right:clamp(12px,3vw,24px);top:calc(100% - 6px);z-index:61;
    padding:8px;border-radius:22px;background:#fff;border:1px solid var(--border);
    box-shadow:0 2px 6px rgba(16,42,90,.06),0 28px 60px -26px rgba(16,42,90,.4);
    transform-origin:top center;animation:nav-in .22s var(--ease)}
  .nav-panel[hidden]{display:none}
  .nav-panel-links{display:flex;flex-direction:column}
  .nav-panel-links a{display:flex;align-items:center;min-height:52px;padding:0 16px;border-radius:14px;
    font-size:16.5px;font-weight:500;color:var(--navy);letter-spacing:-.01em}
  .nav-panel-links a + a{margin-top:2px}
  .nav-panel-links a:hover{background:var(--light-blue-2)}
  .nav-panel-links a.is-active{color:var(--blue);background:var(--light-blue-2);font-weight:600}
  .nav-panel-actions{display:flex;flex-direction:column;gap:8px;margin-top:8px;padding:12px 8px 6px;border-top:1px solid var(--border)}
  .nav-panel-actions .nav-login{display:flex;align-items:center;justify-content:center;min-height:48px;font-size:15.5px}
  .nav-panel-actions .btn{width:100%;justify-content:center;height:52px}
  .nav.is-open .nav-toggle{background:#fff;color:var(--blue)}
}
@keyframes nav-in{from{opacity:0;transform:translateY(-6px) scale(.98)}}
@media (prefers-reduced-motion:reduce){.nav-panel{animation:none}}

.hero{position:relative;overflow:visible;padding:clamp(104px,9.8vw,156px) 0 clamp(40px,4.2vw,68px)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(920px 720px at 22% -6%,rgba(255,255,255,.34),transparent 70%)}
.hero-in{display:grid;grid-template-columns:minmax(0,51.5fr) minmax(0,48.5fr);
  gap:clamp(32px,3.4vw,52px);align-items:center}

.hero h1{margin:clamp(16px,1.5vw,24px) 0 clamp(16px,1.5vw,24px);max-width:none;text-wrap:balance}
.hero .lede{max-width:46ch;font-size:clamp(15px,1.16vw,18.5px);margin-bottom:clamp(26px,2.6vw,40px)}
.hero-cta{display:flex;align-items:center;gap:clamp(20px,2.6vw,44px);flex-wrap:wrap;
  margin-bottom:clamp(26px,2.8vw,44px)}

/* -------- hero de la portada: foto a sangre + chat translúcido -------- */
.h-hero{padding-bottom:clamp(64px,6.4vw,104px)}
.h-hero-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
  /* salón con terraza y vistas al mar: el mar queda entre el texto y el chat */
  background:url("assets/home-hero-bg.jpg") 50% 50%/cover no-repeat;
  animation:h-fade 1.2s var(--ease) both}
/* velo: blanco a la izquierda (texto), limpio a la derecha (foto); suave arriba (menú) y fundido abajo */
.h-hero-bg::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(247,250,254,.97) 0%,rgba(247,250,254,.93) 27%,rgba(247,250,254,.66) 42%,rgba(247,250,254,.14) 60%,rgba(247,250,254,0) 72%),
    linear-gradient(180deg,rgba(247,250,254,.6) 0%,rgba(247,250,254,0) 16%,rgba(247,250,254,0) 80%,#F7FAFE 100%)}
@keyframes h-fade{from{opacity:0}}

.h-hero .hero-in{grid-template-columns:minmax(0,54fr) minmax(0,46fr)}
.h-hero h1{font-size:clamp(34px,3.6vw,60px)}

/* conversación flotante: burbujas de cristal sueltas sobre la foto (sin tarjeta) */
.h-conv{justify-self:end;width:100%;max-width:440px;display:flex;flex-direction:column;gap:14px;
  -webkit-mask-image:linear-gradient(180deg,#000 70%,rgba(0,0,0,.35) 100%);
  mask-image:linear-gradient(180deg,#000 70%,rgba(0,0,0,.35) 100%)}
.h-bub{display:flex;align-items:flex-start;gap:10px;max-width:86%;padding:11px 16px 12px 11px;border-radius:16px;
  background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.85);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 18px 40px -24px rgba(16,42,90,.4),inset 0 1px 0 rgba(255,255,255,.7);
  animation:h-bub .7s var(--ease) both}
.h-bub.g{align-self:flex-end}
.h-bub.l{align-self:flex-start}
.h-bub:nth-child(1){animation-delay:.35s}
.h-bub:nth-child(2){animation-delay:1.15s}
.h-bub:nth-child(3){animation-delay:1.95s}
.h-bub:nth-child(4){animation-delay:2.75s}
@keyframes h-bub{from{opacity:0;transform:translateY(12px)}}
.h-bub-av{display:flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border-radius:50%;
  background:rgba(10,24,52,.07);color:#5B6B88}
.h-bub-av svg{width:58%;height:58%}
.h-bub.l .h-bub-av{background:var(--blue);box-shadow:0 4px 10px rgba(10,102,236,.35)}
.h-bub-av img{width:58%;height:auto;filter:brightness(0) invert(1)}
.h-bub b{display:block;margin:1px 0 1px;font-size:13px;font-weight:600;line-height:1.3;color:var(--navy);letter-spacing:-.006em}
.h-bub p{font-size:14.5px;line-height:1.45;color:var(--navy-soft);letter-spacing:-.008em}

@media (prefers-reduced-motion:reduce){
  .h-hero-bg,.h-bub{animation:none}
}

/* =====================================================================
   TIRA DE PMS (desplazamiento continuo)
   ===================================================================== */
.pms{position:relative;padding:clamp(26px,3vw,46px) 0;
  background:linear-gradient(180deg,rgba(243,248,254,0) 0%,rgba(243,248,254,.55) 55%,rgba(243,248,254,.92) 100%)}
.pms-mask{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%)}
.pms-track{display:flex;width:max-content;animation:pms-scroll 46s linear infinite}
.pms:hover .pms-track{animation-play-state:paused}
.pms-row{display:flex;align-items:center;list-style:none;
  gap:clamp(38px,4.6vw,78px);padding-right:clamp(38px,4.6vw,78px)}
.pms-row li{display:flex;align-items:center;font-size:clamp(17px,1.5vw,24px);font-weight:600;
  letter-spacing:-.018em;color:#7C8AA4;white-space:nowrap;transition:color .25s var(--ease)}
.pms:hover .pms-row li{color:#66748E}
/* cuando exista el archivo de logo, se inserta aquí y sustituye al texto */
.pms-row li img{height:clamp(22px,2vw,32px);width:auto;max-width:clamp(120px,11vw,190px);
  object-fit:contain;display:block;opacity:.82;transition:opacity .25s var(--ease)}
.pms:hover .pms-row li img{opacity:1}
@keyframes pms-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* =====================================================================
   01 · QUÉ ES LIVYO
   ===================================================================== */
.what{padding:clamp(72px,7.5vw,120px) 0 clamp(48px,5vw,78px);position:relative}
.what::before{
  background:
    radial-gradient(820px 640px at 10% 22%,rgba(203,226,252,.42),transparent 62%),
    radial-gradient(760px 620px at 92% 78%,rgba(211,231,253,.38),transparent 62%),
    linear-gradient(180deg,#F3F8FE 0%,#F8FBFF 48%,#F1F7FD 100%)}
.what > .wrap{position:relative}

.what-head{text-align:center;max-width:1100px;margin:0 auto clamp(40px,4.4vw,70px)}
.what-head .eyebrow-mute{color:#66748E;letter-spacing:.3em;font-weight:600}
.what-head h2{margin:clamp(16px,1.5vw,24px) 0 clamp(12px,1.1vw,18px);line-height:1.16;font-size:clamp(30px,4.2vw,67px)}
.what-head .sec-sub{max-width:none;margin:0 auto}

/* ---- tres bloques sobre el arco ---- */
.stats-3{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(20px,2.4vw,40px);align-items:start;padding-top:clamp(18px,2.4vw,40px)}
.stats-arc{position:absolute;left:-4%;right:-4%;width:108%;top:clamp(4px,.9vw,14px);height:clamp(120px,13vw,208px);z-index:0;pointer-events:none;overflow:visible}
.stats-arc path,.stats-arc circle{fill:none;stroke:#D8E4F3;stroke-width:1;vector-effect:non-scaling-stroke}
.stats-arc .soft{stroke:#EBF2FA}

.stat-block{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}
.stat-block.up{margin-top:clamp(-52px,-3.4vw,-20px)}
.stat-ico{position:relative;display:flex;align-items:center;justify-content:center;
  width:clamp(58px,5vw,80px);height:clamp(58px,5vw,80px);border-radius:50%;color:var(--blue);
  background:linear-gradient(160deg,#FFFFFF 0%,#EEF5FE 100%);
  box-shadow:0 2px 6px rgba(16,42,90,.05),0 16px 34px -18px rgba(40,110,210,.32),
             inset 0 1px 0 rgba(255,255,255,.9);
  margin-bottom:clamp(22px,2.4vw,38px)}
.stat-ico::after{content:"";position:absolute;inset:clamp(-9px,-.8vw,-6px);border-radius:50%;
  border:1px solid rgba(160,196,240,.34)}
.stat-ico svg{width:44%;height:44%}

.stat-block .fig{font-size:clamp(48px,6vw,96px);line-height:1;letter-spacing:-.022em;
  color:var(--navy);margin-bottom:clamp(6px,.6vw,10px)}
.stat-block .fig .blue{color:var(--blue)}
.stat-block .fig .fig-lt{color:var(--blue);font-size:clamp(30px,3.9vw,62px);vertical-align:.06em}
.stat-block .fig .fig-unit{font-size:clamp(28px,3.6vw,58px)}
.stat-block.is-text .fig{font-size:clamp(28px,3.6vw,58px);line-height:1.14;letter-spacing:-.014em}
.stat-block .fig-sub{font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(18px,1.9vw,30px);line-height:1.2;letter-spacing:-.012em;color:var(--navy)}
.stat-block .count{display:inline-block;font-variant-numeric:tabular-nums}

/* ---- movimiento: arco que se dibuja desde el centro, iconos con onda, contador ---- */
.stats-arc{clip-path:inset(-14% 50% -18% 50%);transition:clip-path 1.4s var(--ease) .1s}
.stats-3.in .stats-arc{clip-path:inset(-14% -4% -18% -4%)}

.stat-ico{transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.stat-ico::after{transition:transform .35s var(--ease),border-color .35s var(--ease)}
.stat-ico::before{content:"";position:absolute;inset:0;border-radius:50%;
  border:1px solid rgba(11,108,246,.5);opacity:0;pointer-events:none}
.stat-block.in .stat-ico{animation:stat-pop .9s var(--ease) calc(var(--rv-d,0ms) + 80ms) backwards}
.stat-block.in .stat-ico::before{animation:stat-ripple 1.4s var(--ease) calc(var(--rv-d,0ms) + 380ms) backwards}
@keyframes stat-pop{from{opacity:0;transform:translateY(8px) scale(.92)}}
@keyframes stat-ripple{0%{opacity:0;transform:scale(1)}18%{opacity:.75}100%{opacity:0;transform:scale(1.6)}}

@media (hover:hover) and (pointer:fine){
  .stat-block:hover .stat-ico{transform:translateY(-4px);
    box-shadow:0 2px 6px rgba(16,42,90,.06),0 24px 42px -18px rgba(40,110,210,.46),inset 0 1px 0 rgba(255,255,255,.9)}
  .stat-block:hover .stat-ico::after{transform:scale(1.08);border-color:rgba(11,108,246,.32)}
}
@media (prefers-reduced-motion:reduce){
  .stats-3 .stats-arc,.stats-3.in .stats-arc{clip-path:none;transition:none}
  .stat-block.in .stat-ico,.stat-block.in .stat-ico::before{animation:none}
  .stat-block:hover .stat-ico,.stat-block:hover .stat-ico::after{transform:none}
}

/* ---- pie de sección ---- */
/* ---- banda inferior de beneficios ---- */
.what-band{position:relative;margin-top:clamp(48px,5.4vw,88px);
  padding:clamp(30px,3.4vw,54px) 0 clamp(28px,3vw,46px);
  background:linear-gradient(180deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,.38) 100%);
  border-radius:100% 100% 0 0 / clamp(40px,5vw,86px) clamp(40px,5vw,86px) 0 0}
/* cuatro tarjetas con foto: imagen a sangre arriba, icono montado sobre su borde y texto a la izquierda */
.what-benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;
  gap:clamp(14px,1.4vw,24px);max-width:1560px}
.wb-item{--cx:clamp(16px,1.35vw,22px);--ir:clamp(44px,3.3vw,56px);
  position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0;overflow:hidden;
  padding:0 var(--cx) clamp(18px,1.6vw,26px);
  border-radius:var(--r-xl);background:#fff;border:1px solid rgba(208,224,244,.75);
  box-shadow:0 1px 2px rgba(16,42,90,.04),0 18px 42px -26px rgba(16,42,90,.28);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.wb-item > div{min-width:0}
.wb-ph{align-self:stretch;margin:0 calc(var(--cx) * -1);aspect-ratio:413/224;overflow:hidden;background:#E8EEF6}
.wb-ph img{display:block;width:100%;height:100%;object-fit:cover}
.wb-ico{display:flex;align-items:center;justify-content:center;flex:none;
  width:var(--ir);height:var(--ir);border-radius:50%;margin:calc(var(--ir) / -2) 0 clamp(10px,.9vw,14px);
  background:#EAF3FE;color:var(--blue);
  box-shadow:0 0 0 6px rgba(255,255,255,.94),0 10px 20px -10px rgba(10,102,236,.4)}
.wb-ico svg{width:44%;height:44%}
@media (hover:hover) and (pointer:fine){
  .wb-item:hover{transform:translateY(-3px);border-color:rgba(11,108,246,.22);
    box-shadow:0 1px 2px rgba(16,42,90,.05),0 26px 48px -24px rgba(40,110,210,.34)}
}
@media (prefers-reduced-motion:reduce){
  .wb-item:hover{transform:none}
}
.wb-item b{display:block;font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(17px,1.32vw,21.5px);line-height:1.2;letter-spacing:-.012em;color:var(--navy);text-wrap:balance}
.wb-item div span{display:block;margin-top:.42em;font-size:clamp(11px,.8vw,12px);font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:#64738C}
/* la clase doble gana a `.what .wrap`, que si no impone su propio ancho máximo */
@media(max-width:900px){
  .what-benefits.wrap{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px}
}
@media(max-width:560px){
  .what-benefits.wrap{grid-template-columns:1fr;max-width:420px}
}

/* =====================================================================
   02 · TODO LO QUE NECESITA SABER
   ===================================================================== */
.know{padding:clamp(70px,7vw,112px) 0 clamp(52px,5vw,80px)}
.know::before{
  background:
    radial-gradient(900px 700px at 88% 12%,rgba(206,228,252,.55),transparent 62%),
    radial-gradient(700px 560px at 4% 74%,rgba(216,234,253,.5),transparent 64%),
    linear-gradient(180deg,#F6FAFE 0%,#EFF6FE 100%)}
.know-grid{display:grid;grid-template-columns:minmax(0,36fr) minmax(0,64fr);
  gap:clamp(34px,3.4vw,54px);align-items:center}
.know-copy h2{margin:clamp(18px,1.7vw,26px) 0 clamp(14px,1.3vw,20px);line-height:1.14}
.know-copy .sec-sub{max-width:26ch}
.concepts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,22px);
  margin-top:clamp(30px,3.2vw,50px)}
.concept .tile{display:flex;align-items:center;justify-content:center;width:clamp(50px,4.4vw,70px);height:clamp(50px,4.4vw,70px);
  border-radius:clamp(14px,1.25vw,20px);margin-bottom:clamp(14px,1.3vw,20px)}
.concept span:not(.tile){display:block;font-size:clamp(13.5px,1.05vw,17px);font-weight:500;line-height:1.35;
  color:var(--navy);letter-spacing:-.014em}

/* ---- visualización ---- */
.vis{position:relative;width:100%;aspect-ratio:1000/525;container-type:inline-size}
.vis-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.vis-lines path{fill:none;stroke:#B4CFEF;stroke-width:1.4;stroke-dasharray:5 6;vector-effect:non-scaling-stroke}

.unit{position:absolute;left:21.4%;top:15%;width:52%;z-index:2;
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.9);
  border-radius:2.7cqw;padding:1.2cqw;
  box-shadow:0 3px 8px rgba(16,42,90,.05),0 40px 80px -34px rgba(16,42,90,.34);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.unit-ph{position:relative;border-radius:1.9cqw;overflow:hidden;aspect-ratio:557/144}
.unit-ph img{width:100%;height:100%;object-fit:cover}
.unit-ph::after{content:"";position:absolute;inset:0;
  background:linear-gradient(96deg,rgba(10,24,52,.78) 0%,rgba(10,24,52,.34) 40%,rgba(10,24,52,0) 66%)}
.unit-tt{position:absolute;left:2.2cqw;top:1.8cqw;z-index:2;color:#fff}
.unit-tt b{display:block;font-size:2.7cqw;font-weight:500;letter-spacing:-.02em;line-height:1.15}
.unit-tt span{font-size:1.45cqw;color:rgba(255,255,255,.9);letter-spacing:-.008em}
.unit-sync{position:absolute;right:1.3cqw;top:1.4cqw;z-index:2;
  display:inline-flex;align-items:center;gap:.8cqw;background:#fff;border-radius:999px;
  padding:.6cqw 1.1cqw;font-size:1.32cqw;font-weight:500;color:var(--navy);letter-spacing:-.008em;
  box-shadow:0 4px 12px rgba(16,42,90,.12)}
.unit-sync i{width:.9cqw;height:.9cqw;border-radius:50%;background:var(--green);flex:none}


.src{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:1.2cqw;
  background:#fff;border-radius:1.9cqw;padding:1.15cqw 1.5cqw;white-space:nowrap;
  box-shadow:0 2px 6px rgba(16,42,90,.05),0 20px 40px -20px rgba(16,42,90,.28)}
.src .src-i{display:flex;align-items:center;justify-content:center;width:3.4cqw;height:3.4cqw;flex:none;
  color:var(--blue)}
.src-i svg{width:100%;height:100%}
.src b{display:block;font-size:max(12px,1.72cqw);font-weight:500;color:var(--navy);letter-spacing:-.012em;line-height:1.25}
.src span:not(.src-i){display:block;font-size:max(11px,1.5cqw);color:var(--text-soft);letter-spacing:-.008em;line-height:1.3}
.s-pms{left:6.7%;top:4%}
.s-clima{left:2.4%;top:34%}
.s-eventos{left:2.4%;top:56%}
.s-transporte{left:69.7%;top:0}
.s-restaurantes{left:75.2%;top:25%}
.s-futbol{left:75.2%;top:50%}

.ask{position:absolute;right:1%;bottom:2%;z-index:4;display:flex;align-items:center;gap:1.5cqw;
  background:#fff;border-radius:2.2cqw;padding:1.5cqw 1.7cqw;max-width:40%;
  box-shadow:0 3px 8px rgba(16,42,90,.06),0 28px 56px -24px rgba(16,42,90,.32)}
.ask-av{display:flex;align-items:center;justify-content:center;flex:none;
  width:4.6cqw;height:4.6cqw;border-radius:50%;background:var(--blue);color:#fff}
.ask-av svg{width:56%;height:56%}
.ask p{font-size:1.75cqw;line-height:1.35;color:var(--navy);letter-spacing:-.012em}
.ask-go{display:flex;align-items:center;justify-content:center;flex:none;
  width:3.6cqw;height:3.6cqw;border-radius:50%;background:var(--blue);color:#fff}
.ask-go svg{width:44%;height:44%}

/* ---- ficha del alojamiento (landing): filas etiqueta / valor ---- */
.spec{display:flex;flex-direction:column;margin:.6cqw .5cqw 0}
.spec-row{display:flex;align-items:center;justify-content:space-between;gap:1.6cqw;
  padding:1.05cqw .4cqw;border-top:1px solid var(--border-soft)}
.spec-row:first-child{border-top:0}
.spec-row dt{display:flex;align-items:center;gap:1.1cqw;min-width:0;
  font-size:max(11px,1.45cqw);color:var(--text-soft);letter-spacing:-.008em;white-space:nowrap}
.spec-ico{display:flex;align-items:center;justify-content:center;flex:none;
  width:2.9cqw;height:2.9cqw;border-radius:50%;background:var(--light-blue-2);color:var(--blue)}
.spec-ico svg{width:52%;height:52%}
.spec-row dd{font-size:max(11.5px,1.5cqw);font-weight:500;color:var(--navy);letter-spacing:-.01em;
  white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---- tres pilares bajo el titular ---- */
.pillars{list-style:none;max-width:460px;margin-top:clamp(28px,3vw,46px);border-top:1px solid var(--border)}
.pillar{display:flex;align-items:center;gap:clamp(14px,1.2vw,18px);
  padding:clamp(14px,1.25vw,19px) 0;border-bottom:1px solid var(--border)}
.pillar-ico{display:flex;align-items:center;justify-content:center;flex:none;
  width:clamp(40px,3.2vw,48px);height:clamp(40px,3.2vw,48px);border-radius:50%;
  background:linear-gradient(160deg,#FFFFFF 0%,#E6F0FD 100%);color:var(--blue);
  box-shadow:inset 0 0 0 1px rgba(160,196,240,.42)}
.pillar-ico svg{width:46%;height:46%}
.pillar b{display:block;font-size:clamp(15px,1.12vw,17.5px);font-weight:500;line-height:1.3;
  color:var(--navy);letter-spacing:-.014em}
.pillar div span{display:block;margin-top:2px;font-size:clamp(13.5px,.98vw,15px);line-height:1.45;
  color:var(--text-soft);letter-spacing:-.006em}


/* =====================================================================
   03 · SECTORES
   ===================================================================== */
.sectors{padding:clamp(70px,7vw,112px) 0 clamp(70px,7vw,112px)}
.sectors::before{
  background:
    radial-gradient(760px 620px at 2% 30%,rgba(210,230,253,.55),transparent 62%),
    radial-gradient(860px 700px at 98% 76%,rgba(206,228,252,.5),transparent 62%),
    linear-gradient(180deg,#EFF6FE 0%,#F7FBFE 60%,#EFF6FE 100%)}
.sectors-head{position:relative;max-width:1000px;margin-bottom:clamp(32px,3.4vw,54px)}
.sectors-head h2{margin:clamp(16px,1.4vw,22px) 0 clamp(10px,1vw,15px);line-height:1.22;font-size:clamp(25px,2.35vw,38px)}
.head-note{position:absolute;right:0;top:-6%;text-align:center;transform:rotate(-8deg);
  font-size:clamp(15px,1.35vw,21px)}
.head-note svg{display:block;width:clamp(30px,2.6vw,42px);height:auto;margin:6px auto 0;color:var(--blue)}

.sectors-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.2vw,34px)}
.sector{position:relative}
.sector-ph{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:567/233;
  box-shadow:0 20px 40px -26px rgba(16,42,90,.34)}
.sector-ph img{width:100%;height:100%;object-fit:cover}
.sector-body{position:relative;z-index:2;margin:-9% 3% 0;border-radius:var(--r-xl);
  padding:clamp(20px,2.1vw,32px) clamp(20px,2.1vw,32px) clamp(22px,2.2vw,34px);
  background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.9);
  box-shadow:0 3px 8px rgba(16,42,90,.05),0 32px 64px -30px rgba(16,42,90,.30);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sector-top{display:flex;justify-content:flex-end;margin-bottom:clamp(8px,.8vw,12px)}
.sector-main{display:flex;gap:clamp(14px,1.5vw,24px);align-items:flex-start}
.sector-main .tile{width:clamp(48px,4.4vw,70px);height:clamp(48px,4.4vw,70px);
  border-radius:clamp(14px,1.25vw,20px)}
.sector-main h3{margin-bottom:clamp(6px,.6vw,10px)}
.sector-main p{font-size:clamp(14px,1.02vw,16.5px);line-height:1.6;color:var(--text-muted);letter-spacing:-.008em}
.sector-list{list-style:none;margin-top:clamp(16px,1.6vw,24px);padding-top:clamp(16px,1.6vw,24px);
  border-top:1px solid var(--border);display:flex;flex-direction:column;gap:clamp(9px,.9vw,14px)}
.sector-list li{display:flex;align-items:center;gap:12px;font-size:clamp(14px,1.02vw,16.5px);
  color:var(--navy-soft);letter-spacing:-.008em}

/* =====================================================================
   04 · PLANES
   ===================================================================== */
.plans{padding:clamp(70px,7vw,112px) 0 clamp(70px,7vw,112px)}
.plans::before{
  background:
    radial-gradient(900px 720px at 96% 20%,rgba(203,226,252,.6),transparent 62%),
    radial-gradient(700px 600px at 0% 84%,rgba(214,232,253,.55),transparent 64%),
    linear-gradient(180deg,#F7FBFE 0%,#EDF4FD 100%)}
.plans-grid{display:grid;grid-template-columns:minmax(0,52fr) minmax(0,48fr);
  gap:clamp(34px,3.4vw,56px);align-items:center}
.plans-copy h2{margin:clamp(16px,1.4vw,22px) 0 clamp(10px,1vw,15px);line-height:1.22;font-size:clamp(27px,2.7vw,44px)}

.stack{margin-top:clamp(26px,2.6vw,40px);border-radius:var(--r-xl);
  padding:clamp(18px,1.8vw,28px) clamp(18px,1.8vw,28px) clamp(18px,1.8vw,28px) clamp(46px,4.4vw,70px);
  background:linear-gradient(160deg,rgba(255,255,255,.78),rgba(255,255,255,.42));
  border:1px solid rgba(255,255,255,.86);position:relative;
  box-shadow:0 2px 6px rgba(16,42,90,.03),0 26px 54px -32px rgba(16,42,90,.24)}
.plan{position:relative;display:flex;gap:clamp(14px,1.4vw,22px);align-items:flex-start;
  background:#fff;border-radius:var(--r-md);padding:clamp(16px,1.6vw,24px);
  box-shadow:0 1px 2px rgba(16,42,90,.04),0 14px 30px -20px rgba(16,42,90,.22)}
.plan + .plan{margin-top:clamp(12px,1.2vw,18px)}
.plan::before{content:"";position:absolute;left:clamp(-28px,-2.6vw,-42px);top:50%;
  width:clamp(15px,1.3vw,21px);height:clamp(15px,1.3vw,21px);border-radius:50%;
  background:#fff;border:2px solid #C8D8EE;transform:translateY(-50%);z-index:2}
.plan.on::before{background:var(--blue);border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(11,108,246,.16)}
.plan::after{content:"";position:absolute;left:clamp(-20px,-1.85vw,-32px);top:50%;bottom:auto;
  width:2px;height:calc(100% + clamp(12px,1.2vw,18px));background:#D9E4F3;z-index:1}
.plan:last-child::after{display:none}
.plan .tile{width:clamp(44px,3.8vw,60px);height:clamp(44px,3.8vw,60px);border-radius:clamp(13px,1.15vw,18px)}
.plan-h{display:flex;align-items:center;gap:clamp(10px,1vw,16px);flex-wrap:wrap;margin-bottom:clamp(6px,.6vw,10px)}
.plan-h h3{font-size:clamp(17px,1.4vw,23px)}
.plan p{font-size:clamp(13.5px,1vw,16px);line-height:1.55;color:var(--text-muted);letter-spacing:-.008em}
.plans-cta{display:flex;align-items:center;gap:clamp(20px,2.4vw,40px);flex-wrap:wrap;
  margin:clamp(26px,2.6vw,40px) 0 clamp(18px,1.8vw,26px)}

/* paneles 3D */
.deck{position:relative;container-type:inline-size;aspect-ratio:660/700}
.deck-inner{position:absolute;inset:0;perspective:1400px}
.slab{position:absolute;left:6%;width:82%;height:26%;border-radius:3cqw;
  display:flex;align-items:center;gap:2.6cqw;padding:0 3.4cqw;
  background:linear-gradient(148deg,rgba(255,255,255,.94),rgba(238,246,255,.62));
  border:1px solid rgba(255,255,255,.95);
  box-shadow:0 4px 12px rgba(16,42,90,.05),0 40px 70px -34px rgba(16,42,90,.34);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transform:rotateY(-17deg) rotateX(6deg) rotate(-2deg)}
.slab .tile{width:8.4cqw;height:8.4cqw;border-radius:2.2cqw;background:#fff;box-shadow:var(--sh-sm)}
.slab b{font-size:3.4cqw;font-weight:500;letter-spacing:-.02em;color:var(--navy)}
.slab i{position:absolute;right:4.4cqw;top:26%;width:1.9cqw;height:1.9cqw;border-radius:50%;
  background:var(--green)}
.slab-1{top:4%;z-index:3}
.slab-2{top:32%;left:2%;z-index:2}
.slab-3{top:60%;left:-1%;z-index:1}
.deck-note{position:absolute;text-align:center;font-size:clamp(15px,1.35vw,21px);z-index:4}
.deck-note svg{display:block;width:clamp(28px,2.4vw,38px);height:auto;color:var(--blue)}
.deck-note.n1{left:2%;top:-2%}
.deck-note.n1 svg{margin:4px 0 0 auto}
.deck-note.n2{right:0;bottom:-4%}
.deck-note.n2 svg{margin:0 auto 4px}
.deck-arrow{position:absolute;left:-2%;top:34%;width:12%;color:#9CC1F2;z-index:4}

/* =====================================================================
   CIERRE · TU TIEMPO VALE MÁS
   ===================================================================== */
.close{position:relative;padding:clamp(70px,7vw,112px) 0 clamp(40px,4vw,64px);overflow:hidden}
.close::before{
  background:
    radial-gradient(820px 680px at 6% 18%,rgba(211,231,253,.6),transparent 62%),
    radial-gradient(900px 700px at 78% 70%,rgba(206,228,252,.45),transparent 64%),
    linear-gradient(180deg,#F6FAFE 0%,#EFF6FE 100%)}
.close-ph{position:absolute;right:0;top:0;width:46%;height:86%;z-index:0;pointer-events:none}
.close-ph img{width:100%;height:100%;object-fit:cover;object-position:52% 38%;
  -webkit-mask-image:radial-gradient(72% 82% at 62% 46%,#000 52%,transparent 82%);
  mask-image:radial-gradient(72% 82% at 62% 46%,#000 52%,transparent 82%)}
.close-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,48fr) minmax(0,32fr) minmax(0,20fr);
  gap:clamp(28px,3vw,48px);align-items:center}
.close-copy h2{margin:clamp(16px,1.4vw,22px) 0 clamp(24px,2.4vw,38px);line-height:1.24;font-size:clamp(28px,2.85vw,46px)}
.close-copy .btn{height:clamp(52px,3.8vw,62px);padding:0 clamp(28px,2.4vw,38px);
  font-size:clamp(16px,1.25vw,20px)}

.outcomes{display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px)}
.outcome{display:flex;align-items:center;gap:clamp(12px,1.2vw,18px);
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.9);
  border-radius:var(--r-lg);padding:clamp(14px,1.4vw,20px) clamp(16px,1.5vw,22px);
  box-shadow:0 2px 6px rgba(16,42,90,.04),0 22px 44px -26px rgba(16,42,90,.26);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.outcome .tile{width:clamp(40px,3.3vw,52px);height:clamp(40px,3.3vw,52px);
  border-radius:clamp(12px,1.05vw,16px)}
.outcome b{display:block;font-size:clamp(14px,1.05vw,17px);font-weight:500;color:var(--navy);letter-spacing:-.012em}
.outcome span{font-size:clamp(12.5px,.92vw,14.5px);color:var(--text-muted);letter-spacing:-.008em}
.outcome .chk{margin-left:auto;width:clamp(22px,1.7vw,27px);height:clamp(22px,1.7vw,27px);background:var(--green)}
.outcome .chk svg{width:44%;height:44%}

.close-note-r{position:absolute;right:8%;top:0;z-index:3;text-align:center;font-size:clamp(15px,1.35vw,21px);transform:rotate(-7deg);text-shadow:0 1px 10px rgba(255,255,255,.9)}
.close-note-r svg{display:block;width:clamp(30px,2.6vw,42px);height:auto;color:var(--blue);margin:6px auto 0}

.benefits{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(12px,1.4vw,22px);margin-top:clamp(38px,3.8vw,60px)}
.benefit{display:flex;align-items:center;gap:clamp(11px,1.1vw,16px);padding-right:clamp(12px,1.4vw,22px)}
.benefit + .benefit{border-left:1px solid var(--border);padding-left:clamp(12px,1.4vw,22px)}
.benefit .tile{width:clamp(40px,3.3vw,52px);height:clamp(40px,3.3vw,52px);border-radius:50%}
.benefit b{display:block;font-size:clamp(13px,.96vw,15.5px);font-weight:500;color:var(--navy);letter-spacing:-.012em}
.benefit span{font-size:clamp(12.5px,.94vw,15px);color:var(--text-muted);letter-spacing:-.008em}

/* =====================================================================
   FOOTER
   ===================================================================== */
.foot{background:#fff;border-top:1px solid var(--border);padding:clamp(32px,3.2vw,48px) 0}
.foot-in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot-links{display:flex;gap:clamp(16px,1.8vw,28px);flex-wrap:wrap}
.foot-links a{font-size:14.5px;color:var(--text-muted);transition:color .18s ease}
.foot-links a:hover{color:var(--blue)}
.foot small{font-size:13.5px;color:var(--text-soft)}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:1180px){
  .nav-links{gap:24px;margin-left:30px}
  .nav-links a{font-size:14px}
  .hero-in{gap:28px}
  .concepts{gap:14px}
}

@media(max-width:980px){
  /* nav */
  .nav-links,.nav-login{display:none}
  .nav-toggle{display:flex}

  /* hero */
  .hero{padding:104px 0 64px}
  .hero-in{grid-template-columns:1fr;gap:52px}
  .hero h1{max-width:18ch}
  .hero .lede{max-width:52ch}
  .h-hero .hero-in{grid-template-columns:1fr}
  .h-conv{justify-self:start;max-width:480px}
  .h-hero-bg{background-size:cover;background-position:58% 50%}
  .h-hero-bg::after{background:linear-gradient(180deg,rgba(247,250,254,.95) 0%,rgba(247,250,254,.9) 46%,rgba(247,250,254,.3) 70%,rgba(247,250,254,.55) 90%,#F7FAFE 100%)}

  /* 01 */
  .stats-3{grid-template-columns:1fr;gap:clamp(40px,6vw,64px);max-width:520px;margin:0 auto}
  .stats-arc{display:none}
  .stat-block.up{margin-top:0}

  /* 02 */
  .know-grid{grid-template-columns:1fr;gap:44px}
  .know-copy .sec-sub{max-width:46ch}
  .concepts{max-width:560px}
  .vis{max-width:660px;margin:0 auto}

  /* 03 */
  .sectors-grid{grid-template-columns:1fr;gap:34px;max-width:560px;margin:0 auto}
  .head-note{display:none}

  /* 04 */
  .plans-grid{grid-template-columns:1fr;gap:48px}
  .deck{width:100%;max-width:520px;margin:0 auto;aspect-ratio:660/620}

  /* cierre */
  .close{display:flex;flex-direction:column}
  .close-in{grid-template-columns:1fr;gap:38px;order:1}
  .close-bottom{order:3}
  .close-ph{order:2;position:relative;width:100%;height:auto;aspect-ratio:16/10;margin-top:34px;border-radius:var(--r-xl);overflow:hidden}
  .close-ph img{-webkit-mask-image:none;mask-image:none;border-radius:var(--r-xl)}
  .close-note-r{display:none}
  .outcomes{max-width:520px}
  .benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .benefit,.benefit + .benefit{border-left:0;padding-left:0;padding-right:0}
}

@media(max-width:620px){
  .hero{padding:92px 0 52px}
  .deck-note{display:none}
  .h-conv{max-width:none;gap:12px}
  .h-bub{max-width:90%}
  .h-bub p{font-size:14px}
  .hero-cta{gap:16px}
  .hero-cta .btn{width:100%}

  .what-head{text-align:left}
  .what-head .sec-sub{margin:0}

  .vis{aspect-ratio:auto;display:flex;flex-direction:column;gap:14px;container-type:normal}
  .vis-lines{display:none}
  .unit{position:static;width:100%;padding:10px;border-radius:20px}
  .unit-ph{border-radius:14px;aspect-ratio:16/9}
  .unit-tt b{font-size:22px}.unit-tt span{font-size:13px}
  .unit-sync{font-size:12px;padding:6px 10px;gap:6px}.unit-sync i{width:7px;height:7px}
  .spec{margin:6px 4px 0}
  .spec-row{padding:11px 4px;gap:12px}
  .spec-row dt{font-size:13.5px;gap:10px}
  .spec-ico{width:28px;height:28px}
  .spec-row dd{font-size:14px}
  .srcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;order:-1}
  .src{position:static;left:auto;right:auto;top:auto;white-space:normal;
    padding:12px 14px;gap:10px;border-radius:14px}
  .src-i{width:26px;height:26px}
  .src b{font-size:14px}.src span:not(.src-i){font-size:12.5px}
  .ask{position:static;max-width:none;padding:14px 16px;border-radius:16px;gap:12px}
  .ask-av{width:38px;height:38px}
  .ask p{font-size:14.5px}
  .ask-go{width:30px;height:30px}

  .sector-body{margin:-14% 4% 0}
  .stack{padding:16px 16px 16px 42px}
  .plan::before{left:-26px}
  .plan::after{left:-19px}
  .plans-cta{gap:16px}
  .plans-cta .btn{width:100%}

  .deck{aspect-ratio:1/1}
  .slab{height:24%;border-radius:18px}
  .deck-note{font-size:16px}

  .benefits{grid-template-columns:1fr;gap:16px}
  .close-copy .btn{width:100%}
  .foot-in{flex-direction:column;align-items:flex-start;gap:16px}
}

/* ---- ajustes finos contra la referencia ---- */
.what .wrap{max-width:1480px}


@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  /* la tira de PMS queda estática y centrada, sin recorte lateral */
  .pms{padding-left:clamp(20px,3vw,36px);padding-right:clamp(20px,3vw,36px)}
  .pms-mask{-webkit-mask-image:none;mask-image:none}
  .pms-track{animation:none!important;transform:none!important;width:auto;justify-content:center}
  .pms-row{flex-wrap:wrap;justify-content:center;padding-right:0;row-gap:14px}
  .pms-row[aria-hidden="true"]{display:none}
}

/* =====================================================================
   COMPARTIDO · piezas añadidas para las páginas interiores
   ===================================================================== */
/* página actual: texto azul con la línea fija */
.nav-links a.is-active{color:var(--blue);font-weight:600}
.nav-links a.is-active::after{transform:scaleX(1)}
.eyebrow-mono{font-family:'DM Mono',ui-monospace,'SFMono-Regular',Consolas,monospace;font-weight:500;letter-spacing:.2em}

.btn-s{background:rgba(255,255,255,.82);color:var(--navy);
  box-shadow:0 0 0 1px var(--border),var(--sh-sm);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.btn-s:hover{background:#fff;color:var(--blue);box-shadow:0 0 0 1px #D5E3F5,var(--sh-md)}
.btn-s:active{transform:translateY(1px)}

/* =====================================================================
   PRODUCTO · 01 HERO — RESPONDER NO ES RESOLVER
   ===================================================================== */
/* estructura propia (no la retícula partida de la portada):
   texto centrado sobre la foto de fondo; las conversaciones se ven en la sección 02 */
.p-hero{padding-bottom:clamp(96px,9vw,150px)}
.p-hero-in{display:flex;flex-direction:column;align-items:center}
.p-hero-copy{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:920px}
.p-hero h1{font-size:clamp(34px,4.4vw,72px);line-height:1.08;letter-spacing:-.02em;max-width:none}
.p-hero .lede{max-width:56ch;margin:0 auto clamp(26px,2.4vw,36px)}
.p-hero .hero-cta{justify-content:center;gap:12px;margin-bottom:clamp(12px,1.1vw,16px)}
.p-micro{font-size:clamp(13px,.92vw,14.5px);color:var(--text-muted);letter-spacing:-.006em}

/* ---- foto de fondo (Sagrada Familia al anochecer), sutil e integrada ----
   capa de foto → velo blanco radial en el centro para el texto → fundido al fondo por abajo */
.p-hero-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url("assets/producto-hero-bg.jpg") 72% 38%/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 66%,transparent 100%);
  animation:p-fade 1.2s var(--ease) both}
.p-hero-bg::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 46% 58% at 50% 50%,rgba(247,250,254,.97) 0%,rgba(247,250,254,.92) 42%,rgba(247,250,254,.7) 72%,rgba(247,250,254,.5) 100%),
    linear-gradient(180deg,rgba(247,250,254,.72) 0%,rgba(247,250,254,.34) 30%,rgba(247,250,254,.34) 70%,rgba(247,250,254,.6) 100%)}

/* ---- pastillas de estado (las usan las secciones 02–12) ---- */
.p-tag{grid-column:1/-1;justify-self:start;display:inline-flex;align-items:center;gap:5px;
  border-radius:999px;padding:3px 10px;font-size:12px;font-weight:500;line-height:1.5;letter-spacing:-.004em;white-space:nowrap}
.p-tag svg{width:11px;height:11px;flex:none}
.p-tag-wait{background:#FFF1BF;color:#4D3900}
.p-tag-none{background:#E3E8EF;color:#2E3850}
.p-tag-ok{background:var(--green-wash);color:var(--green-ink)}
.p-tag-sale{background:var(--light-blue);color:var(--blue-deep)}
.p-tag-esc{background:#FFF1DC;color:#8A4B00}

/* ---- entrada ---- */
@keyframes p-fade{from{opacity:0}}

@media(max-width:980px){
  .p-hero h1{max-width:none}
}
@media(max-width:620px){
  .p-hero{padding-bottom:72px}
  .p-hero-copy{align-items:flex-start;text-align:left}
  .p-hero-bg{background-position:82% 30%}
  .p-hero-bg::after{background:linear-gradient(180deg,rgba(247,250,254,.8) 0%,rgba(247,250,254,.86) 45%,rgba(247,250,254,.7) 100%)}
  .p-hero .lede{margin-left:0}
}
@media(prefers-reduced-motion:reduce){
  .p-hero-bg{animation:none}
}

/* =====================================================================
   PRODUCTO · SECCIONES 02–12
   ===================================================================== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* avatar de Livyo (imagen: funciona también abriendo el archivo desde disco) */
.lv-av{display:inline-flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;border-radius:50%;
  background:var(--blue);box-shadow:0 4px 12px rgba(10,102,236,.3)}
.lv-av img{width:60%;height:auto;filter:brightness(0) invert(1)}

/* pills y tiles añadidos */
.badge-amber{background:#FFF1DC;color:#8A4B00}
.p-tag-urgent{background:#FDE8E8;color:#A1261F}
.p-tag-urgent i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.tile.t-green{background:linear-gradient(155deg,#EEF9F3 0%,#D6F0E2 100%);color:var(--green-ink)}
.tile.t-amber{background:linear-gradient(155deg,#FFF6E8 0%,#FFE8C6 100%);color:#A35F00}
.tile.t-grey{background:linear-gradient(155deg,#F2F5F9 0%,#E2E8F0 100%);color:#4A5672}

/* ---- ritmo de fondos ---- */
.p-sec{padding:clamp(72px,7.4vw,120px) 0}
.p-sec.is-white::before{background:linear-gradient(180deg,#FFFFFF 0%,#FCFDFF 100%)}
.p-sec.is-tint::before{background:
  radial-gradient(900px 620px at 94% 6%,rgba(206,228,252,.5),transparent 62%),
  radial-gradient(760px 560px at 2% 96%,rgba(214,232,253,.45),transparent 64%),
  linear-gradient(180deg,#F3F8FE 0%,#EEF5FD 100%)}
.p-sec.is-feature::before{background:
  radial-gradient(980px 620px at 50% 0%,rgba(190,219,252,.62),transparent 66%),
  radial-gradient(760px 560px at 100% 100%,rgba(203,226,252,.5),transparent 64%),
  linear-gradient(180deg,#EAF3FE 0%,#F1F7FE 100%)}

.p-head{max-width:780px;margin-bottom:clamp(32px,3.4vw,54px)}
.p-head.center{max-width:1120px;margin-left:auto;margin-right:auto;text-align:center}
.p-head h2{margin:clamp(12px,1.2vw,18px) 0 0;font-size:clamp(28px,3vw,48px);line-height:1.16}
.p-head h2:first-child{margin-top:0}
.p-head .sec-sub{max-width:58ch;margin-top:clamp(12px,1.1vw,18px)}
.p-head.center .sec-sub{margin-left:auto;margin-right:auto}

.p-card{background:rgba(255,255,255,.94);border:1px solid #fff;border-radius:var(--r-xl);padding:clamp(22px,2.2vw,32px);
  box-shadow:0 0 0 1px var(--border-soft),0 2px 6px rgba(16,42,90,.04),0 26px 54px -30px rgba(16,42,90,.26)}
.p-card .tile{width:52px;height:52px;border-radius:15px;margin-bottom:18px}
.p-card h3{margin-bottom:10px}
.p-card p{font-size:clamp(14.5px,1.05vw,16.5px);line-height:1.62;color:var(--text-muted);letter-spacing:-.008em}
.p-foot-chip{display:flex;justify-content:center;margin-top:clamp(26px,2.8vw,40px)}
.p-foot-chip .badge,.p-steps .badge{gap:8px;padding:8px 16px 8px 13px}
.p-foot-chip .badge svg,.p-steps .badge svg{width:16px;height:16px;color:var(--blue);flex:none}

/* ---- 02 · conversaciones ---- */
.cv-tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 12px;margin-bottom:clamp(14px,1.6vw,22px);
  scrollbar-width:none;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.cv-tabs::-webkit-scrollbar{display:none}
.cv-tab{flex:none;scroll-snap-align:start;display:inline-flex;align-items:center;gap:10px;
  height:48px;padding:0 18px 0 7px;border-radius:999px;background:#fff;
  font-size:clamp(14px,1vw,15px);font-weight:500;letter-spacing:-.008em;color:var(--navy-soft);
  box-shadow:0 0 0 1px var(--border),var(--sh-xs);
  transition:background .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease)}
/* icono de cada caso: círculo claro con trazo azul; se invierte en la pestaña activa */
.cv-tab-i{display:flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:50%;
  background:linear-gradient(160deg,#FFFFFF 0%,#E6F0FD 100%);color:var(--blue);
  box-shadow:inset 0 0 0 1px rgba(160,196,240,.45);
  transition:background .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease)}
.cv-tab-i svg{width:17px;height:17px}
.cv-tab:hover{color:var(--blue);box-shadow:0 0 0 1px #D2E2F6,var(--sh-sm)}
.cv-tab[aria-selected="true"]{background:var(--navy);color:#fff;box-shadow:0 0 0 1px var(--navy),var(--sh-sm)}
.cv-tab[aria-selected="true"] .cv-tab-i{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.cv-tab:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* una sola columna centrada: la conversación es la protagonista */
.cv .cv-tabs{width:max-content;max-width:100%;margin-left:auto;margin-right:auto}
.cv-panel{max-width:900px;margin:0 auto}
.cv-panel[hidden]{display:none}
.cv-panel:focus-visible{outline:2px solid var(--blue);outline-offset:6px;border-radius:var(--r-xl)}
.cv-panel:not([hidden]){animation:p-fade .45s var(--ease)}
.cv-chat{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-md)}
.cv-head{display:flex;align-items:center;gap:12px;padding:14px clamp(16px,1.8vw,22px);border-bottom:1px solid var(--border-soft);background:#FBFCFE}
.cv-head .tile{width:38px;height:38px;border-radius:12px}
.cv-head .tile svg{width:50%;height:50%}
.cv-head b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--navy);line-height:1.3}
.cv-head div span{font-size:13px;color:var(--text-muted);letter-spacing:-.006em}
.cv-head .badge{margin-left:auto}
.cv-head > div{min-width:0}
/* resultado de la conversación, en la cabecera del chat */
.cv-head .cv-out{margin-left:auto;font-size:12.5px;padding:5px 12px}
.cv-head .badge + .cv-out{margin-left:0}
.cv-thread{display:flex;flex-direction:column;gap:12px;padding:clamp(18px,2vw,26px) clamp(14px,1.8vw,22px)}

.cv-m{display:flex;align-items:flex-start;gap:10px;max-width:86%}
.cv-m.l,.cv-m.t{margin-left:auto;flex-direction:row-reverse}
.cv-av{display:flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;border-radius:50%;
  background:#E4EAF3;color:#6A7A99;margin-top:2px}
.cv-av svg{width:54%;height:54%}
.cv-m.l .cv-av{background:var(--blue);box-shadow:0 4px 12px rgba(10,102,236,.3)}
.cv-av img{width:60%;height:auto;filter:brightness(0) invert(1)}
.cv-m.t .cv-av{background:var(--navy);color:#fff;font-size:11px;font-weight:600;letter-spacing:-.01em}
.cv-bw{min-width:0}
.cv-b{border-radius:18px;padding:10px 14px 7px}
.cv-b p{font-size:clamp(14px,1vw,15px);line-height:1.5;letter-spacing:-.008em}
.cv-b time{display:block;text-align:right;margin-top:2px;font-size:11.5px;font-variant-numeric:tabular-nums}
.cv-m.g .cv-b{background:#EEF2F7;color:var(--navy);border-top-left-radius:6px}
.cv-m.g .cv-b time{color:var(--text-muted)}
.cv-m.l .cv-b{background:var(--blue);color:#fff;border-top-right-radius:6px}
.cv-m.l .cv-b time{color:#fff}
.cv-m.t .cv-b{background:#fff;color:var(--navy);box-shadow:0 0 0 1px #D5DEEA;border-top-right-radius:6px}
.cv-m.t .cv-b time{color:var(--text-muted)}
.cv-tr{margin-top:5px;padding:0 6px;font-size:12.5px;line-height:1.45;font-style:italic;color:var(--text-muted)}
.cv-m.l .cv-tr{text-align:right}
.cv-sys{align-self:center;display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:7px 14px;border-radius:999px;
  background:#FFF1DC;color:#8A4B00;font-size:12.5px;font-weight:500;letter-spacing:-.004em;text-align:center}
.cv-sys svg{width:14px;height:14px;flex:none}


/* ---- 03 · camino ---- */
.p-steps{--gap:clamp(24px,2.8vw,48px);list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.p-step{position:relative;display:flex;flex-direction:column;align-items:flex-start;
  background:rgba(255,255,255,.94);border:1px solid #fff;border-radius:var(--r-xl);padding:clamp(22px,2.2vw,32px);
  box-shadow:0 0 0 1px var(--border-soft),0 2px 6px rgba(16,42,90,.04),0 26px 54px -30px rgba(16,42,90,.26)}
.p-step + .p-step::after{content:"";position:absolute;top:calc(clamp(22px,2.2vw,32px) + 26px);left:calc(var(--gap) * -1 - 1px);
  width:calc(var(--gap) + 2px);border-top:2px dashed #9CC1F2}
.p-step + .p-step::before{content:"";position:absolute;z-index:1;top:calc(clamp(22px,2.2vw,32px) + 13px);left:calc(var(--gap) / -2 - 13px);
  width:26px;height:26px;border-radius:50%;background-color:#fff;box-shadow:0 0 0 1px #D2E2F6,var(--sh-sm);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A66EC' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12h14M13 6.5l5.5 5.5L13 17.5'/%3E%3C/svg%3E");
  background-size:13px;background-position:center;background-repeat:no-repeat}
.p-step-n{font-family:'Playfair Display',Georgia,serif;font-size:clamp(46px,4.2vw,66px);line-height:52px;color:var(--blue);letter-spacing:-.02em}
.p-step .tile{width:52px;height:52px;border-radius:15px}
.p-step .tile svg{width:48%;height:48%}
.p-step h3{margin-bottom:10px}
.p-step p{font-size:clamp(14.5px,1.05vw,16.5px);line-height:1.62;color:var(--text-muted);letter-spacing:-.008em;margin-bottom:20px}
.p-step .badge{margin-top:auto}

/* ---- 03 · camino con fotos (.has-ph) ---- */
.p-camino .wrap{position:relative}
.p-camino-bg{position:absolute;left:0;right:0;top:0;height:clamp(620px,58vw,900px);z-index:-1;pointer-events:none}
.p-camino-bg img{position:absolute;top:0;height:100%;width:auto;max-width:none;opacity:.95;
  -webkit-mask-image:linear-gradient(var(--dir),#000 30%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 18%,#000 62%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(var(--dir),#000 30%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 18%,#000 62%,transparent 100%);
  mask-composite:intersect}
.p-camino-bg .l{left:0;--dir:90deg}
.p-camino-bg .r{right:0;--dir:270deg}

.p-camino-note{position:absolute;right:clamp(0px,4vw,80px);top:clamp(26px,3vw,48px);transform:rotate(-7deg);
  text-align:center;font-size:clamp(19px,1.6vw,26px);line-height:1.15}
.p-camino-note svg{display:block;width:clamp(22px,1.8vw,30px);height:auto;margin:4px 0 0 auto;color:var(--blue)}

.p-steps.has-ph .p-step{padding:8px}
.p-step-media{position:relative;width:100%}
.p-step-ph{margin:0;width:100%;aspect-ratio:401/116;border-radius:calc(var(--r-xl) - 7px);overflow:hidden;background:var(--light-blue-2)}
.p-step-ph img{display:block;width:100%;height:100%;object-fit:cover}
.p-steps.has-ph .p-step-media .tile{position:absolute;right:clamp(16px,1.6vw,24px);bottom:-26px;z-index:1;
  box-shadow:0 0 0 4px #fff,var(--sh-sm)}
.p-step-body{display:flex;flex-direction:column;align-items:flex-start;flex:1;width:100%;
  padding:clamp(14px,1.4vw,20px) clamp(14px,1.6vw,24px) clamp(14px,1.5vw,22px)}
.p-steps.has-ph .p-step-n{margin-bottom:clamp(8px,.8vw,12px)}
/* conectores a media altura de la foto */
.p-steps.has-ph .p-step + .p-step::after{top:calc(8px + clamp(52px,5.2vw,74px))}
.p-steps.has-ph .p-step + .p-step::before{top:calc(8px + clamp(52px,5.2vw,74px) - 12px)}


/* ---- 04 · escalado ---- */
.p-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(34px,4.4vw,80px);align-items:center}
.p-split .p-head{margin-bottom:0}
.p-checks{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:clamp(24px,2.6vw,36px)}
.p-checks li{display:flex;align-items:center;gap:12px;font-size:clamp(15px,1.12vw,17.5px);font-weight:500;color:var(--navy);letter-spacing:-.012em}
.p-checks .chk{width:24px;height:24px}
.p-esc{position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;
  box-shadow:0 3px 8px rgba(16,42,90,.05),0 44px 90px -40px rgba(16,42,90,.36)}
.p-esc-kicker{display:flex;align-items:center;gap:10px;padding:12px clamp(16px,1.8vw,24px);background:var(--light-blue-2);
  border-bottom:1px solid var(--border-soft);font-size:13px;font-weight:500;color:var(--blue-deep);letter-spacing:-.006em}
.p-esc-kicker .lv-av{width:24px;height:24px;box-shadow:none}
.p-esc-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:18px clamp(16px,1.8vw,24px);border-bottom:1px solid var(--border-soft)}
.p-esc-head .tile{width:42px;height:42px;border-radius:13px}
.p-esc-head .tile svg{width:50%;height:50%}
.p-esc-head b{display:block;font-size:16px;font-weight:600;color:var(--navy);letter-spacing:-.012em;line-height:1.3}
.p-esc-head div span{font-size:13.5px;color:var(--text-muted)}
.p-esc-head .p-tag{margin-left:auto;font-size:12.5px;padding:5px 12px}
.p-esc-body{padding:4px clamp(16px,1.8vw,24px)}
.p-esc-body > div{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;padding:15px 0;border-bottom:1px solid var(--border-soft)}
.p-esc-body > div:last-child{border-bottom:0}
.p-esc-body dt{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);padding-top:3px}
.p-esc-body dd{font-size:clamp(14px,1vw,15.5px);line-height:1.55;color:var(--navy);letter-spacing:-.008em}
.p-esc-to{display:flex;flex-wrap:wrap;gap:8px}
.p-to{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;font-size:13px;font-weight:500;
  color:var(--text-muted);box-shadow:inset 0 0 0 1px var(--border)}
.p-to.on{background:#FFF1DC;color:#8A4B00;box-shadow:none}
.p-to svg{width:12px;height:12px;flex:none}
.p-esc-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px clamp(16px,1.8vw,24px);border-top:1px solid var(--border-soft);background:#FBFCFE;font-size:13px;color:var(--text-muted)}

/* ---- 05 · control ---- */
.p-cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,28px)}
.p-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.p-card-top .p-tag{font-size:12.5px;padding:4px 11px}

/* ---- 06 · conocimiento ---- */
.p-flow{list-style:none;position:relative;display:flex;flex-direction:column;gap:clamp(18px,1.8vw,26px);margin-top:clamp(28px,3vw,44px)}
.p-flow::before{content:"";position:absolute;left:17px;top:18px;bottom:18px;width:2px;background:#D9E4F3}
.p-flow li{position:relative;display:flex;gap:16px;align-items:flex-start}
.p-flow-n{display:flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;border-radius:50%;
  background:#fff;color:var(--blue);font-family:'Playfair Display',Georgia,serif;font-size:18px;
  box-shadow:0 0 0 1px #D2E2F6,var(--sh-sm)}
.p-flow li:first-child .p-flow-n{background:var(--blue);color:#fff;box-shadow:0 0 0 4px rgba(10,102,236,.14)}
.p-flow b{display:block;font-size:clamp(15.5px,1.15vw,18px);font-weight:600;color:var(--navy);letter-spacing:-.012em;line-height:1.35;padding-top:6px}
.p-flow span:not(.p-flow-n){display:block;margin-top:3px;font-size:clamp(14px,1vw,15.5px);color:var(--text-muted);letter-spacing:-.008em}

/* ---- 07 · por qué ---- */
.p-why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,28px)}
.p-why-card{display:flex;flex-direction:column;padding:clamp(26px,2.6vw,40px)}
.p-why-card h3{font-size:clamp(21px,1.75vw,28px);margin-bottom:14px}
.p-why-card > p:not(.p-why-meta){margin-bottom:24px}
.p-why-card .p-why-meta{margin-top:auto;padding-top:22px;border-top:1px solid var(--border);
  font-size:13.5px;color:var(--text-muted);letter-spacing:-.006em}
.p-why-meta b{color:var(--navy);font-weight:600}
.p-why-fig{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.p-why-card .p-why-fig b{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:clamp(54px,5vw,84px);line-height:.9;letter-spacing:-.022em;color:var(--navy)}

/* ---- 08 · comparativa ---- */
.p-cmp-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-md)}
.p-cmp{width:100%;border-collapse:collapse;table-layout:fixed}
.p-cmp th,.p-cmp td{padding:18px clamp(16px,1.8vw,26px);text-align:left;vertical-align:top;border-top:1px solid var(--border-soft);
  font-size:clamp(14px,1.04vw,16px);line-height:1.5;letter-spacing:-.008em}
.p-cmp thead th{border-top:0;padding-top:16px;padding-bottom:16px;background:#FBFCFE;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.p-cmp thead th:first-child{width:28%}
.p-cmp thead th.c-liv{background:#EAF3FE;color:var(--blue-deep)}
.p-cmp thead th.c-liv .lv-av{width:22px;height:22px;margin-right:9px;vertical-align:-6px;box-shadow:none}
.p-cmp tbody th{font-weight:600;color:var(--navy)}
.p-cmp td.c-pms{color:var(--text-muted)}
.p-cmp td.c-liv{background:var(--light-blue-2);color:var(--navy);font-weight:500}
.p-cmp td .chk{float:left;width:20px;height:20px;margin:2px 10px 0 0}
.p-cmp td .chk svg{width:11px;height:11px}
.p-cmp .x{float:left;width:12px;height:2px;margin:11px 12px 0 2px;border-radius:2px;background:#AEB9CA}
.p-cmp td.c-liv,.p-cmp td.c-pms{overflow:hidden}

/* ---- marcador de captura de pantalla (lo usan otras secciones de producto) ---- */
.p-ph{position:absolute;inset:0;display:grid;grid-template-columns:22% 1fr}
.p-ph b{background:#EEF2F7;border-right:1px solid var(--border)}
.p-ph div{display:flex;flex-direction:column;gap:9%;padding:9% 8%}
.p-ph i{display:block;height:9%;border-radius:6px;background:#E9EEF5}
.p-ph i:nth-child(2){width:78%}.p-ph i:nth-child(3){width:88%}.p-ph i:nth-child(4){width:62%}
.p-ph span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:6px 13px;border-radius:999px;background:#fff;
  box-shadow:var(--sh-sm);font-size:12.5px;font-weight:500;color:var(--text-muted);white-space:nowrap}

/* ---- 10 · canales e idiomas ---- */
.p-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.8vw,28px)}
.p-otas{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.p-otas li{display:flex;align-items:center;height:48px;padding:0 20px;border-radius:14px;background:#F6F8FB;
  box-shadow:inset 0 0 0 1px var(--border-soft);font-size:17px;font-weight:600;letter-spacing:-.02em;color:#56627C}
.p-otas li img{height:22px;width:auto;display:block}
.p-langs{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.p-langs .badge{gap:9px;padding:6px 15px 6px 7px;box-shadow:0 0 0 1px var(--border-soft),var(--sh-sm)}
.flag{display:block;flex:none;width:22px;height:22px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px rgba(10,24,52,.1)}
.flag svg{display:block;width:100%;height:100%}

/* ---- 12 · faq + cta ---- */
.p-faq-grid{display:grid;grid-template-columns:minmax(0,34fr) minmax(0,66fr);gap:clamp(30px,4vw,72px);align-items:start}
.p-faq{display:flex;flex-direction:column;gap:12px}
.p-faq details{background:#fff;border-radius:var(--r-lg);box-shadow:0 0 0 1px var(--border),var(--sh-xs);transition:box-shadow .25s var(--ease)}
.p-faq details[open]{box-shadow:0 0 0 1px #D2E2F6,var(--sh-md)}
.p-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px clamp(18px,1.8vw,26px);cursor:pointer;list-style:none;
  font-size:clamp(15.5px,1.15vw,18px);font-weight:500;color:var(--navy);letter-spacing:-.012em;border-radius:var(--r-lg)}
.p-faq summary::-webkit-details-marker{display:none}
.p-faq summary:hover{color:var(--blue)}
.p-faq summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.p-faq-ico{display:flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;border-radius:50%;
  background:var(--light-blue-2);color:var(--blue);transition:transform .3s var(--ease),background .2s ease}
.p-faq-ico svg{width:14px;height:14px}
.p-faq details[open] .p-faq-ico{transform:rotate(45deg);background:var(--light-blue)}
.p-faq-a{padding:0 clamp(18px,1.8vw,26px) 22px}
.p-faq-a p{max-width:64ch;font-size:clamp(14.5px,1.05vw,16px);line-height:1.65;color:var(--text-muted);letter-spacing:-.008em}
.p-cta-row{display:flex;flex-wrap:wrap;gap:12px}

/* ---- responsive ---- */
@media(max-width:980px){
  .p-split{grid-template-columns:1fr}
  .p-esc{max-width:640px}
  .p-why{grid-template-columns:1fr;max-width:640px;margin:0 auto}
  .p-faq-grid{grid-template-columns:1fr;gap:8px}
  .p-flow{max-width:520px}
}
@media(max-width:820px){
  .p-steps{grid-template-columns:1fr;max-width:560px}
  .p-step + .p-step::after{left:calc(clamp(22px,2.2vw,32px) + 26px);top:calc(var(--gap) * -1 - 1px);width:0;height:calc(var(--gap) + 2px);border-top:0;border-left:2px dashed #9CC1F2}
  .p-step + .p-step::before{left:calc(clamp(22px,2.2vw,32px) + 14px);top:calc(var(--gap) / -2 - 13px);transform:rotate(90deg)}
  .p-steps.has-ph .p-step + .p-step::after{left:50%;top:calc(var(--gap) * -1 - 1px)}
  .p-steps.has-ph .p-step + .p-step::before{left:calc(50% - 13px);top:calc(var(--gap) / -2 - 13px)}
  .p-camino-bg,.p-camino-note{display:none}
  .p-cols3{grid-template-columns:1fr;max-width:560px}
  .p-duo{grid-template-columns:1fr}
}
@media(max-width:720px){
  .p-cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .p-cmp,.p-cmp tbody,.p-cmp tr,.p-cmp th,.p-cmp td{display:block;width:100%}
  .p-cmp tr{padding:6px 0 14px;border-top:1px solid var(--border)}
  .p-cmp tbody tr:first-child{border-top:0}
  .p-cmp tbody th{padding:14px 18px 6px;border:0;font-size:16px}
  .p-cmp td{border:0;padding:8px 18px}
  .p-cmp td::before{content:attr(data-label);display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.14em;
    text-transform:uppercase;color:var(--text-muted)}
  .p-cmp td.c-liv{width:auto;margin:6px 12px 0;padding:12px 14px;border-radius:14px}
  .p-cmp td.c-liv::before{color:var(--blue-deep)}
}
@media(max-width:620px){
  .p-sec{padding:64px 0}
  .cv .cv-tabs{width:auto;max-width:none;margin-left:calc(-1 * clamp(20px,3vw,36px));margin-right:calc(-1 * clamp(20px,3vw,36px));
    padding-left:clamp(20px,3vw,36px);padding-right:clamp(20px,3vw,36px);scroll-padding-left:clamp(20px,3vw,36px)}
  .cv-m{max-width:94%}
  .cv-head .badge{font-size:12px;padding:5px 11px}
  .cv-head{flex-wrap:wrap;row-gap:10px}
  .cv-head .cv-out{order:3;margin-left:50px}
  .p-esc-body > div{grid-template-columns:1fr;gap:6px}
  .p-esc-foot .btn{width:100%}
  .p-cta-row .btn{width:100%}
  .p-head.center{text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .cv-panel:not([hidden]){animation:none}
  .p-faq-ico{transition:none}
}


/* =====================================================================
   PRECIOS · página de tarifas
   ===================================================================== */
/* cabecera compacta: titular + controles + tarjetas en el primer viewport */
.pr-page .nav-in{height:clamp(66px,5vw,76px)}

.pr-hero{padding:clamp(100px,7.6vw,122px) 0 clamp(26px,2.6vw,42px);text-align:center}
/* foto de fondo: terraza con vistas al mar, velo claro en el centro para textos y tarjetas */
.pr-hero-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url("assets/home-hero-bg.jpg") 50% 40%/cover no-repeat;
  animation:h-fade 1.2s var(--ease) both}
/* velo ligero: solo detrás del titular (cielo) y fundido a la página abajo; los lados conservan el color */
.pr-hero-bg::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 38% 24% at 50% 19%,rgba(247,250,254,.72) 0%,rgba(247,250,254,0) 100%),
    linear-gradient(180deg,rgba(247,250,254,.62) 0%,rgba(247,250,254,.34) 20%,rgba(247,250,254,.06) 40%,rgba(247,250,254,0) 62%,rgba(247,250,254,.5) 88%,#F7FAFE 100%)}
.pr-hero .eyebrow{margin-bottom:clamp(10px,1vw,14px);letter-spacing:.34em}
.pr-hero::before{background:
  radial-gradient(1100px 620px at 50% -10%,rgba(255,255,255,.7),transparent 66%),
  radial-gradient(900px 560px at 88% 4%,rgba(198,224,252,.42),transparent 64%),
  radial-gradient(820px 520px at 8% 46%,rgba(211,231,253,.38),transparent 66%),
  linear-gradient(180deg,#F4F9FE 0%,#F7FAFE 58%,#F2F7FD 100%)}
.pr-hero-in{display:flex;flex-direction:column;align-items:center}

.pr-title{font-size:clamp(32px,3.5vw,56px);line-height:1.08;margin:0 0 10px;text-wrap:balance}

/* ---- barra de controles ---- */
.pr-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
  width:100%;max-width:1000px;margin:clamp(20px,2vw,30px) auto 0;
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.95);border-radius:var(--r-xl);
  padding:clamp(16px,1.5vw,22px) clamp(20px,2vw,30px);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 2px 6px rgba(16,42,90,.05),0 30px 60px -34px rgba(16,42,90,.36);text-align:left}
.pr-bar-l{min-width:0;padding-right:clamp(20px,2.4vw,40px)}
.pr-bar-lab{display:block;font-size:14px;font-weight:600;color:var(--navy);letter-spacing:-.008em;margin-bottom:10px}
.pr-slider-row{display:flex;align-items:center;gap:14px}

.pr-range{-webkit-appearance:none;appearance:none;flex:1 1 auto;min-width:0;height:6px;border-radius:999px;
  background:linear-gradient(90deg,var(--blue) 0 var(--pct,20%),#E1EAF7 var(--pct,20%) 100%);cursor:pointer}
.pr-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;
  background:#fff;border:2.5px solid var(--blue);box-shadow:0 2px 8px rgba(10,102,236,.32);cursor:grab;
  transition:transform .15s var(--ease)}
.pr-range::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.08)}
.pr-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:2.5px solid var(--blue);
  box-shadow:0 2px 8px rgba(10,102,236,.32);cursor:grab}
.pr-range::-moz-range-track{height:6px;border-radius:999px;background:transparent}
.pr-range:focus-visible{outline:2px solid var(--blue);outline-offset:5px}

.pr-num{flex:none;width:66px;height:36px;border-radius:11px;text-align:center;-moz-appearance:textfield;
  font:600 15px/1 'Inter',system-ui,sans-serif;color:var(--navy);letter-spacing:-.01em;
  background:#F5F9FE;border:1px solid var(--border);transition:border-color .18s ease,box-shadow .18s ease}
.pr-num:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,102,236,.14)}
.pr-num::-webkit-outer-spin-button,.pr-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

.pr-num-u{flex:none;font-size:14px;font-weight:500;color:var(--navy-soft);letter-spacing:-.008em}
.pr-cycle{display:flex;align-items:center;gap:9px;margin-top:12px}

.pr-tramo{display:block;margin-top:5px;font-size:12.8px;color:var(--navy-soft);letter-spacing:-.006em}
.pr-tramo b{color:var(--blue);font-weight:600}
.pr-tramo a{color:var(--blue)}

.pr-bar-r{display:flex;align-items:center;padding-left:clamp(20px,2.4vw,40px)}
.pr-bar-r .pr-cycle{margin-top:0}
.pr-seg{display:inline-flex;background:#F1F6FD;border-radius:999px;padding:3px;gap:2px}
.pr-seg button{height:30px;padding:0 15px;border-radius:999px;font-size:13px;font-weight:600;
  color:var(--text-muted);letter-spacing:-.008em;
  transition:background .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease)}
.pr-seg button[aria-pressed="true"]{background:#fff;color:var(--navy);box-shadow:var(--sh-sm)}
.pr-seg-badge{flex:none;background:var(--green-wash);color:var(--green-ink);border-radius:999px;padding:6px 12px;
  font-size:11.5px;font-weight:600;letter-spacing:-.006em;white-space:nowrap}

/* ---- tarjetas ---- */
.pr-cards{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);align-items:start;
  gap:clamp(14px,1.4vw,24px);width:100%;max-width:1200px;
  margin:clamp(22px,2.2vw,34px) auto 0;text-align:left}
.pr-card{--pad:clamp(18px,1.6vw,26px);position:relative;border-radius:var(--r-xl);padding:var(--pad);
  display:flex;flex-direction:column;
  background:rgba(255,255,255,.84);border:1px solid rgba(255,255,255,.92);
  backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
  box-shadow:0 2px 6px rgba(16,42,90,.04),0 26px 56px -32px rgba(16,42,90,.32),inset 0 1px 0 rgba(255,255,255,.7)}
.pr-card-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:14px}
.pr-card-ico{display:flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;border-radius:50%;
  background:#fff;color:var(--navy-soft);box-shadow:0 0 0 1px rgba(10,24,52,.06),var(--sh-sm)}
.pr-card-ico svg{width:24px;height:24px}
.pr-card h2{font-size:clamp(22px,1.8vw,30px);line-height:1.15;margin:0}
.pr-card .badge{font-size:12px;padding:6px 12px;flex:none}
.pr-tag{margin-top:4px;font-size:clamp(14px,1vw,16px);line-height:1.4;color:var(--text-muted);letter-spacing:-.008em}

/* la disponible: resaltada y a la izquierda */
/* tarjeta disponible: degradado azul claro → blanco */
.pr-card.is-main{overflow:hidden;background:linear-gradient(165deg,#D6E8FE 0%,#E6F1FE 40%,#F7FBFF 100%);
  border-color:transparent;
  box-shadow:0 0 0 1.5px var(--blue),0 4px 10px rgba(16,42,90,.05),0 40px 70px -32px rgba(10,102,236,.42)}
.pr-card.is-main .pr-card-ico{color:var(--blue)}
/* las tres tarjetas a la misma altura, alineadas arriba y abajo; los botones quedan en la misma línea */
.pr-card.is-main,.pr-card.is-soon{align-self:stretch;margin:0}
/* "próximamente": cristal en blanco y negro (la foto de detrás se ve desaturada) frente a la principal en color */
.pr-card.is-soon{background:rgba(255,255,255,.52);border-color:rgba(255,255,255,.66);
  backdrop-filter:blur(16px) grayscale(1) brightness(1.08);-webkit-backdrop-filter:blur(16px) grayscale(1) brightness(1.08);
  box-shadow:0 2px 6px rgba(16,24,40,.04),0 22px 48px -30px rgba(16,24,40,.28),inset 0 1px 0 rgba(255,255,255,.6)}
.pr-card.is-soon h2{color:#1F2937}
.pr-card.is-soon .pr-tag,.pr-card.is-soon .pr-addon,.pr-card.is-soon .pr-list li{color:#4B5563}
.pr-card.is-soon .pr-card-ico{color:#4B5563;background:rgba(255,255,255,.78)}
.pr-card.is-soon .pr-li-ico{color:#6B7280}
.pr-card.is-soon .badge-grey{background:rgba(255,255,255,.72);color:#4B5563}

/* precio */
.pr-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0}
.pr-amount{font-family:'Inter',system-ui,sans-serif;font-weight:700;font-size:clamp(34px,2.9vw,46px);
  line-height:1;letter-spacing:-.03em;color:var(--navy);font-variant-numeric:tabular-nums}
.pr-unit{font-size:13px;font-weight:500;color:var(--text-muted);letter-spacing:-.008em}
.pr-note{display:block;margin-top:2px;font-size:12.2px;color:var(--text-soft);letter-spacing:-.006em}
.pr-note.is-min{color:var(--blue-deep);font-weight:500}
.pr-notes{min-height:18px}
/* precio dentro de la tarjeta disponible: separado de la lista por una línea, justo antes del botón */
.pr-quote{margin:0 0 16px;padding-top:16px;border-top:1px solid rgba(10,24,52,.08)}
.pr-note[hidden]{display:none}

.pr-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin:16px 0 20px}
.pr-list li{display:flex;align-items:center;gap:10px;font-size:clamp(14px,1vw,15.5px);line-height:1.35;
  color:var(--navy-soft);letter-spacing:-.009em}
.pr-list .chk{width:20px;height:20px}
.pr-list .chk svg{width:11px;height:11px}
.pr-li-ico{width:20px;height:20px;flex:none;color:var(--text-muted)}

.pr-cta{width:100%;margin-top:auto;height:50px;font-size:15.5px}

/* tarjetas próximamente */
.pr-addon{display:block;margin-top:8px;font-size:12.5px;font-weight:500;color:var(--text-muted);letter-spacing:-.006em}
.pr-card.is-soon .pr-list li{color:var(--text-muted)}
.pr-card.is-soon .pr-cta{height:46px;font-size:14.5px}

/* ---- 03 · sin letra pequeña: degradado tipo cielo (no repite la foto de la cabecera) + 4 tarjetas verticales ---- */
/* fondo blanco limpio */
.sec.p-sec.pr-incluye::before{background:#fff}
.pr-incluye .p-head .sec-sub{margin-top:clamp(12px,1.1vw,16px);color:var(--navy-soft)}

.pr-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.4vw,22px);
  max-width:1160px;margin:clamp(8px,1vw,16px) auto 0;list-style:none}
/* tarjeta: foto arriba a sangre, icono montado sobre el borde de la foto, texto centrado */
.pr-chip{--cx:clamp(14px,1.3vw,20px);display:flex;flex-direction:column;align-items:center;text-align:center;overflow:hidden;
  padding:0 var(--cx) clamp(20px,1.8vw,26px);border-radius:var(--r-xl);
  background:#fff;border:1px solid var(--border);
  box-shadow:0 2px 6px rgba(16,42,90,.04),0 22px 48px -30px rgba(16,42,90,.24)}
.pr-chip-ph{align-self:stretch;margin:0 calc(var(--cx) * -1);aspect-ratio:356/168;overflow:hidden;background:#EFE9E4}
.pr-chip-ph img{display:block;width:100%;height:100%;object-fit:cover}
.pr-chip-ico{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex:none;
  width:60px;height:60px;border-radius:50%;margin:-30px 0 clamp(10px,1vw,14px);
  background:#EAF3FE;color:var(--blue);box-shadow:0 0 0 6px rgba(255,255,255,.94),0 10px 20px -10px rgba(10,102,236,.4)}
.pr-chip-ico svg{width:26px;height:26px}
.pr-chip b{display:block;font-size:clamp(15px,1.1vw,16.5px);font-weight:600;line-height:1.3;color:var(--navy);
  letter-spacing:-.01em;text-wrap:balance}
.pr-chip > span:last-child{display:block;margin-top:6px;font-size:clamp(13.5px,.98vw,14.5px);line-height:1.45;color:var(--text-muted);
  letter-spacing:-.006em;text-wrap:balance}

/* ---- banda >100 ---- */
.pr-band{max-width:1160px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  gap:clamp(20px,2.6vw,44px);flex-wrap:wrap;border-radius:var(--r-xl);
  padding:clamp(26px,2.8vw,44px) clamp(24px,2.8vw,48px);
  background:linear-gradient(140deg,#E8F2FE 0%,#DCEBFD 100%);box-shadow:0 0 0 1px #D3E5FA}
.pr-band h2{font-size:clamp(22px,2.05vw,34px);line-height:1.2;max-width:24ch}
.pr-band p{margin-top:10px;font-size:clamp(14.5px,1.05vw,16.5px);color:var(--text-muted);
  letter-spacing:-.008em;max-width:54ch}
.pr-band .btn{flex:none}

/* ---- responsive ---- */
@media(max-width:1180px){
  .pr-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1080px){
  .pr-bar{max-width:720px}
  .pr-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .pr-page .nav-in{height:clamp(72px,6vw,96px)}
  .pr-hero{padding:100px 0 40px}
  .pr-title{font-size:clamp(30px,5vw,40px)}
  .pr-bar{grid-template-columns:1fr;max-width:560px;padding:18px 20px}
  .pr-bar-l{padding-right:0}
  .pr-bar-r{margin-top:14px;padding:0}
  .pr-bar-r .pr-cycle{flex:1 1 auto}
  .pr-seg{flex:1 1 auto}
  .pr-seg button{flex:1 1 0;padding:0 10px;height:40px}
  .pr-cards{grid-template-columns:1fr;max-width:460px;gap:14px}
  .pr-card.is-soon{align-self:auto;margin:0}
  .pr-notes{min-height:0}
  .pr-card,.pr-card.is-main{--pad:20px}
  .pr-band{flex-direction:column;align-items:flex-start}
  .pr-band .btn{width:100%}
}
@media(max-width:620px){
  .pr-hero{padding:92px 0 36px}
  .pr-title{font-size:clamp(29px,8.2vw,34px)}
  .pr-chips{grid-template-columns:1fr;max-width:420px}
  .pr-band h2{font-size:26px}
}
@media(prefers-reduced-motion:reduce){
  .pr-seg button{transition:none}
  .pr-range::-webkit-slider-thumb{transition:none}
  .pr-hero-bg{animation:none}
}


/* =====================================================================
   NOSOTROS · quiénes somos y nuestro propio caso
   ===================================================================== */

/* ---- placeholder de foto real (se sustituye por la fotografía) ---- */
.ns-ph{position:relative;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#EDF3FB 0%,#DCE9F8 100%);color:#8CA4C4}
.ns-ph::before{content:"";position:absolute;inset:0;opacity:.55;
  background-image:linear-gradient(135deg,rgba(255,255,255,.6) 25%,transparent 25%,transparent 50%,
    rgba(255,255,255,.6) 50%,rgba(255,255,255,.6) 75%,transparent 75%);
  background-size:16px 16px}
.ns-ph > svg{position:relative;width:clamp(38px,3.6vw,58px);height:auto}
.ns-ph b{position:absolute;left:50%;bottom:clamp(14px,1.5vw,22px);transform:translateX(-50%);
  padding:6px 14px;border-radius:999px;background:#fff;box-shadow:var(--sh-sm);
  font-size:12.5px;font-weight:500;color:var(--text-muted);white-space:nowrap}

/* ---- 01 · hero ---- */
.ns-hero-vis{position:relative;width:100%;max-width:560px;margin-left:auto}
/* el resplandor vive en el contenedor, no dentro del marco recortado */
.ns-hero-vis::before{content:"";position:absolute;inset:-9% 0;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(ellipse at 46% 50%,rgba(54,145,255,.20),rgba(102,174,255,.09) 50%,transparent 76%);
  filter:blur(40px)}
.ns-hero-frame{position:relative;z-index:1;width:100%;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3.4;
  box-shadow:0 0 0 1px rgba(255,255,255,.7),0 6px 14px rgba(16,42,90,.06),0 44px 90px -34px rgba(16,42,90,.34)}
.ns-hero-frame img,.ns-hero-frame .ns-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ns-hero-note{position:absolute;z-index:3;right:5%;top:5%;width:max-content;max-width:13ch;
  text-align:center;transform:rotate(-6deg);font-size:clamp(19px,1.65vw,27px);
  text-shadow:0 1px 10px rgba(255,255,255,.92)}
.ns-hero-note svg{display:block;width:clamp(24px,2vw,34px);height:auto;margin:4px auto 0;color:var(--blue)}

/* ---- 02 · la historia (timeline vertical) ---- */
.ns-time{list-style:none;position:relative;max-width:860px;
  display:flex;flex-direction:column;gap:clamp(26px,2.8vw,44px)}
.ns-time::before{content:"";position:absolute;left:clamp(26px,2.6vw,34px);top:16px;bottom:16px;width:2px;
  background:linear-gradient(180deg,#D9E4F3,#BFD6F3 55%,#D9E4F3)}
.ns-time li{position:relative;display:grid;grid-template-columns:clamp(54px,5.4vw,70px) minmax(0,1fr);
  gap:clamp(16px,1.8vw,28px);align-items:start}
.ns-time-dot{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;
  width:clamp(54px,5.4vw,70px);height:clamp(54px,5.4vw,70px);border-radius:50%;background:#fff;
  font-family:'Playfair Display',Georgia,serif;font-size:clamp(14px,1.12vw,17px);letter-spacing:-.01em;color:var(--blue);
  box-shadow:0 0 0 1px #D2E2F6,var(--sh-sm)}
.ns-time li:last-child .ns-time-dot{background:var(--blue);color:#fff;box-shadow:0 0 0 5px rgba(10,102,236,.14)}
.ns-time-body{padding-top:clamp(6px,.7vw,12px)}
.ns-time-body h3{font-size:clamp(21px,1.8vw,30px);margin-bottom:10px}
.ns-time-body p{font-size:clamp(15px,1.1vw,17.5px);line-height:1.66;color:var(--text-muted);letter-spacing:-.008em;max-width:56ch}

/* ---- cita destacada ---- */
.ns-quote{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px);flex-wrap:wrap;
  max-width:1000px;margin:clamp(44px,4.6vw,76px) 0 0;padding:clamp(26px,2.8vw,44px);
  border-radius:var(--r-xl);border:1px solid #fff;
  background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(238,245,254,.96));
  box-shadow:0 0 0 1px var(--border-soft),var(--sh-md)}
.ns-quote .ns-ph{flex:none;width:clamp(76px,7vw,104px);height:clamp(76px,7vw,104px);border-radius:50%;overflow:hidden}
.ns-quote .ns-ph > svg{width:44%}
.ns-quote-b{flex:1;min-width:min(100%,260px)}
.ns-quote blockquote{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-style:italic;
  font-size:clamp(21px,2.1vw,34px);line-height:1.32;letter-spacing:-.014em;color:var(--navy);text-wrap:balance}
.ns-quote cite{display:block;margin-top:clamp(12px,1.2vw,18px);font-style:normal;
  font-size:clamp(13.5px,1vw,15.5px);color:var(--text-muted);letter-spacing:-.006em}
.ns-quote cite b{color:var(--navy);font-weight:600}

/* ---- 03 · cómo se entrenó ---- */
.ns-train{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(32px,4vw,72px);align-items:start}
.ns-train .p-head{margin-bottom:0}
.ns-train .p-flow{margin-top:0}
.ns-train-note{margin-top:clamp(20px,2.2vw,30px);font-size:clamp(13px,.92vw,14.5px);color:var(--text-muted);letter-spacing:-.006em}

/* ---- 04 · los números ---- */
.ns-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,32px)}
.ns-num{display:flex;flex-direction:column;padding:clamp(22px,2.2vw,32px) 0 0;border-top:2px solid #C9DDF6}
.ns-num .fig{font-size:clamp(40px,4.6vw,74px);line-height:1;letter-spacing:-.022em;color:var(--navy);margin-bottom:10px}
.ns-num .fig .blue{color:var(--blue)}
.ns-num .fig .fig-unit{font-size:.5em;letter-spacing:-.012em}
.ns-num b{font-size:clamp(15.5px,1.15vw,18px);font-weight:600;color:var(--navy);letter-spacing:-.012em;line-height:1.35}
.ns-num p{margin-top:8px;font-size:clamp(14px,1vw,15.5px);line-height:1.6;color:var(--text-muted);letter-spacing:-.008em}

/* ---- el 13 % que escala ---- */
.ns-esc{margin-top:clamp(40px,4.4vw,72px);padding:clamp(24px,2.6vw,40px);border-radius:var(--r-xl);
  background:rgba(255,255,255,.82);border:1px solid #fff;box-shadow:0 0 0 1px var(--border-soft),var(--sh-sm)}
.ns-esc h3{font-size:clamp(19px,1.5vw,24px);margin-bottom:clamp(18px,1.8vw,26px)}
.ns-esc h3 span{color:var(--blue)}
.ns-esc-rows{display:flex;flex-direction:column;gap:clamp(16px,1.7vw,24px)}
.ns-esc-row{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:clamp(14px,1.6vw,28px);align-items:center}
.ns-esc-k{display:flex;align-items:center;gap:12px}
.ns-esc-pct{font-family:'Playfair Display',Georgia,serif;font-size:clamp(24px,2vw,32px);line-height:1;color:var(--blue);letter-spacing:-.018em}
.ns-esc-k b{font-size:clamp(15px,1.08vw,17px);font-weight:600;color:var(--navy);letter-spacing:-.012em}
.ns-esc-bar{height:10px;border-radius:999px;background:#E3ECF8;overflow:hidden;margin-top:10px}
.ns-esc-bar i{display:block;height:100%;width:50%;border-radius:999px;
  background:linear-gradient(90deg,var(--blue-soft),var(--blue))}
.ns-esc-row p{font-size:clamp(14px,1vw,15.5px);line-height:1.6;color:var(--text-muted);letter-spacing:-.008em}
.ns-esc-note{margin-top:clamp(22px,2.2vw,32px);padding-top:clamp(18px,1.8vw,26px);border-top:1px solid var(--border);
  font-size:clamp(14px,1.02vw,16px);line-height:1.62;color:var(--text-muted);letter-spacing:-.008em;max-width:70ch}
.ns-esc-note b{color:var(--navy);font-weight:600}

/* ---- 05 · tres conversaciones reales ---- */
.ns-chats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.8vw,28px);align-items:stretch}
.ns-chat{display:flex;flex-direction:column;height:100%}
.ns-chat .cv-chat{display:flex;flex-direction:column;flex:1}
.ns-chat .cv-head{flex-wrap:wrap;gap:8px 12px}
.ns-chat .cv-head b{flex:1 1 120px;min-width:0;font-size:14.5px}
.ns-chat .cv-head .badge{margin-left:auto;flex:none}
.ns-chat .cv-thread{flex:1}
.ns-chat .cv-m{max-width:94%}
.ns-chat-time{display:inline-flex;align-items:center;gap:7px;font-family:'DM Mono',ui-monospace,Consolas,monospace;
  font-size:12.5px;font-weight:500;color:var(--blue-deep);letter-spacing:.04em;flex:none}
.ns-chat-time svg{width:14px;height:14px}
.ns-did{display:flex;align-items:flex-start;gap:11px;margin-top:14px;padding:14px clamp(14px,1.3vw,18px);
  border-radius:var(--r-md);background:rgba(255,255,255,.86);box-shadow:0 0 0 1px var(--border-soft),var(--sh-xs)}
.ns-did .lv-av{width:26px;height:26px;flex:none;margin-top:1px}
.ns-did p{font-size:clamp(13.5px,.98vw,15px);line-height:1.55;color:var(--text-muted);letter-spacing:-.006em}
.ns-did p b{color:var(--navy);font-weight:600}
.ns-chats-close{margin-top:clamp(30px,3vw,46px);max-width:64ch;
  font-size:clamp(15.5px,1.2vw,19px);line-height:1.6;color:var(--text-muted);letter-spacing:-.01em}
.ns-chats-close b{color:var(--navy);font-weight:600}

/* ---- 07 · quién está detrás ---- */
.ns-team{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,4vw,72px);align-items:center}
.ns-people{display:flex;flex-direction:column;gap:clamp(16px,1.6vw,22px)}
.ns-person{display:flex;align-items:center;gap:clamp(16px,1.6vw,22px);padding:clamp(16px,1.6vw,22px);
  border-radius:var(--r-lg);background:rgba(255,255,255,.94);border:1px solid #fff;
  box-shadow:0 0 0 1px var(--border-soft),var(--sh-sm)}
.ns-person .ns-ph{flex:none;width:clamp(72px,6.4vw,92px);height:clamp(72px,6.4vw,92px);border-radius:50%;overflow:hidden}
.ns-person .ns-ph > svg{width:44%}
.ns-person b{display:block;font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(19px,1.5vw,24px);letter-spacing:-.012em;color:var(--navy);line-height:1.25}
.ns-person span{display:block;margin-top:6px;font-size:clamp(14px,1.02vw,16px);line-height:1.55;
  color:var(--text-muted);letter-spacing:-.008em}
.ns-team-copy h2{margin:clamp(12px,1.2vw,18px) 0 clamp(14px,1.4vw,22px);font-size:clamp(28px,3vw,48px);line-height:1.16}
.ns-team-copy p{font-size:clamp(15.5px,1.2vw,19px);line-height:1.66;color:var(--text-muted);letter-spacing:-.01em;max-width:46ch}
.ns-team-copy p + p{margin-top:clamp(14px,1.3vw,20px)}
.ns-team-copy b{color:var(--navy);font-weight:600}

/* ---- responsive ---- */
@media(max-width:1080px){
  .ns-nums{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,3vw,36px)}
}
@media(max-width:980px){
  .ns-hero-vis{max-width:480px;margin:0 auto}
  .ns-hero-frame{aspect-ratio:4/3.4}
  .ns-hero-note{right:5%;top:4%}
  .ns-train{grid-template-columns:1fr;gap:clamp(28px,3.4vw,44px)}
  .ns-chats{grid-template-columns:1fr;max-width:600px;margin:0 auto}
  .ns-team{grid-template-columns:1fr;gap:clamp(28px,3.4vw,44px)}
  .ns-people{max-width:600px}
  .ns-team-copy p{max-width:60ch}
}
@media(max-width:720px){
  .ns-esc-row{grid-template-columns:1fr;gap:10px}
  .ns-esc-bar{margin-top:8px}
}
@media(max-width:620px){
  .ns-hero-note{display:none}
  .ns-nums{grid-template-columns:1fr;gap:26px}
  .ns-num{padding-top:20px}
  .ns-num .fig{font-size:52px}
  .ns-time::before{left:22px}
  .ns-time li{grid-template-columns:46px minmax(0,1fr);gap:14px}
  .ns-time-dot{width:46px;height:46px;font-size:13px}
  .ns-quote{gap:18px;padding:22px}
  .ns-quote .ns-ph{width:62px;height:62px}
  .ns-person{flex-direction:column;align-items:flex-start;text-align:left}
  .ns-cta .btn{width:100%}
}

/* =====================================================================
   MÓVIL · retoques finales (zonas táctiles y pantallas muy estrechas)
   ===================================================================== */
@media(max-width:980px){
  /* el logo y los enlaces del pie llegan a ~40 px de alto: se pueden tocar sin fallar */
  .nav-in .logo,.foot-in .logo{padding:10px 0}
  .foot-links{gap:2px clamp(16px,4.6vw,24px)}
  .foot-links a{padding:9px 0}
  /* el selector mensual/anual también se toca con el dedo en tablet */
  .pr-seg button{min-height:40px}
}
@media(max-width:400px){
  /* de 320 a 400 px el botón no cabe junto al logo: se queda solo dentro del menú */
  .nav-in{gap:14px}
  .nav-right > .btn{display:none}
}