/* ===========================================================
   Técnicos Línea Blanca Bogotá — hoja de estilos única
   Sin frameworks ni fuentes externas: 0 peticiones de terceros
   =========================================================== */
:root{
  --azul:#0b4a8f; --azul-900:#062f5c; --azul-700:#0d5aa9; --azul-100:#e7f0fa; --azul-50:#f4f8fd;
  --naranja:#f26a1b; --naranja-700:#d3560d; --naranja-100:#fff0e6;
  --verde:#0f9d58; --verde-wa:#25d366; --verde-700:#0b7c45;
  --tinta:#12232e; --gris:#4a5b68; --gris-2:#6b7c89; --linea:#dfe6ec;
  --blanco:#fff; --fondo:#f7f9fb;
  --radio:14px; --radio-s:10px;
  --sombra:0 1px 2px rgba(9,30,66,.06),0 6px 20px rgba(9,30,66,.07);
  --sombra-lg:0 10px 40px rgba(9,30,66,.14);
  --wrap:1180px;
  --fs:clamp(1rem,.96rem + .2vw,1.0625rem);
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:var(--sans);font-size:var(--fs);line-height:1.65;color:var(--tinta);background:var(--blanco);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul-700);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--naranja-700)}
h1,h2,h3,h4{line-height:1.22;margin:0 0 .6em;letter-spacing:-.015em;font-weight:800;text-wrap:balance}
h1{font-size:clamp(1.85rem,1.35rem + 2.2vw,3.05rem)}
h2{font-size:clamp(1.45rem,1.2rem + 1.15vw,2.15rem)}
h3{font-size:clamp(1.14rem,1.06rem + .38vw,1.35rem)}
p{margin:0 0 1.05em;text-wrap:pretty}
ul,ol{margin:0 0 1.1em;padding-left:1.15em}
li{margin-bottom:.42em}
strong{font-weight:700}
:focus-visible{outline:3px solid var(--naranja);outline-offset:2px;border-radius:4px}
.wrap{width:min(100% - 2.2rem,var(--wrap));margin-inline:auto}
.wrap.narrow{width:min(100% - 2.2rem,820px)}
.skip{position:absolute;left:-9999px;top:0;background:var(--azul);color:#fff;padding:.75rem 1.1rem;z-index:999;border-radius:0 0 8px 0}
.skip:focus{left:0}
.ico{width:24px;height:24px;flex:none}.ico-s{width:19px;height:19px;flex:none}.ico-xs{width:15px;height:15px;flex:none;vertical-align:-2px}

/* ---------- BOTONES ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:700;font-size:.95rem;
  padding:.72rem 1.15rem;border-radius:var(--radio-s);border:1px solid transparent;cursor:pointer;
  text-decoration:none;transition:transform .12s ease,box-shadow .2s ease,background .2s ease;line-height:1.2}
.btn:hover{transform:translateY(-1px);box-shadow:var(--sombra)}
.btn:active{transform:translateY(0)}
.btn-lg{padding:.95rem 1.6rem;font-size:1.03rem}
.btn-block{width:100%}
.btn-tel{background:var(--azul);color:#fff}
.btn-tel:hover{background:var(--azul-900);color:#fff}
.btn-wa{background:var(--verde-wa);color:#08351a}
.btn-wa:hover{background:#1eb955;color:#08351a}
.btn-naranja{background:var(--naranja);color:#fff;box-shadow:0 4px 14px rgba(242,106,27,.32)}
.btn-naranja:hover{background:var(--naranja-700);color:#fff}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.btn-out{background:#fff;color:var(--azul);border-color:var(--linea)}
.btn-out:hover{border-color:var(--azul);color:var(--azul-900)}

/* ---------- TOPBAR + HEADER ---------- */
.topbar{background:var(--azul-900);color:#c9dcf1;font-size:.815rem}
.topbar-in{display:flex;gap:1.6rem;justify-content:center;align-items:center;padding:.42rem 0;flex-wrap:wrap}
.topbar-item{display:inline-flex;align-items:center;gap:.36rem}
.site-header{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--linea);box-shadow:0 1px 12px rgba(9,30,66,.05)}
.header-in{display:flex;align-items:center;gap:1rem;padding:.62rem 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--tinta);margin-right:auto}
.brand-mark{width:41px;height:41px;flex:none}
.brand-txt{display:flex;flex-direction:column;line-height:1.16}
.brand-txt strong{font-size:1.03rem;letter-spacing:-.02em;font-weight:800}
.brand-txt em{font-style:normal;font-size:.735rem;color:var(--gris-2);letter-spacing:.01em}
.nav{order:3;width:100%;display:none}
.nav.open{display:block}
.nav>ul{list-style:none;margin:.5rem 0 .3rem;padding:0;display:flex;flex-direction:column;gap:.1rem}
.nav>ul>li>a{display:block;padding:.62rem .7rem;border-radius:8px;text-decoration:none;color:var(--tinta);font-weight:600;font-size:.94rem}
.nav>ul>li>a:hover{background:var(--azul-50);color:var(--azul-700)}
.nav>ul>li>a[aria-current=page]{color:var(--azul);background:var(--azul-100)}
.nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:40px;padding:0 10px;background:#fff;border:1px solid var(--linea);border-radius:9px;cursor:pointer}
.nav-toggle span{display:block;height:2px;background:var(--tinta);border-radius:2px;transition:.22s}
.nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.header-cta{display:flex;gap:.45rem}
.header-cta .btn span{display:none}
@media(min-width:600px){.header-cta .btn span{display:inline}}
@media(min-width:1060px){
  .nav{order:0;width:auto;display:block}
  .nav>ul{flex-direction:row;gap:.05rem;margin:0}
  .nav>ul>li>a{padding:.5rem .58rem;font-size:.865rem}
  .nav-toggle{display:none}
  .brand{margin-right:1rem}
}

/* ---------- BREADCRUMBS ---------- */
.crumbs{background:var(--azul-50);border-bottom:1px solid var(--linea);font-size:.82rem}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:.55rem 0}
.crumbs li{margin:0;display:flex;align-items:center;gap:.4rem;color:var(--gris-2)}
.crumbs li+li::before{content:"›";color:#a8b6c2}
.crumbs a{color:var(--gris);text-decoration:none}
.crumbs a:hover{color:var(--azul-700);text-decoration:underline}

/* ---------- HERO ---------- */
.hero{position:relative;background:linear-gradient(155deg,#0b4a8f 0%,#083a72 48%,#052a55 100%);color:#fff;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;background:
  radial-gradient(680px 340px at 88% 8%,rgba(242,106,27,.30),transparent 62%),
  radial-gradient(520px 300px at 5% 96%,rgba(37,211,102,.14),transparent 60%);pointer-events:none}
.hero-in{position:relative;z-index:1;display:grid;gap:2rem;padding:2.6rem 0 2.9rem}
@media(min-width:960px){.hero-in{grid-template-columns:1.06fr .94fr;align-items:center;padding:3.6rem 0 3.9rem;gap:3rem}}
.hero h1{color:#fff;margin-bottom:.5rem}
.hero h1 .hl{color:#ffc79a;display:block}
.lede{font-size:clamp(1.02rem,.98rem + .35vw,1.19rem);color:#d6e6f7;margin-bottom:1.35rem;max-width:60ch}
.lede-sm{color:var(--gris);max-width:72ch;margin-bottom:1.4rem}
.hero-btns{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1.35rem}
.hero-ticks{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
@media(min-width:520px){.hero-ticks{grid-template-columns:1fr 1fr}}
.hero-ticks li{display:flex;gap:.5rem;align-items:flex-start;color:#cfe1f4;font-size:.925rem;margin:0}
.hero-ticks svg{color:#7ee2a8;margin-top:3px}
.hero-card{background:#fff;color:var(--tinta);border-radius:var(--radio);padding:1.4rem;box-shadow:var(--sombra-lg)}
.hero-card h2{font-size:1.22rem;margin-bottom:.25rem}
.hero-card .mini{font-size:.87rem;color:var(--gris-2);margin-bottom:1rem}

/* ---------- TRUST ---------- */
.trust{background:var(--azul-50);border-bottom:1px solid var(--linea)}
.trust-in{display:grid;gap:1rem;padding:1.5rem 0;grid-template-columns:1fr}
@media(min-width:600px){.trust-in{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.trust-in{grid-template-columns:repeat(4,1fr)}}
.trust-item{display:flex;gap:.7rem;align-items:flex-start}
.trust-item svg{color:var(--azul);margin-top:2px}
.trust-item strong{display:block;font-size:.97rem;line-height:1.3}
.trust-item span{font-size:.845rem;color:var(--gris-2);line-height:1.4}

/* ---------- SECCIONES ---------- */
section{padding:2.9rem 0}
section.tight{padding:2rem 0}
.bg-gris{background:var(--fondo)}
.bg-azul{background:var(--azul-50)}
.sec-head{max-width:760px;margin-bottom:1.9rem}
.sec-head.center{margin-inline:auto;text-align:center}
.eyebrow{display:inline-block;font-size:.755rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--naranja-700);background:var(--naranja-100);padding:.3rem .68rem;border-radius:999px;margin-bottom:.7rem}
.eyebrow.on-dark{color:#ffd0ae;background:rgba(255,255,255,.12)}

/* ---------- GRIDS / CARDS ---------- */
.grid{display:grid;gap:1.05rem}
.g2{grid-template-columns:1fr}
.g3{grid-template-columns:1fr}
.g4{grid-template-columns:1fr 1fr}
@media(min-width:640px){.g2,.g3{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}}
.card{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:1.3rem;transition:border-color .18s,box-shadow .18s,transform .18s;position:relative}
.card:hover{border-color:#bfd4e8;box-shadow:var(--sombra);transform:translateY(-2px)}
.card h3{margin-bottom:.4rem}
.card p{color:var(--gris);font-size:.925rem;margin-bottom:.7rem}
.card .ico{color:var(--azul);background:var(--azul-100);width:44px;height:44px;padding:10px;border-radius:11px;margin-bottom:.8rem}
.card-link{font-weight:700;font-size:.9rem;text-decoration:none;display:inline-flex;gap:.3rem;align-items:center}
.card-link::after{content:"→";transition:transform .18s}
.card:hover .card-link::after{transform:translateX(3px)}
.card .precio{font-size:.85rem;color:var(--gris-2);display:block;margin-bottom:.7rem}
.card .precio b{color:var(--tinta);font-size:1.02rem}
.stretch::after{content:"";position:absolute;inset:0;border-radius:var(--radio)}

/* ---------- LISTAS DE CHEQUEO ---------- */
.checks{list-style:none;padding:0;display:grid;gap:.62rem}
@media(min-width:700px){.checks.c2{grid-template-columns:1fr 1fr;column-gap:1.6rem}}
.checks li{display:flex;gap:.6rem;align-items:flex-start;margin:0;font-size:.945rem;color:var(--gris)}
.checks svg{color:var(--verde);flex:none;margin-top:4px;width:18px;height:18px}

/* ---------- PROCESO ---------- */
.pasos{list-style:none;counter-reset:p;padding:0;display:grid;gap:1.1rem}
@media(min-width:760px){.pasos{grid-template-columns:repeat(4,1fr)}}
.pasos li{counter-increment:p;margin:0;padding-top:2.9rem;position:relative}
.pasos li::before{content:counter(p);position:absolute;top:0;left:0;width:2.3rem;height:2.3rem;display:grid;place-items:center;
  background:var(--naranja);color:#fff;font-weight:800;border-radius:50%;font-size:1.02rem}
.pasos li::after{content:"";position:absolute;top:1.15rem;left:2.7rem;right:-.6rem;height:2px;background:linear-gradient(90deg,var(--linea),transparent)}
.pasos li:last-child::after{display:none}
@media(max-width:759px){.pasos li::after{display:none}}
.pasos h3{font-size:1.05rem;margin-bottom:.3rem}
.pasos p{font-size:.9rem;color:var(--gris);margin:0}

/* ---------- MARCAS ---------- */
.logos{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}
@media(min-width:560px){.logos{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.logos{grid-template-columns:repeat(5,1fr)}}
.logos a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:#fff;border:1px solid var(--linea);
  border-radius:var(--radio-s);padding:1rem .6rem;min-height:104px;text-decoration:none;transition:.18s}
.logos a:hover{border-color:var(--azul);box-shadow:var(--sombra);transform:translateY(-2px)}
.logos img{max-height:40px;max-width:132px;width:auto;object-fit:contain;transition:transform .2s}
.logos a:hover img{transform:scale(1.06)}
.logos span{font-size:.78rem;font-weight:700;color:var(--gris)}

/* ---------- TABLAS ---------- */
.tabla-wrap{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--radio);background:#fff;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.91rem}
caption{text-align:left;padding:.9rem 1rem;font-weight:700;color:var(--gris);font-size:.88rem;border-bottom:1px solid var(--linea)}
th,td{padding:.72rem .95rem;text-align:left;border-bottom:1px solid var(--linea);vertical-align:top}
thead th{background:var(--azul-50);color:var(--azul-900);font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:#fbfcfe}
td .cod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;color:var(--azul);white-space:nowrap}
.precio-td{white-space:nowrap;font-weight:700;color:var(--verde-700)}

/* ---------- FAQ ---------- */
.faq-list{display:grid;gap:.6rem}
.faq-item{background:#fff;border:1px solid var(--linea);border-radius:var(--radio-s);overflow:hidden}
.faq-item[open]{border-color:#bfd4e8;box-shadow:var(--sombra)}
.faq-q{cursor:pointer;padding:.95rem 2.6rem .95rem 1.05rem;font-weight:700;list-style:none;position:relative;font-size:.99rem}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:"+";position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-size:1.4rem;color:var(--azul);font-weight:400;line-height:1}
.faq-item[open] .faq-q::after{content:"−"}
.faq-q:hover{background:var(--azul-50)}
.faq-a{padding:0 1.05rem 1.05rem}
.faq-a p{margin:0;color:var(--gris);font-size:.93rem}

/* ---------- CTA BAND ---------- */
.cta-band{background:linear-gradient(135deg,var(--azul) 0%,var(--azul-900) 100%);color:#fff;padding:2.4rem 0}
.cta-in{display:grid;gap:1.35rem;align-items:center}
@media(min-width:900px){.cta-in{grid-template-columns:1.35fr .65fr}}
.cta-band h2{color:#fff;margin-bottom:.35rem;font-size:clamp(1.35rem,1.15rem + .8vw,1.85rem)}
.cta-band p{color:#cfe1f4;margin:0;font-size:.97rem}
.cta-btns{display:flex;flex-wrap:wrap;gap:.65rem}
@media(min-width:900px){.cta-btns{justify-content:flex-end}}

/* ---------- FORM ---------- */
.form-sec{background:var(--fondo)}
.form{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:1.4rem;box-shadow:var(--sombra)}
.f-row{display:grid;gap:.85rem;margin-bottom:.85rem}
@media(min-width:620px){.f-row{grid-template-columns:1fr 1fr}}
.f{display:block;margin-bottom:.85rem}
.f>span{display:block;font-size:.82rem;font-weight:700;margin-bottom:.32rem;color:var(--tinta)}
.f input,.f select,.f textarea{width:100%;padding:.7rem .8rem;border:1px solid #cfdae4;border-radius:9px;font:inherit;font-size:.94rem;background:#fff;color:var(--tinta)}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--azul);outline:2px solid rgba(11,74,143,.16);outline-offset:0}
.f input:invalid:not(:placeholder-shown){border-color:#e3675c}
.f textarea{resize:vertical;min-height:82px}
.f-check{display:flex;gap:.55rem;align-items:flex-start;font-size:.82rem;color:var(--gris);margin-bottom:1rem}
.f-check input{margin-top:3px;width:17px;height:17px;flex:none;accent-color:var(--azul)}
.hp{position:absolute!important;left:-9999px!important;opacity:0;height:0;width:0}
.form-note{font-size:.8rem;color:var(--gris-2);text-align:center;margin:.85rem 0 .3rem}
.form-alt{font-size:.85rem;text-align:center;margin:0;color:var(--gris)}
.form-ok{background:#e8f7ee;border:1px solid #9fdcb8;color:#0b5f36;padding:1.1rem;border-radius:var(--radio-s);font-weight:600;margin-bottom:1rem}
.form-err{background:#fdeceb;border:1px solid #f2b5b0;color:#93231b;padding:.75rem 1rem;border-radius:var(--radio-s);font-size:.88rem;margin-bottom:1rem}

/* ---------- RELACIONADOS ---------- */
.rel-list{list-style:none;padding:0;display:grid;gap:.7rem}
@media(min-width:700px){.rel-list{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.rel-list{grid-template-columns:repeat(3,1fr)}}
.rel-list a{display:block;background:#fff;border:1px solid var(--linea);border-radius:var(--radio-s);padding:.9rem 1rem;text-decoration:none;transition:.18s}
.rel-list a:hover{border-color:var(--azul);box-shadow:var(--sombra)}
.rel-list strong{display:block;color:var(--azul-900);font-size:.95rem;margin-bottom:.15rem}
.rel-list span{display:block;color:var(--gris-2);font-size:.845rem;line-height:1.45}

/* ---------- PROSA ---------- */
.prosa{max-width:76ch}
.prosa h2{margin-top:2.1rem}
.prosa h3{margin-top:1.5rem}
.prosa>p:first-child{font-size:1.06rem}
.nota{background:var(--azul-50);border-left:4px solid var(--azul);padding:1rem 1.15rem;border-radius:0 var(--radio-s) var(--radio-s) 0;margin:1.4rem 0}
.nota p:last-child{margin:0}
.nota strong{color:var(--azul-900)}
.aviso{background:var(--naranja-100);border-left:4px solid var(--naranja);padding:1rem 1.15rem;border-radius:0 var(--radio-s) var(--radio-s) 0;margin:1.4rem 0}
.aviso p:last-child{margin:0}
.chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.42rem;margin-bottom:1.2rem}
.chips li{margin:0}
.chips a,.chips span{display:inline-block;background:#fff;border:1px solid var(--linea);border-radius:999px;padding:.34rem .78rem;font-size:.83rem;text-decoration:none;color:var(--gris)}
.chips a:hover{border-color:var(--azul);color:var(--azul);background:var(--azul-50)}

/* ---------- FOOTER ---------- */
.site-footer{background:var(--azul-900);color:#b9cee5;padding:2.9rem 0 1rem;font-size:.885rem;margin-bottom:64px}
.footer-grid{display:grid;gap:1.9rem}
@media(min-width:700px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1040px){.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1.2fr}}
.site-footer h2{color:#fff;font-size:.93rem;text-transform:uppercase;letter-spacing:.07em;margin-bottom:.85rem}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.42rem}
.site-footer a{color:#b9cee5;text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline}
.footer-logo strong{color:#fff;font-size:1.05rem}
.footer-meta{font-size:.81rem;color:#8fa9c4}
.cols-2{columns:2;column-gap:1rem}
.ver-todo{font-weight:700;color:#ffc79a!important}
.footer-links{border-top:1px solid rgba(255,255,255,.11);margin-top:2rem;padding-top:1.1rem}
.footer-links ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.5rem 1.3rem;font-size:.83rem}
.footer-links li{margin:0}
.footer-legal{padding:.9rem 0 0;font-size:.765rem;color:#7e97b3;line-height:1.55}
.footer-lp{padding:2rem 0 1rem;text-align:center}
.footer-legal-lp{font-size:.78rem;color:#7e97b3}

/* ---------- STICKY CTA MÓVIL ---------- */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:70;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linea);
  box-shadow:0 -3px 16px rgba(9,30,66,.14);padding-bottom:env(safe-area-inset-bottom)}
.scta{display:flex;align-items:center;justify-content:center;gap:.45rem;padding:.95rem .5rem;font-weight:800;font-size:.94rem;text-decoration:none}
.scta-tel{background:var(--azul);color:#fff}
.scta-wa{background:var(--verde-wa);color:#08351a}
@media(min-width:1060px){.sticky-cta{display:none}.site-footer{margin-bottom:0}}

/* ---------- LANDING ADS ---------- */
body.lp .hero-in{padding:2.2rem 0 2.6rem}
.lp-header{background:#fff;border-bottom:1px solid var(--linea);padding:.7rem 0}
.lp-header-in{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.lp-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.2rem}
.lp-badge{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);color:#fff;font-size:.79rem;font-weight:700;padding:.32rem .7rem;border-radius:999px}
.testimonios{display:grid;gap:1rem}
@media(min-width:820px){.testimonios{grid-template-columns:repeat(3,1fr)}}
.testi{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:1.2rem}
.testi p{font-size:.92rem;color:var(--gris);font-style:italic}
.testi .stars{color:#f5a623;letter-spacing:2px;font-size:.9rem;margin-bottom:.5rem}
.testi cite{font-style:normal;font-weight:700;font-size:.87rem;color:var(--tinta);display:block}
.testi small{color:var(--gris-2);font-size:.79rem}

/* ---------- MISC ---------- */
.mapa-zonas{display:grid;grid-template-columns:repeat(2,1fr);gap:.55rem;list-style:none;padding:0}
@media(min-width:640px){.mapa-zonas{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.mapa-zonas{grid-template-columns:repeat(4,1fr)}}
.mapa-zonas a{display:flex;align-items:center;gap:.45rem;background:#fff;border:1px solid var(--linea);border-radius:var(--radio-s);
  padding:.68rem .8rem;text-decoration:none;color:var(--tinta);font-weight:600;font-size:.9rem;transition:.18s}
.mapa-zonas a:hover{border-color:var(--azul);background:var(--azul-50);color:var(--azul-900)}
.mapa-zonas svg{color:var(--naranja);width:16px;height:16px;flex:none}
.hidden{display:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.sticky-cta,.nav,.nav-toggle,.topbar,.cta-band,.form-sec{display:none!important}body{color:#000}}

/* ---------- COMPLEMENTOS ---------- */
.marcas-strip{background:linear-gradient(180deg,var(--azul-50),#fff);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.marcas-strip h2{font-size:clamp(1.25rem,1.1rem + .7vw,1.7rem)}
.footer-col ul{font-size:.87rem}
.footer-brand p{max-width:46ch;line-height:1.6}
.stretch-link{text-decoration:none;color:inherit}
.stretch-link::after{content:"";position:absolute;inset:0;border-radius:var(--radio)}
.stretch-link:hover{color:var(--azul-700)}
.card .card-link{position:relative;z-index:2}

/* ---------- AJUSTES DE COMPOSICIÓN ---------- */
.card{display:flex;flex-direction:column}
.card .precio{margin-top:auto;padding-top:.2rem}
.card .card-link{align-self:flex-start}
.card>h3+p+.card-link{margin-top:auto}
@media(min-width:1060px){
  .nav>ul>li>a{padding:.5rem .5rem;font-size:.845rem;white-space:nowrap}
  .header-in{flex-wrap:nowrap}
  .brand{margin-right:.6rem}
}
@media(min-width:1060px) and (max-width:1339px){
  .header-cta .btn{padding:.6rem .8rem}
  .header-cta .btn-wa span{display:none}
  .nav>ul>li>a{padding:.5rem .42rem;font-size:.825rem}
}
.btn{white-space:nowrap}
.brand-txt strong,.brand-txt em{white-space:nowrap}
@media(max-width:400px){.brand-txt em{display:none}}

/* ===========================================================
   BLOQUES ILUSTRADOS Y FONDOS DE COLOR
   =========================================================== */
.ilustra{padding:3.2rem 0}
.ilustra-in{display:grid;gap:2rem;align-items:center}
@media(min-width:900px){
  .ilustra-in{grid-template-columns:1fr 1fr;gap:3.2rem}
  .ilustra.invertido .ilustra-txt{order:2}
}
.ilustra-fig{margin:0;position:relative}
.ilustra-fig img{width:100%;height:auto;border-radius:var(--radio);display:block}
.ilustra-fig figcaption{font-size:.79rem;color:var(--gris-2);text-align:center;margin-top:.6rem}
.ilustra h2{margin-bottom:.7rem}
.ilustra p{color:var(--gris)}
.ilustra .checks{margin-top:1.2rem}
.ilustra-cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}

/* Sello flotante sobre la ilustración */
.sello{position:absolute;right:-6px;bottom:14px;background:#fff;border-radius:var(--radio-s);
  box-shadow:var(--sombra-lg);padding:.8rem 1rem;display:flex;align-items:flex-start;gap:.6rem;
  width:max-content;max-width:min(260px,86%)}
.sello svg{color:var(--verde);width:24px;height:24px;flex:none;margin-top:2px}
.sello strong{display:block;font-size:.9rem;line-height:1.2}
.sello span{display:block;font-size:.76rem;color:var(--gris-2);line-height:1.35}
@media(max-width:520px){.sello{right:8px;bottom:8px;padding:.6rem .7rem;max-width:190px}}

/* Fondos que rompen el blanco */
.bg-oscuro{background:linear-gradient(155deg,#0b4a8f 0%,#083a72 55%,#052a55 100%);color:#fff;position:relative;overflow:hidden}
.bg-oscuro::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(620px 320px at 92% 4%,rgba(242,106,27,.26),transparent 62%),
             radial-gradient(500px 280px at 4% 100%,rgba(37,211,102,.13),transparent 60%)}
.bg-oscuro>*{position:relative;z-index:1}
.bg-oscuro h2,.bg-oscuro h3{color:#fff}
.bg-oscuro p,.bg-oscuro li{color:#cfe1f4}
.bg-oscuro .lede-sm{color:#cfe1f4}
.bg-oscuro .eyebrow{color:#ffd0ae;background:rgba(255,255,255,.13)}
.bg-oscuro .pasos li::after{background:linear-gradient(90deg,rgba(255,255,255,.28),transparent)}
.bg-oscuro a{color:#ffc79a}
.bg-suave{background:linear-gradient(180deg,#fff 0%,var(--azul-50) 100%)}
.bg-crema{background:linear-gradient(180deg,var(--naranja-100) 0%,#fff 100%)}
.bg-azul-fuerte{background:var(--azul-100)}

/* Los logos dentro de tarjetas no deben estirarse con el flex del contenedor */
.card{align-items:stretch}
.card>img{align-self:flex-start;object-fit:contain;flex:none}
.card-logo{display:flex;align-items:center;justify-content:flex-start;height:56px;margin-bottom:.9rem}
.card-logo img{max-height:46px;width:auto;max-width:150px;object-fit:contain}
/* Logos cuadrados: necesitan más altura para pesar visualmente igual que los apaisados */
.card-logo{height:64px}
.card-logo img.logo-alto{max-height:62px;max-width:110px}
.logos img.logo-alto{max-height:60px}

/* ===========================================================
   MENÚ CON SUBMENÚS
   =========================================================== */
.nav-btn{display:flex;align-items:center;gap:.28rem;width:100%;padding:.62rem .7rem;background:none;border:0;
  font:inherit;font-weight:600;font-size:.94rem;color:var(--tinta);cursor:pointer;border-radius:8px;text-align:left}
.nav-btn:hover{background:var(--azul-50);color:var(--azul-700)}
.nav-btn.activa{color:var(--azul);background:var(--azul-100)}
.chev{width:15px;height:15px;flex:none;transition:transform .2s;margin-left:auto}
.nav-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.sub[hidden]{display:none}
.sub-in{display:grid;gap:.9rem}
.sub-col{min-width:0}
.sub-tit{font-size:.7rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--naranja-700);margin:0 0 .35rem}
.sub ul{list-style:none;margin:0;padding:0}
.sub li{margin:0}
.sub a{display:block;padding:.44rem .6rem;border-radius:7px;font-size:.875rem;font-weight:500;
  color:var(--gris);text-decoration:none;line-height:1.35}
.sub a:hover{background:var(--azul-50);color:var(--azul-700)}
.sub a[aria-current=page]{color:var(--azul);font-weight:700;background:var(--azul-100)}
.sub-pie{display:inline-flex;align-items:center;gap:.3rem;margin-top:.5rem;padding:.5rem .6rem;
  font-size:.83rem;font-weight:700;color:var(--azul-700);text-decoration:none}
.sub-pie:hover{color:var(--naranja-700)}

/* --- Móvil: el submenú se despliega en acordeón dentro del menú --- */
@media(max-width:1059px){
  .has-sub .sub{padding:.3rem 0 .5rem .8rem;border-left:2px solid var(--linea);margin:.1rem 0 .4rem .7rem}
  .sub-in{gap:.7rem}
}

/* --- Escritorio: panel flotante --- */
@media(min-width:1060px){
  .nav>ul{align-items:center}
  .has-sub{position:relative}
  .nav-btn{width:auto;padding:.5rem .5rem;font-size:.845rem;white-space:nowrap}
  .sub{position:absolute;top:calc(100% + .55rem);left:50%;transform:translateX(-50%) translateY(-6px);
    background:#fff;border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra-lg);
    padding:1.1rem 1.2rem .9rem;z-index:80;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease}
  .sub::before{content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%) rotate(45deg);
    width:12px;height:12px;background:#fff;border-left:1px solid var(--linea);border-top:1px solid var(--linea)}
  .sub[hidden]{display:block}                         /* se controla con opacidad, no con display */
  .has-sub:hover .sub,.has-sub:focus-within .sub,.nav-btn[aria-expanded="true"]+.sub{
    opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
  .sub-in{grid-auto-flow:column;grid-auto-columns:minmax(186px,1fr);gap:1.6rem}
  #sub-zonas .sub-in{grid-auto-columns:minmax(158px,1fr)}
  #sub-fallas .sub-in{grid-auto-columns:minmax(212px,1fr)}
  .sub-pie{border-top:1px solid var(--linea);width:calc(100% + 2.4rem);margin-left:-1.2rem;
    padding:.65rem 1.2rem 0;margin-top:.85rem;border-radius:0}
}

/* ---------- FORMULARIO WHATSAPP DEL HERO ---------- */
.form-wa{border:0;padding:0;box-shadow:none;background:none}
.form-wa .f{margin-bottom:.75rem}
.form-wa .btn{margin-top:.25rem}
.hero-card-marca{background:#fff;border-radius:var(--radio);padding:1.4rem;box-shadow:var(--sombra-lg);text-align:left}
.marca-hero-logo{max-height:56px;width:auto;max-width:160px;object-fit:contain;margin:0 auto 1.1rem;display:block}
.hero-card-marca h2{font-size:1.12rem}
.hero-card-marca .mini{font-size:.87rem;color:var(--gris-2);margin-bottom:1rem}

/* ---------- UTILIDADES (sustituyen estilos inline: permiten CSP sin unsafe-inline) ---------- */
.mt-1{margin-top:1rem}
.mt-2{margin-top:1.7rem}
.mt-3{margin-top:2.2rem}
.mx-auto{margin-inline:auto}
.tc{text-align:center}
.jc-center{justify-content:center}

/* Fotografías reales dentro del bloque ilustrado */
.ilustra-fig.es-foto img{border-radius:var(--radio);box-shadow:0 12px 36px rgba(9,30,66,.16);object-fit:cover;width:100%;height:auto}
.ilustra-fig picture{display:block}

/* ===========================================================
   MÓVIL: cabecera compacta
   Los CTA del encabezado duplicaban la barra fija inferior y
   empujaban el contenido 226 px hacia abajo. En móvil manda la
   barra inferior (siempre visible y al alcance del pulgar).
   =========================================================== */
@media(max-width:1059px){
  .header-cta{display:none}
  .header-in{padding:.5rem 0}   /* ojo: flex-wrap debe seguir en wrap, el nav baja a su propia fila */
  .brand-mark{width:38px;height:38px}
  .brand-txt strong{font-size:.98rem}
}
@media(max-width:660px){
  /* El horario también está en el pie, en Contacto y en el JSON-LD */
  .topbar-item + .topbar-item{display:none}
  .topbar-in{padding:.34rem 0;justify-content:center}
  .topbar{font-size:.78rem}
  .hero-in{padding:1.5rem 0 2.1rem}
  .eyebrow{font-size:.68rem;letter-spacing:.07em;padding:.28rem .6rem}
  .hero h1{font-size:clamp(1.72rem,1.3rem + 2vw,2.4rem)}
  .lede{font-size:1rem}
  section{padding:2.2rem 0}
}
@media(max-width:400px){
  .brand-txt strong{font-size:.92rem}
}

/* Al abrir el menú en móvil, los CTA reaparecen dentro de él (ancho completo) */
@media(max-width:1059px){
  .nav.open ~ .header-cta{
    display:grid;grid-template-columns:1fr 1fr;gap:.5rem;
    order:4;width:100%;margin:.2rem 0 .7rem;padding-top:.7rem;border-top:1px solid var(--linea)}
  .nav.open ~ .header-cta .btn{padding:.72rem .6rem}
  .nav.open ~ .header-cta .btn span{display:inline}
}