/* TenmaHealth · sistema de diseño. Los componentes C1 a C18 del brief, definidos una sola vez. */



:root{

--bg:#FFFFFF;--bg-2:#F4F7FB;--bg-3:#E9F0F9;--deep:#08172B;--deep-2:#0E2542;

--ink:#08172B;--body:#3C4F68;--muted:#6C7E96;--line:#DDE5EF;

--blue:#1257CE;--blue-700:#0E46A8;--blue-200:#BCD3F6;--blue-100:#DFE9FB;

--turq:#0C7B85;--turq-soft:#E6F4F5;

--signal:#DD6323;--ok:#0F8A6A;

--sans:'Inter','Segoe UI',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;

}

*{box-sizing:border-box}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{margin:0;background:#fff;color:var(--body);font:17px/1.62 var(--sans);-webkit-font-smoothing:antialiased}

img,svg{max-width:100%;display:block}

a{color:var(--blue)}

h1,h2,h3,h4{color:var(--ink);margin:0;line-height:1.14;letter-spacing:-.016em;font-weight:600}

h1{font-size:clamp(32px,4vw,52px)}

h2{font-size:clamp(26px,3.2vw,40px)}

h3{font-size:19px}

p{margin:0 0 1em}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px}

.wrap-s{max-width:880px}

.eyebrow{font:500 12px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--blue);margin:0 0 14px}

section{padding:80px 0}

.alt{background:var(--bg-2)}

.deep{background:var(--deep);color:#CFDCEC}

.deep h2,.deep h3,.deep h4{color:#fff}

.deep .eyebrow{color:var(--blue-200)}

.head{max-width:740px;margin-bottom:44px}

.head p{font-size:19px;margin-top:16px}

.btn{display:inline-block;padding:15px 26px;border-radius:9px;text-decoration:none;font:600 16px var(--sans);text-align:center;border:0;cursor:pointer}

.btn-p{background:var(--blue);color:#fff}

.btn-p:hover{background:var(--blue-700)}

.btn-s{border:1.5px solid var(--line);color:var(--ink);background:#fff}

.deep .btn-s{border-color:rgba(255,255,255,.28);color:#fff;background:transparent}

.btn:focus-visible{outline:3px solid var(--blue);outline-offset:3px}



/* C1 cabecera */

.nav{position:sticky;top:0;z-index:40;background:#ffffffee;backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}

section[id],header[id]{scroll-margin-top:86px}

.nav .wrap{display:flex;align-items:center;gap:14px;height:70px}

.brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none;min-width:0}

.brand img{height:24px;width:auto;max-width:170px;object-fit:contain}

.brand b{font-weight:600;color:var(--ink);font-size:18px}

.menu{display:flex;gap:20px;margin-left:auto;font-size:15px;font-weight:500}

.menu>div{position:relative}

.menu a,.menu button{color:var(--body);text-decoration:none;white-space:nowrap;background:none;border:0;font:500 15px var(--sans);cursor:pointer;padding:0}

.menu a:hover,.menu button:hover{color:var(--blue)}

.drop{position:absolute;top:32px;left:-16px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 44px rgba(8,23,43,.14);padding:10px;min-width:262px;display:none}

.menu>div:hover .drop,.menu>div:focus-within .drop{display:block}

.drop a{display:block;padding:9px 12px;border-radius:7px;font-weight:500;white-space:normal}

.drop a:hover{background:var(--bg-2)}

.tel{color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap}



/* C2 cabecera mínima */

.nav-min{border-bottom:1px solid var(--line);background:#fff}

.nav-min .wrap{display:flex;align-items:center;gap:16px;height:66px}

.nav-min .tel{margin-left:auto}



/* migas */

.miga{font-size:13px;color:var(--muted);padding:16px 0 0}

.miga a{color:var(--muted)}



/* C3 hero */

.hero{background:linear-gradient(180deg,#fff,var(--bg-2));padding:62px 0 70px}

.hg{display:grid;grid-template-columns:1.06fr .94fr;gap:54px;align-items:center}

.hg-top{align-items:start}

.hero h1 span{color:var(--blue)}

.lead{font-size:clamp(18px,1.9vw,21px);margin:20px 0 28px;max-width:580px}

.lead b{color:var(--ink);font-weight:600}

.acts{display:flex;gap:12px;flex-wrap:wrap}



/* C4 línea de confianza */

.trust{display:flex;flex-wrap:wrap;gap:8px 18px;font:500 13px var(--mono);color:var(--muted);margin:24px 0 0}

.trust span::before{content:'· ';color:var(--ok)}



/* C5 credibilidad */

.cred{display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:center;text-align:center}

.cred p{margin:0;font-size:17px;max-width:720px}

.sellos{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}

.sello{border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 16px;font:500 13px var(--mono);color:var(--ink);letter-spacing:.05em}



/* C6 tarjetas de dolor */

.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

.g2{display:grid;grid-template-columns:1fr 1fr;gap:26px}

.dol{background:#fff;border:1px solid var(--line);border-top:3px solid var(--signal);border-radius:12px;padding:26px}

.dol .k{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--signal);margin-bottom:10px}

.dol h3{margin-bottom:9px}

.dol p{font-size:16px;margin:0}



/* C7 pilares */

.pil{display:grid;grid-template-columns:repeat(5,1fr);border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.12)}

.p1{padding:26px 22px;border-right:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03)}

.p1:last-child{border-right:0}

.p1 b{display:block;font-size:19px;color:#fff;font-weight:600;margin-bottom:9px}

.p1 p{font-size:15px;margin:0;color:#AFC0D4}

.fija{margin:26px 0 0;font:500 14px var(--mono);color:var(--blue-200)}



/* C8 caso de uso */

.caso{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}

.caso+.caso{margin-top:20px}

.caso-h{padding:22px 26px 18px;border-bottom:1px solid var(--line)}

.caso-h .tag{display:inline-block;background:var(--turq-soft);color:var(--turq);font:500 11px var(--mono);letter-spacing:.07em;padding:5px 11px;border-radius:99px;margin-bottom:11px}

.caso-h h3{font-size:21px;margin:0}

.caso-b{display:grid;grid-template-columns:repeat(3,1fr)}

.cb{padding:22px 26px;border-right:1px solid var(--line)}

.cb:last-child{border-right:0}

.cb .t{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;margin:0 0 9px}

.cb.hoy{background:var(--bg-2)}

.cb.hoy .t{color:var(--muted)}

.cb.con .t{color:var(--blue)}

.cb.cambia{background:var(--turq-soft)}

.cb.cambia .t{color:var(--turq)}

.cb p{font-size:16px;margin:0;color:var(--body)}

.cb.cambia p{color:var(--ink);font-weight:600}



/* C9 panel de avisos */

.avisos{background:var(--deep);border-radius:13px;overflow:hidden;border:1px solid var(--deep-2);box-shadow:0 22px 54px rgba(8,23,43,.18)}

.av-top{padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.1);font:500 12px var(--mono);color:var(--blue-200);letter-spacing:.07em;display:flex;align-items:center;gap:9px}

.av-top i{width:7px;height:7px;border-radius:50%;background:var(--ok);font-style:normal;animation:lat 2.4s infinite}

@keyframes lat{0%,100%{opacity:1}50%{opacity:.3}}

.av{display:flex;gap:13px;align-items:flex-start;padding:15px 18px;border-bottom:1px solid rgba(255,255,255,.07);opacity:0;animation:entra .5s ease forwards}

.av:nth-child(2){animation-delay:.2s}.av:nth-child(3){animation-delay:.9s}

.av:nth-child(4){animation-delay:1.6s}.av:nth-child(5){animation-delay:2.3s}

@keyframes entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.av:last-child{border:0}

.av i{width:8px;height:8px;border-radius:50%;flex:none;margin-top:7px;font-style:normal}

.av b{display:block;color:#fff;font-size:15px;font-weight:600}

.av span{font-size:14px;color:#9FB2C9}



/* C10 tarjetas de segmento */

.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.s1{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;text-decoration:none;display:block;transition:border-color .15s,transform .15s}

.s1:hover{border-color:var(--blue);transform:translateY(-2px)}

.s1 b{display:block;color:var(--ink);font-size:18px;font-weight:600;margin-bottom:7px}

.s1 p{font-size:16px;margin:0 0 12px;color:var(--body)}

.s1 em{font-style:normal;color:var(--blue);font-weight:600;font-size:15px}



/* C11 lo que gana tu centro */

.gana{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}

.gn{border-top:3px solid var(--turq);padding-top:16px}

.gn b{display:block;color:var(--ink);font-size:17px;margin-bottom:7px;font-weight:600}

.gn p{font-size:15px;margin:0}



/* pasos numerados */

.pasos{list-style:none;counter-reset:s;padding:0;margin:0}

.pasos li{counter-increment:s;position:relative;padding:0 0 20px 58px;border-bottom:1px solid var(--line);margin-bottom:20px}

.pasos li:last-child{border:0;margin:0;padding-bottom:0}

.pasos li::before{content:counter(s);position:absolute;left:0;top:-2px;width:40px;height:40px;border-radius:10px;background:var(--blue);color:#fff;display:grid;place-items:center;font:600 17px var(--sans)}

.pasos b{display:block;font-size:19px;color:var(--ink);font-weight:600;margin-bottom:5px}

.pasos span{font-size:16px;color:var(--body)}



/* listas con check */

.checks{list-style:none;margin:0;padding:0}

.checks li{position:relative;padding:0 0 13px 30px;font-size:17px;color:var(--ink)}

.checks li::before{content:'';position:absolute;left:0;top:7px;width:15px;height:15px;border-radius:50%;background:var(--ok);box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 3px var(--ok)}

.checks b{font-weight:600}



/* C13 pioneros */

.pion{background:linear-gradient(120deg,var(--deep),var(--deep-2));border-radius:14px;padding:40px;color:#CFDCEC;display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center}

.pion h2{color:#fff;font-size:clamp(25px,3vw,34px)}

.pion p{margin:14px 0 0;font-size:17px;max-width:660px}

.plazas{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:99px;padding:6px 14px;font:500 12px var(--mono);color:#fff;margin-bottom:14px}



/* C14 diagnóstico */

.diag{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}

.canales{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0;padding:0;list-style:none}

.canales a{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:11px 16px;font:500 15px var(--sans);color:var(--ink);text-decoration:none;transition:border-color .15s,color .15s}

.canales a:hover{border-color:var(--blue);color:var(--blue)}

.canales i{font-style:normal;font-size:16px;line-height:1}

.cal{background:#fff;border:1px solid var(--line);border-radius:13px;padding:26px;box-shadow:0 20px 48px rgba(8,23,43,.10)}

.cal h3{margin-bottom:6px}

.cal .sub{font-size:15px;color:var(--muted);margin-bottom:18px}

.slot{border:1px solid var(--line);border-radius:8px;padding:13px 16px;margin-bottom:9px;display:flex;align-items:center;gap:12px;font-size:15px;color:var(--ink);cursor:pointer;text-decoration:none}

.slot:hover{border-color:var(--blue);background:var(--blue-100)}

.slot b{font-weight:600}

.slot span{margin-left:auto;font:500 12px var(--mono);color:var(--muted)}

.cal .nota{margin:16px 0 0;font-size:13px;color:var(--muted);text-align:center}



/* formularios */

label{display:block;font-size:13px;font-weight:600;color:var(--body);margin:0 0 6px}

input,select,textarea{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:9px;font:400 16px var(--sans);color:var(--ink);background:#fff}

input:focus,select:focus,textarea:focus{outline:3px solid rgba(18,87,206,.25);outline-offset:1px;border-color:var(--blue)}

.f+.f{margin-top:13px}

.f2{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:13px}

.f2 .f+.f{margin-top:0}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.consent{display:flex;gap:10px;align-items:flex-start;margin:18px 0 0;font-size:13px;line-height:1.45;color:var(--muted)}

.consent input{margin-top:3px;width:17px;height:17px;accent-color:var(--blue);flex:none}

.form-meta{margin:13px 0 0;font-size:13px;color:var(--muted);text-align:center}



/* C15 preguntas frecuentes */

details{border-bottom:1px solid var(--line);padding:18px 0}

summary{cursor:pointer;font-weight:600;font-size:17px;color:var(--ink);list-style:none;display:flex;gap:12px}

summary::-webkit-details-marker{display:none}

summary::before{content:'+';color:var(--blue);font-weight:600;flex:none}

details[open] summary::before{content:'\2212'}

details p{margin:12px 0 0 24px;font-size:16px}



/* C16 tabla comparativa */

.comp{width:100%;border-collapse:collapse;font-size:16px}

.tabla-caja{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 14px;overflow-x:auto}

.tabla-caja .comp{min-width:560px}

.comp th{text-align:left;font:600 14px var(--sans);color:var(--muted);padding:13px 16px;border-bottom:2px solid var(--line);background:#fff}

.comp td{padding:14px 16px;border-bottom:1px solid var(--line)}

.comp td:first-child{color:var(--ink);font-weight:600}

.comp td.hoy{color:var(--muted);background:var(--bg-2)}

.comp td.con{color:var(--ink)}



/* C17 barra móvil */

.barra{position:fixed;bottom:0;left:0;right:0;z-index:50;background:#fff;border-top:1px solid var(--line);padding:10px 14px;display:none;gap:10px;box-shadow:0 -6px 20px rgba(8,23,43,.10)}

.barra .btn-p{flex:1;padding:14px}

.barra .tel-ic{flex:none;width:52px;display:grid;place-items:center;border:1.5px solid var(--line);border-radius:9px;color:var(--ink);text-decoration:none;font-size:20px}



/* nota y cita */

.nota{margin:26px 0 0;font-size:16px;color:var(--muted);max-width:780px}

.cita{background:var(--deep);border-radius:14px;padding:38px;color:#CFDCEC}

.cita q{display:block;font-size:clamp(19px,2.2vw,24px);line-height:1.42;color:#fff;quotes:'\00ab' '\00bb'}

.cita footer{margin-top:16px;font:500 13px var(--mono);color:var(--blue-200)}



/* C18 pie */

.pie{background:#050E1B;color:#7E90A8;font-size:14px;padding:52px 0 28px}

.pie a{color:#A9BBD1;text-decoration:none}

.pie a:hover{text-decoration:underline}

.pie-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:28px}

.pie h4{font:500 11px var(--mono);letter-spacing:.1em;color:#5A6C84;margin:0 0 14px}

.pie ul{list-style:none;margin:0;padding:0}

.pie li{margin-bottom:9px}

.pie-legal{border-top:1px solid #16243A;margin-top:34px;padding-top:20px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:13px}

.pie-min{background:#050E1B;color:#7E90A8;font-size:13px;padding:28px 0;text-align:center}

.pie-min a{color:#A9BBD1}



/* ---- movimiento ---- */

[data-rev]{opacity:0;transform:translateY(22px);transition:opacity .62s cubic-bezier(.22,.8,.3,1),transform .62s cubic-bezier(.22,.8,.3,1)}

[data-rev].visto{opacity:1;transform:none}

[data-rev-hijos]>*{opacity:0;transform:translateY(18px);transition:opacity .55s cubic-bezier(.22,.8,.3,1),transform .55s cubic-bezier(.22,.8,.3,1)}

[data-rev-hijos].visto>*{opacity:1;transform:none}

[data-rev-hijos].visto>*:nth-child(2){transition-delay:.08s}

[data-rev-hijos].visto>*:nth-child(3){transition-delay:.16s}

[data-rev-hijos].visto>*:nth-child(4){transition-delay:.24s}

[data-rev-hijos].visto>*:nth-child(5){transition-delay:.32s}

[data-rev-hijos].visto>*:nth-child(6){transition-delay:.40s}



@keyframes flota{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}

@keyframes pulso{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.14;transform:scale(1.16)}}

@keyframes entra{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}



/* Enma */

.enma{position:relative;display:flex;justify-content:center;align-items:flex-end}

.enma img{width:100%;max-width:330px;height:auto;animation:flota 5.5s ease-in-out infinite;filter:drop-shadow(0 26px 34px rgba(8,23,43,.20))}

.enma::before{content:'';position:absolute;bottom:6px;width:56%;aspect-ratio:3/1;border-radius:50%;background:radial-gradient(closest-side,var(--blue-200),transparent);animation:pulso 5.5s ease-in-out infinite}

.enma-sm img{max-width:190px}

.enma-xs img{max-width:132px}

.enma-lado{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center}

.hero-vis{position:relative}

.hero-enma{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;margin-top:-14px;position:relative;z-index:3}

.hero-enma .enma{align-items:flex-end}

.hero-enma .enma img{max-width:112px;animation-duration:6.5s}

.hero-enma .enma::before{width:70%;bottom:2px}

.hero-enma .globo{font-size:15px;line-height:1.5;padding:13px 16px;max-width:none}



/* burbuja de Enma */

.globo{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 22px;box-shadow:0 14px 34px rgba(8,23,43,.10);font-size:16px;color:var(--ink);max-width:420px}

.globo::after{content:'';position:absolute;left:-9px;top:28px;width:16px;height:16px;background:#fff;border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}

.globo b{display:block;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--turq);margin-bottom:6px}



/* mosaico de capturas */

.mosaico{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

.mos{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .25s,box-shadow .25s}

.mos:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(8,23,43,.13)}

.mos img{width:100%;height:190px;object-fit:cover;object-position:top left;border-bottom:1px solid var(--line)}

.mos span{display:block;padding:15px 18px}

.mos b{display:block;color:var(--ink);font-size:16px;font-weight:600;margin-bottom:4px}

.mos p{margin:0;font-size:14.5px;line-height:1.5}



/* cifra grande */

.cifras{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}

.cif{padding:26px 24px;border-right:1px solid var(--line)}

.cif:last-child{border-right:0}

.cif b{display:flex;align-items:baseline;gap:1px;font:600 clamp(30px,3.5vw,42px)/1 var(--sans);color:var(--blue);letter-spacing:-.03em}

.cif b i{font-style:normal;font-variant-numeric:tabular-nums}

.cif b u{text-decoration:none;font-size:.46em;font-weight:600;margin-left:5px;letter-spacing:-.01em}

.cif>span{display:block;margin-top:11px;font-size:14.5px;line-height:1.48;color:var(--body)}

.deep .cifras{background:transparent;border-color:rgba(255,255,255,.14)}

.deep .cif{border-right-color:rgba(255,255,255,.14)}

.deep .cif b{color:#5C9BF5}

.deep .cif>span{color:#AFC0D4}



/* tarjeta de confianza */

.tr1{background:#fff;border:1px solid var(--line);border-top:3px solid var(--turq);border-radius:12px;padding:24px}

.tr1 .k{font:500 10.5px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--turq);margin:0 0 9px}

.tr1 h3{margin-bottom:8px;font-size:18px}

.tr1 p{font-size:15.5px;margin:0;line-height:1.55}



/* ecosistema */

.eco{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.ec{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s}

.ec:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(8,23,43,.14);border-color:var(--blue-200)}

.ec .et{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--turq);margin-bottom:12px;display:block}

.ec h3{margin-bottom:8px}

.ec p{font-size:15.5px;margin:0 0 14px;color:var(--body)}

.ec em{font-style:normal;font-weight:600;color:var(--blue);font-size:15px}



/* franja de urgencia */

.franja{background:var(--deep);color:#CFDCEC;padding:12px 0;font-size:14.5px}

.franja .wrap{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:center}

.franja b{color:#fff;font-weight:600}

.franja .it{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}

.franja .pt{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(15,138,106,.7);animation:latido 2s infinite;flex:none}

.franja .sep{opacity:.3}

.franja a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);white-space:nowrap}

.franja a:hover{border-bottom-color:#fff}

@keyframes latido{70%{box-shadow:0 0 0 10px rgba(15,138,106,0)}100%{box-shadow:0 0 0 0 rgba(15,138,106,0)}}



/* réplica de la plataforma: pestañas, tabla densa y aviso, como en el sistema real */

.app{background:#EEF3FA;border:1px solid var(--line);border-radius:13px;padding:13px;box-shadow:0 22px 50px rgba(8,23,43,.14)}

.app-tabs{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border-radius:9px;padding:5px;margin-bottom:11px}

.app-tabs span{text-align:center;padding:9px 4px;font:600 10.5px var(--sans);letter-spacing:.06em;color:var(--muted);border-radius:7px}

.app-tabs span.on{background:#EAF2FE;color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue-200)}

.app-tabs em{font-style:normal;margin-left:6px;background:var(--blue);color:#fff;border-radius:99px;font-size:9px;padding:1px 6px}

.app-tot{background:#fff;border-radius:8px;padding:9px 13px;font-size:12.5px;margin-bottom:9px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

.app-tot b{color:var(--ink)}

.app-scroll{background:#fff;border-radius:9px;overflow-x:auto}

.app-scroll table{width:100%;border-collapse:collapse;font-size:12.5px}

.app-scroll th{text-align:left;font:600 9.5px var(--sans);letter-spacing:.07em;color:#8494A8;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}

.app-scroll td{padding:9px 12px;border-bottom:1px solid #EFF3F8;color:var(--body);white-space:nowrap}

.app-scroll tr:last-child td{border-bottom:0}

.app-scroll tr.marca td{background:#FFF7F1}

.app-scroll .nom{color:var(--ink);font-weight:600}

.app-val{display:inline-block;background:#F1F5FA;border-radius:6px;padding:4px 10px;font-variant-numeric:tabular-nums;color:var(--ink)}

.app-sube{color:var(--signal);font-weight:600;font-variant-numeric:tabular-nums}

.chip{display:inline-block;border-radius:6px;padding:3px 9px;font:600 10px var(--sans)}

.chip-ok{background:#E3F4EE;color:#0F6B53}

.chip-av{background:#FDF0E7;color:#B44E17}

.chip-inf{background:#E8F0FE;color:#1147A6}

.chip-neu{background:#F4F7FB;color:#66788F}

.app-toast{display:flex;gap:11px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--signal);border-radius:9px;padding:12px 14px;margin-top:11px;box-shadow:0 10px 26px rgba(8,23,43,.10)}

.app-toast i{font-style:normal;color:var(--signal);font-size:15px;line-height:1.2}

.app-toast b{display:block;color:var(--ink);font-size:12.5px;margin-bottom:3px}

.app-toast p{margin:0;font-size:12px;line-height:1.5}

.app-cap{margin:12px 0 0;font-size:13.5px;color:var(--muted);text-align:center}



/* boletín */

.news{background:linear-gradient(120deg,var(--deep),var(--deep-2));border-radius:14px;padding:38px;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;color:#CFDCEC}

.news h2{color:#fff;font-size:clamp(23px,2.7vw,31px)}

.news p{margin:13px 0 0;font-size:16.5px}

.news form{display:grid;gap:10px}

.news input{width:100%;padding:14px 15px;border-radius:9px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:15px var(--sans)}

.news input::placeholder{color:#8FA3BD}

.news input:focus{outline:2px solid var(--blue-200);outline-offset:1px}

.news label{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:#A9BBD1}

.news label a{color:#fff}

.news .hp{position:absolute;left:-9999px}



.f2{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}

.hg>*,.f2>*,.g2>*,.diag>*,.news>*{min-width:0}



/* crecer y confianza */

.crece{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}

.c1{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;text-align:center;font-weight:600;color:var(--ink)}

.conf{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}

.cf{border-top:3px solid var(--blue);padding-top:16px}

.cf b{display:block;color:var(--ink);font-size:17px;margin-bottom:7px;font-weight:600}

.cf p{font-size:15px;margin:0}

.incluye{list-style:none;margin:24px 0 0;padding:0}

.incluye li{position:relative;padding:0 0 13px 30px;font-size:17px;color:var(--ink)}

.incluye li::before{content:'';position:absolute;left:0;top:7px;width:15px;height:15px;border-radius:50%;background:var(--ok);box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 3px var(--ok)}



@media (prefers-reduced-motion:reduce){

.av,[data-rev],[data-rev-hijos]>*{opacity:1;animation:none;transform:none;transition:none}

.av-top i,.enma img,.enma::before,.franja .pt{animation:none}

.s1:hover,.mos:hover,.ec:hover{transform:none}

}



@media (max-width:1040px){

.hg,.diag,.g2,.f2,.news{grid-template-columns:1fr;gap:34px}

.g3,.seg,.gana,.eco,.cifras,.conf{grid-template-columns:1fr 1fr}

.mosaico{grid-template-columns:1fr 1fr}

.crece{grid-template-columns:1fr 1fr}

.pil{grid-template-columns:1fr 1fr}

.p1{border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}

.pion{grid-template-columns:1fr}

.pie-grid{grid-template-columns:1fr 1fr}

.menu{display:none}

}

@media (max-width:620px){

section{padding:56px 0}

.g3,.seg,.gana,.caso-b,.f2,.mosaico,.eco,.conf,.crece{grid-template-columns:1fr}

.cifras{grid-template-columns:1fr 1fr}

.cif{border-bottom:1px solid var(--line)}

.cif:nth-child(2n){border-right:0}

.cif:nth-last-child(-n+2){border-bottom:0}

.pil{grid-template-columns:1fr}

.cb{border-right:0;border-bottom:1px solid var(--line)}

.acts .btn{width:100%}

.barra{display:flex}

body{padding-bottom:76px}

.wrap{padding:0 18px}

.pion{padding:28px}

.nav .btn-p{display:none}

.nav .wrap{justify-content:space-between}

.comp{font-size:15px}

.comp th,.comp td{padding:11px 10px}

.franja{font-size:13px;padding:10px 0}

.franja .wrap{gap:4px 14px}

.franja .sep{display:none}

.enma-lado{grid-template-columns:1fr;gap:16px;justify-items:center}

.globo::after{left:50%;top:-9px;margin-left:-8px;border:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}

}
