/* Estilos de financorediy.com — extraídos del index (10-oct-2026). Los usan las páginas legales y la 404. */
:root{
  /* 10-oct (2.ª vuelta), Daniel: estructura y medidas de la referencia, piel 100 % Financore:
     azul #1565C0 → #1976D2 → #1E88E5, amarillo #F5B80F en botones, blanco y grises claros.
     Sin negro ni azul marino. Cristal sobre los azules y efectos de ratón (raton.js). */
  --azul:#1565C0;--azul2:#1565C0;--azul3:#1E88E5;--azul-borde:#1565C0;
  --am:#F5B80F;--am2:#FFC93A;--lima:#F5B80F;
  --tinta:#1E2A3A;--gris-t:#5A6680;--gris-s:#5A6680;--fondo:#F4F6FA;--borde:#E8ECF3;--borde2:#DDE3EC;--chip-bg:#E3F0FD;--chip-borde:#C5DDF7;--celeste:#E3F0FD;--celeste2:#E3F0FD;--celeste-borde:#C5DDF7;--oscuro:#1565C0;--oscuro-borde:#1565C0;
  --grad:linear-gradient(155deg,#1565C0 0%,#1976D2 100%);
  --sombra-azul:rgba(21,101,192,.18);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:#fff;color:var(--tinta);font:400 16px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,p{margin:0}
button{font:inherit}
.c{max-width:1440px;margin:0 auto;padding:0 32px}
.centro{text-align:center}
.azul-t{color:var(--azul2)}
:focus-visible{outline:3px solid #1565C0;outline-offset:3px}

/* ------- piezas comunes ------- */
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 16px;border-radius:10px;background:var(--chip-bg);border:1px solid var(--chip-borde);
  box-shadow:0 4px 30px rgba(21,101,192,.08);color:var(--azul);font:400 15px/1.15 Inter,sans-serif;letter-spacing:-.5px}
.chip svg{width:15px;height:15px;flex:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 40px;min-height:52px;border-radius:20px;background:var(--azul);color:#fff;text-decoration:none;
  border:1px solid var(--azul-borde);box-shadow:0 4px 10px rgba(0,0,0,.1),inset 0 2px 0 rgba(255,255,255,.35);font:500 20px/30px Inter,sans-serif;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
:where(html.con-raton) .btn:hover{background:var(--azul2);transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(21,101,192,.6),inset 0 2px 0 rgba(255,255,255,.35)}
.btn svg{width:20px;height:20px;flex:none}
.btn--b{padding:16px 42px;font:700 17px/25.5px Inter,sans-serif}
.btn--g{padding:16px 50px 16px 54px;min-height:64px;font:700 20px/30px Inter,sans-serif}
.btn-blanco{display:inline-flex;align-items:center;gap:12px;padding:0 28px;height:50px;border-radius:12px;background:#fff;color:var(--azul);text-decoration:none;font:600 16px/24px Inter,sans-serif;transition:transform .2s}
:where(html.con-raton) .btn-blanco:hover{transform:translateY(-2px)}
.btn-blanco svg{width:20px;height:20px}
.h2{font:800 58px/1.1 Inter,sans-serif;letter-spacing:-1.74px;color:var(--tinta);text-wrap:balance}
.lead{font:400 19px/1.6 Inter,sans-serif;color:var(--gris-s);text-wrap:pretty}

/* Entrada al hacer scroll (solo con JS y sin reduced-motion) */
.js .rev{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.js .rev.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .rev{opacity:1;transform:none;transition:none}*{animation:none!important}.btn,.btn-blanco{transition:none}}

/* ------- cabecera fija ------- */
.cab{position:fixed;top:0;left:0;right:0;z-index:300;padding-top:16px;pointer-events:none}
.cab-in{pointer-events:auto;position:relative;max-width:1450px;margin:0 auto;height:65px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-radius:12px;
  background:transparent;transition:background .3s,box-shadow .3s}
.cab.pegada .cab-in,:where(html.con-raton) .cab-in:hover{background:rgba(249,249,249,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 2px 12px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.05)}
.cab-logo{display:flex;align-items:center;flex:none;min-height:44px}
.cab-logo img{height:34px;width:auto}
.cab-nav{display:flex;align-items:center;gap:2px;flex:1;justify-content:center}
.cab-nav a{display:inline-flex;align-items:center;min-height:44px;padding:8px 13px;border-radius:6px;color:var(--tinta);text-decoration:none;font:400 16px/24px Inter,sans-serif;transition:background .2s,color .2s}
:where(html.con-raton) .cab-nav a:hover{background:rgba(21,101,192,.08);color:var(--azul)}
.cab-der{display:flex;align-items:center;gap:6px;flex:none}
.cab-entrar{display:inline-flex;align-items:center;min-height:44px;padding:8px 15px;border-radius:8px;color:var(--tinta);text-decoration:none;font:500 16px/24px Inter,sans-serif}
:where(html.con-raton) .cab-entrar:hover{background:rgba(21,101,192,.08)}
.cab-cta{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:9px 20px;border-radius:9px;background:var(--azul);color:#fff;text-decoration:none;font:600 16px/24px Inter,sans-serif;
  border:1px solid rgba(0,0,0,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 3px rgba(21,101,192,.3);transition:background .2s}
:where(html.con-raton) .cab-cta:hover{background:var(--azul2)}
.cab-cta svg{width:20px;height:20px}
.cab-burg{display:none;width:44px;height:44px;border:0;background:transparent;border-radius:6px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0}
.cab-burg span{display:block;width:22px;height:2px;border-radius:2px;background:var(--tinta);transition:transform .25s,opacity .25s}
.cab-burg[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cab-burg[aria-expanded="true"] span:nth-child(2){opacity:0}
.cab-burg[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.cab-movil{pointer-events:auto;display:none;margin:8px 16px 0;background:#fff;border-radius:12px;box-shadow:0 10px 30px rgba(15,23,42,.16);padding:8px}
.cab-movil.abierto{display:block}
.cab-movil a{display:flex;align-items:center;min-height:48px;padding:0 14px;border-radius:8px;color:var(--tinta);text-decoration:none;font:500 17px/1 Inter,sans-serif}
:where(html.con-raton) .cab-movil a:hover{background:var(--fondo)}
.espacio-cab{height:81px}
.aviso{display:block;background:#1565C0;color:#F1F1F1;text-decoration:none;padding:11px 16px}
.aviso p{display:flex;align-items:center;justify-content:center;gap:10px;font:300 14px/18.9px Inter,sans-serif;letter-spacing:-.3px;text-align:center}
.aviso svg{width:22px;height:22px;flex:none;color:#fff}
.aviso b{font-weight:600;color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ------- 1. portada ------- */
.portada{background:var(--fondo);padding:32px 0}
.sellos-pill{display:inline-flex;align-items:center;gap:14px;padding:10px 22px;border-radius:999px;background:#F5F5F7;border:1px solid var(--borde)}
.sellos-pill img{height:24px;width:auto}
.sellos-txt{margin-top:8px;font:400 14px/21px Inter,sans-serif;color:var(--gris-s)}
.portada h1{max-width:1220px;margin:16px auto 0;font:800 74px/1.1 Inter,sans-serif;letter-spacing:-2px;color:var(--tinta);text-wrap:balance}
.portada h1 .ic-h1{display:inline-grid;place-items:center;width:.72em;height:.72em;border-radius:50%;background:#fff;box-shadow:0 6px 20px rgba(21,101,192,.25);vertical-align:-.06em;margin:0 .06em}
.portada h1 .ic-h1 svg{width:62%;height:62%}
.portada-sub{max-width:700px;margin:16px auto 0;font:300 18px/27px Inter,sans-serif;color:var(--gris-t)}
.portada-sub strong{font-weight:600;color:var(--tinta)}
.portada-checks{display:none}
.portada-ctas{display:flex;justify-content:center;gap:12px;margin-top:24px}
.btn-sec{display:none}
.video{position:relative;display:block;max-width:1170px;margin:32px auto 0;aspect-ratio:1170/658;border-radius:20px;overflow:hidden;background:#0B1B33;box-shadow:0 50px 200px var(--sombra-azul);text-decoration:none;color:#fff}
.video img.fondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top left;filter:saturate(1.05)}
.video::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,16,30,.72) 0%,rgba(12,16,30,.55) 40%,rgba(21,101,192,.7) 75%,rgba(21,101,192,.97) 100%)}
.video-logo{position:absolute;z-index:2;left:20px;top:20px;height:30px;width:auto}
.video-sello{position:absolute;z-index:2;right:10px;top:12px;width:140px;height:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,.35))}
.video-play{position:absolute;z-index:2;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;border:3px solid #F9F9F9;display:grid;place-items:center;background:rgba(255,255,255,.12);
  box-shadow:0 4px 30px rgba(0,0,0,.4);transition:transform .25s ease,background .25s}
:where(html.con-raton) .video:hover .video-play{transform:scale(1.08);background:rgba(255,255,255,.22)}
.video-play svg{width:28px;height:28px;margin-left:3px}
.video-tit{position:absolute;z-index:2;left:0;right:0;bottom:38px;text-align:center;padding:0 24px}
.video-tit b{display:block;font:500 clamp(22px,4.2vw,60px)/1.1 Inter,sans-serif;letter-spacing:-1px;text-shadow:0 4px 24px rgba(0,0,0,.35)}
.video-tit span{display:block;margin-top:6px;font:400 clamp(13px,2vw,29px)/1.2 Inter,sans-serif;color:rgba(255,255,255,.92)}
.nota-mon{max-width:700px;margin:40px auto 0;font:400 14px/20px Inter,sans-serif;letter-spacing:-.5px;color:var(--gris-s)}

/* ------- 2. dolor ------- */
.dolor{position:relative;background:#fff;padding:128px 0;overflow:hidden}
.dolor-deco{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dolor .c{position:relative}
.dolor .h2{max-width:1100px;margin:20px auto 0}
.dolor .lead{max-width:900px;margin:19px auto 0}
.dolor-g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:64px}
.dolor-t{display:flex;gap:16px;align-items:flex-start;padding:32px;background:#fff;border:1px solid var(--borde2);border-radius:20px;text-align:left;transition:transform .25s,box-shadow .25s}
:where(html.con-raton) .dolor-t:hover{transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(21,101,192,.45)}
.dolor-t svg{width:40px;height:40px;flex:none;color:#8A8A8B}
.dolor-t p{font:300 19px/1.55 Inter,sans-serif;color:var(--tinta)}
.dolor .cta{margin-top:40px}

/* ------- 3. control ------- */
.control{background:var(--fondo);padding:80px 0}
.control .h2{max-width:1100px;margin:16px auto 0;line-height:1.3;letter-spacing:-2px}
.control .lead{max-width:760px;margin:16px auto 0;font-size:20px;line-height:30px;letter-spacing:-.5px;color:var(--gris-t)}
.ctl-osc{position:relative;margin-top:96px;height:419px;border-radius:20px;background:#1565C0;box-shadow:0 50px 200px rgba(21,101,192,.5)}
.ctl-osc-bg{position:absolute;inset:0;border-radius:20px;overflow:hidden}
.ctl-osc-bg svg{position:absolute;right:0;bottom:0;width:74%;height:104%}
.ctl-osc-txt{position:absolute;left:48px;top:94px;max-width:444px;text-align:left}
.ctl-marca{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--azul3));box-shadow:0 0 0 6px rgba(255,255,255,.06)}
.ctl-marca svg{width:36px;height:36px;color:#fff}
.ctl-osc h3{margin-top:20px;font:600 42px/1.1 Inter,sans-serif;letter-spacing:-1.25px;color:#fff}
.ctl-osc-img{position:absolute;right:0;bottom:0;width:51%;max-width:700px}
.ctl-g{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:23px}
.ctl-c{border-radius:20px;padding:32px;text-align:center;display:flex;flex-direction:column}
.ctl-c .img{height:320px;border-radius:12px;display:grid;place-items:center;overflow:hidden}
.ctl-c .img img{max-height:100%;width:auto}
.ctl-c h3{margin-top:24px;font:600 42px/1.15 Inter,sans-serif;letter-spacing:-1px;text-wrap:balance}
.ctl-c p{margin-top:12px;font:400 19px/1.6 Inter,sans-serif}
.ctl-c--a{background:var(--azul);color:#fff}
.ctl-c--a h3{color:#fff}
.ctl-c--g{background:var(--fondo);border:1px solid var(--borde);padding:32px 0}
.ctl-c--g h3{padding:0 16px;color:var(--tinta)}
.ctl-c--g p{padding:0 12px;color:var(--gris-t)}

/* ------- 4. hazlo tú (banda oscura) ------- */
.tu{background:var(--oscuro);padding:80px 0}
.tu .c{display:grid;grid-template-columns:1fr 490px;gap:40px;align-items:center}
.tu-chip{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:10px;background:rgba(77,77,77,.5);border:1px solid var(--azul2);color:#fff;font:300 14px/14px Inter,sans-serif}
.tu-chip b{font-weight:700}
.tu h2{margin-top:24px;max-width:646px;font:800 44px/1.15 Inter,sans-serif;letter-spacing:-1px;color:#fff}
.tu-ic{display:inline-grid;place-items:center;width:37px;height:37px;border-radius:8px;background:linear-gradient(135deg,#A855F7,#6366F1);vertical-align:-4px;margin-left:6px}
.tu-ic svg{width:22px;height:22px;color:#fff}
.tu p{margin-top:25px;max-width:546px;font:300 16px/22.4px Inter,sans-serif;color:rgba(255,255,255,.8)}
.tu p strong{font-weight:500;color:var(--am)}
.tu ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px;max-width:546px}
.tu li{display:flex;gap:10px;align-items:flex-start;font:300 16px/22.4px Inter,sans-serif;color:rgba(255,255,255,.85)}
.tu li svg{width:20px;height:20px;flex:none;color:#C084FC;margin-top:1px}
.tu .btn-blanco{margin-top:32px}
.tu-card{height:537px;border-radius:32px;background:#1565C0;display:grid;place-items:end center;overflow:hidden;position:relative}
.tu-card::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;left:50%;top:40%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,.28),rgba(255,255,255,0) 65%)}
.tu-card img{position:relative;width:118%;max-width:none;margin-bottom:-6px}

/* ------- 5. cómo funciona ------- */
.como{background:var(--fondo);padding:48px 0}
.como .h2{margin-top:16px;font-size:52px;font-weight:700;letter-spacing:-1.5px;line-height:1.15}
.como .lead{max-width:750px;margin:16px auto 0;font:300 17px/25.5px Inter,sans-serif;letter-spacing:-.3px}
.como-g{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:70px}
.como-t{display:flex;flex-direction:column;gap:24px;padding:32px;min-height:460px;background:#fff;border:1px solid var(--borde);border-radius:28px;box-shadow:0 5px 20px rgba(0,0,0,.05);text-align:left;transition:transform .25s,box-shadow .25s}
:where(html.con-raton) .como-t:hover{transform:translateY(-4px);box-shadow:0 22px 40px -22px rgba(21,101,192,.45)}
.como-t svg{width:100%;max-width:254px;height:auto;aspect-ratio:1}
.como-t h3{font:600 24px/1.15 Inter,sans-serif;letter-spacing:-.72px;color:var(--tinta)}
.como-t p{margin-top:-8px;font:300 16px/24px Inter,sans-serif;color:var(--gris-s)}
.como-pill{display:inline-flex;align-items:center;gap:20px;margin-top:70px;padding:12px 32px;background:#fff;border:1px solid var(--chip-borde);border-radius:16px;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1)}
.como-pill svg{width:20px;height:23px;flex:none;color:var(--azul)}
.como-pill p{font:400 21px/1.2 Inter,sans-serif;letter-spacing:-1px;color:var(--azul)}
.como-pill strong{font-weight:700}
.como-nota{margin-top:30px;font:400 15px/20px Inter,sans-serif;color:var(--gris-s)}
.buros{display:flex;justify-content:center;align-items:center;gap:44px;margin:14px 0 30px;font:700 26px/1 Inter,sans-serif;letter-spacing:-.5px;color:#9A9AA0}

/* ------- 6. banda celeste ------- */
.celeste{background:var(--celeste);padding:64px 150px;display:flex;align-items:center;justify-content:center;gap:10px}
.celeste-img{width:560px;flex:none;display:grid;place-items:center;aspect-ratio:1}
.celeste-img img{width:92%}
.celeste-txt{max-width:560px}
.celeste-pill{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding:12px 20px;background:#fff;border:1px solid var(--borde);border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);font:400 13px/19.5px Inter,sans-serif;color:var(--gris-s)}
.celeste-pill span{display:inline-flex;align-items:center;gap:8px}
.celeste-pill svg{width:18px;height:18px;color:var(--azul)}
.celeste-pill i{width:1px;height:18px;background:var(--borde)}
.celeste h2{margin-top:20px;font:700 64px/1 Inter,sans-serif;letter-spacing:-2px;color:var(--tinta)}
.celeste ul{list-style:none;padding:0;margin:20px 0 0}
.celeste li{display:flex;gap:12px;padding-bottom:12px;font:300 17px/25.5px Inter,sans-serif;color:var(--gris-s)}
.celeste li svg{width:20px;height:20px;flex:none;margin-top:2px}
.celeste .btn{margin-top:20px;padding:16px 42px 18px;min-height:65px;font:700 19px/28.5px Inter,sans-serif;border-radius:20px;box-shadow:inset 0 2px 0 rgba(255,255,255,.75)}

/* ------- 7. funciones (bento) ------- */
.func{background:#fff;padding:112px 0}
.func .h2{margin-top:16px;line-height:1.15;letter-spacing:-1.16px}
.func .lead{margin:16px auto 0;max-width:787px;font:300 20px/28px Inter,sans-serif}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:40px;text-align:left}
.b{position:relative;border-radius:30px;border:1px solid var(--borde);box-shadow:0 5px 20px rgba(0,0,0,.05);overflow:hidden;padding:41px;transition:transform .3s}
:where(html.con-raton) .b:hover{transform:translateY(-4px)}
.b h3{font:700 35px/1.15 Inter,sans-serif;letter-spacing:-.98px;text-wrap:balance}
.b p{margin-top:16px;font:300 18px/27px Inter,sans-serif;color:var(--gris-s)}
.b--o{background:var(--oscuro);border-color:var(--oscuro-borde)}
.b--o h3{color:#fff}.b--o p{color:#E4E4E4;font-weight:400}
.b--a{background:var(--azul);border-color:var(--azul-borde)}
.b--a h3{color:#fff}.b--a p{color:#E8F1FC;font-weight:400}
.b--g{background:var(--fondo)}
.b--c{background:var(--celeste2);border-color:var(--celeste-borde)}
.b--c p{color:#4B5563}
.b-ancha{grid-column:span 3;display:grid;grid-template-columns:1fr 283px;gap:32px;align-items:center;min-height:365px}
.b-alta{grid-column:span 2;display:flex;flex-direction:column;min-height:733px}
.b-alta .b-vis{margin-top:auto;padding-top:40px;display:grid;place-items:center}
.b-vis svg,.b-vis img{width:100%;max-width:367px;height:auto}
.b-ancha .b-vis svg{max-width:283px}

/* ------- 9. empieza ------- */
.empieza{background:var(--fondo);padding:80px 0}
.empieza .h2{margin-top:20px;letter-spacing:-2px}
.empieza .lead{max-width:1000px;margin:19px auto 0;font:300 19px/28.5px Inter,sans-serif;letter-spacing:-.5px}
.pasos{margin-top:50px;display:grid;gap:45px}
.paso{display:grid;grid-template-columns:440px 1fr;gap:65px;align-items:center;text-align:left}
.paso-vis{height:415px;border-radius:40px;background:#fff;box-shadow:0 15px 25px rgba(21,101,192,.2);display:grid;place-items:center;overflow:hidden;padding:24px}
.paso-vis img{max-height:300px;width:auto}
.paso-vis svg{width:80%;height:auto}
.paso-t{max-width:750px}
.paso-t h3{margin-top:18px;font:700 35px/42px Inter,sans-serif;letter-spacing:-1px;color:var(--tinta)}
.paso-t p{margin-top:17px;font:300 19px/28.5px Inter,sans-serif;color:var(--gris-s)}
.paso-t p strong{font-weight:500;color:var(--tinta)}
.precio{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:6px 14px;border-radius:10px;background:#fff;border:1px solid #A9C0FF;font:600 16px/1.4 Inter,sans-serif;color:var(--tinta)}
.empieza .cta{margin-top:50px}

/* ------- 10. banda CTA oscura ------- */
.cta-osc-s{background:var(--fondo);padding:0 0 40px}
.cta-osc{position:relative;height:477px;border-radius:40px;background:var(--oscuro);overflow:hidden;padding:60px 67px;display:flex;align-items:center}
.cta-osc .rayas{position:absolute;inset:0;width:100%;height:100%}
.cta-osc .foto{position:absolute;right:0;bottom:0;width:65%;max-width:894px;height:100%;object-fit:cover;object-position:center bottom}
.cta-osc .velo{position:absolute;inset:0;background:linear-gradient(to right,var(--oscuro) 30%,rgba(27,28,33,.82) 48%,rgba(27,28,33,0) 75%)}
.cta-osc-txt{position:relative;max-width:620px}
.caja-soporte{display:inline-flex;align-items:center;gap:10px;padding:5px 12px 5px 14px;border-radius:5px;background:rgba(46,46,46,.5);border:1px solid rgba(120,120,120,.5);color:#fff;font:300 16px/24px Inter,sans-serif}
.caja-soporte strong{font-weight:700}
.caja-soporte svg{width:20px;height:20px;color:#25D366}
.cta-osc h2{margin-top:32px;font:600 55px/1.15 Inter,sans-serif;letter-spacing:-1.25px;color:#fff}
.cta-osc h2 .mini{display:inline-grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#fff;vertical-align:-10px;margin-left:4px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.cta-osc h2 .mini svg{width:34px;height:34px}
.cta-osc .btn{margin-top:32px}

/* ------- 11. garantía ------- */
.gar{background:var(--fondo);padding:48px 0 80px;position:relative;overflow:hidden}
.gar-arcos{display:block;width:100%;max-width:1100px;height:auto;margin:0 auto}
.gar-sello{position:absolute;left:50%;top:0;width:180px;transform:translateX(-50%);margin-top:70px;filter:drop-shadow(0 0 40px rgba(21,101,192,.55))}
.gar .h2{margin:-170px auto 0;max-width:1184px;font-weight:700;line-height:1;letter-spacing:-1px;position:relative}
.gar .lead{max-width:880px;margin:16px auto 0;color:var(--gris-t)}
.gar .lead strong{font-weight:700}
.gar-link{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;font:700 16px/24px Inter,sans-serif;font-style:italic;color:var(--tinta);text-decoration:underline;text-underline-offset:3px}
.gar-3{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;max-width:1184px;margin:40px auto 0}
.gar-ic{display:inline-grid;place-items:center;width:60px;height:60px;border-radius:12px;background:#fff;border:1px solid var(--borde);box-shadow:0 4px 15px rgba(0,0,0,.1)}
.gar-ic svg{width:28px;height:28px;color:var(--azul)}
.gar-3 h3{margin-top:32px;font:700 35px/1.25 Inter,sans-serif;color:var(--tinta)}
.gar-3 p{margin-top:12px;font:400 18px/21.6px Inter,sans-serif;color:var(--gris-t)}

/* ------- 12. banda soporte oscura ------- */
.sop{position:relative;background:var(--oscuro);overflow:hidden}
.sop .rayas{position:absolute;inset:0;width:100%;height:100%}
.sop .c{position:relative;display:grid;grid-template-columns:1fr 645px;gap:40px;align-items:center;min-height:754px}
.sop h2{margin-top:28px;font:700 64px/1.2 Inter,sans-serif;letter-spacing:-1.5px;background:linear-gradient(100deg,#F5F5F5 0%,#ADC3FF 100%);-webkit-background-clip:text;background-clip:text;color:transparent;max-width:647px}
.sop p{margin-top:32px;max-width:528px;font:400 19px/24.7px Inter,sans-serif;letter-spacing:.25px;color:#CBCBCB}
.sop-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn-linea{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:10px 26px;border-radius:20px;border:1px solid rgba(255,255,255,.35);color:#fff;text-decoration:none;font:500 18px/1 Inter,sans-serif}
:where(html.con-raton) .btn-linea:hover{background:rgba(255,255,255,.08)}
.btn-linea svg{width:20px;height:20px}
.sop-vis{position:relative;display:grid;place-items:center}
.sop-vis .marco{width:100%;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 40px 90px -20px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.12);transform:perspective(1400px) rotateY(-12deg) rotateX(4deg)}
.sop-vis .barra{height:28px;background:#F1F5FB;border-bottom:1px solid #E1E8F2;display:flex;align-items:center;gap:6px;padding:0 12px}
.sop-vis .barra i{width:9px;height:9px;border-radius:50%;background:#CBD5E1}

/* ------- 13. guías ------- */
.guias{background:var(--fondo);padding:64px 0}
.guias .h2{max-width:896px;margin:16px auto 0;line-height:1.2;letter-spacing:-2px}
.guias-g{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:56px;text-align:left}
.guia{display:block;text-decoration:none;color:inherit}
.guia-mini{position:relative;aspect-ratio:437/246;border-radius:32px;overflow:hidden;background:linear-gradient(135deg,var(--azul) 0%,var(--azul3) 100%);padding:26px 28px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;transition:transform .3s}
:where(html.con-raton) .guia:hover .guia-mini{transform:translateY(-4px)}
.guia-mini img{height:20px;width:auto;align-self:flex-start}
.guia-mini b{font:700 22px/1.15 Inter,sans-serif;letter-spacing:-.5px;max-width:62%}
.guia-mini small{font:400 11px/1 Inter,sans-serif;opacity:.8}
.guia-mini svg{position:absolute;right:-18px;bottom:-18px;width:52%;height:auto;opacity:.95}
.guia-cat{display:inline-block;margin-top:20px;padding:8px 16px;border-radius:12px;background:var(--chip-bg);color:var(--azul);font:400 16px/24px Inter,sans-serif}
.guia h3{margin-top:8px;font:700 26px/1.2 Inter,sans-serif;letter-spacing:-1px;color:var(--tinta)}
.guia-mas{display:inline-block;margin-top:16px;font:500 15px/22.5px Inter,sans-serif;color:var(--azul)}

/* ------- avisos ------- */
.avisos{background:var(--fondo);border-top:1px solid rgba(0,0,0,.05);padding:40px 0 48px}
.avisos p{font:400 13px/1.65 Inter,sans-serif;color:var(--gris-s);max-width:1376px}
.avisos p+p{margin-top:12px}
.avisos strong{color:var(--tinta);font-weight:600}
.avisos a{color:var(--azul)}

/* ------- flotantes ------- */
.wa-flot{position:fixed;right:16px;bottom:16px;z-index:250;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 12px 26px -8px rgba(0,0,0,.4)}
.wa-flot svg{width:28px;height:28px}
.modal{position:fixed;inset:0;z-index:400;display:grid;place-items:center;padding:16px}
.modal[hidden]{display:none}
.modal-velo{position:absolute;inset:0;background:rgba(10,12,18,.85)}
.modal-caja{position:relative;width:min(1000px,100%)}
.modal-caja video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:14px;background:#000}
.modal-x{position:absolute;top:-52px;right:0;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;background:rgba(255,255,255,.18);color:#fff;font:400 28px/1 sans-serif}
footer.fc-pie .pie-aviso{color:rgba(255,255,255,.8)}

/* =========== piel Financore (antes de los cortes responsive) =========== */
:focus-visible{outline:3px solid #F5B80F;outline-offset:3px}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--tinta)}
.h2,.portada h1,.tu h2,.celeste h2,.cta-osc h2,.sop h2,.ctl-osc h3,.ctl-c h3,.como-t h3,.b h3,.paso-t h3,.gar-3 h3,.guia h3,.guia-mini b,.video-tit b{font-family:Merriweather,Georgia,serif;letter-spacing:-.02em}
.portada h1{font-weight:900;font-size:64px;line-height:1.12}
.h2{font-weight:900;font-size:48px;line-height:1.18}
.como .h2{font-size:46px;font-weight:900}
.lead,.portada-sub,.control .lead,.como .lead,.func .lead,.empieza .lead{color:var(--gris-t);line-height:1.7;font-weight:400}
.chip{border-radius:100px;padding:6px 16px;background:#E3F0FD;border:1px solid #C5DDF7;color:#1565C0;font:700 11px/1.2 Inter,sans-serif;letter-spacing:2.5px;text-transform:uppercase;box-shadow:none}

/* Fondos claros con manchas de luz: el cristal blanco tiene algo detrás */
.portada,.control,.como,.empieza,.gar,.guias{background-color:var(--fondo);background-image:radial-gradient(520px 340px at 8% 12%,rgba(30,136,229,.16),transparent 70%),radial-gradient(460px 320px at 94% 70%,rgba(245,184,15,.14),transparent 70%)}
.dolor,.func{background-image:radial-gradient(560px 360px at 92% 18%,rgba(30,136,229,.12),transparent 70%),radial-gradient(420px 300px at 6% 88%,rgba(245,184,15,.12),transparent 70%)}

/* Botones: amarillo con texto oscuro, elevación y brillo que cruza */
.btn,.cab-cta,.btn-blanco{position:relative;overflow:hidden;isolation:isolate;background:var(--am);color:#12203A;border:0;border-radius:10px;font-weight:800;
  box-shadow:0 12px 30px -12px rgba(245,184,15,.7),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .25s ease-out,box-shadow .25s ease-out,background .25s}
.btn::after,.cab-cta::after,.btn-blanco::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s ease-out}
:where(html.con-raton) .btn:hover,:where(html.con-raton) .cab-cta:hover,:where(html.con-raton) .btn-blanco:hover{background:var(--am2);transform:translateY(-3px);box-shadow:0 20px 40px -14px rgba(245,184,15,.85),inset 0 1px 0 rgba(255,255,255,.5)}
:where(html.con-raton) .btn:hover::after,:where(html.con-raton) .cab-cta:hover::after,:where(html.con-raton) .btn-blanco:hover::after{transform:translateX(120%)}
.cab-cta{box-shadow:0 8px 20px -8px rgba(245,184,15,.7)}
.btn--b,.btn--g{font-weight:800}
.btn-sec{border-radius:10px}
:where(html.con-raton) .cab-nav a:hover,:where(html.con-raton) .cab-entrar:hover{background:#E3F0FD;color:#1565C0}
.aviso{background:#1565C0}
.aviso p{font:500 14px/1.4 Inter,sans-serif;letter-spacing:0;color:#fff}
.aviso b{color:#fff}

/* ---------- Cristal ---------- */
/* claro (sobre fondos claros) */
.cristal{background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.9);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 0 0 1px rgba(21,101,192,.08),0 14px 34px -18px rgba(13,43,85,.28)}
/* azul (sobre fondos azules) */
.cristal-az{background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 20px 44px -20px rgba(13,43,85,.45)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .cristal{-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
  .cristal-az{-webkit-backdrop-filter:blur(16px) saturate(140%) brightness(.94);backdrop-filter:blur(16px) saturate(140%) brightness(.94)}
}
/* Respaldo opaco (sin backdrop-filter o con «reducir transparencia»): sigue viéndose premium */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .cristal{background:linear-gradient(180deg,#FFFFFF 0%,#F6FAFF 100%);border-color:#DCE8F7}
  .cristal-az{background:linear-gradient(150deg,#1E6FC9 0%,#1667C2 100%);border-color:rgba(255,255,255,.3)}
}
@media (prefers-reduced-transparency:reduce){
  .cristal{background:linear-gradient(180deg,#FFFFFF 0%,#F6FAFF 100%);border-color:#DCE8F7;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(21,101,192,.06),0 16px 36px -18px rgba(13,43,85,.3)}
  .cristal-az{background:linear-gradient(150deg,#1E6FC9 0%,#1667C2 100%);border-color:rgba(255,255,255,.3);-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ---------- Inclinación 3D + brillo que sigue al puntero ---------- */
[data-tilt]{position:relative;transform-style:preserve-3d;will-change:transform}
[data-tilt]::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s ease-out;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.45),transparent 45%);mix-blend-mode:soft-light}
.js .rev.in[data-tilt],[data-tilt]{transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .25s ease-out,box-shadow .25s ease-out,border-color .25s}
.js .rev.in[data-tilt].tilt-on,[data-tilt].tilt-on{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-6px);box-shadow:0 26px 50px -24px rgba(13,43,85,.4)}
[data-tilt].tilt-on::after{opacity:1}
[data-par]{transition:transform .3s ease-out;will-change:transform}
@media (prefers-reduced-motion:reduce){[data-tilt],[data-par],.btn,.cab-cta,.btn-blanco{transition:none!important}[data-tilt].tilt-on{transform:none!important}.btn::after,.cab-cta::after,.btn-blanco::after{display:none}}

/* ---------- Secciones ---------- */
.sellos-pill{border-color:rgba(255,255,255,.9)}
.video{background:#1565C0;box-shadow:0 30px 70px -24px rgba(21,101,192,.55);border-radius:16px}
.video::after{background:linear-gradient(180deg,rgba(21,101,192,.5) 0%,rgba(21,101,192,.45) 45%,rgba(21,101,192,.85) 78%,rgba(21,101,192,.97) 100%)}
.video-play{background:#F5B80F;border-color:#fff}
.video-play svg{fill:#12203A}
.video-tit b{font-weight:900}
.dolor-t{border-radius:16px}
.dolor-t svg{color:#1565C0}
.dolor-t p{font-weight:400;color:var(--tinta)}
.ctl-osc{background:var(--grad);box-shadow:0 30px 70px -28px rgba(21,101,192,.55);border-radius:16px}
.ctl-osc-bg{border-radius:16px}
.ctl-marca{background:#F5B80F}
.ctl-marca svg{color:#12203A}
.ctl-osc h3{font-weight:900;font-size:36px}
.ctl-c{border-radius:16px}
.ctl-c--a{background:#E3F0FD;color:var(--tinta);border:1px solid #C5DDF7}
.ctl-c--a h3{color:var(--tinta)}
.ctl-c--a p{color:var(--gris-t)}
.ctl-c--g{border-color:rgba(255,255,255,.9)}
.ctl-c h3{font-weight:900;font-size:34px}
.tu{background:var(--grad);position:relative;overflow:hidden}
.tu::before{content:"";position:absolute;width:620px;height:620px;right:-120px;top:-160px;border-radius:50%;background:radial-gradient(circle,rgba(30,136,229,.9),rgba(30,136,229,0) 68%);pointer-events:none}
.tu .c{position:relative}
.tu-chip{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.45);font:500 13px/1 Inter,sans-serif}
.tu h2{font-weight:900;font-size:40px}
.tu-ic{background:#F5B80F;border-radius:8px}
.tu-ic svg{color:#12203A}
.tu p,.tu li{color:#fff;font-weight:400}
.tu p strong{color:#fff;font-weight:700;text-decoration:underline;text-decoration-color:#F5B80F;text-decoration-thickness:3px;text-underline-offset:4px}
.tu li svg{color:#F5B80F}
.tu-card{border-radius:16px}
.tu-card::before{background:radial-gradient(circle,rgba(255,255,255,.3),rgba(255,255,255,0) 65%)}
.como-t{border-radius:16px}
.como-t h3{font-weight:700;font-size:24px}
.como-t p{font-weight:400;line-height:1.7}
.como-pill{border-radius:16px}
.como-pill p{font:600 19px/1.3 Inter,sans-serif;letter-spacing:0;color:#1565C0}
.buros{color:#5A6680;font-family:Inter,sans-serif}
.celeste{background:#E3F0FD;background-image:radial-gradient(500px 360px at 20% 50%,rgba(30,136,229,.22),transparent 70%)}
.celeste h2{font-weight:900;font-size:48px;line-height:1.12}
.celeste li{color:var(--gris-t);font-weight:400}
.celeste .btn{border-radius:10px}
.celeste-pill{border-radius:100px}
.b{border-radius:16px}
.b h3{font-weight:900;font-size:30px}
.b p{font-weight:400;line-height:1.7}
.b--o{background:var(--grad);border-color:#1565C0}
.b--o h3,.b--o p{color:#fff}
.b--o .b-vis{border-radius:16px;padding:18px}
.b--a{background:#E3F0FD;border-color:#C5DDF7}
.b--a h3{color:var(--tinta)}.b--a p{color:var(--gris-t)}
.b--g{background:#fff}
.b--c p{color:var(--gris-t)}
.paso-vis{border-radius:16px}
.paso-t h3{font-weight:900;font-size:30px;line-height:1.25}
.paso-t p{font-weight:400;line-height:1.7}
.precio{border-radius:100px;background:#FFF6D9;border-color:#F5D27A;color:#12203A}
.cta-osc{background:var(--grad);border-radius:16px}
.cta-osc .velo{background:linear-gradient(to right,#1565C0 32%,rgba(21,101,192,.85) 50%,rgba(21,101,192,0) 78%)}
.cta-osc-txt{padding:28px 30px;border-radius:16px}
.cta-osc h2{font-weight:900;font-size:42px}
.cta-osc h2 .mini{box-shadow:0 6px 16px rgba(13,43,85,.25)}
.caja-soporte{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.45);border-radius:100px;font-weight:500}
.caja-soporte svg{color:#fff}
.gar-sello{filter:drop-shadow(0 12px 30px rgba(21,101,192,.35))}
.gar .h2{font-weight:900}
.gar-3>div{padding:28px 24px;border-radius:16px}
.gar-ic{border-radius:16px;box-shadow:0 4px 16px rgba(13,43,85,.10)}
.gar-3 h3{font-weight:700;font-size:26px;margin-top:20px}
.gar-3 p{line-height:1.6}
.gar-link{color:#1565C0;font-style:normal}
.sop{background:var(--grad)}
.sop h2{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#fff;font-weight:900;font-size:48px}
.sop p{color:#fff;letter-spacing:0;line-height:1.7}
.btn-linea{border-radius:10px;border:2px solid rgba(255,255,255,.6)}
.sop-vis{padding:18px;border-radius:20px}
.sop-vis .marco{box-shadow:0 30px 60px -20px rgba(13,43,85,.35)}
.guia-mini{border-radius:16px;background:var(--grad)}
.guia-mini b{font-weight:900;font-size:20px}
.guia-cat{border-radius:100px;font:700 11px/1.2 Inter,sans-serif;letter-spacing:2px;text-transform:uppercase;padding:7px 14px;color:#1565C0}
.guia h3{font-weight:700;font-size:22px;letter-spacing:-.01em}
.guia-mas{color:#1565C0;font-weight:700}
.avisos p{color:var(--gris-t)}
.avisos a{color:#1565C0}

/* =========== 3.ª vuelta (10-oct): composición visual al nivel de la referencia =========== */
.reticula{background-image:linear-gradient(rgba(21,101,192,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(21,101,192,.07) 1px,transparent 1px);background-size:28px 28px}
.reticula-bl{background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:32px 32px}

/* Laptop */
.laptop{position:relative;width:100%}
.laptop-pant{position:relative;border-radius:16px 16px 6px 6px;background:linear-gradient(180deg,#F7F9FC,#E3E9F2);padding:12px 12px 14px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 0 0 1px rgba(13,43,85,.10),0 46px 80px -30px rgba(13,43,85,.5),0 18px 32px -18px rgba(13,43,85,.32)}
.laptop-pant::before{content:"";position:absolute;top:4px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#AEB9CA}
.laptop-pant img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:left top;border-radius:6px;background:#fff}
.laptop-pant::after{content:"";position:absolute;inset:12px 12px 14px;border-radius:6px;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,0) 32%)}
.laptop-base{position:relative;height:16px;margin:0 -8%;border-radius:2px 2px 20px 20px;background:linear-gradient(180deg,#F4F7FB 0%,#D3DCE8 60%,#B9C4D4 100%);box-shadow:0 22px 34px -14px rgba(13,43,85,.45)}
.laptop-base::before{content:"";position:absolute;top:0;left:50%;width:16%;height:6px;margin-left:-8%;border-radius:0 0 8px 8px;background:#C3CDDB}

/* Teléfono (pantalla hecha en HTML, sin cifras de resultados) */
.tel{position:relative;width:var(--tw,250px);aspect-ratio:9/19.3;border-radius:calc(var(--tw,250px)*.17);padding:calc(var(--tw,250px)*.036);
  background:linear-gradient(145deg,#FBFCFE 0%,#DCE4EF 55%,#C7D2E2 100%);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.95),inset 0 0 0 3px rgba(13,43,85,.06),0 0 0 1px rgba(13,43,85,.12),0 54px 90px -34px rgba(13,43,85,.55),0 22px 34px -18px rgba(13,43,85,.35)}
.tel-pant{position:relative;height:100%;border-radius:calc(var(--tw,250px)*.135);overflow:hidden;background:#F4F6FA;text-align:left;font:400 calc(var(--tw,250px)*.044)/1.3 Inter,sans-serif;color:#1E2A3A;
  box-shadow:inset 0 0 0 1px rgba(13,43,85,.08)}
.tel-pant::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 28%)}
.tel-isla{position:absolute;z-index:3;top:3.2%;left:50%;width:31%;height:3.6%;transform:translateX(-50%);border-radius:20px;background:#1E2A3A}
.ts-top{display:flex;justify-content:space-between;align-items:center;padding:4.2% 9% 0;font-weight:700;font-size:.92em}
.ts-top i{display:inline-block;width:1.6em;height:.75em;border-radius:3px;border:1.5px solid #1E2A3A;position:relative}
.ts-top i::after{content:"";position:absolute;inset:1px 30% 1px 1px;background:#1E2A3A;border-radius:1px}
.ts-head{display:flex;justify-content:space-between;align-items:center;padding:9% 7% 0}
.ts-head img{height:1.9em;width:auto}
.ts-av{width:2.2em;height:2.2em;border-radius:50%;background:linear-gradient(135deg,#1565C0,#1E88E5);box-shadow:0 0 0 2px #fff}
.ts-hola{padding:4% 7% 0;color:#5A6680;font-size:.9em}
.ts-nom{display:block;padding:0 7%;font:900 1.45em/1.2 Merriweather,Georgia,serif}
.ts-card{margin:4.5% 5% 0;padding:5% 5.5%;background:#fff;border-radius:1.1em;box-shadow:0 1px 2px rgba(13,43,85,.06),0 8px 18px -10px rgba(13,43,85,.18)}
.ts-gauge{display:flex;align-items:center;gap:6%}
.ts-gauge svg{width:38%;height:auto;flex:none}
.ts-gauge b{display:block;font-size:1.05em}
.ts-gauge small{display:block;color:#5A6680;font-size:.82em;margin-top:2px}
.ts-tit{font-weight:700;font-size:.95em;margin-bottom:3%}
.ts-fila{display:flex;align-items:center;gap:5%;padding:3.6% 0;border-top:1px solid #EEF2F7}
.ts-fila:first-of-type{border-top:0}
.ts-fila>i{flex:none;display:grid;place-items:center;width:2.2em;height:2.2em;border-radius:.6em;font:800 .78em/1 Inter,sans-serif;font-style:normal;color:#fff}
.ts-fila>span{flex:1;min-width:0;font-weight:600;font-size:.88em;line-height:1.25}
.ts-fila>span small{display:block;font-weight:400;color:#5A6680;font-size:.9em}
.ts-tag{flex:none;padding:.25em .6em;border-radius:20px;font:700 .72em/1.2 Inter,sans-serif}
.tg-ok{background:#E8F5E9;color:#2E7D32}.tg-az{background:#E3F0FD;color:#1565C0}.tg-am{background:#FFF4D1;color:#7A5A00}
.bx{background:#6A1B9A}.bt{background:#0277BD}.be{background:#B71C1C}
.ts-boton{margin:5% 5% 0;padding:4.5%;border-radius:.9em;text-align:center;background:#F5B80F;color:#12203A;font-weight:800;font-size:.92em}

/* Tarjetas flotantes */
.flota{position:absolute;z-index:6;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;text-align:left;white-space:nowrap;
  font:600 13px/1.25 Inter,sans-serif;color:#1E2A3A;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);
  box-shadow:0 1px 0 #fff inset,0 0 0 1px rgba(21,101,192,.08),0 18px 36px -14px rgba(13,43,85,.4);
  transform:rotate(var(--rot,0deg));animation:flotar 6s ease-in-out infinite;animation-delay:var(--retraso,0s)}
.flota small{display:block;font-weight:500;color:#5A6680;font-size:11.5px}
.flota-ic{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:#fff;background:linear-gradient(135deg,#1565C0,#1E88E5);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 12px -6px rgba(21,101,192,.7)}
.flota-ic svg{width:18px;height:18px}
.flota-ic.am{background:linear-gradient(135deg,#F5B80F,#FFCF4D);color:#12203A;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 6px 12px -6px rgba(245,184,15,.8)}
.flota-ic.vd{background:linear-gradient(135deg,#2E7D32,#43A047)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.flota{-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);background:rgba(255,255,255,.72)}}
@media (prefers-reduced-transparency:reduce){.flota{background:linear-gradient(180deg,#fff,#F6FAFF);-webkit-backdrop-filter:none;backdrop-filter:none}}
@keyframes flotar{0%,100%{transform:translateY(0) rotate(var(--rot,0deg))}50%{transform:translateY(-10px) rotate(var(--rot,0deg))}}

/* Cuadros de icono con degradado y brillo */
.ic-cuadro{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:14px;color:#fff;
  background:linear-gradient(140deg,#1E88E5 0%,#1565C0 70%);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -8px 16px -8px rgba(13,43,85,.35),0 10px 22px -10px rgba(21,101,192,.8)}
.dolor-t .ic-cuadro svg{width:28px;height:28px;color:#fff;stroke-width:2}
.dolor-t{align-items:center}

/* ---------- Portada: tarjeta de video ---------- */
.video{display:block;aspect-ratio:1170/640;border-radius:24px;overflow:visible;background:none;box-shadow:none;padding:0}
.video::after{display:none}
.video-lienzo{position:absolute;inset:0;border-radius:24px;overflow:hidden;background:radial-gradient(60% 70% at 70% 20%,#2A8AE8 0%,rgba(30,136,229,0) 60%),linear-gradient(150deg,#1565C0 0%,#1976D2 100%);
  box-shadow:0 0 0 8px rgba(255,255,255,.55),0 0 0 9px rgba(21,101,192,.12),0 50px 120px -40px rgba(21,101,192,.7)}
.video-lienzo::before{content:"";position:absolute;inset:0}
.video-lienzo .curva{position:absolute;inset:0;width:100%;height:100%}
.v-laptop{position:absolute;left:19%;top:9%;width:56%}
.v-tel{position:absolute;right:7%;top:15%;--tw:clamp(110px,15vw,210px);transform:perspective(1200px) rotateY(-14deg) rotateZ(3deg)}
.v-tel2{position:absolute;left:5%;top:22%;--tw:clamp(92px,12vw,170px);transform:perspective(1200px) rotateY(14deg) rotateZ(-4deg)}
.video .flota.f1{left:17%;top:62%;--rot:-3deg}
.video .flota.f2{right:20%;top:8%;--rot:2deg;--retraso:-2s}
.video .flota.f3{right:4%;top:66%;--rot:-2deg;--retraso:-4s}
.video-play{z-index:7;width:104px;height:104px;margin:-52px 0 0 -52px;border:0;background:#F5B80F;box-shadow:0 18px 40px -10px rgba(13,43,85,.55),inset 0 2px 0 rgba(255,255,255,.5)}
.video-play::before,.video-play::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.85);animation:pulso 2.4s ease-out infinite}
.video-play::after{animation-delay:1.2s}
@keyframes pulso{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.85);opacity:0}}
.video-play svg{width:38px;height:38px;fill:#12203A;margin-left:5px}
:where(html.con-raton) .video:hover .video-play{transform:scale(1.07);background:#FFC93A}
.video-tit{z-index:6;bottom:0;padding:70px 24px 30px;border-radius:0 0 24px 24px;background:linear-gradient(180deg,rgba(21,101,192,0) 0%,rgba(21,101,192,.92) 55%,#1565C0 100%)}
.video-sello{z-index:8;right:-34px;top:-44px;width:150px;filter:drop-shadow(0 16px 26px rgba(13,43,85,.35))}

/* ---------- Control: dos teléfonos que sobresalen ---------- */
.ctl-osc{overflow:visible}
.ctl-duo{position:absolute;right:5%;bottom:0;width:52%;height:118%;pointer-events:none}
.ctl-duo .tel{position:absolute;bottom:-30px}
.ctl-duo .t1{right:34%;--tw:250px;transform:perspective(1200px) rotateY(16deg) rotateZ(-6deg);z-index:2}
.ctl-duo .t2{right:4%;bottom:-60px;--tw:230px;transform:perspective(1200px) rotateY(-12deg) rotateZ(7deg)}
.ctl-osc .flota.f1{left:40%;top:16%;--rot:-3deg}
.ctl-c .img{position:relative;border-radius:16px;overflow:visible}
.ctl-c--a .img{background:radial-gradient(60% 70% at 50% 40%,rgba(255,255,255,.9),rgba(255,255,255,0) 70%)}
.ctl-c .flota.f1{left:4%;top:8%;--rot:-4deg}
.ctl-c .flota.f2{right:3%;bottom:6%;--rot:3deg;--retraso:-3s}

/* ---------- Hazlo tú ---------- */
.tu-card{display:block;padding:0;overflow:visible}
.tu-card .marcoimg{position:absolute;inset:0;border-radius:16px;overflow:hidden}
.tu-card .marcoimg img{position:absolute;left:-9%;bottom:-6px;width:118%;max-width:none}
.tu-card .flota.f1{left:-36px;top:18%;--rot:-4deg}
.tu-card .flota.f2{right:-20px;top:52%;--rot:3deg;--retraso:-2.5s}
.tu-card .flota.f3{left:10%;bottom:-22px;--rot:-2deg;--retraso:-4.5s}

/* ---------- Cómo funciona: ilustración en su marco ---------- */
.ilus{position:relative;display:grid;place-items:center;border-radius:16px;aspect-ratio:1;overflow:hidden;background:radial-gradient(70% 70% at 50% 45%,#FFFFFF 0%,#EAF3FD 70%,#DCEBFB 100%);box-shadow:inset 0 0 0 1px rgba(21,101,192,.10)}
.ilus::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(21,101,192,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(21,101,192,.08) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 75%);mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 75%)}
.ilus svg{position:relative;width:88%!important;max-width:none!important}
.ilus .num{position:absolute;left:12px;top:12px;display:grid;place-items:center;width:30px;height:30px;border-radius:10px;font:800 14px/1 Inter,sans-serif;color:#12203A;background:#F5B80F;box-shadow:0 6px 12px -6px rgba(245,184,15,.9)}

/* ---------- Banda celeste ---------- */
.celeste-img{position:relative}
.celeste-img .forma{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle,rgba(30,136,229,.35),rgba(30,136,229,0) 68%)}
.celeste-img .anillo{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;border:1.5px dashed rgba(21,101,192,.3)}
.celeste-img .tel{--tw:260px;transform:perspective(1200px) rotateY(-10deg) rotateZ(-3deg)}
.celeste-img .flota.f1{left:2%;top:22%;--rot:-4deg}
.celeste-img .flota.f2{right:0;bottom:20%;--rot:3deg;--retraso:-3s}

/* ---------- Pasos ---------- */
.paso-vis{position:relative;overflow:visible;background-color:#fff}
.paso-vis>.fondo-vis{position:absolute;inset:0;border-radius:16px;overflow:hidden;background:radial-gradient(70% 70% at 50% 45%,#FFFFFF 0%,#EEF5FD 70%,#E1EDFB 100%)}
.paso-vis>.fondo-vis::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(21,101,192,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(21,101,192,.07) 1px,transparent 1px);background-size:24px 24px}
.paso-vis>img,.paso-vis>svg,.paso-vis>.laptop{position:relative}
.paso-vis .laptop{width:86%}
.paso-vis .flota{--rot:-3deg}
.paso-vis .flota.f1{right:-18px;top:12%}
.paso-vis .flota.f2{left:-18px;bottom:12%;--rot:3deg;--retraso:-3s}

/* ---------- Soporte ---------- */
.sop-vis{padding:0;background:none!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.sop-vis .laptop{transform:perspective(1600px) rotateY(-10deg) rotateX(3deg)}
.burbuja{position:absolute;z-index:6;max-width:250px;padding:12px 14px;border-radius:16px;font:500 14px/1.4 Inter,sans-serif;color:#1E2A3A;text-align:left;background:#fff;box-shadow:0 18px 36px -14px rgba(13,43,85,.45);animation:flotar 6s ease-in-out infinite}
.burbuja small{display:block;margin-top:4px;color:#5A6680;font-size:11.5px}
.burbuja.b1{left:-30px;top:6%;border-bottom-left-radius:4px;--rot:-2deg}
.burbuja.b2{right:-14px;bottom:10%;background:#E8F5E9;border-bottom-right-radius:4px;--rot:2deg;--retraso:-3s}
.burbuja .wa{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:#2E7D32;font-size:12px;margin-bottom:4px}
.burbuja .wa svg{width:14px;height:14px}

/* ---------- Guías ---------- */
.guia-mini::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);background-size:26px 26px;pointer-events:none}
.guia-mini{box-shadow:0 0 0 1px rgba(21,101,192,.12),0 24px 44px -24px rgba(13,43,85,.5)}

@media (prefers-reduced-motion:reduce){.flota,.burbuja,.video-play::before,.video-play::after{animation:none!important}}


/* ajustes 3.ª vuelta */
.ctl-osc{clip-path:inset(-400px -60px 0 -60px round 0 0 16px 16px)}
.ctl-duo .t1{bottom:-90px}
.ctl-duo .t2{bottom:-120px}
.paso-vis .laptop img{max-height:none;width:100%}
.burbuja .wa{display:flex}
.celeste-img .flota.f1{top:46%}
.paso-vis .laptop{width:96%}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.flota{background:rgba(255,255,255,.9)}}
.portada{overflow:hidden}
@media (max-width:1240px){.video-sello{right:-8px}}
/* ================= responsive ================= */
@media (max-width:1280px){
  .celeste{padding:64px 32px}
  .tu .c{grid-template-columns:1fr 420px}
  .sop .c{grid-template-columns:1fr 520px}
}
@media (max-width:1100px){
  .cab-nav{display:none}
  .cab-entrar{display:none}
  .cab-burg{display:flex}
  .como-g{grid-template-columns:1fr 1fr}
  .bento{grid-template-columns:1fr 1fr}
  .b-ancha{grid-column:span 2}
  .b-alta{grid-column:span 1;min-height:0}
  .b-alta:last-child{grid-column:span 2}
  .paso{grid-template-columns:360px 1fr;gap:40px}
}
@media (max-width:900px){
  .portada h1{font-size:54px}
  .h2{font-size:42px;letter-spacing:-1.2px}
  .dolor-g{grid-template-columns:1fr 1fr}
  .ctl-g{grid-template-columns:1fr}
  .ctl-osc{height:auto;padding:40px 32px 0;display:flex;flex-direction:column}
  .ctl-osc-txt{position:static}
  .ctl-osc-img{position:relative;width:100%;margin-top:24px}
  .tu .c,.sop .c{grid-template-columns:1fr}
  .tu-card{height:440px}
  .celeste{flex-direction:column}
  .celeste-img{width:100%;max-width:420px}
  .paso{grid-template-columns:1fr;gap:24px}
  .cta-osc{height:auto;min-height:477px;align-items:flex-start}
  .cta-osc .foto{width:100%;height:55%;opacity:.55}
  .gar-3{grid-template-columns:1fr}
  .gar-arcos{display:none}
  .gar-sello{position:static;transform:none;width:140px;margin:0 auto}
  .gar .h2{margin-top:20px}
  .guias-g{grid-template-columns:1fr}
  .sop .c{min-height:0;padding-top:64px;padding-bottom:64px}
}
@media (max-width:640px){
  .c{padding:0 16px}
  .cab{padding-top:8px}
  .cab-in{margin:0 16px;height:65px;padding:0 12px;background:#fff!important;box-shadow:inset 0 0 0 1px #fff,0 4px 14px rgba(21,101,192,.12)}
  .cab-logo img{height:30px}
  .cab-cta{min-height:44px;padding:8px 16px;font-size:14px;line-height:21px;border-radius:8px}
  .cab-cta svg{display:none}
  .espacio-cab{height:73px}
  .portada{padding:40px 0}
  .portada .centro{text-align:left}
  .sellos-pill{padding:8px 14px;gap:10px}
  .sellos-pill img{height:20px}
  .portada h1{font:700 32px/1.05 Inter,sans-serif;letter-spacing:-2px;margin-top:16px}
  .portada-sub{margin:16px 0 0;font:400 14px/21px Inter,sans-serif}
  .portada-checks{display:grid;gap:9px;list-style:none;padding:0;margin:16px 0 0}
  .portada-checks li{display:flex;gap:10px;align-items:center;font:500 14px/1.2 Inter,sans-serif;color:var(--gris-t)}
  .portada-checks svg{width:15px;height:15px;color:#1B9E5A;flex:none}
  .portada-ctas{flex-direction:column;gap:12px;margin-top:32px}
  .portada-ctas .btn{min-height:46px;padding:10px 0;font-size:16px;line-height:24px}
  .btn-sec{display:flex;align-items:center;justify-content:center;min-height:49px;border-radius:20px;background:var(--fondo);border:1px solid var(--borde);box-shadow:0 4px 10px rgba(0,0,0,.1),inset 0 2px 0 rgba(255,255,255,.1);color:var(--gris-t);text-decoration:none;font:500 18px/27px Inter,sans-serif}
  .video{margin-top:32px;border-radius:16px}
  .video-logo{height:18px;left:12px;top:12px}
  .video-sello{width:64px;right:6px;top:6px}
  .video-play{width:52px;height:52px;margin:-26px 0 0 -26px}
  .video-play svg{width:20px;height:20px}
  .video-tit{bottom:14px}
  .video-tit b{font-size:22px}
  .video-tit span{font-size:13px;margin-top:2px}
  .nota-mon{margin-top:20px;text-align:center}
  .h2{font-size:30px;line-height:1.15;letter-spacing:-1.2px}
  .lead{font-size:15px;line-height:1.55}
  .chip{font-size:13px;padding:5px 14px}
  .btn{width:100%;min-height:46px;padding:10px 0;font-size:16px;line-height:24px}
  .btn--b,.btn--g{min-height:56px;font-size:17px}
  .dolor{padding:80px 0}
  .dolor-g{grid-template-columns:1fr;margin-top:40px}
  .dolor-t{padding:24px}
  .dolor-t p{font-size:17px}
  .control{padding:48px 0}
  .control .h2{line-height:1.15;letter-spacing:-1.2px}
  .control .lead{font-size:15px;line-height:1.55}
  .ctl-osc{margin-top:48px;padding:28px 20px 0;border-radius:20px}
  .ctl-osc-bg{display:none}
  .ctl-marca{width:52px;height:52px}
  .ctl-osc h3,.ctl-c h3{font-size:28px;letter-spacing:-.8px}
  .ctl-c{padding:20px}
  .ctl-c--g{padding:20px 0}
  .ctl-c .img{height:220px}
  .ctl-c p{font-size:16px}
  .tu{padding:64px 0}
  .tu h2{font-size:32px}
  .tu-card{height:376px;border-radius:32px}
  .tu .btn-blanco{width:100%;justify-content:center}
  .como{padding:80px 0}
  .como .h2{font-size:30px;letter-spacing:-1.5px}
  .como-g{grid-template-columns:1fr;gap:32px;margin-top:40px}
  .como-t{min-height:0}
  .como-t svg{max-width:220px;margin:0 auto}
  .como-pill{margin-top:40px;padding:12px 16px;gap:12px}
  .como-pill p{font-size:15px;letter-spacing:-.3px}
  .buros{gap:18px;font-size:17px;flex-wrap:wrap}
  .celeste{padding:48px 16px 0}
  .celeste h2{font-size:34px;line-height:1.1;letter-spacing:-1px}
  .celeste-pill{width:100%;justify-content:center}
  .celeste-pill i{display:none}
  .celeste .btn{width:100%;min-height:60px;font-size:16px}
  .func{padding:80px 0}
  .func .h2{font-size:34px}
  .func .lead{font-size:16px;line-height:1.5}
  .bento{grid-template-columns:1fr}
  .b-ancha,.b-alta,.b-alta:last-child{grid-column:span 1;grid-template-columns:1fr;min-height:0}
  .b{padding:32px}
  .b h3{font-size:28px;letter-spacing:-.78px}
  .b p{font-size:16px;line-height:1.55}
  .empieza{padding:80px 0}
  .empieza .h2{font-size:30px;letter-spacing:-1.2px}
  .empieza .lead{font-size:15px;line-height:1.55}
  .paso-vis{height:300px;border-radius:30px}
  .paso-vis img{max-height:230px}
  .paso-t h3{font-size:26px;line-height:1.2}
  .paso-t p{font-size:16px;line-height:1.55}
  .cta-osc{padding:40px 24px;border-radius:30px;min-height:560px}
  .cta-osc h2{font-size:34px;letter-spacing:-1px}
  .cta-osc h2 .mini{width:42px;height:42px;vertical-align:-8px}
  .cta-osc h2 .mini svg{width:24px;height:24px}
  .cta-osc .foto{height:46%}
  .gar{padding:48px 0 64px}
  .gar .h2{font-size:34px;letter-spacing:-.68px;line-height:1.15}
  .dolor-deco path,.dolor-deco circle{display:none}
  .gar-3 h3{font-size:26px;margin-top:20px}
  .gar-3 p{font-size:16px;line-height:1.5}
  .sop h2{font-size:35px;line-height:1.1;letter-spacing:-1px}
  .sop p{font-size:16px;line-height:1.5}
  .sop-ctas a{width:100%;justify-content:center}
  .sop-vis .marco{transform:none}
  .guias .h2{font-size:34px}
  .guias-g{gap:40px;margin-top:40px}
  .guia-mini{border-radius:24px}
  .guia-mini b{font-size:18px}
  .guia h3{font-size:22px;letter-spacing:-.8px}
}
@media (min-width:1600px){.c{max-width:1500px}}
/* 3.ª vuelta: tableta y móvil */
@media (max-width:1100px){
  .ctl-duo .t1{--tw:210px}
  .ctl-duo .t2{--tw:195px}
}
@media (max-width:900px){
  .ctl-osc{overflow:hidden;padding-bottom:0}
  .ctl-duo{position:relative;right:auto;bottom:auto;width:100%;height:420px;margin-top:10px}
  .ctl-duo .t1{--tw:200px;right:auto;left:8%;bottom:-40px}
  .ctl-duo .t2{--tw:185px;right:6%;bottom:-70px}
  .ctl-osc .flota.f1{left:auto;right:4%;top:auto;bottom:300px}
  .celeste-img .tel{--tw:220px}
  .tu-card{height:440px}
}
@media (max-width:640px){
  .video{aspect-ratio:auto;height:440px;margin-top:28px}
  .video-lienzo{border-radius:20px;box-shadow:0 0 0 6px rgba(255,255,255,.55),0 30px 70px -30px rgba(21,101,192,.7)}
  .v-laptop{left:5%;top:8%;width:74%}
  .v-tel{--tw:104px;right:4%;top:22%}
  .v-tel2{display:none}
  .video .flota.f2,.video .flota.f3{display:none}
  .video .flota.f1{left:4%;top:auto;bottom:128px}
  .video-play{width:76px;height:76px;margin:-38px 0 0 -38px}
  .video-play svg{width:28px;height:28px}
  .video-sello{width:80px;right:-6px;top:-26px}
  .video-tit{padding:56px 14px 18px;border-radius:0 0 20px 20px}
  .flota{font-size:12px;padding:8px 10px 8px 8px;gap:8px}
  .flota small{font-size:11px}
  .flota-ic{width:28px;height:28px;border-radius:8px}
  .flota-ic svg{width:15px;height:15px}
  .ctl-duo{height:360px}
  .ctl-duo .t1{--tw:160px;left:4%}
  .ctl-duo .t2{--tw:148px;right:2%}
  .ctl-osc .flota.f1{right:2%;bottom:250px}
  .ctl-c .flota.f1{left:0;top:2%}
  .ctl-c .flota.f2{right:0}
  .tu-card{height:380px}
  .tu-card .flota.f1{left:-4px;top:8%}
  .tu-card .flota.f2{right:-4px}
  .tu-card .flota.f3{display:none}
  .celeste-img .tel{--tw:200px}
  .celeste-img .flota.f1{left:-4px}
  .celeste-img .flota.f2{right:-4px}
  .paso-vis .flota.f1{right:-4px;top:4%}
  .paso-vis .flota.f2{left:-4px;bottom:4%}
  .burbuja{max-width:210px;font-size:13px}
  .burbuja.b1{left:-4px;top:-10px}
  .burbuja.b2{right:-4px;bottom:-14px}
  .ilus .num{left:10px;top:10px}
}