@property --cur-ang{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
:root{
  --sf:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", system-ui, "Segoe UI", sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --sel:#B4D5FE; --sel-oscuro:rgba(122,162,255,.42);
  --ios-azul:#2F7BF5; --ios-gris:#F5F5F7; --ios-linea:rgba(60,60,67,.14); --ios-2:rgba(60,60,67,.64);
  --vidrio:rgba(255,255,255,.64); --vidrio-borde:rgba(255,255,255,.8);
  --vidrio-sombra:inset 0 1px 0 rgba(255,255,255,.95), 0 24px 48px -24px rgba(12,31,79,.32), 0 2px 8px rgba(12,31,79,.06);
  --ia:conic-gradient(from var(--cur-ang), #2F7BF5, #6FB6FF, #F9C658, #004484, #2F7BF5);
}

html[data-piel="cursor"] body > section, html[data-piel="cursor"] .pie{ --f-display:var(--sf); --f-text:var(--sf); font-family:var(--sf); }
html[data-piel="cursor"] .hero__h1{ font-weight:700; letter-spacing:-.032em; line-height:1.02; }
html[data-piel="cursor"] .niv__tit{ font-weight:700; letter-spacing:-.028em; line-height:1.05; }
html[data-piel="cursor"] .hero__apoyo{ font-weight:500; letter-spacing:-.01em; }

/* ---------- 1 · fondo ambiental (el vidrio necesita algo detrás para leerse) ---------- */
html[data-piel="cursor"] .dia,
html[data-piel="cursor"] .aprenden,
html[data-piel="cursor"] .entrar{
  background:
    radial-gradient(55% 60% at 8% 0%, rgba(47,123,245,.13), transparent 62%),
    radial-gradient(45% 55% at 100% 100%, rgba(249,198,88,.18), transparent 62%),
    radial-gradient(35% 40% at 70% 20%, rgba(111,182,255,.10), transparent 60%),
    var(--ios-gris);
  position:relative;
}

/* ---------- 2 · eyebrows con degradado (el color "inteligente" de 2026, en azul y dorado NK) ---------- */
html[data-piel="cursor"] .niv__ante{ text-transform:none; letter-spacing:-.005em; font-family:var(--sf); font-size:clamp(15px,1.15vw,17px); font-weight:600;
  background:linear-gradient(90deg, #004484 0%, #2F7BF5 45%, #C9901C 100%); -webkit-background-clip:text; background-clip:text; color:transparent; width:max-content; max-width:100%; }
html[data-piel="cursor"] .niv__ante::before{ display:none; }
html[data-piel="cursor"] .niv__ante--oro, html[data-piel="cursor"] .hero__eyebrow{
  background:linear-gradient(90deg, #FFFFFF 0%, #BFD9FF 50%, #F9C658 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
html[data-piel="cursor"] .hero__eyebrow{ text-transform:none; letter-spacing:-.005em; font-size:clamp(15px,1.15vw,17px); font-weight:600; width:max-content; max-width:100%; }
html[data-piel="cursor"] .hero__eyebrow::before{ display:none; }

/* ---------- 3 · títulos que se teclean + selección ---------- */
html[data-piel="cursor"] .niv__lin > span{ transform:none !important; transition:none !important; }
html[data-piel="cursor"] .cur-t .cur-c{ opacity:0; }
html[data-piel="cursor"] .cur-t .cur-c.v{ opacity:1; }
html[data-piel="cursor"]:not(.js-traza) section .cur-t .cur-c{ opacity:1; }
.cur-caret{ display:inline-block; width:.075em; min-width:2px; height:.9em; margin-right:-.075em; vertical-align:-.08em;
  background:var(--ios-azul); border-radius:2px; animation:cur-parpadea 1.05s steps(1) infinite; }
.hero .cur-caret, .cuida .cur-caret{ background:#fff; }
@keyframes cur-parpadea{ 0%,55%{ opacity:1; } 56%,100%{ opacity:0; } }
.cur-sel{ background:linear-gradient(var(--sel), var(--sel)) no-repeat 0 62% / 0% 86%; transition:background-size .55s cubic-bezier(.55,.08,.35,1); border-radius:4px; }
.cur-sel.on{ background-size:100% 86%; }
.hero .cur-sel, .cuida .cur-sel{ background-image:linear-gradient(var(--sel-oscuro), var(--sel-oscuro)); }

/* ---------- 4 · HERO: los seis hechos en una barra de vidrio ---------- */
html[data-piel="cursor"] .hero--nivel .hechos__marco{
  border-top:0; margin-bottom:clamp(14px,2.4vh,26px); padding:clamp(12px,1.8vh,18px) clamp(18px,1.8vw,26px);
  width:auto; margin-left:max(4vw, (100vw - var(--marco-max,1660px)) / 2); margin-right:max(4vw, 292px);
  background:rgba(12,31,79,.26); -webkit-backdrop-filter:blur(26px) saturate(1.7); backdrop-filter:blur(26px) saturate(1.7);
  border:1px solid rgba(255,255,255,.2); border-radius:26px; box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 24px 50px -20px rgba(0,0,0,.45); }
html[data-piel="cursor"] .hecho dt{ font-weight:650; letter-spacing:-.02em; }
html[data-piel="cursor"] .hecho dd{ text-transform:none; letter-spacing:0; font-size:12.5px; font-weight:500; color:rgba(255,255,255,.72); }

/* ---------- 5 · UN DÍA: lista agrupada de vidrio + escena en tarjeta ---------- */
html[data-piel="cursor"] .dia__lista{ padding:6px 14px; gap:0; background:var(--vidrio); -webkit-backdrop-filter:blur(24px) saturate(1.8); backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid var(--vidrio-borde); border-radius:24px; box-shadow:var(--vidrio-sombra); }
html[data-piel="cursor"] .momento{ position:relative; border-top:0 !important; border-bottom:0 !important; padding-left:4px; padding-right:4px; }
html[data-piel="cursor"] .momento + .momento::after{ content:""; position:absolute; left:48px; right:0; top:0; height:1px; background:var(--ios-linea); }
html[data-piel="cursor"] .momento::before{ content:""; position:absolute; inset:2px -8px; left:-8px; right:-8px; top:2px; height:auto; width:auto; background:rgba(47,123,245,.09);
  border-radius:14px; opacity:0; transform:none !important; animation:none !important; transition:opacity .35s ease; z-index:-1; }
html[data-piel="cursor"] .momento[aria-current="true"]::before{ opacity:1; }
/* número en azulejo, como los íconos de Ajustes */
html[data-piel="cursor"] .momento__hora{ display:inline-grid; place-items:center; width:30px; height:30px; min-width:30px; border-radius:8px; font-family:var(--mono); font-size:12px; font-weight:600;
  color:#fff; background:linear-gradient(180deg, #A8B3C4, #8792A6); box-shadow:inset 0 1px 0 rgba(255,255,255,.35); transition:background .35s ease; }
html[data-piel="cursor"] .momento[aria-current="true"] .momento__hora{ color:#fff; background:linear-gradient(180deg, #4B8DF8, #1F5FD0); }
html[data-piel="cursor"] .momento__que b{ font-weight:600; letter-spacing:-.01em; }
html[data-piel="cursor"] .momento__que span{ color:var(--ios-2); }
html[data-piel="cursor"] .momento[aria-current="true"] .momento__que b::after{ content:""; display:inline-block; width:2px; height:1em; margin-left:3px; vertical-align:-.12em;
  background:var(--ios-azul); border-radius:1px; animation:cur-parpadea 1.05s steps(1) infinite; }
html[data-piel="cursor"] .dia__escena{ border-radius:28px; box-shadow:0 30px 60px -30px rgba(12,31,79,.5), 0 2px 8px rgba(12,31,79,.08); }
html[data-piel="cursor"] .dia__pie{ left:16px; right:auto; bottom:16px; max-width:calc(100% - 32px); padding:12px 16px; border-radius:18px;
  background:rgba(12,31,79,.34); -webkit-backdrop-filter:blur(22px) saturate(1.6); backdrop-filter:blur(22px) saturate(1.6); border:1px solid rgba(255,255,255,.18); }
html[data-piel="cursor"] .dia__pie-eti{ text-transform:none; letter-spacing:0; font-size:13px; font-weight:600; color:#BFD9FF; }
html[data-piel="cursor"] .dia__pie-dice{ font-style:normal; font-weight:500; font-size:clamp(15px,1.2vw,18px); letter-spacing:-.01em; }

/* ---------- 6 · LO QUE TE LLEVAS: lista agrupada con azulejos de color + foto en tarjeta ---------- */
html[data-piel="cursor"] .aprenden__foto{ margin:clamp(12px,1.8vh,20px) clamp(12px,1.4vw,22px) clamp(12px,1.8vh,20px) 0; border-radius:30px; box-shadow:0 30px 60px -30px rgba(12,31,79,.5); }
html[data-piel="cursor"] .pilares{ padding:4px 16px; background:var(--vidrio); -webkit-backdrop-filter:blur(24px) saturate(1.8); backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid var(--vidrio-borde); border-radius:24px; box-shadow:var(--vidrio-sombra); }
html[data-piel="cursor"] .pilar{ border-top:0 !important; border-bottom:0 !important; position:relative; grid-template-columns:34px 1fr; }
html[data-piel="cursor"] .pilar + .pilar::before{ content:""; position:absolute; left:48px; right:0; top:0; height:1px; background:var(--ios-linea); }
html[data-piel="cursor"] .pilar__n{ display:inline-grid; place-items:center; width:30px; height:30px; border-radius:8px; font-family:var(--sf); font-size:14px; font-weight:700; font-style:normal;
  color:#fff; align-self:start; margin-top:1px; box-shadow:inset 0 1px 0 rgba(255,255,255,.35); transition:transform .2s cubic-bezier(.3,1.6,.5,1); }
html[data-piel="cursor"] .pilar:nth-child(1) .pilar__n{ background:linear-gradient(180deg,#2A5EA8,#0B3D7E); }
html[data-piel="cursor"] .pilar:nth-child(2) .pilar__n{ background:linear-gradient(180deg,#4B8DF8,#1F5FD0); }
html[data-piel="cursor"] .pilar:nth-child(3) .pilar__n{ background:linear-gradient(180deg,#39B8C9,#138A9C); }
html[data-piel="cursor"] .pilar:nth-child(4) .pilar__n{ background:linear-gradient(180deg,#F5C14E,#D0911B); }
html[data-piel="cursor"] .pilar:hover .pilar__n{ transform:scale(1.08); }
html[data-piel="cursor"] .pilar__t{ font-weight:600; letter-spacing:-.015em; font-size:clamp(16px,1.25vw,18px); }
html[data-piel="cursor"] .pilar__p{ color:var(--ios-2); }

html[data-piel="cursor"] .cuida{ display:flex; flex-direction:column; justify-content:center; }
html[data-piel="cursor"] .cuida__marco{ align-self:stretch; }
html[data-piel="cursor"] .cuida__puntos{ align-items:stretch; margin-top:clamp(22px,3.6vh,38px); }
html[data-piel="cursor"] .cuida__puntos::before{ display:none; }
html[data-piel="cursor"] .cuida__punto-b{ display:none; }
html[data-piel="cursor"] .cuida__punto{ position:relative; display:flex; flex-direction:column; padding:18px 18px 20px; border-radius:24px; overflow:hidden; isolation:isolate;
  background:linear-gradient(160deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  -webkit-backdrop-filter:blur(26px) saturate(1.7); backdrop-filter:blur(26px) saturate(1.7); border:1px solid rgba(255,255,255,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), inset 0 -1px 0 rgba(255,255,255,.04), 0 24px 48px -26px rgba(0,0,0,.6); }
/* el brillo especular que la cruza una vez al llegar */
html[data-piel="cursor"] .cuida__punto::after{ content:""; position:absolute; top:-20%; bottom:-20%; left:-60%; width:45%; z-index:-1; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.22), transparent); transform:translateX(0) skewX(-14deg); opacity:0; }
html[data-piel="cursor"] .cuida__puntos.se-traza .cuida__punto::after{ animation:cur-brillo 1.2s cubic-bezier(.4,0,.2,1) calc(.95s + var(--k,0) * .11s) both; }
@keyframes cur-brillo{ 0%{ opacity:0; transform:translateX(0) skewX(-14deg); } 20%{ opacity:1; } 100%{ opacity:0; transform:translateX(420%) skewX(-14deg); } }
html[data-piel="cursor"] .cur-ico{ display:grid; place-items:center; width:38px; height:38px; margin-bottom:14px; border-radius:12px; color:#fff;
  background:linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,.1)); border:1px solid rgba(255,255,255,.25); box-shadow:inset 0 1px 0 rgba(255,255,255,.35); }
html[data-piel="cursor"] .cur-ico svg{ width:21px; height:21px; }
html[data-piel="cursor"] .cuida__punto:nth-child(5) .cur-ico{ color:#FFD37A; }
html[data-piel="cursor"] .cuida__punto-t{ text-transform:none; letter-spacing:-.015em; font-size:clamp(15px,1.15vw,17px); font-weight:650; color:#fff; line-height:1.3; }
html[data-piel="cursor"] .cuida__punto-p{ color:rgba(255,255,255,.8); font-size:clamp(13px,.98vw,14.5px); line-height:1.5; margin-top:8px; }
/* la entrada: la tarjeta entera, no sus partes */
html[data-piel="cursor"] .cuida__punto-t, html[data-piel="cursor"] .cuida__punto-p{ opacity:1 !important; transition:none !important; }
/* entrada con propiedades sueltas (translate/scale/opacity/filter) y hover con transform: no se pisan */
html[data-piel="cursor"].js-traza .cuida__puntos:not(.se-traza) .cuida__punto{ opacity:0; translate:0 34px; scale:.94; filter:blur(14px); }
html[data-piel="cursor"] .cuida__puntos.se-traza .cuida__punto{ animation:cur-tarjeta 1.15s cubic-bezier(.18,1.2,.3,1) calc(.25s + var(--k,0) * .11s) both; }
@keyframes cur-tarjeta{
  0%{ opacity:0; translate:0 34px; scale:.94; filter:blur(14px); }
  45%{ opacity:1; filter:blur(0); }
  100%{ opacity:1; translate:0 0; scale:1; filter:blur(0); } }
html[data-piel="cursor"] .cuida__punto{ transition:transform .45s cubic-bezier(.2,1.3,.4,1), background .3s ease; }
html[data-piel="cursor"] .cuida__punto:hover{ transform:translateY(-4px); background:linear-gradient(160deg, rgba(255,255,255,.21), rgba(255,255,255,.08)); }
/* el cierre entra después de la última tarjeta */
html[data-piel="cursor"] .cuida .cierre__filete{ display:none; }
html[data-piel="cursor"] .cuida .cierre{ margin-top:clamp(22px,3.4vh,36px); }
html[data-piel="cursor"].js-traza .cuida .cierre:not(.se-traza) .cierre__frase{ opacity:0; transform:translateY(14px) scale(.96); }
html[data-piel="cursor"] .cuida .cierre__frase{ clip-path:none !important; transition:opacity .6s ease .9s, transform .8s cubic-bezier(.18,1.25,.3,1) .9s; }
@media (max-width:900px){ html[data-piel="cursor"] .cuida__punto{ padding:16px 16px 18px; } html[data-piel="cursor"] .cur-ico{ width:34px; height:34px; margin-bottom:10px; } }
@media (prefers-reduced-motion:reduce){ html[data-piel="cursor"] .cuida__punto{ opacity:1 !important; translate:none !important; scale:none !important; filter:none !important; animation:none !important; } html[data-piel="cursor"] .cuida__punto::after{ animation:none !important; } }

html[data-piel="cursor"] .entrar__foto{ margin:clamp(12px,1.8vh,20px) 0 clamp(12px,1.8vh,20px) clamp(12px,1.4vw,22px); border-radius:30px; box-shadow:0 30px 60px -30px rgba(12,31,79,.5); }
html[data-piel="cursor"] .calc{ border-bottom:0; }
html[data-piel="cursor"] .calc__preg{ font-family:var(--sf); font-weight:500; letter-spacing:-.01em; color:var(--ios-2); font-size:clamp(15px,1.2vw,17px); }
html[data-piel="cursor"] .calc__fila{ position:relative; display:flex; align-items:center; max-width:380px; padding:7px 7px 7px 18px;
  background:rgba(255,255,255,.78); -webkit-backdrop-filter:blur(24px) saturate(1.8); backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid var(--vidrio-borde); border-radius:20px; box-shadow:var(--vidrio-sombra); isolation:isolate; }
html[data-piel="cursor"] .calc__fila::before, html[data-piel="cursor"] .calc__fila::after{ content:""; position:absolute; inset:-2px; border-radius:22px; padding:2px; background:var(--ia);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .45s ease; animation:cur-gira 3.2s linear infinite; pointer-events:none; }
html[data-piel="cursor"] .calc__fila::after{ inset:-6px; border-radius:26px; padding:6px; filter:blur(12px); z-index:-1; }
html[data-piel="cursor"] .calc__fila:focus-within::before, html[data-piel="cursor"] .calc__fila.cur-lleno::before{ opacity:1; }
html[data-piel="cursor"] .calc__fila:focus-within::after, html[data-piel="cursor"] .calc__fila.cur-lleno::after{ opacity:.55; }
@keyframes cur-gira{ to{ --cur-ang:360deg; } }
html[data-piel="cursor"] .calc__sel{ flex:1 1 auto; width:auto !important; min-width:0; background:none !important; border:0 !important; padding:4px 0 !important;
  font-family:var(--sf) !important; font-weight:600 !important; font-size:21px !important; letter-spacing:-.01em !important; color:var(--tinta); caret-color:var(--ios-azul); }
html[data-piel="cursor"] .calc__sel::placeholder{ color:rgba(60,60,67,.38) !important; font-weight:500; }
html[data-piel="cursor"] .calc__sel:focus-visible{ outline:none; }
.cur-enviar{ flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgba(60,60,67,.16); color:#fff; transition:background .25s ease, transform .25s cubic-bezier(.3,1.6,.5,1); }
.cur-enviar svg{ width:17px; height:17px; }
.calc__fila.cur-lleno .cur-enviar{ background:var(--ios-azul); transform:scale(1.06); }
html[data-piel="cursor"] .calc__res-t{ clip-path:none !important; transition:none; font-family:var(--sf); font-weight:700; letter-spacing:-.02em; }
html[data-piel="cursor"] .calc__res-cuando{ text-transform:none; letter-spacing:0; font-weight:500; font-size:13px; color:var(--ios-2); }
html[data-piel="cursor"] .calc__res-hoy, html[data-piel="cursor"] .calc__pie{ color:var(--ios-2); }
/* la ruta: tarjeta de vidrio con barra de progreso */
html[data-piel="cursor"] .ruta{ padding:14px 18px 12px; background:var(--vidrio); -webkit-backdrop-filter:blur(24px) saturate(1.8); backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid var(--vidrio-borde); border-radius:22px; box-shadow:var(--vidrio-sombra); }
html[data-piel="cursor"] .ruta::before{ left:24px; right:calc(25% - 6px + 6px); top:21px; height:5px; border-radius:5px; background:rgba(60,60,67,.12); transform:none; }
html[data-piel="cursor"] .ruta::after{ content:""; position:absolute; left:24px; right:calc(25% - 6px + 6px); top:21px; height:5px; border-radius:5px;
  background:linear-gradient(90deg, #1F5FD0, #6FB6FF 60%, #F5C14E); transform-origin:left center; transform:scaleX(0); transition:transform 1.6s cubic-bezier(.45,0,.2,1) .3s; }
html[data-piel="cursor"] .ruta.se-traza::after, html[data-piel="cursor"]:not(.js-traza) .ruta::after{ transform:scaleX(var(--pct,1)); }
html[data-piel="cursor"] .ruta__n{ padding-top:26px; }
html[data-piel="cursor"] .ruta__punto{ top:-1px; width:15px; height:15px; background:#fff; border:0; box-shadow:0 0 0 1px rgba(60,60,67,.18), 0 2px 6px rgba(12,31,79,.2); }
html[data-piel="cursor"] .ruta__n.es-aqui .ruta__punto{ background:var(--ios-azul); box-shadow:0 0 0 4px rgba(47,123,245,.22); }
html[data-piel="cursor"] .ruta__n--meta .ruta__punto{ background:#F5C14E; }
html[data-piel="cursor"] .ruta__t{ font-weight:650; letter-spacing:-.015em; font-size:clamp(15px,1.15vw,17px); }
html[data-piel="cursor"] .ruta__a{ font-family:var(--sf); letter-spacing:0; text-transform:none; font-size:12.5px; font-weight:500; color:var(--ios-2); }
html[data-piel="cursor"] .ruta__n.es-aqui .ruta__a{ color:var(--ios-azul); font-weight:600; }
html[data-piel="cursor"] .ruta__n--meta.es-fecha .ruta__a{ color:#B7800F; font-weight:650; font-size:13px; }
html[data-piel="cursor"] .ruta__nota{ color:var(--ios-2); }
html[data-piel="cursor"] .entrar__cta, html[data-piel="cursor"] .hero__ir, html[data-piel="cursor"] .cuida .cierre__frase a{
  position:relative; display:inline-flex; align-items:center; gap:8px; padding:11px 20px 11px 22px; border-radius:999px;
  font-family:var(--sf); font-weight:600; font-size:clamp(15px,1.1vw,16.5px); letter-spacing:-.01em; text-transform:none; line-height:1.2;
  -webkit-backdrop-filter:blur(22px) saturate(1.8); backdrop-filter:blur(22px) saturate(1.8);
  transition:transform .35s cubic-bezier(.3,1.5,.5,1), box-shadow .35s ease, background .3s ease; overflow:hidden; isolation:isolate; }
html[data-piel="cursor"] .entrar__cta::after, html[data-piel="cursor"] .hero__ir::after{ display:none; }
/* brillo especular que cruza la píldora al pasar el cursor */
html[data-piel="cursor"] .entrar__cta::before, html[data-piel="cursor"] .hero__ir::before, html[data-piel="cursor"] .cuida .cierre__frase a::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:-1;
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0) 55%); opacity:.9; }
html[data-piel="cursor"] .entrar__cta{ color:#fff; background:linear-gradient(180deg, rgba(75,141,248,.92), rgba(31,95,208,.92));
  border:1px solid rgba(255,255,255,.45); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 10px 24px -10px rgba(31,95,208,.7), 0 1px 3px rgba(12,31,79,.18); }
html[data-piel="cursor"] .entrar__cta::before{ background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 55%); }
html[data-piel="cursor"] .entrar__cta--2{ color:#1F5FD0; font-weight:600; background:rgba(255,255,255,.66); border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 10px 24px -14px rgba(12,31,79,.4), 0 0 0 1px rgba(31,95,208,.12); }
html[data-piel="cursor"] .hero__ir, html[data-piel="cursor"] .cuida .cierre__frase a{ color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 12px 28px -14px rgba(0,0,0,.55); padding-bottom:11px; }
html[data-piel="cursor"] .cuida .cierre__frase a{ font-size:clamp(16px,1.2vw,18px); }
html[data-piel="cursor"] .cuida .cierre__frase a:hover{ color:#fff; background:rgba(255,255,255,.24); }
html[data-piel="cursor"] .entrar__cta:hover, html[data-piel="cursor"] .hero__ir:hover, html[data-piel="cursor"] .cuida .cierre__frase a:hover{ transform:translateY(-1px) scale(1.03); }
html[data-piel="cursor"] .entrar__cta:active, html[data-piel="cursor"] .hero__ir:active, html[data-piel="cursor"] .cuida .cierre__frase a:active{ transform:scale(.97); }
html[data-piel="cursor"] .entrar__cta svg{ width:16px; height:16px; }
html[data-piel="cursor"] .entrar__botones{ gap:12px; margin-top:clamp(8px,1.3vh,14px); }
html[data-piel="cursor"] .tambien dt{ text-transform:none; letter-spacing:-.01em; font-size:15px; font-weight:650; color:var(--tinta); }
html[data-piel="cursor"] .tambien dd{ color:var(--ios-2); }
html[data-piel="cursor"] .cierre__frase{ font-weight:600; letter-spacing:-.02em; }

.cur-wa{ position:absolute; z-index:4; display:block; width:clamp(230px,19vw,290px); color:#111B21; font-family:var(--sf); text-decoration:none; }
.cur-wa--der{ top:18px; right:18px; } .cur-wa--izq{ top:18px; left:18px; }
.cur-wa__escribe, .cur-wa__msg{ position:absolute; top:0; background:#D9FDD3; border-radius:12px; box-shadow:0 1px .5px rgba(11,20,26,.13), 0 14px 30px -14px rgba(11,20,26,.45); }
.cur-wa--der .cur-wa__escribe, .cur-wa--der .cur-wa__msg{ right:0; border-top-right-radius:0; }
.cur-wa--izq .cur-wa__escribe, .cur-wa--izq .cur-wa__msg{ left:0; border-top-left-radius:0; }
/* la colita de la burbuja, del lado del borde de la foto */
.cur-wa__escribe::before, .cur-wa__msg::before{ content:""; position:absolute; top:0; width:10px; height:12px; background:#D9FDD3; }
.cur-wa--der .cur-wa__escribe::before, .cur-wa--der .cur-wa__msg::before{ right:-8px; clip-path:polygon(0 0, 100% 0, 0 100%); }
.cur-wa--izq .cur-wa__escribe::before, .cur-wa--izq .cur-wa__msg::before{ left:-8px; clip-path:polygon(0 0, 100% 0, 100% 100%); }
/* "escribiendo…": tres puntos que respiran */
.cur-wa__escribe{ display:flex; gap:4px; padding:12px 14px; opacity:0; transform:translateY(-8px) scale(.92); transition:opacity .25s ease, transform .35s cubic-bezier(.2,1.4,.4,1); }
.cur-wa__escribe i{ width:7px; height:7px; border-radius:50%; background:#5E7A6E; animation:cur-wa-punto 1.1s ease-in-out infinite; }
.cur-wa__escribe i:nth-child(2){ animation-delay:.15s; } .cur-wa__escribe i:nth-child(3){ animation-delay:.3s; }
@keyframes cur-wa-punto{ 0%,60%,100%{ opacity:.35; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }
.cur-wa.llega .cur-wa__escribe{ opacity:1; transform:none; }
.cur-wa.dicho .cur-wa__escribe{ opacity:0; transform:scale(.9); transition-duration:.15s; }
/* la burbuja */
.cur-wa__msg{ display:block; width:100%; box-sizing:border-box; padding:7px 10px 6px 11px; opacity:0; transform:translateY(-10px) scale(.94);
  transform-origin:top right; transition:opacity .3s ease, transform .5s cubic-bezier(.2,1.35,.4,1); }
.cur-wa--izq .cur-wa__msg{ transform-origin:top left; }
.cur-wa.dicho .cur-wa__msg{ opacity:1; transform:none; }
.cur-wa__de{ display:block; font-size:12.5px; font-weight:600; color:#06866B; margin-bottom:2px; letter-spacing:-.005em; }
.cur-wa__txt{ display:inline; font-size:14.5px; line-height:1.35; letter-spacing:-.005em; }
.cur-wa__meta{ float:right; display:inline-flex; align-items:center; gap:3px; margin:6px 0 -2px 10px; font-size:11px; color:#667781; }
.cur-wa__leido{ width:16px; height:11px; color:#53BDEB; }
.cur-wa:hover .cur-wa__msg{ box-shadow:0 1px .5px rgba(11,20,26,.13), 0 18px 34px -12px rgba(11,20,26,.55); transform:translateY(-1px); }
.cur-wa:focus-visible{ outline:2px solid #53BDEB; outline-offset:4px; border-radius:12px; }

/* ---------- celular ---------- */
@media (max-width:900px){
  html[data-piel="cursor"] .hero--nivel .hechos__marco{ margin-right:4vw; margin-left:4vw; padding:12px 14px; border-radius:22px; }
  html[data-piel="cursor"] .aprenden__foto, html[data-piel="cursor"] .entrar__foto{ margin:12px 4vw 0; border-radius:24px; }
  html[data-piel="cursor"] .dia__escena{ border-radius:22px; }
  .cur-wa{ width:210px; } .cur-wa__txt{ font-size:13px; } .cur-wa__de{ font-size:11.5px; }
  .cur-wa--der{ top:12px; right:14px; } .cur-wa--izq{ top:12px; left:14px; }
  html[data-piel="cursor"] .ruta::before{ width:5px; height:auto; top:24px; bottom:40px; left:42.5px; right:auto; }   /* centro del punto: 18 (tarjeta) + 18 + 7.5 */
  html[data-piel="cursor"] .ruta::after{ left:42.5px; right:auto; width:5px; height:auto; top:24px; bottom:40px; transform-origin:center top; transform:scaleY(0);
    background:linear-gradient(180deg, #1F5FD0, #6FB6FF 60%, #F5C14E); }
  html[data-piel="cursor"] .ruta.se-traza::after, html[data-piel="cursor"]:not(.js-traza) .ruta::after{ transform:scaleY(var(--pct,1)); }
  html[data-piel="cursor"] .ruta__n{ padding-top:0; }
  html[data-piel="cursor"] .ruta__punto{ top:3px; left:18px; }
  html[data-piel="cursor"] .ruta__n{ padding-left:44px; }
}
@media (prefers-reduced-motion:reduce){
  .cur-caret, html[data-piel="cursor"] .momento__que b::after, html[data-piel="cursor"] .calc__fila::before, html[data-piel="cursor"] .calc__fila::after{ animation:none; }
  .cur-wa__msg{ transition:none; } .cur-wa__escribe i{ animation:none; }
}

html[data-piel="cursor"].js-traza .pilares:not(.se-traza),
html[data-piel="cursor"].js-traza .dia__cuerpo:not(.se-traza) .dia__lista,
html[data-piel="cursor"].js-traza .ruta:not(.se-traza){ opacity:0; transform:translateY(18px) scale(.975); }
html[data-piel="cursor"] .pilares, html[data-piel="cursor"] .dia__lista, html[data-piel="cursor"] .ruta{
  transition:opacity .7s ease, transform .9s cubic-bezier(.2,1.1,.3,1); }
@media (prefers-reduced-motion:reduce){ html[data-piel="cursor"] .pilares, html[data-piel="cursor"] .dia__lista, html[data-piel="cursor"] .ruta{ opacity:1 !important; transform:none !important; } }

html[data-piel="cursor"] .dia__pie{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important;
  overflow:hidden !important; clip-path:inset(50%) !important; border:0 !important; white-space:nowrap; }
.cur-wa--pie{ top:auto; bottom:18px; left:18px; right:auto; width:clamp(250px,24vw,340px); }
.cur-wa--pie .cur-wa__escribe, .cur-wa--pie .cur-wa__msg{ top:auto; bottom:0; left:0; right:auto; border-top-right-radius:12px; border-bottom-left-radius:0; }
.cur-wa--pie .cur-wa__escribe::before, .cur-wa--pie .cur-wa__msg::before{ top:auto; bottom:0; left:-8px; right:auto; clip-path:polygon(100% 0, 100% 100%, 0 100%); }
.cur-wa--pie .cur-wa__msg{ transform-origin:bottom left; }
.cur-wa--pie .cur-wa__txt{ font-size:15px; }
.cur-wa--pie.llega:not(.dicho) .cur-wa__msg{ opacity:0; transform:translateY(8px) scale(.96); transition-duration:.18s; }
@media (max-width:900px){ .cur-wa--pie{ bottom:12px; left:14px; width:min(78%, 280px); } .cur-wa--pie .cur-wa__txt{ font-size:13.5px; } }

.cur-wa__escribe, .cur-wa__msg, .cur-wa__escribe::before, .cur-wa__msg::before{ background:#FFFFFF; }
.cur-wa__leido{ display:none; }
