/* Almacenes El Punto · estilos del sitio · v1.0
   Fuente de verdad: brand.html (manual de marca) */

/* ================= TOKENS ================= */
:root{
  --rojo-50:#FEF2F2; --rojo-100:#FDE3E4; --rojo-200:#F9C3C6; --rojo-400:#EE5560;
  --rojo-600:#E20919; --rojo-700:#C10715; --rojo-800:#9A0511; --rojo-900:#6E040C;
  --gris-0:#FFFFFF; --gris-50:#F7F7F8; --gris-100:#EFEFF1; --gris-200:#E2E2E5; --gris-300:#C9C9CE;
  --gris-500:#8A8A91; --gris-600:#5E5E66; --gris-700:#45454C; --gris-800:#2B2B30; --gris-900:#18181B;
  --dorado-400:#F6C342; --dorado-50:#FFF8E6;
  --exito-700:#15803D; --exito-50:#ECFDF3;
  --aviso-700:#A15C00; --aviso-50:#FFF7E6;
  --error-700:#B42318; --error-50:#FEF3F2;
  --info-700:#1D4ED8; --info-50:#EFF4FF;
  --whatsapp:#25D366;

  --marca:var(--rojo-600); --marca-hover:var(--rojo-700); --marca-suave:var(--rojo-50);
  --fondo:var(--gris-0); --fondo-alt:var(--gris-50); --oscuro:var(--gris-900);
  --texto:var(--gris-900); --texto-2:var(--gris-600); --texto-3:var(--gris-500);
  --borde:var(--gris-200); --borde-campo:var(--gris-300); --foco:var(--rojo-600);

  --f-titulo:"Poppins", "Segoe UI", system-ui, sans-serif;
  --f-texto:"Open Sans", "Segoe UI", system-ui, sans-serif;
  --t-xs:.8125rem; --t-sm:.875rem; --t-base:1rem; --t-md:1.125rem; --t-lg:1.25rem;
  --t-xl:1.5rem; --t-2xl:clamp(1.625rem,1.3rem + 1.2vw,2rem); --t-3xl:clamp(2rem,1.5rem + 2vw,2.75rem);
  --t-hero:clamp(2.125rem,1.4rem + 3vw,3.5rem);

  --e-1:4px; --e-2:8px; --e-3:12px; --e-4:16px; --e-5:24px; --e-6:32px; --e-7:48px; --e-8:64px; --e-9:96px;
  --r-sm:6px; --r-md:10px; --r-lg:16px; --r-full:999px;
  --sombra-1:0 1px 2px rgb(24 24 27 / .05), 0 1px 3px rgb(24 24 27 / .08);
  --sombra-2:0 4px 12px -2px rgb(24 24 27 / .08), 0 2px 4px -2px rgb(24 24 27 / .06);
  --sombra-3:0 16px 32px -8px rgb(24 24 27 / .14), 0 4px 8px -4px rgb(24 24 27 / .06);
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-in-out:cubic-bezier(.77,0,.175,1); --d-press:140ms; --d-ui:200ms; --d-panel:300ms;
  --control-alto:48px; --contenedor:1200px; --cabecera-alto:76px;
}

/* ================= BASE ================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--cabecera-alto) + 16px)}
body{margin:0;background:var(--fondo);color:var(--texto);font:400 var(--t-base)/1.65 var(--f-texto);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--rojo-100);color:var(--rojo-900)}
:focus-visible{outline:2px solid var(--foco);outline-offset:3px;border-radius:4px}
a{color:var(--rojo-700);text-underline-offset:.2em}
a:hover{color:var(--rojo-800)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{font-family:var(--f-titulo);margin:0;line-height:1.2;text-wrap:balance;color:var(--texto)}
h1{font-size:var(--t-3xl);font-weight:700;letter-spacing:-.02em}
h2{font-size:var(--t-2xl);font-weight:700;letter-spacing:-.015em}
h3{font-size:var(--t-lg);font-weight:600}
h4{font-size:var(--t-md);font-weight:600}
p{margin:0 0 var(--e-4);text-wrap:pretty}
ul,ol{padding-left:1.25em}
html{scrollbar-color:var(--gris-300) transparent}
.ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:12px;top:-60px;z-index:100;background:var(--oscuro);color:#fff;padding:10px 14px;border-radius:var(--r-sm);text-decoration:none;font-weight:600}
.saltar:focus{top:12px;color:#fff}
.num{font-variant-numeric:tabular-nums}

/* ================= LAYOUT ================= */
.contenedor{max-width:var(--contenedor);margin:0 auto;padding:0 var(--e-4)}
@media (min-width:768px){.contenedor{padding:0 var(--e-5)}}
.seccion{padding:var(--e-8) 0}
@media (min-width:900px){.seccion{padding:var(--e-9) 0}}
.seccion.alt{background:var(--fondo-alt)}
.seccion.compacta{padding:var(--e-7) 0}
.encabezado{max-width:720px;margin:0 auto var(--e-7);text-align:center}
.encabezado.izq{margin-left:0;text-align:left}
.encabezado p{color:var(--texto-2);font-size:var(--t-md);margin:var(--e-3) 0 0}
.encabezado .sobre{display:inline-block;font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.08em;color:var(--marca);margin-bottom:var(--e-3)}
.grid{display:grid;gap:var(--e-4)}
.g-2,.g-3,.g-4{grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.g-3,.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.dividido{display:grid;gap:var(--e-7);grid-template-columns:minmax(0,1fr);align-items:center}
@media (min-width:900px){.dividido{grid-template-columns:1fr 1fr;gap:var(--e-8)}.dividido.ancho-izq{grid-template-columns:1.2fr .8fr}.dividido.ancho-der{grid-template-columns:.85fr 1.15fr}}
.centro{text-align:center}
main{overflow-x:clip}
@media (max-width:899px){.form-primero>form{order:-1}}
.mt-5{margin-top:var(--e-5)} .mt-6{margin-top:var(--e-6)} .mt-7{margin-top:var(--e-7)}

/* ================= BOTONES ================= */
.btn{-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--control-alto);padding:0 22px;border-radius:var(--r-md);border:1.5px solid transparent;cursor:pointer;text-decoration:none;user-select:none;white-space:nowrap;
  font:600 var(--t-base)/1 var(--f-titulo);
  transition:transform var(--d-press) var(--ease-out),background-color var(--d-ui) ease,border-color var(--d-ui) ease,color var(--d-ui) ease,box-shadow var(--d-ui) ease}
.btn:active{transform:scale(.97)}
.btn .ic{width:20px;height:20px;transition:transform var(--d-ui) var(--ease-out)}
.btn-primario{background:var(--marca);color:#fff;box-shadow:0 1px 2px rgb(154 5 17 / .3)}
.btn-secundario{background:#fff;color:var(--texto);border-color:var(--borde-campo)}
.btn-borde-blanco{background:transparent;color:#fff;border-color:rgb(255 255 255 / .85)}
.btn-blanco{background:#fff;color:var(--rojo-700)}
.btn-wa{background:var(--whatsapp);color:#073B1E}
.btn-texto{background:none;color:var(--rojo-700);padding:0 6px;min-height:40px}
.btn-sm{min-height:40px;padding:0 16px;font-size:var(--t-sm)}
.btn-lg{min-height:54px;padding:0 28px;font-size:var(--t-md)}
.btn-bloque{width:100%}
.btn-primario:hover,.btn-primario:focus-visible{color:#fff}
@media (hover:hover) and (pointer:fine){
  .btn-primario:hover{background:var(--marca-hover)}
  .btn-primario:hover .ic-mov,.btn-blanco:hover .ic-mov{transform:translateX(3px)}
  .btn-secundario:hover{border-color:var(--texto);color:var(--texto)}
  .btn-borde-blanco:hover{background:#fff;color:var(--rojo-700)}
  .btn-blanco:hover{background:var(--rojo-50);color:var(--rojo-800)}
  .btn-wa:hover{background:#1EBE5A;color:#073B1E}
  .btn-texto:hover{text-decoration:underline}
}
.btn:disabled,.btn[aria-disabled="true"]{background:var(--gris-100);color:var(--gris-500);border-color:transparent;box-shadow:none;cursor:not-allowed;transform:none}
.btn[aria-busy="true"]{pointer-events:none;opacity:.92}
.btn[aria-busy="true"] .ic{animation:girar 700ms linear infinite}
@keyframes girar{to{transform:rotate(1turn)}}
.acciones{display:flex;flex-wrap:wrap;gap:var(--e-3)}
.centro .acciones{justify-content:center}

/* ================= CABECERA ================= */
.topbar{background:var(--oscuro);color:#D4D4D8;font-size:var(--t-xs)}
.topbar .contenedor{display:flex;justify-content:space-between;align-items:center;gap:var(--e-4);min-height:38px}
.topbar a{color:#E4E4E7;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.topbar a:hover{color:#fff}
.topbar .ic{width:15px;height:15px}
.topbar .datos{display:flex;align-items:center;gap:var(--e-5)}
.redes{display:flex;gap:4px}
.redes a{width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r-full);color:inherit}
.redes a:hover{background:rgb(255 255 255 / .1);color:#fff}
.canales .redes a{color:var(--texto);border:1px solid var(--borde);width:40px;height:40px}
.canales .redes a:hover{background:var(--marca);border-color:var(--marca);color:#fff}
.redes svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){.topbar .ocultar-movil{display:none}.topbar .contenedor{justify-content:center}}

.cabecera{position:sticky;top:0;z-index:40;background:rgb(255 255 255 / .94);backdrop-filter:saturate(1.6) blur(12px);-webkit-backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--borde);transition:box-shadow var(--d-ui) ease}
.cabecera.con-sombra{box-shadow:0 6px 20px -12px rgb(24 24 27 / .25)}
.cabecera .contenedor{display:flex;align-items:center;gap:var(--e-5);height:var(--cabecera-alto)}
.marca-link{display:flex;align-items:center;gap:var(--e-3);text-decoration:none;color:var(--texto);flex:none}
.marca-link img{width:56px;height:56px}
.marca-link span{display:none;line-height:1.15}
.marca-link b{display:block;font:700 var(--t-base)/1.1 var(--f-titulo)}
.marca-link small{font-size:var(--t-xs);color:var(--texto-2)}
@media (min-width:1100px){.marca-link span{display:block}}
.nav{flex:1;display:flex;justify-content:center}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:2px}
.nav a{display:block;padding:10px 14px;border-radius:var(--r-sm);text-decoration:none;color:var(--texto);font:500 var(--t-sm)/1 var(--f-titulo);transition:color var(--d-ui) ease,background-color var(--d-ui) ease}
.nav a:hover{background:var(--gris-50);color:var(--texto)}
.nav a[aria-current="page"]{color:var(--rojo-700);background:var(--marca-suave)}
.cabecera .cta{flex:none}
.menu-btn{display:none;-webkit-tap-highlight-color:transparent;width:44px;height:44px;border-radius:var(--r-md);border:1px solid var(--borde);background:#fff;color:var(--texto);cursor:pointer;place-items:center;transition:transform var(--d-press) var(--ease-out)}
.menu-btn:active{transform:scale(.95)}
@media (max-width:959px){
  .nav,.cabecera .cta{display:none}
  .menu-btn{display:grid;margin-left:auto}
  :root{--cabecera-alto:68px}
  .marca-link img{width:48px;height:48px}
}

/* Menú móvil */
.cajon{position:fixed;inset:0;z-index:60;visibility:hidden;pointer-events:none}
.cajon.abierto{visibility:visible;pointer-events:auto}
.cajon .velo{position:absolute;inset:0;background:rgb(24 24 27 / .45);opacity:0;transition:opacity var(--d-panel) ease}
.cajon.abierto .velo{opacity:1}
.cajon .panel{position:absolute;top:0;right:0;bottom:0;width:min(86vw,360px);background:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform var(--d-panel) cubic-bezier(.32,.72,0,1);box-shadow:var(--sombra-3);overflow-y:auto}
.cajon.abierto .panel{transform:none}
.cajon .panel-cab{display:flex;justify-content:space-between;align-items:center;padding:var(--e-4);border-bottom:1px solid var(--borde)}
.cajon .panel-cab img{width:48px}
.cajon nav ul{list-style:none;margin:0;padding:var(--e-3)}
.cajon nav a{display:flex;justify-content:space-between;align-items:center;padding:14px var(--e-3);border-radius:var(--r-md);text-decoration:none;color:var(--texto);font:500 var(--t-md)/1.2 var(--f-titulo)}
.cajon nav a .ic{width:18px;height:18px;color:var(--texto-3)}
.cajon nav a[aria-current="page"]{color:var(--marca);background:var(--marca-suave)}
.cajon .panel-pie{margin-top:auto;padding:var(--e-4);display:grid;gap:var(--e-3);border-top:1px solid var(--borde)}
@media (prefers-reduced-motion:reduce){.cajon .panel{transition:none}}

/* Migas */
.migas{font-size:var(--t-sm);color:var(--texto-2);padding:var(--e-4) 0}
.migas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.migas li+li::before{content:"/";margin-right:6px;color:var(--gris-300)}
.migas a{color:var(--texto-2);text-decoration:none}
.migas a:hover{color:var(--marca)}

/* ================= HERO ================= */
.hero{background:linear-gradient(180deg,var(--gris-50),#fff);overflow:hidden}
.hero .contenedor{display:grid;gap:var(--e-6);grid-template-columns:minmax(0,1fr);align-items:center;padding-top:var(--e-7);padding-bottom:0}
.hero h1{font-size:var(--t-hero);line-height:1.08;letter-spacing:-.025em;margin-bottom:var(--e-4)}
.hero h1 em{font-style:normal;color:var(--marca)}
.hero .lead{font-size:var(--t-md);color:var(--texto-2);max-width:52ch;margin-bottom:var(--e-5)}
.hero .confianza{display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-5);margin-top:var(--e-5);font-size:var(--t-sm);color:var(--texto-2);list-style:none;padding:0}
.hero .confianza li{display:flex;align-items:center;gap:6px}
.hero .confianza .ic{width:18px;height:18px;color:var(--exito-700)}
.hero-img{position:relative;justify-self:center;align-self:end;width:min(100%,440px)}
.hero-img::before{content:"";position:absolute;left:50%;bottom:0;width:92%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,var(--rojo-100),transparent 72%)}
.hero-img img{position:relative;margin:0 auto;max-height:520px;width:auto}
.hero-img .sello{position:absolute;right:4%;top:12%;width:96px;filter:drop-shadow(0 10px 18px rgb(193 7 21 / .3));animation:aparece 600ms var(--ease-out) 200ms both}
@keyframes aparece{from{opacity:0;transform:scale(.92) rotate(-8deg)}to{opacity:1;transform:none}}
@media (min-width:900px){.hero .contenedor{grid-template-columns:1.1fr .9fr;padding-top:var(--e-8)}.hero-texto{padding-bottom:var(--e-8)}}
@media (max-width:899px){.hero-img img{max-height:300px}.hero-img .sello{width:72px;right:8%}.hero .acciones .btn{flex:1 1 200px}.hero-foto .mascota{width:min(52vw,190px)}}
.hero.simple .contenedor{padding-bottom:var(--e-7)}
.hero.simple{background:var(--gris-50);border-bottom:1px solid var(--borde)}
.etiqueta-oferta{display:inline-flex;align-items:center;gap:6px;background:var(--dorado-400);color:var(--gris-900);font:700 var(--t-sm)/1 var(--f-titulo);padding:8px 12px;border-radius:var(--r-sm);margin-bottom:var(--e-4)}
.etiqueta-oferta .ic{width:16px;height:16px}

/* Hero con foto (cortinería) */
.hero-foto{position:relative;color:#fff;isolation:isolate;overflow:hidden;background:var(--rojo-800)}
.hero-foto .fondo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.hero-foto::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgb(110 4 12 / .92) 0%,rgb(154 5 17 / .78) 45%,rgb(154 5 17 / .25) 100%)}
.hero-foto .contenedor{display:grid;gap:var(--e-5);grid-template-columns:minmax(0,1fr);align-items:end;padding-top:var(--e-8);padding-bottom:0}
.hero-foto h1{color:#fff;font-size:var(--t-hero);line-height:1.08;letter-spacing:-.025em;margin-bottom:var(--e-4)}
.hero-foto .lead{font-size:var(--t-md);color:#fff;opacity:.95;max-width:46ch;margin-bottom:var(--e-5)}
.hero-foto .texto{padding-bottom:var(--e-8)}
.hero-foto .mascota{justify-self:center;position:relative;width:min(70vw,260px)}
.hero-foto .insignia{position:absolute;right:-8px;bottom:18%;background:#fff;color:var(--texto);border-radius:var(--r-lg);padding:10px 14px;box-shadow:var(--sombra-3);text-align:center;line-height:1.2}
.hero-foto .insignia b{display:block;font:700 var(--t-xl)/1 var(--f-titulo);color:var(--marca)}
.hero-foto .insignia small{font-size:var(--t-xs);color:var(--texto-2)}
@media (min-width:900px){.hero-foto .contenedor{grid-template-columns:1.3fr .7fr}.hero-foto .mascota{justify-self:end}}

/* ================= PROMOS (carrusel) ================= */
.carrusel{position:relative}
.carrusel-pista{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:var(--e-4);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--r-lg);overscroll-behavior-x:contain}
.carrusel-pista::-webkit-scrollbar{display:none}
.carrusel-pista>*{scroll-snap-align:start}
.carrusel-pista img{width:100%;border-radius:var(--r-lg);background:var(--gris-100)}
.carrusel.aliados .carrusel-pista{grid-auto-columns:88%}
@media (min-width:768px){.carrusel.aliados .carrusel-pista{grid-auto-columns:calc(50% - 8px)}}
.carrusel-ctrl{display:flex;justify-content:center;align-items:center;gap:var(--e-3);margin-top:var(--e-4)}
.carrusel-ctrl button{-webkit-tap-highlight-color:transparent;width:44px;height:44px;border-radius:var(--r-full);border:1px solid var(--borde);background:#fff;color:var(--texto);display:grid;place-items:center;cursor:pointer;transition:transform var(--d-press) var(--ease-out),border-color var(--d-ui) ease}
.carrusel-ctrl button:active{transform:scale(.94)}
.carrusel-ctrl button:hover{border-color:var(--texto)}
.carrusel-ctrl .ic{width:20px;height:20px}
.puntos{display:flex;gap:6px}
.puntos span{width:8px;height:8px;border-radius:var(--r-full);background:var(--gris-300);transition:width var(--d-ui) var(--ease-out),background-color var(--d-ui) ease}
.puntos span.activo{width:22px;background:var(--marca)}

/* ================= PASOS DEL CRÉDITO ================= */
.pasos-credito{display:grid;gap:1px;grid-template-columns:repeat(2,minmax(0,1fr));background:var(--borde);border:1px solid var(--borde);border-radius:var(--r-lg);overflow:hidden;list-style:none;margin:0;padding:0;counter-reset:paso}
.pasos-credito li{background:#fff;padding:var(--e-5);display:grid;gap:6px;align-content:start;counter-increment:paso}
.pasos-credito .ico{width:48px;height:48px;border-radius:12px;background:var(--marca-suave);color:var(--marca);display:grid;place-items:center;margin-bottom:var(--e-2)}
.pasos-credito li::before{content:"Paso " counter(paso);font:600 var(--t-xs)/1 var(--f-titulo);color:var(--texto-3);text-transform:uppercase;letter-spacing:.06em;order:1}
.pasos-credito .ico{order:0}
.pasos-credito h3{order:2;font-size:var(--t-md)}
.pasos-credito p{order:3;margin:0;font-size:var(--t-sm);color:var(--texto-2)}
@media (min-width:900px){.pasos-credito{grid-template-columns:repeat(4,minmax(0,1fr))}.pasos-credito li{padding:var(--e-6) var(--e-5)}}

/* ================= CATEGORÍAS ================= */
.cats{display:grid;gap:var(--e-3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cat{display:grid;text-decoration:none;color:var(--texto);background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);overflow:hidden;transition:box-shadow var(--d-ui) ease,transform var(--d-ui) var(--ease-out),border-color var(--d-ui) ease}
.cat .img{aspect-ratio:1;background:var(--gris-50);overflow:hidden}
.cat img{width:100%;height:100%;object-fit:contain;padding:var(--e-3);transition:transform var(--d-panel) var(--ease-out)}
.cat span{padding:var(--e-3) var(--e-4);font:600 var(--t-sm)/1.25 var(--f-titulo);display:flex;justify-content:space-between;align-items:center;gap:var(--e-2)}
.cat span .ic{width:16px;height:16px;color:var(--marca)}
@media (hover:hover){.cat:hover{box-shadow:var(--sombra-3);transform:translateY(-2px);color:var(--texto);border-color:transparent}.cat:hover img{transform:scale(1.04)}}

/* ================= TARJETAS ================= */
.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-5)}
.beneficio{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-6) var(--e-5);display:grid;gap:var(--e-2);align-content:start}
.beneficio .ico,.ico-caja{width:48px;height:48px;border-radius:12px;background:var(--marca-suave);color:var(--marca);display:grid;place-items:center;margin-bottom:var(--e-2)}
.beneficio h3{font-size:var(--t-md)}
.beneficio p{margin:0;font-size:var(--t-sm);color:var(--texto-2);line-height:1.6}
.beneficio.destacado{background:var(--marca);border-color:var(--marca);color:#fff}
.beneficio.destacado h3,.beneficio.destacado p{color:#fff}
.beneficio.destacado .ico{background:rgb(255 255 255 / .16);color:#fff}

.lista-check{list-style:none;padding:0;margin:0;display:grid;gap:var(--e-4)}
.lista-check li{display:grid;grid-template-columns:44px 1fr;gap:var(--e-4);align-items:start}
.lista-check .ico-caja{width:44px;height:44px;margin:0}
.lista-check h3{font-size:var(--t-base);margin-bottom:4px}
.lista-check p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}

.soluciones{display:grid;gap:var(--e-3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.soluciones{grid-template-columns:repeat(3,minmax(0,1fr))}}
.solucion{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-5) var(--e-4);display:grid;justify-items:center;text-align:center;gap:var(--e-3);font:600 var(--t-sm)/1.25 var(--f-titulo)}
.solucion .ico-caja{margin:0;width:56px;height:56px;border-radius:14px}
.solucion .ico-caja .ic{width:28px;height:28px}

/* Formas de pago */
.pagos{display:grid;gap:var(--e-3);grid-template-columns:minmax(0,1fr)}
@media (min-width:768px){.pagos{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pagos img{width:100%;border-radius:var(--r-md);border:1px solid var(--borde)}

/* Misión */
.mision{display:grid;justify-items:center;text-align:center;gap:var(--e-4);max-width:760px;margin:0 auto}
.mision img{width:88px}
.mision p{font-size:var(--t-md);color:var(--texto-2);margin:0}

/* Banda de llamado */
.banda{background:var(--marca);color:#fff;border-radius:var(--r-lg);padding:var(--e-7) var(--e-5);display:grid;gap:var(--e-4);justify-items:center;text-align:center;position:relative;overflow:hidden;isolation:isolate}
.banda::before{content:"";position:absolute;width:420px;aspect-ratio:1;right:-140px;top:-160px;border-radius:50%;border:2px solid rgb(255 255 255 / .18);z-index:-1}
.banda::after{content:"";position:absolute;width:300px;aspect-ratio:1;left:-120px;bottom:-170px;border-radius:50%;background:rgb(0 0 0 / .08);z-index:-1}
.banda h2{color:#fff;font-size:clamp(1.35rem,1.1rem + 1vw,1.9rem);max-width:32ch;line-height:1.25}
.banda p{margin:0;color:#fff;max-width:56ch}
.banda img{width:72px}
.banda.oscura{background:var(--oscuro)}
@media (min-width:768px){.banda{padding:var(--e-8) var(--e-7)}}

/* Bloque dividido con imagen */
.bloque-img{border-radius:var(--r-lg);overflow:hidden;background:var(--gris-100)}
.bloque-img img{width:100%;height:100%;object-fit:cover}
.panel-rojo{background:var(--marca);color:#fff;border-radius:var(--r-lg);padding:var(--e-7) var(--e-6);display:grid;gap:var(--e-4);align-content:center}
.panel-rojo h2,.panel-rojo p{color:#fff;margin:0}
.panel-rojo .sobre{font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.08em}

/* Escolar */
.temporada{display:grid;gap:var(--e-5);grid-template-columns:minmax(0,1fr);align-items:center;background:var(--dorado-50);border:1px solid #F6E3B0;border-radius:var(--r-lg);padding:var(--e-6) var(--e-5);overflow:hidden}
.temporada .imgs{display:flex;justify-content:center;align-items:flex-end;gap:var(--e-3)}
.temporada .imgs img{max-height:220px;width:auto}
@media (min-width:900px){.temporada{grid-template-columns:1.2fr .8fr;padding:var(--e-7)}}

/* ================= CORTINERÍA ================= */
.estilos{display:grid;gap:var(--e-4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.estilos{grid-template-columns:repeat(3,minmax(0,1fr))}}
.estilo{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column}
.estilo .img{aspect-ratio:4/5;background:var(--gris-100);overflow:hidden}
.estilo img{width:100%;height:100%;object-fit:cover;transition:transform var(--d-panel) var(--ease-out)}
.estilo .cuerpo{padding:var(--e-4);display:grid;gap:6px;flex:1;align-content:start}
.estilo h3{font-size:var(--t-base)}
.estilo p{margin:0 0 var(--e-2);font-size:var(--t-sm);color:var(--texto-2)}
.estilo .btn{margin-top:auto;justify-self:start}
@media (hover:hover){.estilo:hover img{transform:scale(1.04)}}
@media (max-width:520px){.estilo .btn{font-size:var(--t-xs);padding:0 10px;white-space:normal;text-align:center}}

.proceso{list-style:none;margin:0;padding:0;display:grid;gap:var(--e-5);grid-template-columns:minmax(0,1fr);counter-reset:pr;position:relative}
.proceso li{counter-increment:pr;display:grid;grid-template-columns:48px 1fr;gap:var(--e-4);align-items:start}
.proceso li::before{content:counter(pr);width:48px;height:48px;border-radius:50%;background:var(--marca);color:#fff;display:grid;place-items:center;font:700 var(--t-md)/1 var(--f-titulo);box-shadow:0 0 0 6px var(--rojo-50)}
.proceso h3{font-size:var(--t-base);margin:4px 0}
.proceso p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}
@media (min-width:900px){
  .proceso{grid-template-columns:repeat(4,minmax(0,1fr))}
  .proceso::before{content:"";position:absolute;left:24px;right:24px;top:24px;height:2px;background:var(--rojo-200);z-index:-1}
  .proceso li{grid-template-columns:1fr;justify-items:start}
}

.testimonios{display:grid;gap:var(--e-4);grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.testimonios{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.testimonios{grid-template-columns:repeat(4,minmax(0,1fr))}}
.testimonio{margin:0;background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-5);display:flex;flex-direction:column;gap:var(--e-3)}
.estrellas{display:flex;gap:2px;color:var(--dorado-400)}
.estrellas svg{width:18px;height:18px;fill:currentColor}
.testimonio blockquote{margin:0;font-size:var(--t-sm);line-height:1.6}
.testimonio figcaption{margin-top:auto;font-size:var(--t-sm)}
.testimonio figcaption b{display:block;font-family:var(--f-titulo);font-weight:600}
.testimonio figcaption span{color:var(--texto-2)}

/* ================= BLOG ================= */
.posts{display:grid;gap:var(--e-5);grid-template-columns:minmax(0,1fr)}
@media (min-width:700px){.posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.posts{grid-template-columns:repeat(3,minmax(0,1fr))}}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:var(--texto);transition:box-shadow var(--d-ui) ease,transform var(--d-ui) var(--ease-out)}
.post-card .img{aspect-ratio:1200/628;background:var(--gris-100);overflow:hidden}
.post-card img{width:100%;height:100%;object-fit:cover}
.post-card img[src$=".png"],.articulo-portada img[src$=".png"]{object-fit:contain;background:#fff;padding:var(--e-3)}
.post-card .cuerpo{padding:var(--e-5);display:grid;gap:var(--e-2);flex:1;align-content:start}
.post-card .meta{font-size:var(--t-xs);color:var(--texto-3);display:flex;gap:var(--e-3);flex-wrap:wrap}
.post-card .cat-tag{color:var(--marca);font-weight:600}
.post-card h3{font-size:var(--t-md);line-height:1.35}
.post-card p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}
.post-card .leer{margin-top:var(--e-2);font:600 var(--t-sm)/1 var(--f-titulo);color:var(--marca);display:inline-flex;align-items:center;gap:6px}
.post-card .leer .ic{width:16px;height:16px;transition:transform var(--d-ui) var(--ease-out)}
@media (hover:hover){.post-card:hover{box-shadow:var(--sombra-3);transform:translateY(-2px);color:var(--texto)}.post-card:hover .leer .ic{transform:translateX(3px)}}
.filtros{display:flex;flex-wrap:wrap;gap:var(--e-2);margin-bottom:var(--e-6);justify-content:center}
.filtros a{text-decoration:none;color:var(--texto-2);border:1px solid var(--borde);border-radius:var(--r-full);padding:8px 16px;font:500 var(--t-sm)/1 var(--f-titulo);transition:all var(--d-ui) ease}
.filtros a:hover{border-color:var(--texto);color:var(--texto)}
.filtros a[aria-current="page"]{background:var(--marca);border-color:var(--marca);color:#fff}

.articulo-cab{background:var(--gris-50);border-bottom:1px solid var(--borde);padding-bottom:var(--e-7)}
.articulo-cab .contenedor{max-width:860px}
.articulo-cab h1{font-size:clamp(1.85rem,1.4rem + 2vw,2.75rem);line-height:1.15;margin:var(--e-3) 0 var(--e-4)}
.articulo-cab .extracto{font-size:var(--t-md);color:var(--texto-2);margin:0 0 var(--e-5)}
.articulo-cab .meta{display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-5);font-size:var(--t-sm);color:var(--texto-2)}
.articulo-cab .meta span{display:inline-flex;align-items:center;gap:6px}
.articulo-cab .meta .ic{width:16px;height:16px}
.articulo-cab .cat-tag{display:inline-block;font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.06em;color:var(--marca);text-decoration:none}
.articulo-portada{max-width:860px;margin:calc(var(--e-7) * -1) auto 0;padding:0 var(--e-4)}
.articulo-portada img{width:100%;border-radius:var(--r-lg);box-shadow:var(--sombra-2);aspect-ratio:1200/628;object-fit:cover;background:var(--gris-100)}
.articulo-cuerpo{display:grid;gap:var(--e-7);grid-template-columns:minmax(0,1fr);max-width:1080px;margin:0 auto;padding:var(--e-7) var(--e-4) 0}
@media (min-width:1000px){.articulo-cuerpo{grid-template-columns:minmax(0,1fr) 280px;align-items:start}}
.lateral{display:grid;gap:var(--e-4)}
@media (min-width:1000px){.lateral{position:sticky;top:calc(var(--cabecera-alto) + 24px)}}
.lateral .tarjeta h2{font-size:var(--t-md);margin-bottom:var(--e-2)}
.lateral .tarjeta p{font-size:var(--t-sm);color:var(--texto-2)}
.lateral .indice-art ol{margin:0;padding-left:1.1em;font-size:var(--t-sm);display:grid;gap:6px}
.lateral .indice-art a{color:var(--texto-2);text-decoration:none}
.lateral .indice-art a:hover{color:var(--marca)}
.lateral .cta-rojo{background:var(--marca);border-color:var(--marca);color:#fff}
.lateral .cta-rojo h2,.lateral .cta-rojo p{color:#fff}

/* Prosa (blog y legales) */
.prosa{max-width:72ch;font-size:1.0625rem;line-height:1.75;color:var(--gris-800)}
.prosa>*+*{margin-top:1.1em}
.prosa h2{font-size:var(--t-xl);margin-top:2em;color:var(--texto)}
.prosa h3{font-size:var(--t-lg);margin-top:1.8em;color:var(--texto)}
.prosa h4{font-size:var(--t-md);margin-top:1.6em}
.prosa p{margin-bottom:0}
.prosa ul,.prosa ol{margin-bottom:0;padding-left:1.3em;display:grid;gap:.5em}
.prosa li::marker{color:var(--marca)}
.prosa strong{color:var(--texto);font-weight:700}
.prosa img{border-radius:var(--r-lg);margin:1.6em auto;max-height:520px;width:auto}
.prosa a{font-weight:600}
.prosa blockquote{margin:1.5em 0;padding:var(--e-4) var(--e-5);background:var(--gris-50);border-radius:var(--r-md);font-style:italic}
.prosa table{width:100%;border-collapse:collapse;font-size:var(--t-sm)}
.prosa th,.prosa td{border:1px solid var(--borde);padding:8px 12px;text-align:left}
.prosa .tabla-scroll{overflow-x:auto}
.prosa .faq{margin-top:1.1em;max-width:none}
.prosa .faq summary{font-size:var(--t-base)}
.prosa .faq-art{background:var(--gris-50);border-radius:var(--r-md);padding:var(--e-4) var(--e-5)}
.prosa .faq-art strong{display:block;font-family:var(--f-titulo);margin-bottom:4px}
.prosa .cta-art{background:var(--marca-suave);border:1px solid var(--rojo-200);border-radius:var(--r-lg);padding:var(--e-5);display:grid;gap:var(--e-3)}
.prosa .cta-art p{margin:0}
.prosa .cta-art .btn{justify-self:start;font-weight:600}
.legal-cab{font-size:var(--t-sm);color:var(--texto-2);margin-top:var(--e-3)}

/* ================= FAQ ================= */
.faq{display:grid;gap:var(--e-3);max-width:820px;margin:0 auto}
.faq details{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);transition:border-color var(--d-ui) ease,box-shadow var(--d-ui) ease}
.faq details[open]{border-color:var(--rojo-200);box-shadow:var(--sombra-2)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--e-4);padding:var(--e-5);font:600 var(--t-base)/1.4 var(--f-titulo);-webkit-tap-highlight-color:transparent}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:20px;height:20px;color:var(--marca);transition:transform var(--d-ui) var(--ease-out)}
.faq details[open] summary .ic{transform:rotate(45deg)}
.faq .resp{padding:0 var(--e-5) var(--e-5);color:var(--texto-2)}
.faq .resp p:last-child{margin:0}

/* ================= BUSCADOR EN VIVO ================= */
.faq-panel,.blog-panel{max-width:820px;margin:0 auto var(--e-6);display:grid;gap:var(--e-4)}
.blog-panel .filtros{margin-bottom:0}
.buscador{display:grid;gap:var(--e-2)}
.buscador-campo{position:relative}
.buscador-campo>.ic{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:22px;height:22px;color:var(--texto-3);pointer-events:none;transition:color var(--d-ui) ease}
.buscador-campo input{width:100%;min-height:58px;padding:0 54px;border:1.5px solid var(--borde-campo);border-radius:var(--r-full);background:#fff;font:400 17px/1 var(--f-texto);color:var(--texto);box-shadow:var(--sombra-2);appearance:none;-webkit-appearance:none;transition:border-color var(--d-ui) ease,box-shadow var(--d-ui) ease}
.buscador-campo input::-webkit-search-cancel-button{display:none}
.buscador-campo input::placeholder{color:var(--gris-600);opacity:.8}
.buscador-campo input:focus{outline:none;border-color:var(--marca);box-shadow:0 0 0 4px var(--rojo-100),var(--sombra-2)}
.buscador-campo:focus-within>.ic{color:var(--marca)}
.buscador-limpiar{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:var(--gris-100);color:var(--texto-2);display:grid;place-items:center;cursor:pointer;transition:background-color var(--d-ui) ease}
.buscador-limpiar:hover{background:var(--gris-200)}
.buscador-limpiar[hidden]{display:none}
.buscador-limpiar .ic{width:18px;height:18px}
.buscador-estado{margin:0;min-height:1.4em;font-size:var(--t-sm);color:var(--texto-2);text-align:center}
.sin-resultados{text-align:center;display:grid;justify-items:center;gap:var(--e-2);padding:var(--e-7) var(--e-4);border:1.5px dashed var(--borde-campo);border-radius:var(--r-lg);background:#fff;margin-top:var(--e-2)}
.sin-resultados[hidden]{display:none}
.sin-resultados .ico-caja{margin:0}
.sin-resultados p{color:var(--texto-2);margin:0 0 var(--e-2)}
mark{background:var(--dorado-50);color:inherit;border-radius:3px;padding:0 2px;box-shadow:inset 0 -2px 0 var(--dorado-400)}
[data-id][hidden],[data-grupo][hidden]{display:none!important}
.faq-chips a span{display:inline-grid;place-items:center;min-width:22px;height:22px;margin-left:4px;padding:0 6px;border-radius:var(--r-full);background:var(--gris-100);font-size:var(--t-xs);color:var(--texto-2)}
.faq-lista{display:grid;gap:var(--e-7);max-width:820px;margin:0 auto}
.faq-grupo{scroll-margin-top:calc(var(--cabecera-alto) + 20px)}
.faq-grupo h2{font-size:var(--t-xl);margin-bottom:var(--e-4);display:flex;align-items:center;gap:var(--e-3)}
.faq-grupo h2::before{content:"";width:6px;height:1.1em;border-radius:3px;background:var(--marca)}
.faq summary .q{flex:1}

/* ================= CONTACTO ================= */
.canales{display:grid;gap:var(--e-4)}
.canal{display:grid;grid-template-columns:48px 1fr;gap:var(--e-4);align-items:start;background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-5)}
.canal .ico-caja{margin:0}
.canal h3{font-size:var(--t-base);margin-bottom:4px}
.canal p{margin:0 0 var(--e-2);font-size:var(--t-sm);color:var(--texto-2)}
.canal a{font-weight:600;overflow-wrap:anywhere}
.horario{list-style:none;margin:0;padding:0;font-size:var(--t-sm);display:grid;gap:4px}
.horario li{display:flex;justify-content:space-between;gap:var(--e-4)}
.horario span:last-child{font-weight:600}

/* ================= FORMULARIOS ================= */
.form-tarjeta{background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);box-shadow:var(--sombra-2);padding:var(--e-6) var(--e-5);min-width:0}
@media (min-width:640px){.form-tarjeta{padding:var(--e-7) var(--e-6)}}
.form-tarjeta>h2{font-size:var(--t-xl);margin-bottom:var(--e-2)}
.form-tarjeta>.sub{color:var(--texto-2);font-size:var(--t-sm);margin-bottom:var(--e-5)}
.form{display:grid;gap:var(--e-5);min-width:0}
.fila{display:grid;gap:var(--e-5) var(--e-4);grid-template-columns:minmax(0,1fr)}
@media (min-width:560px){.fila{grid-template-columns:1fr 1fr}}
.campo{display:grid;gap:6px;min-width:0;align-content:start}
.campo label,.campo .lbl,.campo legend{font:600 var(--t-sm)/1.3 var(--f-titulo);color:var(--texto);padding:0}
.campo .opc{font:400 var(--t-xs)/1 var(--f-texto);color:var(--texto-3)}
.campo .ayuda{font-size:var(--t-xs);color:var(--texto-2);margin:0;line-height:1.45}
.entrada{position:relative}
.entrada input,.entrada select,.entrada textarea{width:100%;min-height:var(--control-alto);padding:0 44px 0 14px;font:400 16px/1.3 var(--f-texto);color:var(--texto);background:#fff;
  border:1px solid var(--borde-campo);border-radius:var(--r-md);box-shadow:var(--sombra-1);appearance:none;-webkit-appearance:none;caret-color:var(--marca);
  transition:border-color var(--d-ui) ease,box-shadow var(--d-ui) ease}
.entrada textarea{min-height:120px;padding:12px 14px;resize:vertical;line-height:1.5}
.entrada select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235E5E66' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 14px center/18px no-repeat}
.entrada input::placeholder,.entrada textarea::placeholder{color:var(--gris-600);opacity:.85}
.entrada input:hover,.entrada select:hover,.entrada textarea:hover{border-color:var(--gris-500)}
.entrada input:focus,.entrada select:focus,.entrada textarea:focus{outline:none;border-color:var(--foco);box-shadow:0 0 0 3px var(--rojo-100)}
.entrada .pre{position:absolute;left:1px;top:1px;bottom:1px;display:flex;align-items:center;padding:0 12px;font:600 15px/1 var(--f-texto);color:var(--texto-2);background:var(--gris-50);border-right:1px solid var(--borde);border-radius:var(--r-md) 0 0 var(--r-md)}
.entrada.con-pre input{padding-left:66px}
.entrada .est{position:absolute;right:13px;top:24px;width:20px;height:20px;transform:translateY(-50%) scale(.9);opacity:0;pointer-events:none;transition:opacity var(--d-ui) ease,transform var(--d-ui) var(--ease-out)}
.campo[data-estado="ok"] input,.campo[data-estado="ok"] select{border-color:var(--exito-700)}
.campo[data-estado="ok"] .est-ok{opacity:1;transform:translateY(-50%);color:var(--exito-700)}
.campo[data-estado="error"] input,.campo[data-estado="error"] select,.campo[data-estado="error"] textarea{border-color:var(--error-700)}
.campo[data-estado="error"] input:focus{box-shadow:0 0 0 3px var(--error-50)}
.campo[data-estado="error"] .est-err{opacity:1;transform:translateY(-50%);color:var(--error-700)}
.campo select ~ .est{right:40px}
.err{display:none;align-items:flex-start;gap:6px;font:600 var(--t-xs)/1.4 var(--f-texto);color:var(--error-700);margin:0}
.err .ic{width:16px;height:16px;margin-top:1px}
.campo[data-estado="error"] .err{display:flex}
.contador{font-size:var(--t-xs);color:var(--texto-3);justify-self:end;margin-top:-2px}
.grupo{border:0;margin:0;padding:0;display:grid;gap:var(--e-5);min-width:0}
.grupo>legend{font:600 var(--t-md)/1.3 var(--f-titulo);margin-bottom:var(--e-2);padding:0;display:flex;align-items:center;gap:var(--e-2)}
.grupo>legend .ic{color:var(--marca);width:22px;height:22px}
.grupo+.grupo{border-top:1px solid var(--borde);padding-top:var(--e-5)}

.carga{display:grid;gap:var(--e-3);grid-template-columns:repeat(2,minmax(0,1fr))}
.carga label{position:relative;display:grid;place-items:center;align-content:center;text-align:center;gap:6px;aspect-ratio:1.586;padding:var(--e-3);cursor:pointer;min-width:0;overflow:hidden;
  border:1.5px dashed var(--borde-campo);border-radius:var(--r-md);background:var(--gris-50);font:600 var(--t-sm)/1.2 var(--f-titulo);color:var(--texto);
  transition:border-color var(--d-ui) ease,background-color var(--d-ui) ease,transform var(--d-press) var(--ease-out)}
.carga label:active{transform:scale(.98)}
.carga label small{font:400 var(--t-xs)/1.3 var(--f-texto);color:var(--texto-2);overflow-wrap:anywhere;position:relative}
.carga label .ic{width:28px;height:28px;color:var(--marca);position:relative}
.carga label>span{position:relative}
.carga input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.carga label:focus-within{outline:2px solid var(--foco);outline-offset:3px}
.carga label.lista{border-style:solid;border-color:var(--exito-700);background:var(--exito-50)}
.carga label.lista .ic{color:var(--exito-700)}
.carga .vista{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22}
.campo[data-estado="error"] .carga label:not(.lista){border-color:var(--error-700)}
@media (hover:hover){.carga label:hover{border-color:var(--marca);background:var(--rojo-50)}}

.check{display:grid;grid-template-columns:22px 1fr;gap:var(--e-3);align-items:start;cursor:pointer;font-size:var(--t-sm);line-height:1.5;color:var(--texto-2)}
.check input{appearance:none;-webkit-appearance:none;margin:1px 0 0;width:22px;height:22px;border:1.5px solid var(--gris-500);border-radius:5px;background:#fff;display:grid;place-items:center;cursor:pointer;transition:background-color var(--d-ui) ease,border-color var(--d-ui) ease}
.check input::after{content:"";width:10px;height:6px;border:2.5px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg) scale(.6);opacity:0;transition:transform var(--d-ui) var(--ease-out),opacity var(--d-ui) ease}
.check input:checked{background:var(--marca);border-color:var(--marca)}
.check input:checked::after{opacity:1;transform:translateY(-1px) rotate(-45deg)}
.campo[data-estado="error"] .check input{border-color:var(--error-700)}

.pasos{list-style:none;margin:0 0 var(--e-5);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--e-2)}
.pasos li{display:grid;gap:8px;font:500 var(--t-xs)/1.25 var(--f-titulo);color:var(--texto-3)}
.pasos li::before{content:"";height:4px;border-radius:2px;background:var(--gris-200);transition:background-color var(--d-panel) ease}
.pasos li.hecho{color:var(--texto-2)}
.pasos li.hecho::before{background:var(--rojo-200)}
.pasos li.actual{color:var(--texto);font-weight:600}
.pasos li.actual::before{background:var(--marca)}
@media (max-width:420px){.pasos li span{display:none}.pasos li.actual span{display:inline}}
.paso[hidden]{display:none}
.paso{animation:entra-paso var(--d-panel) var(--ease-out)}
@keyframes entra-paso{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.paso{animation:none}}
.paso-acc{display:flex;justify-content:space-between;align-items:center;gap:var(--e-3);flex-wrap:wrap;padding-top:var(--e-2)}
.paso-acc .btn-primario{margin-left:auto}
@media (max-width:480px){.paso-acc .btn-primario{width:100%}.paso-acc{flex-direction:column-reverse;align-items:stretch}}
.seguro{display:flex;gap:6px;align-items:center;font-size:var(--t-xs);color:var(--texto-2);margin:0}
.seguro .ic{width:16px;height:16px;color:var(--exito-700)}
.trampa{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.resumen-err{border:1px solid var(--error-700);background:var(--error-50);border-radius:var(--r-md);padding:var(--e-4) var(--e-5)}
.resumen-err b{display:flex;gap:8px;align-items:center;color:var(--error-700);font:600 var(--t-base)/1.3 var(--f-titulo);margin-bottom:6px}
.resumen-err ul{margin:0;padding-left:1.4em;font-size:var(--t-sm)}
.resumen-err a{color:var(--error-700);font-weight:600}
.aviso{display:flex;gap:var(--e-3);align-items:flex-start;border-radius:var(--r-md);padding:var(--e-4);font-size:var(--t-sm)}
.aviso .ic{width:20px;height:20px;margin-top:1px}
.aviso b{display:block;font-family:var(--f-titulo);font-weight:600}
.aviso p{margin:0;color:var(--texto)}
.aviso.info{background:var(--info-50);color:var(--info-700)}
.aviso.exito{background:var(--exito-50);color:var(--exito-700)}
.aviso.error{background:var(--error-50);color:var(--error-700)}
.form-estado:empty{display:none}

/* Suscripción */
.suscribir{display:grid;gap:var(--e-4);grid-template-columns:minmax(0,1fr);align-items:center;background:var(--oscuro);color:#fff;border-radius:var(--r-lg);padding:var(--e-6) var(--e-5)}
.suscribir h2{color:#fff;font-size:var(--t-xl)}
.suscribir p{color:#D4D4D8;margin:var(--e-2) 0 0;font-size:var(--t-sm)}
.suscribir form{display:grid;gap:var(--e-3);grid-template-columns:minmax(0,1fr)}
.suscribir input{width:100%;min-height:var(--control-alto);padding:0 14px;border-radius:var(--r-md);border:1px solid #3F3F46;background:#27272A;color:#fff;font:400 16px/1 var(--f-texto)}
.suscribir input::placeholder{color:#A1A1AA}
.suscribir input:focus{outline:none;border-color:#fff}
.suscribir .check{color:#D4D4D8}
.suscribir .check a{color:#fff}
@media (min-width:900px){.suscribir{grid-template-columns:1fr 1.1fr;padding:var(--e-7)}.suscribir form{grid-template-columns:1fr 1fr auto}.suscribir .check,.suscribir .form-estado{grid-column:1/-1}}

/* Gracias / 404 */
.estado-pagina{min-height:60vh;display:grid;place-items:center;text-align:center;padding:var(--e-9) 0}
.estado-pagina .ico-grande{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;margin:0 auto var(--e-5);background:var(--exito-50);color:var(--exito-700)}
.estado-pagina .ico-grande .ic{width:44px;height:44px;stroke-width:2}
.estado-pagina p{color:var(--texto-2);max-width:52ch;margin:var(--e-3) auto var(--e-6);font-size:var(--t-md)}
.estado-pagina .acciones{justify-content:center}

/* Mapa del sitio */
.mapa{display:grid;gap:var(--e-6);grid-template-columns:minmax(0,1fr)}
@media (min-width:768px){.mapa{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mapa h2{font-size:var(--t-md);margin-bottom:var(--e-3);padding-bottom:var(--e-2);border-bottom:2px solid var(--marca)}
.mapa ul{list-style:none;padding:0;margin:0;display:grid;gap:var(--e-2)}
.mapa a{color:var(--texto);text-decoration:none}
.mapa a:hover{color:var(--marca)}

/* ================= PIE ================= */
.pie{background:var(--oscuro);color:#C4C4CA;font-size:var(--t-sm);margin-top:var(--e-9)}
.pie.sin-margen{margin-top:0}
.pie .contenedor{padding-top:var(--e-8);padding-bottom:var(--e-5)}
.pie-grid{display:grid;gap:var(--e-6) var(--e-5);grid-template-columns:repeat(2,minmax(0,1fr))}
.pie-grid>:first-child,.pie-grid>:last-child{grid-column:1/-1}
@media (min-width:1000px){.pie-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}.pie-grid>:first-child,.pie-grid>:last-child{grid-column:auto}}
.pie img{width:72px;margin-bottom:var(--e-4)}
.pie h2{color:#fff;font:600 var(--t-sm)/1.3 var(--f-titulo);margin-bottom:var(--e-4);text-transform:uppercase;letter-spacing:.06em}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pie a{color:#C4C4CA;text-decoration:none}
.pie a:hover{color:#fff}
.pie p{margin:0 0 var(--e-4);max-width:36ch}
.pie .contacto-pie>li{display:grid;grid-template-columns:20px 1fr;gap:10px}
.pie .horario li{gap:var(--e-3)}
.pie .horario span:last-child{color:#fff;font-weight:600;white-space:nowrap}
.pie .contacto-pie .ic{width:18px;height:18px;color:var(--rojo-400);margin-top:2px}
.pie .redes{margin-top:var(--e-2)}
.pie .redes a{background:#27272A;width:40px;height:40px}
.pie .redes a:hover{background:var(--marca);color:#fff}
.pie-legal{border-top:1px solid #2E2E34;margin-top:var(--e-7);padding-top:var(--e-5);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--e-3);font-size:var(--t-xs);color:#A1A1AA}
.pie-legal ul{display:flex;flex-wrap:wrap;gap:var(--e-4)}

/* WhatsApp flotante */
.wa-flotante{position:fixed;right:16px;bottom:16px;z-index:50;width:58px;height:58px;border-radius:50%;background:var(--whatsapp);color:#fff;display:grid;place-items:center;box-shadow:0 8px 20px -6px rgb(7 59 30 / .55);transition:transform var(--d-ui) var(--ease-out);-webkit-tap-highlight-color:transparent}
.wa-flotante:hover{color:#fff;transform:scale(1.06)}
.wa-flotante:active{transform:scale(.95)}
.wa-flotante svg{width:30px;height:30px;stroke-width:2}
@media (min-width:768px){.wa-flotante{right:24px;bottom:24px}}
body.form-activo .wa-flotante{display:none}

/* =====================================================================
   CRÉDITO: portada roja con calculadora, cifras, línea de tiempo, requisitos y comparación
   ===================================================================== */
.credito-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--marca);color:#fff}
.credito-hero::before{content:"";position:absolute;width:720px;aspect-ratio:1;right:-260px;top:-300px;border-radius:50%;border:2px solid rgb(255 255 255 / .16);z-index:-1}
.credito-hero::after{content:"";position:absolute;width:520px;aspect-ratio:1;left:-220px;bottom:-320px;border-radius:50%;background:rgb(0 0 0 / .1);z-index:-1}
.credito-hero .contenedor{display:grid;gap:var(--e-7);grid-template-columns:minmax(0,1fr);align-items:center;padding-top:var(--e-8);padding-bottom:var(--e-8)}
.credito-hero h1{color:#fff;font-size:var(--t-hero);line-height:1.08;letter-spacing:-.025em;margin:var(--e-4) 0}
.credito-hero .lead{font-size:var(--t-md);color:#fff;max-width:50ch;margin-bottom:var(--e-6)}
.chip-claro{display:inline-flex;align-items:center;gap:6px;background:rgb(255 255 255 / .16);border:1px solid rgb(255 255 255 / .3);color:#fff;font:600 var(--t-sm)/1 var(--f-titulo);padding:8px 14px;border-radius:var(--r-full)}
.chip-claro .ic{width:16px;height:16px}
@media (min-width:960px){.credito-hero .contenedor{grid-template-columns:1.1fr .9fr}}

.calculadora{background:#fff;color:var(--texto);border-radius:20px;padding:var(--e-6) var(--e-5);box-shadow:0 30px 60px -20px rgb(80 0 8 / .45),0 8px 20px -10px rgb(0 0 0 / .2);display:grid;gap:var(--e-3)}
@media (min-width:640px){.calculadora{padding:var(--e-6)}}
.calc-cab{display:flex;gap:var(--e-3);align-items:center;margin-bottom:var(--e-2)}
.calc-cab .ico-caja{margin:0}
.calc-cab h2{font-size:var(--t-lg)}
.calc-cab p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}
.calc-lbl{font:600 var(--t-sm)/1 var(--f-titulo);color:var(--texto-2)}
.calc-valor{font:700 clamp(2rem,1.6rem + 1.4vw,2.6rem)/1 var(--f-titulo);letter-spacing:-.02em}
.calculadora input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;cursor:pointer;--p:10%}
.calculadora input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--marca) var(--p),var(--gris-200) var(--p))}
.calculadora input[type=range]::-moz-range-track{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--marca) var(--p),var(--gris-200) var(--p))}
.calculadora input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-9px;border-radius:50%;background:#fff;border:3px solid var(--marca);box-shadow:0 2px 8px rgb(154 5 17 / .35);transition:transform var(--d-press) var(--ease-out)}
.calculadora input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--marca);box-shadow:0 2px 8px rgb(154 5 17 / .35)}
.calculadora input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
.calculadora input[type=range]:focus-visible{outline:2px solid var(--foco);outline-offset:4px;border-radius:4px}
.calc-rango{display:flex;justify-content:space-between;font-size:var(--t-xs);color:var(--texto-3);margin-top:-6px}
.calc-cuotas{border:0;padding:0;margin:var(--e-2) 0 0;display:grid;grid-template-columns:auto repeat(3,1fr);gap:var(--e-2);align-items:center}
.calc-cuotas legend{float:left;font:600 var(--t-sm)/1 var(--f-titulo);color:var(--texto-2);margin-right:var(--e-2)}
.calc-cuotas label{position:relative;cursor:pointer}
.calc-cuotas input{position:absolute;opacity:0;inset:0}
.calc-cuotas span{display:grid;place-items:center;height:44px;border-radius:var(--r-md);border:1.5px solid var(--borde-campo);font:700 var(--t-md)/1 var(--f-titulo);transition:background-color var(--d-ui) ease,color var(--d-ui) ease,border-color var(--d-ui) ease,transform var(--d-press) var(--ease-out)}
.calc-cuotas label:active span{transform:scale(.95)}
.calc-cuotas input:checked + span{background:var(--marca);border-color:var(--marca);color:#fff}
.calc-cuotas input:focus-visible + span{outline:2px solid var(--foco);outline-offset:2px}
.calc-resultado{background:var(--marca-suave);border-radius:var(--r-lg);padding:var(--e-4) var(--e-5);margin:var(--e-2) 0;text-align:center}
.calc-resultado p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}
.calc-resultado strong{display:block;font:700 clamp(2.2rem,1.8rem + 1.6vw,3rem)/1.1 var(--f-titulo);color:var(--rojo-700);letter-spacing:-.02em;margin:4px 0 var(--e-3)}
.calc-resultado strong.cambia{animation:pulso 380ms var(--ease-out)}
@keyframes pulso{0%{transform:scale(1)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
.calc-barras{display:flex;gap:6px;height:10px;margin-bottom:var(--e-3)}
.calc-barras i{flex:1;border-radius:5px;background:var(--marca);transform-origin:left;animation:barra 500ms var(--ease-out) both;animation-delay:calc(var(--i,0) * 80ms)}
@keyframes barra{from{transform:scaleX(.2);opacity:0}to{transform:none;opacity:1}}
.calc-total b{color:var(--texto)}
.calc-nota{margin:0;font-size:var(--t-xs);color:var(--texto-3);text-align:center}

.cifras{background:var(--oscuro);color:#fff}
.cifras .contenedor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px}
.cifras .contenedor>div{padding:var(--e-6) var(--e-4);text-align:center;display:grid;gap:4px}
.cifras b{font:700 clamp(1.8rem,1.4rem + 1.6vw,2.6rem)/1 var(--f-titulo);color:#fff}
.cifras .contenedor>div>span{font-size:var(--t-sm);color:#C4C4CA}
@media (min-width:768px){.cifras .contenedor{grid-template-columns:repeat(4,minmax(0,1fr))}.cifras .contenedor>div+div{border-left:1px solid #2E2E34}}

.sticky-col{display:grid;gap:var(--e-2);justify-items:start}
@media (min-width:900px){.sticky-col{position:sticky;top:calc(var(--cabecera-alto) + 40px)}}
.linea-tiempo{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:var(--e-6)}
.linea-tiempo::before{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:2px;background:var(--gris-200)}
.linea-tiempo::after{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:2px;background:var(--marca);transform-origin:top;transform:scaleY(var(--avance,0))}
.linea-tiempo li{display:grid;grid-template-columns:48px 1fr;gap:var(--e-4);position:relative;z-index:1}
.linea-tiempo .punto{width:48px;height:48px;border-radius:50%;background:#fff;border:2px solid var(--gris-200);display:grid;place-items:center;color:var(--texto-3);transition:background-color 400ms ease,border-color 400ms ease,color 400ms ease,transform 400ms var(--ease-out)}
.linea-tiempo li.activo .punto{background:var(--marca);border-color:var(--marca);color:#fff;transform:scale(1.08);box-shadow:0 0 0 6px var(--rojo-50)}
.linea-tiempo .cuando{font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.08em;color:var(--marca)}
.linea-tiempo h3{font-size:var(--t-lg);margin:6px 0 4px}
.linea-tiempo p{margin:0;color:var(--texto-2)}

.requisitos-check{list-style:none;margin:0;padding:0;display:grid;gap:var(--e-3)}
.requisitos-check li{display:grid;grid-template-columns:40px 1fr;gap:var(--e-4);align-items:start;background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);padding:var(--e-4) var(--e-5)}
.requisitos-check .tic{width:40px;height:40px;border-radius:50%;background:var(--exito-50);display:grid;place-items:center}
.requisitos-check .tic svg{width:22px;height:22px;fill:none;stroke:var(--exito-700);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:0;transition:stroke-dashoffset 500ms var(--ease-out);transition-delay:calc(var(--i,0) * 140ms + 200ms)}
.anim .requisitos-check.espera .tic svg{stroke-dashoffset:24}
.requisitos-check h3{font-size:var(--t-base);margin-bottom:2px}
.requisitos-check p{margin:0;font-size:var(--t-sm);color:var(--texto-2)}

.tabla-comparar{overflow-x:auto;border:1px solid var(--borde);border-radius:var(--r-lg);background:#fff}
.tabla-comparar table{width:100%;border-collapse:collapse;min-width:640px;font-size:var(--t-sm)}
.tabla-comparar th,.tabla-comparar td{padding:var(--e-4);text-align:left;border-bottom:1px solid var(--borde);vertical-align:top}
.tabla-comparar tbody tr:last-child>*{border-bottom:0}
.tabla-comparar thead th{font:600 var(--t-sm)/1.3 var(--f-titulo);background:var(--gris-50)}
.tabla-comparar tbody th{font:600 var(--t-sm)/1.3 var(--f-titulo);color:var(--texto-2);width:20%}
.tabla-comparar .destacada{background:var(--marca-suave);color:var(--texto)}
.tabla-comparar thead .destacada{background:var(--marca);color:#fff}
.tabla-comparar td.destacada{font-weight:600}
.tabla-comparar td .ic{width:16px;height:16px;color:var(--exito-700);vertical-align:-3px;margin-right:4px}

.marquesina{display:flex;overflow:hidden;gap:var(--e-3);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquesina .pista{display:flex;gap:var(--e-3);flex:none;animation:desfile 38s linear infinite}
.marquesina:hover .pista{animation-play-state:paused}
.marquesina .chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:#fff;border:1px solid var(--borde);border-radius:var(--r-full);padding:12px 20px;font:600 var(--t-sm)/1 var(--f-titulo)}
.marquesina .chip .ic{width:18px;height:18px;color:var(--marca)}
@keyframes desfile{to{transform:translateX(calc(-100% - var(--e-3)))}}
@media (prefers-reduced-motion:reduce){.marquesina{flex-wrap:wrap;mask:none}.marquesina .pista{animation:none;flex-wrap:wrap}.marquesina .pista[aria-hidden]{display:none}}

/* =====================================================================
   CORTINERÍA: estilos, proyectos y galería
   ===================================================================== */
a.estilo{text-decoration:none;color:var(--texto);transition:box-shadow var(--d-ui) ease,transform var(--d-ui) var(--ease-out)}
a.estilo .img{position:relative}
a.estilo .leer,.proyecto-card .leer{margin-top:auto;font:600 var(--t-sm)/1 var(--f-titulo);color:var(--marca);display:inline-flex;align-items:center;gap:6px}
a.estilo .leer .ic,.proyecto-card .leer .ic{width:16px;height:16px;transition:transform var(--d-ui) var(--ease-out)}
@media (hover:hover){a.estilo:hover,.proyecto-card:hover{box-shadow:var(--sombra-3);transform:translateY(-3px);color:var(--texto)}a.estilo:hover .leer .ic,.proyecto-card:hover .leer .ic{transform:translateX(3px)}}
.n-fotos{position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;background:rgb(24 24 27 / .78);color:#fff;font:600 var(--t-xs)/1 var(--f-titulo);padding:6px 9px;border-radius:var(--r-full);backdrop-filter:blur(4px)}
.n-fotos .ic{width:14px;height:14px}
.marca-ejemplo{position:absolute;right:10px;top:10px;background:var(--dorado-400);color:var(--gris-900);font:700 var(--t-xs)/1 var(--f-titulo);padding:6px 9px;border-radius:var(--r-sm);text-transform:uppercase;letter-spacing:.06em}

.estilo-hero{background:var(--gris-50);border-bottom:1px solid var(--borde);overflow:hidden}
.estilo-hero .contenedor{display:grid;gap:var(--e-6);grid-template-columns:minmax(0,1fr);align-items:center;padding-top:var(--e-5);padding-bottom:var(--e-7)}
.estilo-hero h1{font-size:var(--t-hero);line-height:1.08;letter-spacing:-.025em;margin-bottom:var(--e-4)}
.estilo-hero .lead{font-size:var(--t-md);color:var(--texto-2);max-width:52ch}
.estilo-hero .ventajas{list-style:none;padding:0;margin:0 0 var(--e-5);display:grid;gap:8px}
.estilo-hero .ventajas li{display:flex;gap:8px;align-items:center;font-weight:600}
.estilo-hero .ventajas .ic{width:18px;height:18px;color:var(--exito-700)}
.estilo-hero .imagen{border-radius:20px;overflow:hidden;aspect-ratio:4/5;max-height:520px;justify-self:center;width:min(100%,420px);box-shadow:var(--sombra-3)}
.estilo-hero .imagen img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.estilo-hero .contenedor{grid-template-columns:1.2fr .8fr}.estilo-hero .imagen{justify-self:end}}

.proyectos{display:grid;gap:var(--e-5);grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.proyectos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.proyectos{grid-template-columns:repeat(3,minmax(0,1fr))}}
.proyecto-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--borde);border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:var(--texto);transition:box-shadow var(--d-ui) ease,transform var(--d-ui) var(--ease-out)}
.proyecto-card .img{position:relative;aspect-ratio:4/3;background:var(--gris-100);overflow:hidden}
.proyecto-card .img img{width:100%;height:100%;object-fit:cover;transition:transform 700ms var(--ease-out)}
@media (hover:hover){.proyecto-card:hover .img img{transform:scale(1.05)}}
.proyecto-card .cuerpo{padding:var(--e-5);display:grid;gap:var(--e-2);flex:1}
.proyecto-card .cat-tag{font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.06em;color:var(--marca)}
.proyecto-card h3{font-size:var(--t-md)}
.proyecto-card p{margin:0;font-size:var(--t-sm);color:var(--texto-2);display:flex;align-items:center;gap:6px}
.proyecto-card p .ic{width:16px;height:16px}
.vacio{text-align:center;display:grid;justify-items:center;gap:var(--e-3);padding:var(--e-8) var(--e-4);border:1.5px dashed var(--borde-campo);border-radius:var(--r-lg);background:#fff}
.vacio .ico-caja{margin:0}
.vacio p{color:var(--texto-2);max-width:48ch}

.proyecto-cab{background:var(--gris-50);border-bottom:1px solid var(--borde);padding-bottom:var(--e-6)}
.proyecto-cab .cat-tag{display:inline-block;font:600 var(--t-xs)/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.06em;color:var(--marca);text-decoration:none}
.proyecto-cab h1{font-size:clamp(1.85rem,1.4rem + 2vw,2.75rem);margin:var(--e-3) 0}
.proyecto-cab .meta{display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-5);font-size:var(--t-sm);color:var(--texto-2)}
.proyecto-cab .meta span{display:inline-flex;align-items:center;gap:6px}
.proyecto-cab .meta .ic{width:16px;height:16px}
.mosaico{display:grid;gap:var(--e-3);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense}
@media (min-width:900px){.mosaico{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mosaico .foto{all:unset;display:block;cursor:zoom-in;border-radius:var(--r-md);overflow:hidden;position:relative;background:var(--gris-100);aspect-ratio:4/5}
.mosaico .foto:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto;min-height:100%}
.mosaico .foto img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease-out)}
.mosaico .foto:focus-visible{outline:3px solid var(--foco);outline-offset:3px}
@media (hover:hover){.mosaico .foto:hover img{transform:scale(1.04)}}
.anim .mosaico .foto{animation:mosaico 800ms var(--ease-out) both;animation-delay:calc(var(--i,0) * 90ms + 250ms)}
@keyframes mosaico{from{opacity:0;transform:translateY(30px) scale(.96);clip-path:inset(12% 0 0 0 round 10px)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 10px)}}
.cta-proyecto h2{font-size:var(--t-xl);margin-bottom:var(--e-2)}
.cta-proyecto p{color:var(--texto-2)}

.visor{border:0;padding:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:rgb(10 10 12 / .94);display:none;place-items:center;overflow:hidden}
.visor[open]{display:grid}
.visor::backdrop{background:transparent}
.visor img{max-width:min(92vw,1400px);max-height:84dvh;border-radius:var(--r-md);box-shadow:0 30px 80px rgb(0 0 0 / .5);transition:opacity 160ms ease,transform 160ms var(--ease-out)}
.visor img.cambiando{opacity:0;transform:scale(.98)}
.visor[open] img{animation:visor-entra 260ms var(--ease-out)}
@keyframes visor-entra{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.visor-btn{position:absolute;width:52px;height:52px;border-radius:50%;border:0;background:rgb(255 255 255 / .12);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background-color var(--d-ui) ease,transform var(--d-press) var(--ease-out)}
.visor-btn:hover{background:rgb(255 255 255 / .22)}
.visor-btn:active{transform:scale(.94)}
.visor-btn .ic{width:26px;height:26px}
.visor .cerrar{top:16px;right:16px}
.visor .ant{left:16px;top:50%;margin-top:-26px}
.visor .sig{right:16px;top:50%;margin-top:-26px}
.visor-cont{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#D4D4D8;font:600 var(--t-sm)/1 var(--f-titulo);margin:0}
@media (max-width:640px){.visor .ant,.visor .sig{top:auto;bottom:12px;margin:0}.visor-cont{bottom:30px}}

/* =====================================================================
   MOVIMIENTO
   Carga de página: animaciones CSS (corren fuera del hilo principal). Al bajar: revelados con IntersectionObserver.
   ===================================================================== */

/* Transición suave entre páginas (navegadores que la soportan) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-sale 180ms var(--ease-out) both}
::view-transition-new(root){animation:vt-entra 340ms var(--ease-out) both}
@keyframes vt-sale{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-entra{from{opacity:0;transform:translateY(14px)}}
.cabecera{view-transition-name:cabecera}
.topbar{view-transition-name:barra-superior}

/* Títulos que entran palabra por palabra */
.palabra{display:inline-block;white-space:pre}
.anim .palabras-listas .palabra{animation:palabra 760ms var(--ease-out) both;animation-delay:calc(var(--i) * 55ms + 120ms)}
@keyframes palabra{from{opacity:0;transform:translateY(.55em) rotate(2deg);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}
.anim [data-palabras]:not(.palabras-listas){opacity:0;animation:mostrar-seguro 0s 1.5s forwards}
@keyframes mostrar-seguro{to{opacity:1}}

/* Elementos de la portada que entran escalonados al cargar */
.anim [data-hero] .lead,.anim [data-hero] .acciones,.anim [data-hero] .confianza,.anim [data-hero] .etiqueta-oferta,.anim [data-hero] .chip-claro,.anim [data-hero] .ventajas,.anim [data-hero] .meta,.anim [data-hero] .extracto,.anim [data-hero] .cat-tag,.anim [data-hero] .encabezado p{animation:sube 800ms var(--ease-out) both}
.anim [data-hero] .etiqueta-oferta,.anim [data-hero] .chip-claro,.anim [data-hero] .cat-tag{animation-name:salta;animation-delay:60ms}
.anim [data-hero] .lead,.anim [data-hero] .extracto,.anim [data-hero] .encabezado p{animation-delay:420ms}
.anim [data-hero] .ventajas,.anim [data-hero] .meta{animation-delay:540ms}
.anim [data-hero] .acciones{animation-delay:620ms}
.anim [data-hero] .confianza{animation-delay:780ms}
@keyframes sube{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes salta{0%{opacity:0;transform:translateY(10px) scale(.9)}60%{opacity:1;transform:translateY(-2px) scale(1.03)}100%{opacity:1;transform:none}}

/* Inicio: la clienta entra con un barrido y el sello flota */
.anim [data-hero="inicio"] .hero-img img:not(.sello){animation:barrido 1100ms var(--ease-out) 200ms both}
@keyframes barrido{from{opacity:0;clip-path:inset(100% 0 0 0);transform:translateY(40px) scale(1.04)}to{opacity:1;clip-path:inset(0);transform:none}}
.anim [data-hero="inicio"] .hero-img .sello{animation:sello-entra 900ms var(--ease-out) 900ms both,flotar 5s ease-in-out 1.8s infinite}
.anim [data-hero="inicio"] .hero-img::before{animation:halo 1400ms var(--ease-out) 100ms both}
@keyframes sello-entra{from{opacity:0;transform:scale(.6) rotate(-40deg)}to{opacity:1;transform:none}}
@keyframes flotar{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(4deg)}}
@keyframes halo{from{opacity:0;transform:translateX(-50%) scale(.6)}to{opacity:1;transform:translateX(-50%) scale(1)}}
.hero-img[data-paralaje] img{will-change:auto}

/* Crédito: la calculadora llega girando hacia el frente */
.anim [data-hero="credito"] .calculadora{animation:tarjeta 1000ms var(--ease-out) 350ms both}
@keyframes tarjeta{from{opacity:0;transform:perspective(1200px) rotateY(-18deg) rotateX(6deg) translateY(40px) scale(.94)}to{opacity:1;transform:none}}
.anim [data-hero="credito"]::before{animation:aro 1600ms var(--ease-out) both}
@keyframes aro{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}

/* Cortinería: el telón se abre al cargar */
.telon{position:absolute;inset:0;z-index:5;display:none;pointer-events:none}
.anim .telon{display:flex}
.telon span{flex:1;background:
  repeating-linear-gradient(90deg,rgb(0 0 0 / .18) 0 2px,transparent 2px 26px,rgb(255 255 255 / .08) 26px 30px,transparent 30px 56px),
  linear-gradient(180deg,#B0000F,#7E000A);box-shadow:inset 0 -30px 60px rgb(0 0 0 / .35)}
.telon span:first-child{transform-origin:left;animation:telon-izq 1300ms var(--ease-in-out) 350ms both}
.telon span:last-child{transform-origin:right;animation:telon-der 1300ms var(--ease-in-out) 350ms both}
@keyframes telon-izq{0%{transform:none}100%{transform:translateX(-102%) scaleX(.55)}}
@keyframes telon-der{0%{transform:none}100%{transform:translateX(102%) scaleX(.55)}}
.telon.visto{display:none}
.anim [data-hero="cortinas"] .fondo{animation:fondo-zoom 2200ms var(--ease-out) both}
@keyframes fondo-zoom{from{transform:scale(1.15)}to{transform:none}}
.anim [data-hero="cortinas"] .mascota{animation:mascota 1000ms var(--ease-out) 1200ms both}
@keyframes mascota{0%{opacity:0;transform:translateY(60px) rotate(-6deg)}70%{opacity:1;transform:translateY(-6px) rotate(1deg)}100%{opacity:1;transform:none}}
.anim [data-hero="cortinas"] .insignia{animation:salta 700ms var(--ease-out) 1900ms both}
.anim [data-hero="cortinas"] .palabra{animation-delay:calc(var(--i) * 55ms + 900ms)}
.anim [data-hero="cortinas"] .lead{animation-delay:1250ms}
.anim [data-hero="cortinas"] .acciones{animation-delay:1400ms}

/* Estilos de cortina: la foto entra con barrido lateral */
.anim [data-hero="estilo"] .imagen{animation:barrido-lado 1100ms var(--ease-out) 250ms both}
@keyframes barrido-lado{from{opacity:0;clip-path:inset(0 0 0 100% round 20px);transform:translateX(30px)}to{opacity:1;clip-path:inset(0 0 0 0 round 20px);transform:none}}

/* Nosotros: el logo llega rodando */
.anim [data-hero="nosotros"] .hero-img img{animation:rueda 1200ms var(--ease-out) 200ms both}
@keyframes rueda{from{opacity:0;transform:translateX(120px) rotate(200deg) scale(.7)}to{opacity:1;transform:none}}

/* Contacto: los canales llegan desde la izquierda, el formulario desde la derecha */
.anim [data-hero="contacto"] .canal{animation:desde-izq 700ms var(--ease-out) both;animation-delay:calc(var(--i,0) * 90ms + 300ms)}
.anim [data-hero="contacto"] .form-tarjeta{animation:desde-der 900ms var(--ease-out) 350ms both}
@keyframes desde-izq{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
@keyframes desde-der{from{opacity:0;transform:translateX(40px) scale(.98)}to{opacity:1;transform:none}}

/* Entradas del blog: la portada se descubre */
.anim .articulo-portada img{animation:barrido 1100ms var(--ease-out) 450ms both}

/* Revelado al bajar: el bloque, o sus hijos uno tras otro */
.anim .revelar.espera:not([data-hijos]){opacity:0;transform:translateY(28px)}
.anim .revelar:not([data-hijos]){transition:opacity 800ms var(--ease-out),transform 800ms var(--ease-out)}
.anim [data-hijos].espera>*{opacity:0;transform:translateY(34px) scale(.97)}
.anim [data-hijos]>*{transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out),box-shadow var(--d-ui) ease;transition-delay:calc(var(--i,0) * 75ms)}
.anim [data-hijos]:not(.espera)>*{transition-delay:calc(var(--i,0) * 75ms),calc(var(--i,0) * 75ms),0s}
.anim .bloque-img.revelar.espera{opacity:1;transform:none}
.anim .bloque-img.revelar.espera img{clip-path:inset(0 0 100% 0);transform:scale(1.12)}
.anim .bloque-img img{transition:clip-path 1100ms var(--ease-out),transform 1400ms var(--ease-out)}
.encabezado h2::after,.encabezado h1::after{content:"";display:block;width:56px;height:3px;border-radius:2px;background:var(--marca);margin:14px auto 0;transform-origin:center;transition:transform 900ms var(--ease-out) 250ms}
.encabezado.izq h2::after,.encabezado.izq h1::after{margin-left:0;transform-origin:left}
.anim .encabezado.espera h2::after{transform:scaleX(0)}
.banda.revelar.espera{transform:translateY(28px) scale(.98)!important}

/* Contadores */
[data-contar]{font-variant-numeric:tabular-nums}

/* Barra de progreso de lectura */
.progreso-lectura{position:fixed;left:0;right:0;top:0;height:3px;z-index:70;background:var(--marca);transform-origin:left;transform:scaleX(0);pointer-events:none}

/* Índice del artículo: resalta la sección activa */
.indice-art{position:relative}
.indice-art ol{list-style:none;padding:0 0 0 var(--e-4)!important;position:relative;counter-reset:ind}
.indice-art ol::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--gris-100);border-radius:2px}
.indice-art .marcador{position:absolute;left:0;top:0;width:2px;height:24px;background:var(--marca);border-radius:2px;transition:transform 380ms var(--ease-in-out),height 380ms var(--ease-in-out),opacity var(--d-ui) ease;opacity:0}
.indice-art li{counter-increment:ind}
.indice-art a{display:flex;gap:8px;padding:5px 0;line-height:1.35;transition:color var(--d-ui) ease,transform 300ms var(--ease-out)}
.indice-art a::before{content:counter(ind,decimal-leading-zero);font:600 11px/1.6 var(--f-titulo);color:var(--texto-3);flex:none;transition:color var(--d-ui) ease}
.indice-art a.activo{color:var(--texto)!important;font-weight:600;transform:translateX(4px)}
.indice-art a.activo::before{color:var(--marca)}
.indice-art a.leido{color:var(--texto-3)}
.indice-art .avance{display:block;margin-top:var(--e-3);height:4px;background:var(--gris-100);border-radius:2px;overflow:hidden}
.indice-art .avance i{display:block;height:100%;background:var(--marca);transform-origin:left;transform:scaleX(var(--leido,0))}
.prosa>h2{scroll-margin-top:calc(var(--cabecera-alto) + 24px);position:relative}
.prosa>h2.enfocado::before{content:"";position:absolute;left:-18px;top:.2em;bottom:.2em;width:4px;border-radius:2px;background:var(--marca);animation:enfoque 600ms var(--ease-out)}
@keyframes enfoque{from{transform:scaleY(0)}to{transform:none}}
@media (max-width:999px){.prosa>h2.enfocado::before{left:-10px}}

/* Preguntas frecuentes: abren y cierran con suavidad (navegadores compatibles) */
:root{interpolate-size:allow-keywords}
.faq details::details-content{block-size:0;overflow:hidden;transition:block-size 320ms var(--ease-out),content-visibility 320ms allow-discrete}
.faq details[open]::details-content{block-size:auto}

/* Botón principal: brillo que cruza al pasar el mouse */
.btn-primario{position:relative;overflow:hidden;isolation:isolate}
.btn-primario::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgb(255 255 255 / .28) 50%,transparent 70%);transform:translateX(-120%)}
@media (hover:hover) and (pointer:fine){.btn-primario:hover::after{transform:translateX(120%);transition:transform 700ms var(--ease-out)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}
  .telon{display:none!important}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}
@media print{.topbar,.cabecera,.wa-flotante,.pie,.lateral{display:none}}