/* =====================================================================
   INTELCOBRO S.A. · Sistema de diseño
   Paleta tomada del logotipo oficial: rojo #D3372F · verde #7C9A5B · azul #2F4BA8
   ===================================================================== */

:root{
  --azul:#2F4BA8; --azul-700:#263E8C; --azul-900:#16255C;
  --rojo:#D3372F; --verde:#7C9A5B; --verde-700:#63804A;
  --acento:var(--azul);          /* cada sitio puede reasignarlo */
  --acento-2:var(--verde);

  --tinta:#131F38; --texto:#33425C; --suave:#6B7B95;
  --fondo:#FFFFFF; --fondo-2:#F4F7FB; --fondo-3:#EAF0F8;
  --linea:rgba(47,75,168,.15); --linea-2:rgba(47,75,168,.28);

  --sombra:0 1px 2px rgba(19,31,56,.04), 0 12px 28px -14px rgba(19,31,56,.18);
  --sombra-l:0 2px 4px rgba(19,31,56,.04), 0 28px 56px -22px rgba(19,31,56,.26);

  --h:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --b:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ancho:1180px;
  --pad:clamp(1.1rem,4vw,2.5rem);
  --r:14px; --r-l:22px; --r-x:30px;
  --e:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:92px}
body{
  margin:0;font-family:var(--b);font-size:16.5px;line-height:1.68;color:var(--texto);
  background:var(--fondo);-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{margin:0;font-family:var(--h);color:var(--tinta);line-height:1.16;letter-spacing:-.022em;font-weight:800}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2.5px solid var(--acento);outline-offset:3px;border-radius:6px}

.env{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:var(--pad)}
.saltar{position:fixed;top:10px;left:10px;z-index:200;padding:.7rem 1.1rem;border-radius:99px;
  background:var(--acento);color:#fff;font-weight:700;transform:translateY(-200%);transition:transform .2s var(--e)}
.saltar:focus{transform:none}

/* ---------- Cabecera ---------- */
.cab{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.cab.fija{border-bottom-color:var(--linea);box-shadow:0 6px 24px -18px rgba(19,31,56,.5)}
.cab-in{display:flex;align-items:center;gap:1rem;min-height:74px;padding-block:.6rem}
.marca{flex:none;display:flex;align-items:center}
.marca img{width:clamp(150px,22vw,208px)}
.menu{display:none}
@media(min-width:1180px){
  .menu{display:flex;align-items:center;gap:.15rem;margin-inline:auto}
  .menu a{padding:.55rem .66rem;border-radius:9px;font-size:.875rem;font-weight:600;color:var(--texto);
    white-space:nowrap;transition:color .2s,background-color .2s}
  .menu a:hover{color:var(--acento);background:var(--fondo-2)}
  .menu a.act{color:var(--acento)}
}
.cab-acc{margin-left:auto;display:flex;align-items:center;gap:.6rem}
@media(min-width:1180px){.cab-acc{margin-left:0}}
.hamb{display:grid;place-items:center;gap:5px;width:46px;height:46px;border-radius:11px;
  border:1px solid var(--linea-2);background:#fff;cursor:pointer}
.hamb span{display:block;width:19px;height:2px;border-radius:2px;background:var(--tinta);
  transition:transform .28s var(--e),opacity .2s}
.hamb.on span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamb.on span:nth-child(2){opacity:0}
.hamb.on span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:1180px){.hamb{display:none}}
.panel{position:fixed;inset:74px 0 0;z-index:79;background:#fff;padding:1.4rem var(--pad) 3rem;
  overflow-y:auto;opacity:0;pointer-events:none;transition:opacity .28s var(--e)}
.panel.on{opacity:1;pointer-events:auto}
.panel a{display:block;padding:1rem 0;font-family:var(--h);font-size:1.18rem;font-weight:700;
  color:var(--tinta);border-bottom:1px solid var(--linea)}
.panel .btn{margin-top:1.4rem;width:100%}


/* En pantallas pequeñas el CTA de la cabecera se oculta: ya está dentro del
   menú hamburguesa, y mantenerlo forzaba un ancho mínimo mayor que el del móvil. */
@media(max-width:639px){
  .cab-acc .btn{display:none}
  .marca img{width:clamp(128px,42vw,170px)}
}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;
  padding:.78rem 1.5rem;border-radius:11px;border:1.5px solid transparent;font-family:var(--h);
  font-weight:700;font-size:.95rem;cursor:pointer;text-align:center;white-space:nowrap;
  transition:transform .2s var(--e),box-shadow .25s var(--e),background-color .2s,border-color .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn-p{background:var(--acento);color:#fff;box-shadow:0 12px 26px -14px var(--acento)}
.btn-p:hover{background:var(--azul-700);box-shadow:0 18px 34px -14px var(--acento)}
.btn-v{background:var(--verde);color:#fff;box-shadow:0 12px 26px -14px var(--verde)}
.btn-v:hover{background:var(--verde-700)}
.btn-o{background:#fff;border-color:var(--linea-2);color:var(--tinta)}
.btn-o:hover{border-color:var(--acento);color:var(--acento)}
.btn-b{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.45);color:#fff}
.btn-b:hover{background:#fff;color:var(--azul-900);border-color:#fff}
.btn-sm{min-height:42px;padding:.55rem 1.1rem;font-size:.88rem}
.ic{width:1.1em;height:1.1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}

/* ---------- Bloques ---------- */
.sec{padding:clamp(3.4rem,7vw,5.8rem) 0}
.sec-gris{background:var(--fondo-2)}
.tit{max-width:760px;margin-bottom:clamp(1.8rem,4vw,2.8rem)}
.tit.c{margin-inline:auto;text-align:center}
.eti{display:inline-flex;align-items:center;gap:.5rem;padding:.34rem .85rem;border-radius:99px;
  background:color-mix(in srgb,var(--acento) 10%,transparent);color:var(--acento);
  font-size:.73rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.9rem}
.tit h2{font-size:clamp(1.65rem,4.2vw,2.5rem)}
.tit p{margin-top:.85rem;font-size:clamp(1rem,2.1vw,1.1rem);color:var(--suave)}

/* ---------- Portada ---------- */
.hero{position:relative;overflow:hidden;background:var(--fondo-2)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(60% 70% at 88% 0%, color-mix(in srgb,var(--acento) 15%,transparent) 0%, transparent 62%),
    radial-gradient(48% 60% at 4% 100%, color-mix(in srgb,var(--verde) 15%,transparent) 0%, transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--linea) 1px,transparent 1px),
                   linear-gradient(90deg,var(--linea) 1px,transparent 1px);
  background-size:62px 62px;
  -webkit-mask-image:radial-gradient(70% 60% at 70% 30%,#000,transparent 76%);
  mask-image:radial-gradient(70% 60% at 70% 30%,#000,transparent 76%)}
.hero-in{position:relative;z-index:1;display:grid;gap:clamp(2rem,5vw,3.4rem);align-items:center;
  padding:clamp(2.8rem,7vw,5rem) 0 clamp(3rem,7vw,5.4rem)}
@media(min-width:960px){.hero-in{grid-template-columns:1.08fr .92fr}}
.hero h1{font-size:clamp(2rem,5.4vw,3.35rem);letter-spacing:-.035em}
.hero h1 em{font-style:normal;color:var(--acento)}
.hero-baj{margin-top:1.1rem;font-size:clamp(1.02rem,2.3vw,1.18rem);color:var(--texto);max-width:52ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.hero-cta .btn{flex:1 1 auto;min-width:min(100%,230px)}
@media(min-width:560px){.hero-cta .btn{flex:0 0 auto;min-width:0}}
.hero-nota{display:flex;align-items:center;gap:.5rem;margin-top:1.4rem;font-size:.88rem;color:var(--suave)}
.hero-nota .ic{color:var(--verde);width:17px;height:17px}

/* tarjeta lateral de la portada */
.tarj-hero{background:#fff;border:1px solid var(--linea);border-radius:var(--r-x);
  box-shadow:var(--sombra-l);padding:clamp(1.4rem,3.4vw,2rem);display:grid;gap:1rem}
.tarj-hero h3{font-size:1.12rem}
.tarj-hero .lin{display:flex;gap:.85rem;align-items:flex-start;padding:.85rem 0;border-top:1px solid var(--linea)}
.tarj-hero .lin:first-of-type{border-top:0;padding-top:.2rem}
.tarj-hero .lin i{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:10px;
  background:color-mix(in srgb,var(--acento) 10%,transparent);color:var(--acento)}
.tarj-hero .lin b{display:block;font-family:var(--h);font-size:.95rem;color:var(--tinta)}
.tarj-hero .lin span{font-size:.88rem;color:var(--suave)}

/* ---------- Barra de confianza ---------- */
.conf{border-block:1px solid var(--linea);background:#fff}
.conf-in{display:grid;gap:1.4rem;padding:clamp(1.6rem,3.6vw,2.2rem) 0}
@media(min-width:700px){.conf-in{grid-template-columns:repeat(4,1fr)}}
.conf-i{display:flex;gap:.8rem;align-items:flex-start}
.conf-i .ic{width:22px;height:22px;color:var(--verde);margin-top:.2rem}
.conf-i b{display:block;font-family:var(--h);font-size:.98rem;color:var(--tinta)}
.conf-i span{font-size:.86rem;color:var(--suave);line-height:1.5}

/* ---------- Rejillas y tarjetas ---------- */
.rej{display:grid;gap:1.1rem}
.rej-2{grid-template-columns:1fr}
.rej-3{grid-template-columns:1fr}
.rej-4{grid-template-columns:1fr 1fr}
@media(min-width:700px){.rej-2{grid-template-columns:1fr 1fr}.rej-3{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.rej-3{grid-template-columns:repeat(3,1fr)}.rej-4{grid-template-columns:repeat(4,1fr)}}

.tarj{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.5rem 1.4rem;
  display:grid;align-content:start;gap:.6rem;
  transition:transform .3s var(--e),box-shadow .3s var(--e),border-color .3s var(--e)}
.tarj:hover{transform:translateY(-4px);box-shadow:var(--sombra-l);border-color:var(--linea-2)}
.tarj i.tic{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;margin-bottom:.35rem;
  background:color-mix(in srgb,var(--acento) 10%,transparent);color:var(--acento)}
.tarj i.tic .ic{width:22px;height:22px}
.tarj h3{font-size:1.08rem}
.tarj p{font-size:.94rem;color:var(--suave)}
.tarj ul.pun{display:grid;gap:.35rem;margin-top:.35rem}
.tarj ul.pun li{position:relative;padding-left:1.15rem;font-size:.9rem;color:var(--suave)}
.tarj ul.pun li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;
  background:var(--verde)}

/* ---------- Proceso ---------- */
.paso{position:relative;background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.5rem 1.4rem}
.paso b.n{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;margin-bottom:.85rem;
  background:var(--acento);color:#fff;font-family:var(--h);font-size:.95rem;font-weight:800}
.paso h3{font-size:1.04rem;margin-bottom:.35rem}
.paso p{font-size:.92rem;color:var(--suave)}

/* ---------- Franja oscura ---------- */
.oscuro{position:relative;overflow:hidden;color:#EAF0FA;
  background:linear-gradient(140deg,var(--azul-900) 0%,var(--azul-700) 55%,var(--azul) 100%)}
.oscuro::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:radial-gradient(50% 60% at 85% 10%, rgba(124,154,91,.32), transparent 62%),
             radial-gradient(45% 55% at 8% 95%, rgba(211,55,47,.22), transparent 62%)}
.oscuro h2,.oscuro h3{color:#fff}
.oscuro .eti{background:rgba(255,255,255,.14);color:#DCE6FA}
.oscuro .tit p{color:#C3D0E8}
.oscuro .env{position:relative;z-index:1}
.caja-o{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:var(--r-l);
  padding:1.5rem 1.4rem;display:grid;gap:.5rem;align-content:start}
.caja-o i.tic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;margin-bottom:.4rem;
  background:rgba(255,255,255,.14);color:#fff}
.caja-o i.tic .ic{width:21px;height:21px}
.caja-o p{font-size:.93rem;color:#C3D0E8}

/* ---------- Sectores ---------- */
.sect{display:flex;flex-wrap:wrap;gap:.6rem}
.sect li{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.05rem;border-radius:99px;
  background:#fff;border:1px solid var(--linea);font-size:.9rem;font-weight:600;color:var(--texto);
  transition:border-color .25s,transform .25s var(--e)}
.sect li:hover{border-color:var(--acento);transform:translateY(-2px)}
.sect li .ic{width:17px;height:17px;color:var(--acento)}

/* ---------- Deudor / canales ---------- */
.pago{display:grid;gap:1.1rem}
@media(min-width:860px){.pago{grid-template-columns:1.05fr .95fr;align-items:start}}
.pasos-n{display:grid;gap:.75rem;counter-reset:p}
.pasos-n li{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start;background:#fff;
  border:1px solid var(--linea);border-radius:var(--r);padding:.95rem 1.05rem}
.pasos-n li::before{counter-increment:p;content:counter(p,decimal-leading-zero);
  display:grid;place-items:center;width:30px;height:30px;border-radius:8px;
  background:color-mix(in srgb,var(--acento) 12%,transparent);color:var(--acento);
  font-family:var(--h);font-size:.8rem;font-weight:800}
.pasos-n b{display:block;font-family:var(--h);font-size:.97rem;color:var(--tinta)}
.pasos-n span{font-size:.9rem;color:var(--suave)}

/* ---------- Preguntas ---------- */
.faq{display:grid;gap:.7rem;max-width:860px}
.faq details{background:#fff;border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;
  transition:border-color .25s,box-shadow .25s}
.faq details[open]{border-color:var(--linea-2);box-shadow:var(--sombra)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;
  padding:1.05rem 1.25rem;font-family:var(--h);font-weight:700;font-size:1rem;color:var(--tinta);
  list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:11px;height:11px;border-right:2.2px solid var(--acento);
  border-bottom:2.2px solid var(--acento);transform:rotate(45deg) translateY(-3px);transition:transform .28s var(--e)}
.faq details[open] summary::after{transform:rotate(225deg) translateY(-3px)}
.faq .cnt{padding:0 1.25rem 1.15rem;font-size:.95rem;color:var(--suave)}

/* ---------- Formulario ---------- */
.form{display:grid;gap:.9rem}
.campo{display:grid;gap:.35rem}
.campo label{font-size:.85rem;font-weight:700;color:var(--tinta);font-family:var(--h)}
.campo input,.campo select,.campo textarea{
  width:100%;padding:.8rem .95rem;border-radius:11px;border:1.5px solid var(--linea-2);
  background:#fff;font:inherit;font-size:.95rem;color:var(--tinta);transition:border-color .2s,box-shadow .2s}
.campo textarea{min-height:118px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--acento);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--acento) 14%,transparent)}
.dos{display:grid;gap:.9rem}
@media(min-width:620px){.dos{grid-template-columns:1fr 1fr}}
.aviso{display:flex;gap:.6rem;align-items:flex-start;font-size:.83rem;color:var(--suave);line-height:1.55}
.aviso input{margin-top:.28rem;width:17px;height:17px;flex:none;accent-color:var(--acento)}
.aviso a{color:var(--acento);font-weight:600;text-decoration:underline;text-underline-offset:2px}

.contacto{display:grid;gap:1.6rem}
@media(min-width:900px){.contacto{grid-template-columns:1.05fr .95fr}}
.datos{display:grid;gap:.15rem;align-content:start}
.dato{display:flex;gap:.9rem;align-items:flex-start;padding:.95rem 0;border-bottom:1px solid var(--linea)}
.dato i{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:11px;
  background:color-mix(in srgb,var(--acento) 10%,transparent);color:var(--acento)}
.dato b{display:block;font-family:var(--h);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;
  color:var(--suave);margin-bottom:.15rem}
.dato span,.dato a{font-size:1rem;color:var(--tinta);font-weight:600;word-break:break-word}
.dato a:hover{color:var(--acento)}

/* ---------- Pie ---------- */
.pie{background:var(--azul-900);color:#B9C7E4;padding:clamp(2.6rem,6vw,4rem) 0 1.6rem;font-size:.92rem}
.pie-in{display:grid;gap:2rem}
@media(min-width:820px){.pie-in{grid-template-columns:1.6fr 1fr 1fr}}
.pie-logo{background:#fff;border-radius:12px;padding:.7rem .9rem;width:fit-content;margin-bottom:1rem}
.pie-logo img{width:190px}
.pie h4{color:#fff;font-size:.78rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.9rem}
.pie a{color:#B9C7E4;transition:color .2s}
.pie a:hover{color:#fff}
.pie-l{display:grid;gap:.1rem;align-content:start}
.pie-l a{padding:.35rem 0}
.pie-b{margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.16);
  display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;justify-content:space-between;font-size:.84rem;color:#93A5C9}
.legal-nota{margin-top:1rem;font-size:.83rem;color:#93A5C9;line-height:1.6;max-width:62ch}


/* Los correos largos no deben forzar el ancho mínimo de la página en móvil */
.pie a,.pie p,.legal-nota,.doc a,.doc li,.dato a,.dato span,.accion .via span{overflow-wrap:anywhere}

/* ---------- Flotante WhatsApp ---------- */
.wa{position:fixed;right:16px;bottom:16px;z-index:70;display:grid;place-items:center;width:56px;height:56px;
  border-radius:50%;background:#25D366;color:#fff;box-shadow:0 12px 28px -10px rgba(37,211,102,.7);
  transition:transform .25s var(--e)}
.wa:hover{transform:scale(1.07)}
.wa svg{width:29px;height:29px;fill:#fff;stroke:none}

/* ---------- Aparición al hacer scroll ---------- */
.ap{opacity:0;transform:translateY(20px);transition:opacity .7s var(--e),transform .7s var(--e);
  transition-delay:var(--d,0s)}
.ap.vis{opacity:1;transform:none}

/* ---------- Páginas legales ---------- */
.doc{max-width:820px;padding-block:clamp(2.4rem,6vw,4rem)}
.doc h1{font-size:clamp(1.7rem,4.4vw,2.4rem);margin-bottom:.6rem}
.doc .act{font-size:.88rem;color:var(--suave);margin-bottom:2rem}
.doc h2{font-size:1.2rem;margin:2.2rem 0 .7rem}
.doc h3{font-size:1.02rem;margin:1.4rem 0 .45rem}
.doc p{margin-bottom:.9rem}
.doc ul.li{display:grid;gap:.45rem;margin:.3rem 0 1.1rem}
.doc ul.li li{position:relative;padding-left:1.25rem}
.doc ul.li li::before{content:"";position:absolute;left:.15rem;top:.68em;width:6px;height:6px;
  border-radius:50%;background:var(--acento)}
.doc a{color:var(--acento);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.doc .caja{background:var(--fondo-2);border:1px solid var(--linea);border-radius:var(--r);
  padding:1.1rem 1.25rem;margin:1.2rem 0}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .ap{opacity:1!important;transform:none!important}
}

@media print{
  .cab,.panel,.wa,.hero-cta,.form,.hamb{display:none!important}
  body{font-size:11pt;color:#000}
  .sec{padding:12px 0}
  .oscuro{background:#fff!important;color:#000}
  .oscuro h2,.oscuro h3{color:#000}
}


/* =====================================================================
   intelcobrogestion.com · variaciones propias de este sitio
   ===================================================================== */
:root{ --acento:#2F4BA8; --acento-2:#7C9A5B; }

/* Portada oscura */
.hero.osc{background:linear-gradient(145deg,#0E1830 0%,#18294F 46%,#22377A 100%);color:#C7D4EC}
.hero.osc::before{background:
  radial-gradient(52% 62% at 88% 2%, rgba(124,154,91,.30) 0%, transparent 62%),
  radial-gradient(46% 58% at 0% 100%, rgba(64,102,214,.42) 0%, transparent 64%)}
.hero.osc::after{opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.10) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.10) 1px,transparent 1px)}
.hero.osc h1{color:#fff}
.hero.osc h1 em{color:#A8CE7F}
.hero.osc .eti{background:rgba(255,255,255,.14);color:#DCE6FA}
.hero.osc .hero-baj{color:#C3D0E8}
.hero.osc .hero-baj strong{color:#fff}
.hero.osc .hero-nota{color:#A5B6D6}
.hero.osc .hero-nota .ic{color:#A8CE7F}
.hero.osc .tarj-hero{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);
  box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.hero.osc .tarj-hero h3{color:#fff}
.hero.osc .tarj-hero .lin{border-color:rgba(255,255,255,.14)}
.hero.osc .tarj-hero .lin i{background:rgba(255,255,255,.13);color:#fff}
.hero.osc .tarj-hero .lin b{color:#fff}
.hero.osc .tarj-hero .lin span{color:#B0C0DC}

/* Banda de capacidades operativas */
.kpi{display:grid;gap:1rem;grid-template-columns:1fr 1fr}
@media(min-width:860px){.kpi{grid-template-columns:repeat(4,1fr)}}
.kpi div{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.3rem 1.2rem}
.kpi b{display:block;font-family:var(--h);font-size:clamp(1.05rem,2.6vw,1.3rem);color:var(--acento);
  letter-spacing:-.02em;margin-bottom:.2rem}
.kpi span{font-size:.88rem;color:var(--suave);line-height:1.5}

/* Tabla de alcance del servicio */
.tabla{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--linea);
  border-radius:var(--r-l);overflow:hidden;font-size:.93rem}
.tabla th,.tabla td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--linea);vertical-align:top}
.tabla thead th{background:var(--fondo-3);font-family:var(--h);font-size:.78rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta)}
.tabla tbody tr:last-child td{border-bottom:0}
.tabla td:first-child{font-weight:600;color:var(--tinta)}
.tabla .si{color:var(--verde-700);font-weight:700}
.tabla-env{overflow-x:auto;border-radius:var(--r-l)}


/* =====================================================================
   Bloques añadidos: ficha de la compañía, misión/visión/valores,
   oficinas e ilustraciones de servicio
   ===================================================================== */

/* ---------- Sobre la compañía ---------- */
.sobre{display:grid;gap:clamp(1.8rem,4vw,3rem);align-items:center}
@media(min-width:980px){.sobre{grid-template-columns:1.02fr .98fr}}
.sobre-img{width:100%;height:auto}

.ficha{border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;background:#fff;
  box-shadow:var(--sombra);margin-top:1.4rem}
.ficha dl{margin:0;display:grid;grid-template-columns:1fr}
@media(min-width:520px){.ficha dl{grid-template-columns:minmax(120px,auto) 1fr}}
.ficha dt{padding:.8rem 1.1rem;font-size:.72rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--suave);background:var(--fondo-2);border-bottom:1px solid var(--linea)}
.ficha dd{margin:0;padding:.8rem 1.1rem;font-size:.94rem;color:var(--tinta);border-bottom:1px solid var(--linea);
  overflow-wrap:anywhere}
.ficha dd b{font-weight:700;letter-spacing:.02em}
.ficha dd a{color:var(--acento);font-weight:600}
.ficha .ult{border-bottom:0}
@media(max-width:519px){.ficha dt{border-bottom:0;padding-bottom:.2rem;background:#fff}}

/* ---------- Misión · Visión · Valores (como las placas de la oficina) ---------- */
.mvv{display:grid;gap:1.1rem}
@media(min-width:860px){.mvv{grid-template-columns:repeat(3,1fr)}}
.placa{position:relative;overflow:hidden;border-radius:var(--r-l);padding:1.9rem 1.7rem;color:#fff;
  display:grid;align-content:start;gap:1rem;box-shadow:var(--sombra-l)}
.placa::after{content:"";position:absolute;right:-84px;bottom:-104px;width:250px;height:250px;border-radius:50%;
  border:28px solid rgba(255,255,255,.09);pointer-events:none}
.placa-m{background:linear-gradient(150deg,#DC3C33,#AE2A22)}
.placa-v{background:linear-gradient(150deg,#8C9140,#6B7030)}
.placa-l{background:linear-gradient(150deg,#3B3FAE,#242785)}
.placa h3{position:relative;color:#fff;font-size:1.45rem;letter-spacing:.07em;text-transform:uppercase;
  padding-left:1rem;line-height:1}
.placa h3::before{content:"";position:absolute;left:0;top:-.05em;bottom:-.05em;width:4px;background:rgba(0,0,0,.4)}
.placa p{position:relative;font-size:.97rem;line-height:1.64;color:rgba(255,255,255,.95)}
.placa ul{position:relative;display:grid;gap:.5rem}
.placa li{display:flex;gap:.7rem;align-items:flex-start;font-size:.97rem;color:rgba(255,255,255,.95)}
.placa li::before{content:"";flex:none;width:9px;height:9px;margin-top:.5em;background:rgba(255,255,255,.8)}

/* ---------- Oficinas ---------- */
.ofis{display:grid;gap:1.2rem}
@media(min-width:820px){.ofis{grid-template-columns:1fr 1fr}}
.ofi{overflow:hidden;border-radius:var(--r-l);border:1px solid var(--linea);background:#fff;
  box-shadow:var(--sombra);transition:transform .3s var(--e),box-shadow .3s var(--e)}
.ofi:hover{transform:translateY(-4px);box-shadow:var(--sombra-l)}
.ofi img{width:100%;height:180px;object-fit:cover;display:block}
.ofi-c{padding:1.3rem 1.4rem;display:grid;gap:.35rem}
.ofi-c h3{font-size:1.1rem}
.ofi-c p{font-size:.93rem;color:var(--suave)}
.ofi-c .ref{font-size:.85rem;font-style:italic}

/* ---------- Ilustración dentro de la tarjeta ---------- */
.tarj img.ilus{width:100%;height:auto;border-radius:13px;margin-bottom:.5rem}