/* =====================================================================
   Tema azul para páginas internas (unidades, Nosotros, Blog, artículos,
   DataCommerce). Misma línea gráfica del home: fondo blanco, títulos azul
   marino, acentos azul eléctrico. Se carga después de site.css y de la hoja
   propia de cada página; todo va bajo body.azul.
   ===================================================================== */
body.azul{
  --az:#0B3BE6; --az-hover:#0830C4; --az-2:#2E6BFF; --az-3:#5B8CFF;
  --navy:#0B1B4D; --ink:#1F2B4D; --muted:#56627F;
  --tint:#F3F6FE; --tint-2:#E8EEFD; --line:#DCE4F7;
  --shadow:0 18px 40px -22px rgba(11,43,160,.35);
  --base:#fff; --base2:#fff; --panel-bg:#fff;
  --text:var(--navy); --plata:var(--muted); --rgb-fg:11,27,77;
  --violet:var(--az); --purple:var(--az-2); --magenta:var(--az-3);
  color:var(--ink);
}
html[data-theme="light"] body.azul{background:#fff}
/* Cada unidad tenía su propio color: ahora todas usan el azul de marca */
body.azul,.azul [class*="u-"]{--accent:var(--az)}
.azul *{--post-ac:var(--az)!important;--mc:var(--az)!important}
.azul .eyebrow{color:var(--az)}
.azul .arr{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .2s var(--ease)}
.azul a:hover .arr{transform:translateX(3px)}

/* ---------- Header (igual al home) ---------- */
.azul header{background:rgba(255,255,255,.92);border-bottom:1px solid var(--line)}
.azul .nav{height:72px}
.azul .dslogo-img{height:30px}
.azul .navlinks{gap:clamp(16px,2.2vw,30px);font-size:14px;color:var(--ink);margin-inline-end:10px}
.azul .navlinks a{position:relative;padding:6px 0;white-space:nowrap}
.azul .navlinks a:hover{color:var(--az)}
.azul .navlinks a.is-active{color:var(--navy);font-weight:600}
.azul .navlinks a.is-active::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;border-radius:2px;background:var(--az)}
.azul .nav-cta{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:var(--az);border:none;color:#fff;font-size:14px;font-weight:600;padding:11px 22px;box-shadow:0 8px 20px -10px rgba(11,59,230,.7)}
.azul .nav-cta:hover{background:var(--az-hover);border:none}
.azul .cta-short{display:none}
@media (max-width:640px){.azul .nav{height:62px}.azul header .dslogo-img{height:22px}.azul .nav-cta{padding:9px 16px;font-size:13px}}
@media (max-width:420px){.azul header .dslogo-img{height:18px}.azul .nav-cta{padding:8px 13px;font-size:12.5px}.azul .nav-cta .arr{display:none}}
@media (max-width:400px){.azul .cta-long{display:none}.azul .cta-short{display:inline}}
html{scroll-padding-top:80px}

/* ---------- Botones ---------- */
.azul .btn{border-radius:999px}
.azul .btn-accent,.azul .btn-primary{background:var(--az);color:#fff;box-shadow:0 10px 24px -12px rgba(11,59,230,.8)}
.azul .btn-accent:hover,.azul .btn-primary:hover{background:var(--az-hover);box-shadow:0 14px 30px -12px rgba(11,59,230,.85)}

/* ---------- Hero de unidad ---------- */
.azul .unit-hero::before{filter:hue-rotate(-18deg) saturate(.9)}
.azul .unit-hero::after{background:
  linear-gradient(180deg,rgba(6,26,94,.28) 0%,rgba(6,26,94,.62) 55%,rgba(5,20,80,.92) 100%),
  linear-gradient(90deg,rgba(11,59,230,.5) 0%,transparent 65%)}
.azul .num-big{background:linear-gradient(120deg,var(--az),var(--az-2));border-color:rgba(255,255,255,.4);box-shadow:0 10px 28px -10px rgba(11,59,230,.8)}
.azul .unit-hero .chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.45)}
.azul .acronym-sub{color:#CFDCFF}

/* ---------- Cuerpo de unidad ---------- */
.azul .unit-body{background:#fff}
.azul .rail-head .t{color:var(--az)}
.azul .rail-head .t b{color:var(--navy);font-size:clamp(22px,2.4vw,28px)}
.azul .rail-btn{border-color:var(--line);background:#fff;color:var(--az)}
.azul .rail-btn:hover{background:var(--az);border-color:var(--az);color:#fff}
.azul .rail{scrollbar-color:var(--az) var(--tint-2)}
.azul .rail::-webkit-scrollbar-thumb{background:var(--az)}
.azul .tema{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.azul .tema:hover{border-color:var(--az-2);box-shadow:0 24px 44px -24px rgba(11,43,160,.5)}
.azul .tema h4{color:var(--navy)}
.azul .tema p{color:var(--muted)}
.azul .tema .ic{background:var(--tint-2)}
.azul .tema .ic svg{stroke:var(--az)}
.azul .tema .brands{color:var(--muted);border-top-color:var(--line)}
.azul .tema .abrir{color:var(--az);font-weight:600}
.azul .tema-thumb{border-color:var(--line)}
.azul .tema-thumb.badge{background:linear-gradient(145deg,var(--az-2),var(--az))}
.azul .brands-row .lbl,.azul .owners-box .lbl{color:var(--az)}
.azul .blogo{border-color:var(--line)}
.azul .blogo:hover{box-shadow:var(--shadow)}
.azul .brand-tag{border-color:var(--line);color:var(--muted)}
.azul .owners-box{background:var(--tint);border-color:var(--line)}
.azul .avatar{border-color:var(--az);background:var(--tint-2)}
.azul .owner .r{color:var(--muted)}
.azul .owner a.n:hover{color:var(--az)}
/* Caja de cierre: banda azul como el contacto del home */
.azul .cta-box{border:none;color:#fff;background:
  radial-gradient(60% 90% at 80% 10%,rgba(91,140,255,.5),transparent 70%),
  linear-gradient(120deg,#0A2A9E 0%,var(--az) 55%,var(--az-2) 100%);box-shadow:0 26px 50px -28px rgba(11,43,160,.7)}
.azul .cta-box h4{color:#fff}
.azul .cta-box p{color:rgba(255,255,255,.86)}
.azul .cta-box .btn-accent{background:#fff;color:var(--az);box-shadow:none}
.azul .cta-box .btn-accent:hover{background:var(--tint-2)}

/* Secciones profundas (páginas de marca, espacios, CMI) */
.azul .deep-section{border-top-color:var(--line)}
.azul .deep-eyebrow{color:var(--az)}
.azul .deep-title{color:var(--navy);font-size:clamp(23px,2.4vw,30px)}
.azul .spec-card,.azul .brand-cards .bc,.azul .stat-card,.azul .marca-ficha{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .spec-card:hover,.azul .brand-cards .bc:hover,.azul .marca-ficha:hover{border-color:var(--az-2)}
.azul .spec-card h5{border-left-color:var(--az)}
.azul .stat-card .n{color:var(--az);font-weight:700}
.azul .flow-box{background:var(--tint);border-color:var(--line)}
.azul .flow-arrow{color:var(--az)}
.azul .marca-ficha .mf-chip{background:var(--tint);border-color:var(--line)}
.azul .section-banner,.azul .media-fig,.azul .hotspot-wrap{border-color:var(--line)}
.azul .hotspot-dot{background:var(--az);box-shadow:0 0 0 6px rgba(11,59,230,.25)}
.azul .hotspot-dot .hotspot-tip{background:var(--navy)}
.azul .unit-card{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .unit-card::before{background:var(--az)}

/* ---------- Modal de temas ---------- */
.azul .tm-overlay,.azul .city-modal-overlay{background:rgba(6,20,70,.55)}
.azul .tm-modal,.azul .city-modal{background:#fff;border-color:var(--line);box-shadow:0 40px 90px -30px rgba(6,20,70,.6)}
.azul .tm-eyebrow{color:var(--az)}
.azul .tm-title{color:var(--navy)}
.azul .tm-item{border-color:var(--line);background:var(--tint)}
.azul .tm-item h5{color:var(--navy)}
.azul .tm-close,.azul .city-modal-close{background:var(--tint);border-color:var(--line);color:var(--navy)}

/* ---------- Nosotros ---------- */
.azul .sec-head h2{color:var(--navy)}
.azul .mv-card,.azul .mv-card.vision{background:linear-gradient(160deg,var(--tint),#fff);border-color:var(--line);box-shadow:var(--shadow)}
.azul .mv-card .tag,.azul .mv-card.vision .tag{color:var(--az);background:var(--tint-2);border-color:transparent}
.azul .pillar{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .pillar:hover{border-color:var(--az-2)}
.azul .pillar .ic{background:var(--tint-2)}
.azul .pillar .ic svg{stroke:var(--az)}
.azul .why{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .map-row::before{background-image:linear-gradient(90deg,rgba(11,59,230,.45) 40%,transparent 0)}
.azul .city .cdot{background:var(--az);box-shadow:0 0 0 5px rgba(11,59,230,.14)}
.azul .city-cobertura .cdot,.azul .city-cobertura:hover .cdot{background:#fff;border-color:var(--az);box-shadow:none}

/* ---------- Blog y artículos ---------- */
.azul .blog-list{background:#fff}
.azul .post-card{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .post-card:hover{border-color:var(--az-2);box-shadow:0 26px 50px -26px rgba(11,43,160,.5)}
.azul .post-card h3{color:var(--navy)}
.azul .post-card .go{font-weight:600}
.azul .post-banner-photo::after{background:linear-gradient(180deg,rgba(6,26,94,0) 50%,rgba(6,26,94,.55) 100%),linear-gradient(100deg,rgba(11,59,230,.28),transparent 55%)}
.azul .post-banner-photo img{filter:hue-rotate(-14deg)}
.azul .blog-article-body{background:#fff;padding-top:160px}
.azul .post-head h1,.azul .post-head h2{color:var(--navy)}
.azul .post-body h4{color:var(--navy)}
.azul .post-body .callout{background:var(--tint);border-color:var(--line)}
.azul .post-table th{background:var(--tint)}
.azul .post-table-wrap{border-color:var(--line)}
.azul .post-cta{background:var(--tint);border-color:var(--line)}
.azul .post-cta .btn-outline{font-family:var(--font-display);font-weight:600;font-size:14px;border-width:1.5px}
.azul .breadcrumb .current{color:var(--navy)}
.azul .promo-banner::before{background:linear-gradient(0deg,rgba(6,20,70,.88),rgba(6,20,70,.15))}

/* ---------- DataCommerce ---------- */
.azul .dc-toolbar{top:72px;background:rgba(255,255,255,.96);border-bottom-color:var(--line)}
@media (max-width:640px){.azul .dc-toolbar{top:62px}}
.azul .dc-search,.azul .dc-pill,.azul .dc-selects select{background:var(--tint);border-color:var(--line)}
.azul .dc-pill.active{background:var(--az);border-color:var(--az)}
.azul .dc-card{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.azul .dc-card:hover{border-color:var(--az-2);box-shadow:0 26px 50px -26px rgba(11,43,160,.5)}
.azul .dc-card .dc-imgwrap{background:#fff}
.azul .dc-cart-drawer,.azul .dc-cmp-modal{background:#fff;border-color:var(--line)}

/* ---------- Footer (igual al home) ---------- */
.azul .foot{padding:28px 0 22px;background:#fff;border-top:1px solid var(--line);text-align:left}
.azul .foot-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px 28px}
.azul .foot .dslogo-img{height:26px}
.azul .foot .weblink{margin-top:0;color:var(--navy);font-weight:600;font-family:var(--font-display)}
.azul .foot-links{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14px;color:var(--ink)}
.azul .foot-links a:hover{color:var(--az)}
.azul .foot .social{margin-top:0}
.azul .foot .social a{border-color:var(--line)}
.azul .foot .social svg{fill:var(--az)}
.azul .foot .social a:hover{background:var(--az);border-color:var(--az)}
.azul .foot .social a:hover svg{fill:#fff}
.azul .foot .fine2{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:11.5px;text-align:center}
@media (max-width:760px){.azul .foot-row{justify-content:center;text-align:center}}
