:root{--negro:#050505;--panel:#0d1118;--panel2:#121824;--azul:#1677ff;--azul2:#58a2ff;--blanco:#fff;--texto:#d8e0ec;--muted:#94a0b2;--borde:rgba(255,255,255,.11);--radio:20px;--contenedor:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--negro);color:var(--texto);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.65}body,button,input,textarea,select{font:inherit}img{display:block;max-width:100%}a{text-decoration:none;color:inherit}button{cursor:pointer}.contenedor{width:min(calc(100% - 40px),var(--contenedor));margin:auto}.seccion{padding:92px 0;background:var(--negro)}.seccion-gris,.proceso{background:#080b10}h1,h2,h3,p{margin-top:0}h2{margin-bottom:18px;color:#fff;font-size:clamp(32px,4vw,50px);line-height:1.1;letter-spacing:-1.5px}h3{color:#fff}.etiqueta{display:inline-block;margin-bottom:14px;color:var(--azul2);font-size:13px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}.etiqueta-clara{color:#8dbdff}.cabecera-seccion{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:42px}.cabecera-seccion>p{max-width:430px;color:var(--muted)}
.boton{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 23px;border:0;border-radius:11px;font-weight:750;transition:.25s}.boton:hover{transform:translateY(-2px)}.boton-primario{color:#fff;background:var(--azul);box-shadow:0 14px 36px rgba(22,119,255,.3)}.boton-secundario,.boton-secundario-oscuro{color:#fff;background:rgba(255,255,255,.04);border:1px solid var(--borde)}.boton-claro{color:#08111e;background:#fff}.boton-pequeno{min-height:42px;padding:0 17px;font-size:13px}.boton-texto{min-height:auto;padding:8px 0;color:var(--azul2);background:transparent}
/* PORTADA */
.hero-tech{position:relative;overflow:hidden;min-height:760px;padding:85px 0 0;background:radial-gradient(circle at 75% 38%,rgba(22,119,255,.24),transparent 32%),radial-gradient(circle at 8% 5%,rgba(0,174,255,.1),transparent 28%),#030303;color:#fff}.hero-tech-fondo{position:absolute;inset:0;opacity:.25;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(#000,transparent 93%)}.hero-tech-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:65px;min-height:585px}.hero-tech-contenido{max-width:700px}.hero-tech-etiqueta{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;color:#69abff;font-size:13px;font-weight:850;letter-spacing:1.5px;text-transform:uppercase}.hero-tech-etiqueta i{width:9px;height:9px;border-radius:50%;background:var(--azul);box-shadow:0 0 18px var(--azul)}.hero-tech h1{margin:0;color:#fff;font-size:clamp(46px,5vw,76px);line-height:1.03;letter-spacing:-3px}.hero-tech h1 strong{display:block;margin-top:8px;color:#338aff}.hero-tech-descripcion{max-width:650px;margin:28px 0 0;color:#b7c0cc;font-size:19px;line-height:1.8}.hero-tech-botones{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}.hero-tech-beneficios{display:flex;flex-wrap:wrap;gap:18px;margin-top:32px;color:#aeb7c4;font-size:13px}.hero-tech-beneficios span{display:flex;align-items:center;gap:7px}.hero-tech-imagen{position:relative;display:flex;align-items:center;justify-content:center;min-height:540px}.hero-tech-circulo{position:absolute;width:410px;height:410px;border:1px solid rgba(70,145,255,.2);border-radius:50%;background:radial-gradient(circle,rgba(25,115,255,.28),rgba(25,115,255,.07) 50%,transparent 70%);box-shadow:0 0 100px rgba(27,111,255,.15)}.robot-tech{position:relative;z-index:2;width:min(100%,310px);height:auto;max-height:420px;object-fit:contain;border-radius:25px;box-shadow:0 35px 80px rgba(0,0,0,.55),0 0 55px rgba(20,110,255,.16);animation:flotar 5s ease-in-out infinite}@keyframes flotar{50%{transform:translateY(-10px)}}.tarjeta-tech{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:12px 15px;border:1px solid var(--borde);border-radius:14px;background:rgba(10,13,18,.86);box-shadow:0 18px 40px rgba(0,0,0,.35);backdrop-filter:blur(14px)}.tarjeta-tech strong{color:#fff}.tarjeta-tech span{display:block;color:#94a0b0;font-size:11px}.tarjeta-experiencia{top:70px;right:5px}.tarjeta-experiencia strong{color:var(--azul2);font-size:22px}.tarjeta-marca{bottom:55px;left:0}.tarjeta-marca img{width:40px;height:40px;border-radius:9px;object-fit:cover}.hero-tech-estadisticas{position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px;border-top:1px solid var(--borde);background:rgba(5,5,5,.62)}.hero-tech-estadisticas>div{position:relative;padding:26px 23px}.hero-tech-estadisticas>div:not(:last-child):after{content:"";position:absolute;top:20px;right:0;bottom:20px;width:1px;background:var(--borde)}.hero-tech-estadisticas strong{display:block;color:#fff;font-size:26px}.hero-tech-estadisticas span{color:var(--muted);font-size:13px}
/* TARJETAS */
.rejilla-servicios{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.servicio,.sistema,.proyecto,.rejilla-testimonios blockquote,.beneficios>div,.linea-proceso>div{border:1px solid var(--borde);background:linear-gradient(145deg,var(--panel),#090d13);box-shadow:0 18px 45px rgba(0,0,0,.22)}.servicio{position:relative;min-height:270px;padding:29px;border-radius:var(--radio);transition:.25s}.servicio:hover,.sistema:hover,.proyecto:hover{transform:translateY(-5px);border-color:rgba(70,150,255,.4)}.servicio .numero{display:inline-block;margin-bottom:35px;color:var(--azul2);font-weight:850}.servicio p,.sistema p,.proyecto p,.dos-columnas p{color:var(--muted)}.servicio a{position:absolute;right:29px;bottom:25px;left:29px;color:var(--azul2);font-size:13px;font-weight:800}
.filtros{display:grid;grid-template-columns:1fr 260px;gap:12px;margin-bottom:25px}.filtros input,.filtros select,.formulario input,.formulario textarea,.formulario select{width:100%;min-height:49px;padding:11px 14px;border:1px solid var(--borde);border-radius:10px;color:#fff;background:#0b1018}.filtros input:focus,.filtros select:focus,.formulario input:focus,.formulario textarea:focus,.formulario select:focus{border-color:var(--azul);box-shadow:0 0 0 3px rgba(22,119,255,.13);outline:0}.rejilla-sistemas,.rejilla-proyectos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.sistema,.proyecto{overflow:hidden;border-radius:var(--radio);transition:.25s}.sistema-imagen,.proyecto-imagen{display:grid;place-items:center;height:210px;overflow:hidden;color:#fff;background:linear-gradient(135deg,#07182c,#124f96)}.sistema-imagen img,.proyecto-imagen img{width:100%;height:100%;object-fit:cover}.sistema-imagen span{font-size:60px;font-weight:900}.sistema-contenido,.proyecto>div:last-child{padding:24px}.sistema small,.proyecto small{color:var(--azul2);font-weight:800;text-transform:uppercase}.sistema ul{display:grid;gap:7px;padding:0;list-style:none}.sistema li{color:#b5bfcd;font-size:13px}.sistema li:before{content:"✓";margin-right:8px;color:var(--azul2)}.acciones-tarjeta{display:flex;justify-content:space-between;align-items:center;gap:10px}
/* SECCIONES */
.personalizada{background:radial-gradient(circle at 90% 0,rgba(22,119,255,.35),transparent 32%),linear-gradient(135deg,#05070b,#0a182b)}.personalizada-grid,.dos-columnas,.cotizacion-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.lista-funciones{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lista-funciones span{padding:13px 15px;border:1px solid var(--borde);border-radius:10px;background:rgba(255,255,255,.04)}.beneficios{display:grid;gap:12px}.beneficios>div{display:flex;align-items:center;gap:13px;min-height:62px;padding:15px 18px;border-radius:13px}.beneficios strong{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--azul2);background:rgba(22,119,255,.13)}.linea-proceso{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:38px}.linea-proceso>div{min-height:145px;padding:22px;border-radius:15px}.linea-proceso b{display:grid;place-items:center;width:38px;height:38px;margin-bottom:22px;border-radius:50%;color:#fff;background:var(--azul)}.linea-proceso span{display:block;color:#e1e8f2;font-weight:700}.proyecto-imagen{height:220px}.proyecto em{color:#7f8b9d;font-size:12px}.rejilla-testimonios{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}.rejilla-testimonios blockquote{margin:0;padding:27px;border-radius:var(--radio)}.estrellas{margin-bottom:15px;color:#ffb020}.rejilla-testimonios footer{display:grid}.rejilla-testimonios footer span{color:var(--muted);font-size:13px}
.faq-contenedor{max-width:900px}.acordeon{display:grid;gap:12px;margin-top:30px}.acordeon article{overflow:hidden;border:1px solid var(--borde);border-radius:13px;background:var(--panel)}.acordeon button{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:66px;padding:0 20px;border:0;color:#fff;background:transparent;text-align:left;font-weight:800}.acordeon button span{color:var(--azul2);font-size:24px}.acordeon article>div{display:none;padding:0 20px 18px}.acordeon article.activo>div{display:block}.acordeon p{margin:0;color:var(--muted)}
.cotizacion-grid{grid-template-columns:.8fr 1.2fr;align-items:start}.datos-contacto{display:grid;gap:7px;margin-top:28px}.datos-contacto p{margin:0;color:#aeb9c8}.formulario{display:grid;gap:16px;padding:31px;border:1px solid var(--borde);border-radius:var(--radio);background:var(--panel);box-shadow:0 25px 70px rgba(0,0,0,.3)}.formulario label{display:grid;gap:7px;color:#dce4ef;font-size:13px;font-weight:700}.formulario textarea{min-height:130px;resize:vertical}.campo-doble{display:grid;grid-template-columns:1fr 1fr;gap:14px}.campo-trampa{position:absolute;left:-9999px}.contacto-final{padding:75px 0;text-align:center;background:radial-gradient(circle at 80% 20%,rgba(22,119,255,.3),transparent 32%),#030405}.contacto-final h2{color:#fff}.contacto-final p{color:var(--muted)}
.modal{position:fixed;z-index:9999;inset:0;display:none;place-items:center;padding:20px;background:rgba(0,0,0,.75)}.modal.abierto{display:grid}.modal-contenido{position:relative;width:min(100%,520px);padding:30px;border:1px solid var(--borde);border-radius:18px;background:var(--panel);box-shadow:0 25px 80px rgba(0,0,0,.5)}.cerrar-modal{position:absolute;top:12px;right:14px;width:36px;height:36px;border:0;border-radius:50%;color:#fff;background:#202938;font-size:24px}
@media(max-width:1040px){.hero-tech-grid{grid-template-columns:1fr 390px;gap:35px}.robot-tech{width:min(100%,280px)}.hero-tech-circulo{width:350px;height:350px}.rejilla-servicios{grid-template-columns:repeat(2,1fr)}.rejilla-sistemas,.rejilla-proyectos,.rejilla-testimonios{grid-template-columns:repeat(2,1fr)}.linea-proceso{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.seccion{padding:72px 0}.cabecera-seccion{display:grid;gap:8px}.hero-tech{min-height:auto;padding-top:58px}.hero-tech-grid{grid-template-columns:1fr;gap:25px;min-height:auto}.hero-tech-contenido{text-align:center}.hero-tech-etiqueta,.hero-tech-botones,.hero-tech-beneficios{justify-content:center}.hero-tech h1{font-size:clamp(39px,10vw,58px);letter-spacing:-2px}.hero-tech-descripcion{margin-left:auto;margin-right:auto;font-size:17px}.hero-tech-imagen{min-height:420px}.robot-tech{width:min(75%,250px);max-height:340px}.hero-tech-circulo{width:300px;height:300px}.tarjeta-experiencia{top:42px;right:4%}.tarjeta-marca{bottom:32px;left:4%}.hero-tech-estadisticas{grid-template-columns:repeat(2,1fr)}.personalizada-grid,.dos-columnas,.cotizacion-grid{grid-template-columns:1fr;gap:40px}}
@media(max-width:620px){.contenedor{width:min(calc(100% - 28px),var(--contenedor))}.seccion{padding:60px 0}h2{font-size:34px}.hero-tech{padding-top:42px}.hero-tech h1{font-size:39px;line-height:1.08}.hero-tech-descripcion{font-size:16px}.hero-tech-botones{display:grid;width:100%}.hero-tech-beneficios{display:grid;gap:10px}.hero-tech-imagen{min-height:350px}.robot-tech{width:min(68%,210px);max-height:285px;border-radius:18px}.hero-tech-circulo{width:240px;height:240px}.tarjeta-tech{padding:9px 11px}.tarjeta-experiencia{top:28px;right:0}.tarjeta-marca{bottom:18px;left:0}.hero-tech-estadisticas,.rejilla-servicios,.rejilla-sistemas,.rejilla-proyectos,.rejilla-testimonios,.linea-proceso,.lista-funciones{grid-template-columns:1fr}.hero-tech-estadisticas>div{text-align:center;border-bottom:1px solid var(--borde)}.hero-tech-estadisticas>div:after{display:none}.filtros,.campo-doble{grid-template-columns:1fr}.formulario{padding:22px}.acciones-tarjeta{align-items:stretch;flex-direction:column}}

/* =========================================================
   ENCABEZADO Y PIE DE PÁGINA
   Compatibilidad con includes/header.php e includes/footer.php
========================================================= */
.encabezado{
  position:sticky;
  top:0;
  z-index:1000;
  width:100%;
  background:rgba(5,5,5,.94);
  border-bottom:1px solid var(--borde);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px)
}
.barra{
  min-height:78px;
  display:flex;
  align-items:center;
  gap:24px
}
.marca{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--blanco);
  flex-shrink:0
}
.marca-logo{
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.16)
}
.marca-texto{
  display:flex;
  flex-direction:column;
  line-height:1.05
}
.marca-texto strong{
  font-size:18px;
  color:var(--blanco)
}
.marca-texto small{
  margin-top:5px;
  color:var(--azul2);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase
}
.menu{
  display:flex;
  align-items:center;
  gap:21px;
  margin-left:auto
}
.menu a{
  position:relative;
  color:#c4cedc;
  font-size:13px;
  font-weight:700;
  transition:.22s ease
}
.menu a:hover{color:var(--blanco)}
.menu a:after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-9px;
  height:2px;
  background:var(--azul);
  transition:.22s ease
}
.menu a:hover:after{right:0}
.menu-boton{
  display:none;
  margin-left:auto;
  width:42px;
  height:42px;
  border:1px solid var(--borde);
  border-radius:10px;
  color:var(--blanco);
  background:var(--panel);
  font-size:22px
}
.header-whatsapp{
  color:#72d89f;
  font-size:13px;
  font-weight:800;
  white-space:nowrap
}
.barra-cta{white-space:nowrap}

.pie{
  padding:70px 0 22px;
  color:#aab6c6;
  background:#04070b;
  border-top:1px solid var(--borde)
}
.pie-grid{
  display:grid;
  grid-template-columns:1.8fr 1fr 1fr 1.25fr;
  gap:40px
}
.marca-pie{margin-bottom:18px}
.pie-grid>div:first-child p{max-width:360px}
.pie h3{
  margin:0 0 18px;
  color:var(--blanco);
  font-size:16px
}
.pie a,.pie p{
  display:block;
  margin:8px 0;
  color:#aab6c6;
  font-size:14px
}
.pie a:hover{color:var(--azul2)}
.pie-final{
  margin-top:42px;
  padding-top:22px;
  border-top:1px solid var(--borde);
  color:#7f8b9c;
  font-size:13px
}
.whatsapp-flotante{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:900;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  color:#fff;
  background:#16a66a;
  box-shadow:0 14px 38px rgba(22,166,106,.32);
  font-size:14px;
  font-weight:850
}
.whatsapp-flotante:hover{transform:translateY(-2px)}

@media(max-width:1040px){
  .menu{
    position:absolute;
    top:78px;
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    margin:0;
    padding:16px 20px 22px;
    background:#080b10;
    border-bottom:1px solid var(--borde)
  }
  .menu.activo{display:flex}
  .menu a{width:100%;padding:12px 0}
  .menu a:after{display:none}
  .menu-boton{display:inline-grid;place-items:center}
  .header-whatsapp,.barra-cta{display:none}
  .pie-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .barra{min-height:70px}
  .marca-logo{width:42px;height:42px}
  .marca-texto strong{font-size:17px}
  .marca-texto small{display:none}
  .menu{top:70px}
  .pie{padding-top:55px}
  .pie-grid{grid-template-columns:1fr;gap:28px}
  .whatsapp-flotante{right:12px;bottom:12px;min-height:44px;padding:0 16px;font-size:13px}
}

/* =========================================================
   CORRECCIÓN FAQ Y BLOQUE DE KITS
========================================================= */
.acordeon article > div{
  display:block;
  max-height:0;
  overflow:hidden;
  padding:0 20px;
  opacity:0;
  transition:max-height .32s ease, opacity .25s ease, padding .32s ease;
}
.acordeon article.abierto > div,
.acordeon article.activo > div{
  max-height:500px;
  padding:0 20px 20px;
  opacity:1;
}
.acordeon article.abierto button,
.acordeon article.activo button{
  color:var(--azul2);
}

.aviso-kits{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:10px 24px;
  margin:0 0 28px;
  padding:24px 26px;
  border:1px solid rgba(32,125,255,.28);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(32,125,255,.12),rgba(18,25,38,.92));
  box-shadow:0 16px 45px rgba(0,0,0,.18);
}
.aviso-kits strong{
  color:#fff;
  font-size:20px;
}
.aviso-kits p{
  grid-column:1;
  margin:0;
  color:var(--muted);
}
.aviso-kits .boton{
  grid-column:2;
  grid-row:1 / span 2;
  white-space:nowrap;
}

@media(max-width:760px){
  .aviso-kits{grid-template-columns:1fr}
  .aviso-kits p,.aviso-kits .boton{grid-column:1;grid-row:auto}
  .aviso-kits .boton{width:100%;margin-top:6px}
}

/* =========================================================
   CATÁLOGO COMERCIAL Y SISTEMAS A LA MEDIDA
========================================================= */
.subcabecera-catalogo{margin:34px 0 20px}.subcabecera-catalogo span{display:inline-block;margin-bottom:7px;color:var(--azul2);font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.subcabecera-catalogo h3{margin:0;color:#fff;font-size:clamp(24px,3vw,34px)}
.separador-catalogo{grid-column:1/-1;min-height:auto;border:1px solid rgba(32,125,255,.28);background:linear-gradient(135deg,rgba(32,125,255,.16),rgba(11,15,23,.96))}.separador-catalogo-contenido{padding:30px}.separador-catalogo span{color:var(--azul2);font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.separador-catalogo h3{margin:8px 0 10px;color:#fff;font-size:clamp(25px,3vw,36px)}.separador-catalogo p{max-width:850px;margin:0;color:var(--muted)}
.sistema-medida{border-color:rgba(32,125,255,.22)}.sistema-imagen-medida{position:relative;background:radial-gradient(circle at 70% 30%,rgba(48,139,255,.42),transparent 35%),linear-gradient(145deg,#0c1524,#111f35)}.sistema-imagen-medida small{position:absolute;right:14px;bottom:14px;padding:6px 9px;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#cfe2ff;background:rgba(0,0,0,.28);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.acciones-medida{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.boton-borde-claro{color:#fff;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.04)}.boton-borde-claro:hover{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.10)}
@media(max-width:680px){.separador-catalogo-contenido{padding:23px}.acciones-medida{display:grid}.acciones-medida .boton{width:100%}}


/* =========================================================
   REFERENCIAS DE CLIENTES
========================================================= */
.clientes-referencias{
  background:#fff;
  color:#101010;
  padding:72px 0 78px;
}
.clientes-referencias-cabecera{
  max-width:760px;
  margin:0 auto 52px;
  text-align:center;
}
.clientes-referencias-cabecera h2{
  margin:0;
  color:#0b0b0b;
  font-size:clamp(28px,3.5vw,42px);
  line-height:1.12;
  font-weight:850;
  letter-spacing:-.025em;
}
.clientes-referencias-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:54px 72px;
  align-items:center;
}
.cliente-referencia{
  min-height:145px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 24px;
}
.cliente-referencia img{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:135px;
  object-fit:contain;
  filter:none;
  transition:transform .25s ease,opacity .25s ease;
}
.cliente-referencia:hover img{
  transform:scale(1.045);
}
.cliente-referencia:nth-child(7){
  grid-column:2;
}
@media(max-width:820px){
  .clientes-referencias{padding:58px 0 62px}
  .clientes-referencias-cabecera{margin-bottom:40px}
  .clientes-referencias-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 24px}
  .cliente-referencia{min-height:125px;padding:8px 16px}
  .cliente-referencia img{max-height:115px}
  .cliente-referencia:nth-child(7){grid-column:1/-1}
}
@media(max-width:520px){
  .clientes-referencias{padding:48px 0 52px}
  .clientes-referencias-cabecera{margin-bottom:30px}
  .clientes-referencias-grid{grid-template-columns:1fr;gap:25px}
  .cliente-referencia{min-height:110px;padding:8px 28px}
  .cliente-referencia img{max-height:105px}
  .cliente-referencia:nth-child(7){grid-column:auto}
}

/* =========================================================
   CLIENTES - AJUSTE FINAL DE LOGOS Y GRID
========================================================= */
section.clientes-referencias{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:76px 0 84px !important;
  background:#ffffff !important;
  color:#111111 !important;
}
section.clientes-referencias > .contenedor{
  width:min(1180px, calc(100% - 48px)) !important;
  max-width:1180px !important;
  margin:0 auto !important;
}
section.clientes-referencias .clientes-referencias-cabecera{
  width:min(820px,100%) !important;
  margin:0 auto 56px !important;
  text-align:center !important;
}
section.clientes-referencias .clientes-referencias-cabecera h2{
  margin:0 !important;
  color:#0b0b0b !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:clamp(30px,3.6vw,44px) !important;
  font-weight:800 !important;
  line-height:1.08 !important;
  letter-spacing:-.03em !important;
}
section.clientes-referencias .clientes-referencias-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:44px 70px !important;
  align-items:center !important;
  justify-items:center !important;
  width:100% !important;
}
section.clientes-referencias .cliente-referencia{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  min-height:210px !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
section.clientes-referencias .cliente-referencia img{
  display:block !important;
  width:100% !important;
  max-width:420px !important;
  height:210px !important;
  max-height:210px !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}
section.clientes-referencias .cliente-referencia:nth-child(7){
  grid-column:2 !important;
}
@media(max-width:850px){
  section.clientes-referencias{padding:60px 0 66px !important}
  section.clientes-referencias > .contenedor{width:min(100% - 34px, 760px) !important}
  section.clientes-referencias .clientes-referencias-cabecera{margin-bottom:42px !important}
  section.clientes-referencias .clientes-referencias-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:34px 28px !important}
  section.clientes-referencias .cliente-referencia{min-height:175px !important}
  section.clientes-referencias .cliente-referencia img{height:175px !important;max-height:175px !important;max-width:360px !important}
  section.clientes-referencias .cliente-referencia:nth-child(7){grid-column:1/-1 !important;width:50% !important;min-width:300px !important}
}
@media(max-width:560px){
  section.clientes-referencias{padding:48px 0 54px !important}
  section.clientes-referencias > .contenedor{width:calc(100% - 28px) !important}
  section.clientes-referencias .clientes-referencias-cabecera{margin-bottom:32px !important}
  section.clientes-referencias .clientes-referencias-cabecera h2{font-size:29px !important}
  section.clientes-referencias .clientes-referencias-grid{grid-template-columns:1fr !important;gap:24px !important}
  section.clientes-referencias .cliente-referencia,
  section.clientes-referencias .cliente-referencia:nth-child(7){grid-column:auto !important;width:100% !important;min-width:0 !important;min-height:158px !important}
  section.clientes-referencias .cliente-referencia img{height:158px !important;max-height:158px !important;max-width:340px !important}
}


/* =========================================================
   CLIENTES - FONDO UNIFICADO TECH SLEID
   Sección sin tarjetas ni recuadros blancos
========================================================= */
html body section.clientes-referencias{
  background:var(--negro) !important;
  background-color:var(--negro) !important;
  color:var(--blanco) !important;
  border:0 !important;
}
html body section.clientes-referencias > .contenedor,
html body section.clientes-referencias .clientes-referencias-cabecera,
html body section.clientes-referencias .clientes-referencias-grid,
html body section.clientes-referencias .cliente-referencia{
  background:transparent !important;
  background-color:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
html body section.clientes-referencias .clientes-referencias-cabecera h2{
  color:#fff !important;
  background:transparent !important;
}
html body section.clientes-referencias .cliente-referencia img{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
}

/* =========================================================
   CLIENTES - 8 LOGOS (4 x 2)
========================================================= */
html body section.clientes-referencias .clientes-referencias-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:46px 44px !important;
}
html body section.clientes-referencias .cliente-referencia,
html body section.clientes-referencias .cliente-referencia:nth-child(7),
html body section.clientes-referencias .cliente-referencia:nth-child(8){
  grid-column:auto !important;
  width:100% !important;
  min-width:0 !important;
}
html body section.clientes-referencias .cliente-referencia img{
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:165px !important;
}
@media(max-width:900px){
  html body section.clientes-referencias .clientes-referencias-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:34px 28px !important;
  }
}
@media(max-width:560px){
  html body section.clientes-referencias .clientes-referencias-grid{
    grid-template-columns:1fr !important;
    gap:26px !important;
  }
  html body section.clientes-referencias .cliente-referencia img{
    max-height:150px !important;
  }
}