
*{box-sizing:border-box}
html{scroll-behavior:smooth}
:root{--bg:#070a0f;--panel:#0d141c;--panel2:#111b25;--text:#edf3f8;--muted:#9aa8b5;--line:#1d2b38;--blue:#36a4f4;--red:#df2029;--green:#56d19a;--header:rgba(7,10,15,.94)}
html[data-theme="light"]{--bg:#f4f7f9;--panel:#fff;--panel2:#edf2f6;--text:#15212c;--muted:#5f6f7d;--line:#d6e0e7;--blue:#087ac5;--header:rgba(255,255,255,.96)}
body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
.wrap{width:min(1240px,calc(100% - 48px));margin:auto}
header{position:sticky;top:0;z-index:50;background:var(--header);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{height:86px;display:grid;grid-template-columns:270px 1fr auto;align-items:center;gap:24px}
.brand img{display:block;width:235px;max-height:62px;object-fit:contain}
.slogan{font-size:9px;color:var(--red);font-weight:700;letter-spacing:.35px;margin:0 0 0 18px}
.brandbox{display:flex;flex-direction:column;align-items:flex-start}
nav{display:flex;justify-content:center;gap:23px;white-space:nowrap;font-size:13px;color:var(--muted)}
nav a:hover,nav a.active{color:var(--text)}
.navright{display:flex;gap:9px;align-items:center}
.button,.outline{display:inline-flex;align-items:center;justify-content:center;border-radius:9px;padding:11px 16px;font-weight:700;font-size:13px}
.button{background:#1689df;color:white} .outline{border:1px solid #318bc9}
.theme{width:42px;height:42px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:9px;cursor:pointer;font-size:18px}
.hero{min-height:620px;display:flex;align-items:center;position:relative;overflow:hidden;background:#080d13}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,12,.98) 0%,rgba(5,8,12,.88) 48%,rgba(5,8,12,.35) 80%),url("../img/scene-1.jpg") center/cover}
.hero .wrap{position:relative;z-index:2}
.kicker{text-transform:uppercase;letter-spacing:2px;font-size:11px;color:var(--blue);font-weight:800}
h1{font-size:64px;line-height:1;letter-spacing:-2.8px;max-width:780px;margin:14px 0 22px}
.hero p{max-width:720px;font-size:19px;color:#bac5cf}
.actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:28px}
.section{padding:82px 0} .section.alt{background:var(--panel)}
h2{font-size:43px;line-height:1.05;letter-spacing:-1.6px;margin:10px 0 16px}
.lead{font-size:18px;color:var(--muted);max-width:820px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:34px}
.card{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:24px}
.card h3{margin:8px 0 10px;font-size:21px} .card p{color:var(--muted);font-size:14px;margin:0}
.servicegrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}
.visualcard{min-height:340px;border:1px solid var(--line);border-radius:15px;overflow:hidden;position:relative;background-position:center;background-size:cover}
.visualcard:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,12,.08),rgba(5,8,12,.94) 82%)}
.visualcard .copy{position:absolute;bottom:0;padding:27px;z-index:2} .visualcard h3{font-size:27px;margin:6px 0 8px} .visualcard p{color:#b6c1ca;margin:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.featureimg{min-height:430px;border-radius:15px;border:1px solid var(--line);background:url("../img/scene-3.jpg") center/cover}
.list{display:grid;gap:11px;margin-top:20px} .list div{padding:13px 15px;border:1px solid var(--line);border-radius:9px;background:var(--panel)}
.partnergrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px}
.partner{min-height:105px;border:1px solid var(--line);background:var(--panel);border-radius:12px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;padding:18px}
.partner small{display:block;color:var(--muted);font-weight:400;margin-top:4px}
.frameworks{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px} .frameworks span{border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:12px}
.diaggrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:32px} .diag{padding:30px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,var(--panel),var(--panel2))} .diag h3{font-size:31px;margin:7px 0 12px} .diag p{color:var(--muted)} .diag strong{font-size:58px;opacity:.08;float:right}
.contactgrid{display:grid;grid-template-columns:1fr .9fr;gap:38px} .contactdata{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:25px} .contactdata a{padding:15px;border:1px solid var(--line);border-radius:10px;background:var(--panel)} .contactdata small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase}
form{border:1px solid var(--line);background:var(--panel);padding:27px;border-radius:14px} label{display:block;font-size:12px;color:var(--muted);margin:12px 0 5px} input,textarea{width:100%;padding:12px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--text)} textarea{min-height:120px}
footer{border-top:1px solid var(--line);padding:32px 0;color:var(--muted);font-size:12px} .foot{display:flex;justify-content:space-between;gap:20px;align-items:center} .foot img{width:115px}
.pagehero{padding:90px 0 64px;background:linear-gradient(135deg,#09111a,#0d1c29);border-bottom:1px solid var(--line)} .pagehero h1{font-size:52px;margin-bottom:14px} .pagehero p{max-width:760px;color:#b9c4cc;font-size:18px}
@media(max-width:1100px){nav{display:none}.nav{grid-template-columns:1fr auto}.grid4{grid-template-columns:1fr 1fr}.partnergrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.wrap{width:min(100% - 32px,1240px)}.brand img{width:190px}.nav{height:76px}h1{font-size:44px}h2{font-size:35px}.servicegrid,.two,.diaggrid,.contactgrid{grid-template-columns:1fr}.grid4,.partnergrid,.contactdata{grid-template-columns:1fr 1fr}.hero{min-height:560px}.pagehero h1{font-size:42px}}
@media(max-width:480px){.grid4,.partnergrid,.contactdata{grid-template-columns:1fr}.outline{display:none}}


/* ===== Normalización visual de imágenes / hero ===== */
.hero{
  min-height:620px;
  height:620px;
}
.hero:before{
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center 48% !important;
  transform:none !important;
}
.hero h1,
.hero p,
.hero .kicker{
  color:#f4f7fa !important;
}
.hero h1{
  text-shadow:0 2px 18px rgba(0,0,0,.38);
}
.hero p{
  color:#d5dee5 !important;
  text-shadow:0 1px 10px rgba(0,0,0,.25);
}
html[data-theme="light"] .hero h1,
html[data-theme="light"] .hero p,
html[data-theme="light"] .hero .kicker{
  color:#f4f7fa !important;
}
html[data-theme="light"] .hero:before{
  filter:none !important;
}
html[data-theme="light"] .hero:after{
  content:none !important;
}

/* Tarjetas visuales: mismo encuadre y sin deformación */
.visualcard{
  min-height:340px;
  height:340px;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
}

/* Ajuste focal individual para evitar recortes torpes */
.servicegrid .visualcard:nth-child(1){background-position:center 42% !important}
.servicegrid .visualcard:nth-child(2){background-position:center 48% !important}
.servicegrid .visualcard:nth-child(3){background-position:center 45% !important}
.servicegrid .visualcard:nth-child(4){background-position:center 50% !important}

/* Evita saltos de altura al navegar entre páginas */
.pagehero{
  min-height:245px;
  display:flex;
  align-items:center;
}
.featureimg{
  min-height:430px;
  height:430px;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
}

@media(max-width:720px){
  .hero{
    min-height:560px;
    height:560px;
  }
  .visualcard{
    height:310px;
    min-height:310px;
  }
  .featureimg{
    height:340px;
    min-height:340px;
  }
}

.page-index .hero:before{background-position:center 46% !important}


/* ===== V3: las fotografías NO cambian entre Dark / Light ===== */
/* El tema cambia la interfaz, nunca el tratamiento de las imágenes. */
.hero,
.visualcard,
.featureimg{
  isolation:isolate;
}

/* Hero: overlay fijo, independiente del tema */
.hero:before{
  filter:none !important;
  opacity:1 !important;
  background-blend-mode:normal !important;
}
.hero:after{
  content:none !important;
}

/* Tarjetas: conservar exactamente la misma fotografía y contraste */
.visualcard{
  filter:none !important;
  opacity:1 !important;
}
.visualcard:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:linear-gradient(
    180deg,
    rgba(5,8,12,.06) 0%,
    rgba(5,8,12,.18) 45%,
    rgba(5,8,12,.90) 100%
  ) !important;
  opacity:1 !important;
  filter:none !important;
  pointer-events:none;
}
.visualcard .copy{
  z-index:2 !important;
}
.visualcard .copy h3{
  color:#f3f7fa !important;
  text-shadow:0 2px 12px rgba(0,0,0,.48);
}
.visualcard .copy p{
  color:#d5dee5 !important;
}
.visualcard .copy .kicker{
  color:#36a4f4 !important;
}

/* Imagen editorial / nosotros */
.featureimg{
  filter:none !important;
  opacity:1 !important;
}

/* Light mode solo modifica superficies de UI */
html[data-theme="light"] .hero,
html[data-theme="light"] .visualcard,
html[data-theme="light"] .featureimg{
  filter:none !important;
}
html[data-theme="light"] .hero:before,
html[data-theme="light"] .visualcard:before{
  filter:none !important;
  opacity:1 !important;
}
html[data-theme="light"] .visualcard .copy h3{
  color:#f3f7fa !important;
}
html[data-theme="light"] .visualcard .copy p{
  color:#d5dee5 !important;
}

/* Marco normativo: separado de fabricantes/aliados */
.normative-block{margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}
.normative-title{text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:800;color:var(--muted);margin-bottom:14px}
.normative-grid{display:flex;gap:14px;flex-wrap:wrap}
.normative-item{display:flex;align-items:center;gap:13px;min-width:330px;padding:14px 18px;border:1px solid var(--line);border-radius:11px;background:var(--panel)}
.normative-item strong{display:block;font-size:15px}
.normative-item small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.iso-mark{width:45px;height:45px;border:2px solid #748696;border-radius:50%;display:grid;place-items:center;position:relative;flex:0 0 auto}
.iso-mark:before,.iso-mark:after{content:"";position:absolute;inset:4px;border:1px solid #748696;border-radius:50%}
.iso-mark:after{inset:9px}
.iso-mark span{position:relative;z-index:2;font-size:10px;font-weight:900;letter-spacing:.3px;background:var(--panel);padding:1px 3px}
.normative-note{font-size:10px;color:var(--muted);margin:11px 0 0}
html[data-theme="light"] .pagehero h1{color:#f4f7fa !important}
html[data-theme="light"] .pagehero p{color:#b9c4cc !important}
html[data-theme="light"] .pagehero .kicker{color:#36a4f4 !important}
@media(max-width:720px){.normative-item{min-width:0;width:100%}}


/* ===== V5: botones sobre hero oscuro ===== */
.hero .button{
  background:#1689df !important;
  color:#ffffff !important;
  border:1px solid #1689df !important;
}
.hero .outline{
  background:rgba(7,10,15,.28) !important;
  color:#f4f7fa !important;
  border:1px solid #36a4f4 !important;
  backdrop-filter:blur(4px);
}
.hero .outline:hover{
  background:rgba(54,164,244,.12) !important;
  color:#ffffff !important;
}
html[data-theme="light"] .hero .button{
  background:#1689df !important;
  color:#ffffff !important;
}
html[data-theme="light"] .hero .outline{
  background:rgba(7,10,15,.28) !important;
  color:#f4f7fa !important;
  border-color:#36a4f4 !important;
}


/* ===== V6: tratamiento fotográfico real para Light Mode ===== */

/* DARK: mantiene el tratamiento actual */
.hero:before{
  background:
    linear-gradient(90deg,
      rgba(5,8,12,.96) 0%,
      rgba(5,8,12,.82) 45%,
      rgba(5,8,12,.30) 78%,
      rgba(5,8,12,.18) 100%
    ),
    url("../img/scene-1.jpg") center 46% / cover no-repeat !important;
}

.visualcard:before{
  background:
    linear-gradient(
      180deg,
      rgba(5,8,12,.02) 0%,
      rgba(5,8,12,.10) 48%,
      rgba(5,8,12,.90) 100%
    ) !important;
}

/* LIGHT: fotografía visible, sin look hacker */
html[data-theme="light"] .hero:before{
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.88) 0%,
      rgba(255,255,255,.72) 42%,
      rgba(255,255,255,.16) 73%,
      rgba(255,255,255,.04) 100%
    ),
    url("../img/scene-1.jpg") center 46% / cover no-repeat !important;
}

/* En el hero claro el texto vuelve a oscuro */
html[data-theme="light"] .hero h1{
  color:#13202b !important;
  text-shadow:0 1px 2px rgba(255,255,255,.65) !important;
}
html[data-theme="light"] .hero p{
  color:#334554 !important;
  text-shadow:none !important;
}
html[data-theme="light"] .hero .kicker{
  color:#087ac5 !important;
}

/* Botones hero adaptados al modo claro */
html[data-theme="light"] .hero .button{
  background:#1689df !important;
  color:#fff !important;
}
html[data-theme="light"] .hero .outline{
  background:rgba(255,255,255,.72) !important;
  color:#173046 !important;
  border-color:#1689df !important;
  backdrop-filter:blur(6px);
}
html[data-theme="light"] .hero .outline:hover{
  background:#ffffff !important;
  color:#0c2233 !important;
}

/* Tarjetas: en Light la foto queda natural y el texto vive en una franja local */
html[data-theme="light"] .visualcard:before{
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 48%,
      rgba(8,15,22,.18) 62%,
      rgba(8,15,22,.78) 100%
    ) !important;
}
html[data-theme="light"] .visualcard{
  background-color:#e7edf2;
}
html[data-theme="light"] .visualcard .copy{
  background:linear-gradient(
    180deg,
    rgba(8,15,22,0) 0%,
    rgba(8,15,22,.10) 18%,
    rgba(8,15,22,.66) 100%
  );
}
html[data-theme="light"] .visualcard .copy h3{
  color:#ffffff !important;
  text-shadow:0 2px 10px rgba(0,0,0,.55) !important;
}
html[data-theme="light"] .visualcard .copy p{
  color:#eef3f6 !important;
}

/* Imagen de Nosotros: sin filtros oscuros en Light */
html[data-theme="light"] .featureimg{
  filter:none !important;
  opacity:1 !important;
}

/* Page hero: también deja de parecer Dark Mode incrustado */
html[data-theme="light"] .pagehero{
  background:linear-gradient(135deg,#eef4f8,#dfe9f0) !important;
}
html[data-theme="light"] .pagehero h1{
  color:#162431 !important;
}
html[data-theme="light"] .pagehero p{
  color:#506473 !important;
}
html[data-theme="light"] .pagehero .kicker{
  color:#087ac5 !important;
}


/* ===== V8: Light Mode consistente con el hero ===== */
/* Fotografías naturales + veladura blanca lateral/superior, sin cajas blancas. */

/* Hero: referencia visual aprobada */
html[data-theme="light"] .hero:before{
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.90) 0%,
      rgba(255,255,255,.78) 35%,
      rgba(255,255,255,.38) 58%,
      rgba(255,255,255,.08) 82%,
      rgba(255,255,255,0) 100%
    ),
    url("../img/scene-1.jpg") center 46% / cover no-repeat !important;
}

/* Tarjetas: misma lógica del hero, aplicada desde abajo/izquierda */
html[data-theme="light"] .visualcard:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.02) 42%,
      rgba(255,255,255,.18) 62%,
      rgba(255,255,255,.72) 82%,
      rgba(255,255,255,.92) 100%
    ) !important;
  pointer-events:none;
}

/* Sin tarjetas flotantes ni blur */
html[data-theme="light"] .visualcard .copy{
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:auto !important;
  padding:26px 28px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Texto oscuro, como en el hero aprobado */
html[data-theme="light"] .visualcard .copy h3{
  color:#14212c !important;
  text-shadow:none !important;
}
html[data-theme="light"] .visualcard .copy p{
  color:#334554 !important;
  text-shadow:none !important;
}
html[data-theme="light"] .visualcard .copy .kicker{
  color:#087ac5 !important;
}

/* Mantener fotografía limpia, sin filtros "hacker" */
html[data-theme="light"] .visualcard,
html[data-theme="light"] .featureimg{
  filter:none !important;
  opacity:1 !important;
}

/* Page hero en claro sigue la misma lógica visual */
html[data-theme="light"] .pagehero{
  background:linear-gradient(135deg,#f3f7fa 0%,#e8eff4 100%) !important;
}
html[data-theme="light"] .pagehero h1{
  color:#14212c !important;
}
html[data-theme="light"] .pagehero p{
  color:#506473 !important;
}
html[data-theme="light"] .pagehero .kicker{
  color:#087ac5 !important;
}


/* ===== V9: Light Mode refinado — veladura corta y consistente ===== */

/* Eliminar cualquier tratamiento claro previo demasiado agresivo */
html[data-theme="light"] .visualcard:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 62%,
      rgba(255,255,255,.10) 72%,
      rgba(255,255,255,.42) 86%,
      rgba(255,255,255,.76) 100%
    ) !important;
  pointer-events:none !important;
}

/* Mantener el contenido exactamente en la misma zona en las cuatro tarjetas */
html[data-theme="light"] .visualcard .copy{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  padding:22px 28px 24px !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  z-index:2 !important;
}

/* Tipografía consistente y legible */
html[data-theme="light"] .visualcard .copy h3{
  color:#14212c !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35) !important;
  margin-bottom:8px !important;
}
html[data-theme="light"] .visualcard .copy p{
  color:#334554 !important;
  text-shadow:none !important;
}
html[data-theme="light"] .visualcard .copy .kicker{
  color:#087ac5 !important;
}

/* Mismo encuadre y altura real para las cuatro */
.visualcard{
  height:340px !important;
  min-height:340px !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

/* Ajustes focales suaves por tarjeta, sin modificar escala */
.servicegrid .visualcard:nth-child(1){background-position:center 44% !important}
.servicegrid .visualcard:nth-child(2){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(3){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(4){background-position:center 48% !important}

@media(max-width:720px){
  .visualcard{
    height:310px !important;
    min-height:310px !important;
  }
  html[data-theme="light"] .visualcard .copy{
    padding:20px 22px 22px !important;
  }
}


/* ===== V10: tarjetas fotográficas idénticas en Dark y Light ===== */
/* La interfaz cambia de tema; las tarjetas fotográficas NO. */

.visualcard{
  background-size:cover !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  opacity:1 !important;
}

/* Mismo degradado cinematográfico inferior para ambos temas */
.visualcard:before,
html[data-theme="light"] .visualcard:before,
html[data-theme="dark"] .visualcard:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  background:
    linear-gradient(
      180deg,
      rgba(5,8,12,.02) 0%,
      rgba(5,8,12,.08) 48%,
      rgba(5,8,12,.34) 68%,
      rgba(5,8,12,.88) 100%
    ) !important;
  pointer-events:none !important;
}

/* El bloque de texto se mantiene integrado a la foto */
.visualcard .copy,
html[data-theme="light"] .visualcard .copy,
html[data-theme="dark"] .visualcard .copy{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:auto !important;
  padding:26px 28px !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  z-index:2 !important;
}

/* Tipografía fija sobre fotografía, independiente del tema */
.visualcard .copy h3,
html[data-theme="light"] .visualcard .copy h3,
html[data-theme="dark"] .visualcard .copy h3{
  color:#f4f7fa !important;
  text-shadow:0 2px 10px rgba(0,0,0,.48) !important;
}

.visualcard .copy p,
html[data-theme="light"] .visualcard .copy p,
html[data-theme="dark"] .visualcard .copy p{
  color:#d9e1e7 !important;
  text-shadow:0 1px 8px rgba(0,0,0,.28) !important;
}

.visualcard .copy .kicker,
html[data-theme="light"] .visualcard .copy .kicker,
html[data-theme="dark"] .visualcard .copy .kicker{
  color:#36a4f4 !important;
  text-shadow:none !important;
}

/* Misma geometría y mismo encuadre */
.visualcard{
  height:340px !important;
  min-height:340px !important;
}

.servicegrid .visualcard:nth-child(1){background-position:center 44% !important}
.servicegrid .visualcard:nth-child(2){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(3){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(4){background-position:center 48% !important}

/* Light solo modifica el entorno exterior */
html[data-theme="light"] .section{
  background:var(--bg);
}
html[data-theme="light"] .section.alt{
  background:var(--panel);
}

@media(max-width:720px){
  .visualcard{
    height:310px !important;
    min-height:310px !important;
  }
  .visualcard .copy{
    padding:22px !important;
  }
}


/* ===== V11: Light Mode con la misma lógica visual del HERO aprobado ===== */
/* Foto natural + veladura blanca localizada desde la izquierda/inferior. */

html[data-theme="light"] .visualcard{
  filter:none !important;
  opacity:1 !important;
  background-color:#eaf0f4 !important;
}

/* En Light, cada tarjeta usa una veladura blanca parecida al hero:
   suficiente para leer, pero sin lavar toda la fotografía. */
html[data-theme="light"] .visualcard:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  pointer-events:none !important;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.86) 0%,
      rgba(255,255,255,.70) 30%,
      rgba(255,255,255,.36) 52%,
      rgba(255,255,255,.10) 72%,
      rgba(255,255,255,0) 100%
    ),
    linear-gradient(
      0deg,
      rgba(255,255,255,.34) 0%,
      rgba(255,255,255,.10) 22%,
      rgba(255,255,255,0) 48%
    ) !important;
}

/* El contenido queda igual que en el hero: sobre la imagen, sin caja. */
html[data-theme="light"] .visualcard .copy{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:auto !important;
  padding:26px 28px !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  z-index:2 !important;
}

/* Texto oscuro, exactamente como en el hero claro. */
html[data-theme="light"] .visualcard .copy h3{
  color:#14212c !important;
  text-shadow:none !important;
}
html[data-theme="light"] .visualcard .copy p{
  color:#334554 !important;
  text-shadow:none !important;
}
html[data-theme="light"] .visualcard .copy .kicker{
  color:#087ac5 !important;
  text-shadow:none !important;
}

/* Dark conserva el look original. */
html[data-theme="dark"] .visualcard:before{
  background:
    linear-gradient(
      180deg,
      rgba(5,8,12,.02) 0%,
      rgba(5,8,12,.08) 48%,
      rgba(5,8,12,.34) 68%,
      rgba(5,8,12,.88) 100%
    ) !important;
}
html[data-theme="dark"] .visualcard .copy h3{
  color:#f4f7fa !important;
}
html[data-theme="dark"] .visualcard .copy p{
  color:#d9e1e7 !important;
}

/* Ajuste focal uniforme */
.servicegrid .visualcard:nth-child(1){background-position:center 44% !important}
.servicegrid .visualcard:nth-child(2){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(3){background-position:center 46% !important}
.servicegrid .visualcard:nth-child(4){background-position:center 48% !important}

/* ===== V12: respaldo profesional + recursos ===== */
.credibility h2,.cyber-resources h2{font-size:clamp(32px,4vw,54px);margin:8px 0 28px}
.credential-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.credential-card{display:flex;align-items:center;gap:18px;padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--panel);min-height:155px}
.credential-card h3{margin:4px 0 7px;font-size:21px}
.credential-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
.issuer{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#1689df}
.credential-badge{width:82px;height:82px;flex:0 0 82px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:12px;letter-spacing:.4px}
.pending-badge{border:2px solid #d7e0e7;color:var(--muted);background:var(--bg)}
.asset-note{font-size:10px;color:var(--muted);margin:14px 0 0}
.resource-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.resource-card{display:block;min-height:220px;padding:30px;border:1px solid var(--line);border-radius:16px;background:var(--panel);text-decoration:none;color:var(--text);transition:.2s ease}
.resource-card:hover{transform:translateY(-3px);border-color:#1689df}
.resource-source{font-size:10px;letter-spacing:1.7px;font-weight:900;color:#1689df}
.resource-card h3{font-size:26px;margin:14px 0 10px}
.resource-card p{color:var(--muted);max-width:580px;line-height:1.6}
.resource-link{display:inline-block;margin-top:18px;font-weight:800;color:#1689df}
@media(max-width:900px){.credential-grid{grid-template-columns:1fr}.resource-grid{grid-template-columns:1fr}}

/* V15 - cambios efectivos: logos + badges reales */
.brand-logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
.brand-logo-grid a{height:155px;background:#fff;border:1px solid var(--line);border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:22px;text-decoration:none;transition:.2s ease}
.brand-logo-grid a:hover{transform:translateY(-3px);border-color:#1689df}
.brand-logo-grid img{max-width:180px;max-height:62px;width:auto;height:auto;object-fit:contain}
.brand-logo-grid span{font-size:11px;font-weight:800;color:#586978}
.credential-real .credential-card{min-height:220px}
.credential-real-badge{width:132px;height:132px;object-fit:contain;flex:0 0 132px}
.ceh-mark{width:132px;height:132px;flex:0 0 132px;border-radius:24px;background:#15293d;color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid #278bd1}
.ceh-mark strong{font-size:28px}.ceh-mark span{font-size:10px;margin-top:6px}
.normative-strip{border-top:1px solid var(--line);margin-top:30px;padding-top:26px}
.normative-items{display:flex;gap:16px;margin-top:16px}
.normative-items>div{border:1px solid var(--line);border-radius:13px;padding:18px 22px;min-width:330px;background:var(--panel);display:flex;flex-direction:column;gap:5px}
.normative-items span{font-size:11px;color:var(--muted)}
@media(max-width:900px){.brand-logo-grid{grid-template-columns:repeat(2,1fr)}.normative-items{flex-direction:column}.normative-items>div{min-width:0}}
@media(max-width:520px){.brand-logo-grid{grid-template-columns:1fr}.credential-real-badge,.ceh-mark{width:105px;height:105px;flex-basis:105px}}
/* v16: cierre integral de marcas, marco normativo y credenciales */
.framework-block{margin-top:34px;padding-top:32px;border-top:1px solid var(--line)}
.framework-block .section-label{font-size:14px;letter-spacing:.16em;font-weight:800;color:var(--blue);text-transform:uppercase;margin-bottom:18px}
.framework-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:1120px}
.framework-card{min-height:150px;border:1px solid var(--line);border-radius:20px;padding:28px 30px;background:var(--card);display:flex;flex-direction:column;justify-content:center}
.framework-card strong{font-size:28px;line-height:1.1;color:var(--text);margin-bottom:10px}
.framework-card span{font-size:17px;color:var(--muted);line-height:1.45}
.credential-real-badge{width:190px!important;height:190px!important;object-fit:contain!important;border:0!important;background:transparent!important;padding:0!important}
@media(max-width:760px){.framework-grid{grid-template-columns:1fr}.credential-real-badge{width:145px!important;height:145px!important}}


/* ===== V18: Marco normativo con jerarquía equivalente a partners ===== */
.normative-major{
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 85% 15%, rgba(22,137,223,.10), transparent 28%),
    var(--bg);
}
.normative-major-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:end;
  margin-bottom:34px;
}
.normative-major-head h2{
  max-width:780px;
  margin-bottom:14px;
}
.normative-major-head .lead{
  margin:0;
  max-width:760px;
}
.normative-mark{
  align-self:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  letter-spacing:1.45px;
  color:var(--blue);
  background:var(--panel);
  white-space:nowrap;
}
.normative-major-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
.normative-major-card{
  min-height:310px;
  position:relative;
  display:grid;
  grid-template-columns:112px 1fr;
  gap:28px;
  align-items:center;
  overflow:hidden;
  padding:34px;
  border:1px solid rgba(70,145,205,.32);
  border-radius:18px;
  color:#fff;
  background:
    linear-gradient(145deg,#092a5a 0%,#0b3f7a 54%,#0b315f 100%);
  box-shadow:0 18px 42px rgba(4,22,44,.12);
}
.normative-major-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.04) 58% 59%,transparent 59%),
    radial-gradient(circle at 92% 15%,rgba(63,174,255,.18),transparent 32%);
}
.normative-major-card:after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-120px;
  bottom:-150px;
  border:1px solid rgba(104,194,255,.18);
  border-radius:50%;
}
.normative-code{
  position:absolute;
  right:22px;
  top:14px;
  font-size:74px;
  line-height:1;
  font-weight:900;
  letter-spacing:-4px;
  color:rgba(255,255,255,.045);
}
.normative-major-copy{
  position:relative;
  z-index:2;
}
.normative-family{
  display:block;
  margin-bottom:2px;
  color:#83c7ff;
  font-size:13px;
  font-weight:900;
  letter-spacing:1.8px;
}
.normative-major-copy h3{
  margin:0;
  font-size:50px;
  line-height:1;
  letter-spacing:-1.7px;
  color:#fff;
}
.normative-major-copy h4{
  margin:14px 0 12px;
  max-width:430px;
  font-size:18px;
  line-height:1.3;
  color:#fff;
}
.normative-major-copy p{
  margin:0;
  max-width:470px;
  color:#dbe8f4;
  font-size:14px;
  line-height:1.6;
}
.normative-icon{
  position:relative;
  z-index:2;
  width:104px;
  height:116px;
  margin:auto;
  border:4px solid rgba(255,255,255,.92);
  border-radius:48% 48% 54% 54% / 28% 28% 72% 72%;
  clip-path:polygon(50% 0,92% 16%,92% 55%,78% 78%,50% 100%,22% 78%,8% 55%,8% 16%);
}
.shield-check:before{
  content:"";
  position:absolute;
  width:42px;
  height:21px;
  left:27px;
  top:40px;
  border-left:5px solid #fff;
  border-bottom:5px solid #fff;
  transform:rotate(-45deg);
}
.shield-lock:before{
  content:"";
  position:absolute;
  width:39px;
  height:31px;
  left:28px;
  top:50px;
  border:4px solid #fff;
  border-radius:5px;
}
.shield-lock:after{
  content:"";
  position:absolute;
  width:25px;
  height:25px;
  left:35px;
  top:31px;
  border:4px solid #fff;
  border-bottom:0;
  border-radius:18px 18px 0 0;
}
.normative-foot{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin-top:20px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
}
.normative-foot strong{
  font-size:13px;
}
.normative-foot span{
  max-width:720px;
  color:var(--muted);
  font-size:11px;
  text-align:right;
}

html[data-theme="light"] .normative-major{
  background:
    radial-gradient(circle at 85% 15%, rgba(22,137,223,.08), transparent 28%),
    #f7fafc;
}
html[data-theme="dark"] .normative-major{
  background:
    radial-gradient(circle at 85% 15%, rgba(22,137,223,.13), transparent 28%),
    var(--bg);
}

@media(max-width:900px){
  .normative-major-head{grid-template-columns:1fr;align-items:start}
  .normative-mark{justify-self:start}
  .normative-major-grid{grid-template-columns:1fr}
  .normative-major-card{min-height:280px}
  .normative-foot{align-items:flex-start;flex-direction:column}
  .normative-foot span{text-align:left}
}
@media(max-width:580px){
  .normative-major-card{
    grid-template-columns:78px 1fr;
    gap:18px;
    padding:26px 22px;
    min-height:260px;
  }
  .normative-icon{width:74px;height:84px;border-width:3px}
  .shield-check:before{width:30px;height:15px;left:19px;top:29px;border-width:0 0 4px 4px}
  .shield-lock:before{width:29px;height:24px;left:20px;top:36px;border-width:3px}
  .shield-lock:after{width:19px;height:19px;left:25px;top:23px;border-width:3px;border-bottom:0}
  .normative-major-copy h3{font-size:39px}
  .normative-major-copy h4{font-size:16px}
  .normative-code{font-size:58px}
}

/* V19 — Blancco: logo oficial actualizado */
.brand-logo-grid img[alt="Blancco"],
.brand-logo-zone img[alt="Blancco"]{
  max-width:220px !important;
  max-height:72px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
}


/* V20 — Integración compacta del marco normativo en el flujo de la página */
.standards-section,
.normative-section,
.iso-section{
  padding-top:48px !important;
  padding-bottom:48px !important;
  min-height:0 !important;
}

.standards-section .section-head,
.normative-section .section-head,
.iso-section .section-head{
  margin-bottom:26px !important;
}

.standards-section h2,
.normative-section h2,
.iso-section h2{
  font-size:clamp(34px,3vw,50px) !important;
  line-height:1.05 !important;
  margin-bottom:12px !important;
}

.iso-grid,
.standards-grid,
.normative-grid{
  gap:20px !important;
  align-items:stretch !important;
}

.iso-card,
.standard-card,
.normative-card{
  min-height:190px !important;
  height:auto !important;
  padding:30px 34px !important;
  border-radius:20px !important;
}

/* Eliminar adornos/iconos defectuosos que aparecían cortados */
.iso-card .iso-icon,
.iso-card .card-icon,
.standard-card .iso-icon,
.standard-card .card-icon,
.normative-card .iso-icon,
.normative-card .card-icon{
  display:none !important;
}

.iso-card h3,
.standard-card h3,
.normative-card h3{
  font-size:34px !important;
  line-height:1 !important;
  margin:4px 0 14px !important;
}

.iso-card p,
.standard-card p,
.normative-card p{
  margin-bottom:0 !important;
}

/* Evitar que la sección cree un falso hero o un hueco antes del siguiente bloque */
.standards-section + section,
.normative-section + section,
.iso-section + section{
  margin-top:0 !important;
}

.standards-section .standards-foot,
.normative-section .standards-foot,
.iso-section .standards-foot,
.standards-section .section-note,
.normative-section .section-note,
.iso-section .section-note{
  margin-top:18px !important;
  min-height:0 !important;
}

/* V21 — Bloque normativo: assets suministrados por el usuario, normalizados */
.standard-logo-user{
  display:block !important;
  width:132px !important;
  height:108px !important;
  object-fit:contain !important;
  object-position:center !important;
  flex:0 0 132px !important;
  margin:0 26px 0 0 !important;
  background:#fff !important;
  border-radius:14px !important;
  padding:10px !important;
}
.iso-card,
.standard-card,
.normative-card{
  display:flex !important;
  align-items:center !important;
}
.iso-card .iso-icon,
.iso-card .card-icon,
.standard-card .iso-icon,
.standard-card .card-icon,
.normative-card .iso-icon,
.normative-card .card-icon{
  display:none !important;
}
@media (max-width:760px){
  .standard-logo-user{
    width:105px !important;
    height:88px !important;
    margin:0 18px 0 0 !important;
  }
}

/* V22 — corrección efectiva del bloque .normative-major-card */
.normative-major-card{
  display:grid !important;
  grid-template-columns:190px 1fr !important;
  align-items:center !important;
  gap:34px !important;
  padding:34px 38px !important;
}
.normative-major-card .normative-code,
.normative-major-card .normative-icon,
.normative-major-card .normative-family{
  display:none !important;
}
.normative-official-logo{
  display:block !important;
  width:190px !important;
  height:160px !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#fff !important;
  border-radius:16px !important;
  padding:12px !important;
}
.normative-major-copy h3{
  margin:0 0 12px !important;
  font-size:34px !important;
  line-height:1.05 !important;
}
.normative-major-copy h4{margin:0 0 12px !important;}
.normative-major-copy p{margin:0 !important;}
.normative-foot{
  justify-content:flex-start !important;
}
@media(max-width:760px){
 .normative-major-card{grid-template-columns:1fr !important;}
 .normative-official-logo{width:150px !important;height:126px !important;}
}

/* V23 — normalización visual real de ambos logos ISO */
.normative-official-logo{
  width:190px !important;
  height:150px !important;
  padding:0 !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#fff !important;
  border-radius:16px !important;
}
.normative-major-card{
  min-height:255px !important;
}

/* V24 — homologación estricta del área visual de los dos distintivos */
.normative-official-logo{
  width:190px !important;
  height:136px !important;
  padding:0 !important;
  margin:0 !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#fff !important;
  border-radius:16px !important;
}

/* V25 — ISO sin cajitas: bloque abierto e integrado en la sección */
.normative-major-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:56px !important;
  margin-top:34px !important;
}
.normative-standard-item{
  display:grid !important;
  grid-template-columns:190px 1fr !important;
  align-items:center !important;
  gap:28px !important;
  min-height:0 !important;
  padding:10px 0 !important;
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:var(--ink) !important;
}
.normative-standard-item::before,
.normative-standard-item::after{
  display:none !important;
  content:none !important;
}
.normative-standard-item .normative-official-logo{
  display:block !important;
  width:auto !important;
  height:170px !important;
  max-width:190px !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 auto !important;
  box-shadow:none !important;
}
.normative-standard-item .normative-major-copy h3{
  color:var(--ink) !important;
  margin:0 0 10px !important;
  font-size:32px !important;
}
.normative-standard-item .normative-major-copy h4{
  color:var(--ink) !important;
  margin:0 0 10px !important;
  font-size:20px !important;
}
.normative-standard-item .normative-major-copy p{
  color:var(--muted) !important;
  margin:0 !important;
  font-size:16px !important;
}
@media(max-width:760px){
  .normative-major-grid{grid-template-columns:1fr !important;gap:30px !important;}
  .normative-standard-item{grid-template-columns:140px 1fr !important;gap:18px !important;}
  .normative-standard-item .normative-official-logo{height:130px !important;max-width:140px !important;}
}

/* V26 — homologación real: MISMO emblema ISO para ambos; solo cambia el número */
.iso-standard-mark{
  width:190px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  margin:0 auto !important;
}
.iso-standard-mark img{
  display:block !important;
  width:170px !important;
  height:116px !important;
  object-fit:contain !important;
  object-position:center !important;
  background:transparent !important;
}
.iso-standard-mark span{
  display:block !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:38px !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:1px !important;
  color:#1268b3 !important;
  text-align:center !important;
}
@media(max-width:760px){
  .iso-standard-mark{width:140px !important;}
  .iso-standard-mark img{width:128px !important;height:88px !important;}
  .iso-standard-mark span{font-size:30px !important;}
}

/* =========================================================
   V27 — SISTEMA TIPOGRÁFICO GLOBAL + RITMO VISUAL
   Corrige escala excesiva y unifica todo el sitio.
   ========================================================= */

:root{
  --fs-hero: clamp(52px, 5.2vw, 72px);
  --fs-page: clamp(40px, 4vw, 56px);
  --fs-section: clamp(32px, 3.2vw, 44px);
  --fs-card: clamp(20px, 1.8vw, 26px);
  --fs-lead: clamp(17px, 1.45vw, 20px);
  --fs-body: 15px;
}

/* ---------- Navegación ---------- */
nav{
  font-size:12.5px !important;
  gap:21px !important;
}
.button,.outline{
  font-size:12.5px !important;
  padding:10px 15px !important;
}
.theme{
  width:40px !important;
  height:40px !important;
}

/* ---------- Hero principal ---------- */
.hero{
  min-height:570px !important;
}
.hero h1,
.hero .hero-title{
  font-size:var(--fs-hero) !important;
  line-height:.98 !important;
  letter-spacing:-2.2px !important;
  max-width:1040px !important;
  margin:16px 0 22px !important;
  text-wrap:balance;
}
.hero p,
.hero .lead{
  max-width:860px !important;
  font-size:clamp(18px,1.55vw,22px) !important;
  line-height:1.52 !important;
}
.hero .kicker{
  font-size:10.5px !important;
  letter-spacing:2.1px !important;
}
.hero .actions{
  margin-top:25px !important;
}

/* ---------- Heroes internos ---------- */
.pagehero{
  padding:68px 0 52px !important;
}
.pagehero h1{
  font-size:var(--fs-page) !important;
  line-height:1.02 !important;
  letter-spacing:-1.9px !important;
  max-width:900px !important;
  margin:10px 0 14px !important;
}
.pagehero p{
  max-width:760px !important;
  font-size:17px !important;
  line-height:1.55 !important;
}

/* ---------- Secciones ---------- */
.section{
  padding:68px 0 !important;
}
.section h2,
.normative-major-head h2{
  font-size:var(--fs-section) !important;
  line-height:1.06 !important;
  letter-spacing:-1.25px !important;
  margin:9px 0 14px !important;
  max-width:980px;
}
.kicker,
.eyebrow{
  font-size:10.5px !important;
  letter-spacing:1.9px !important;
}
.lead{
  font-size:var(--fs-lead) !important;
  line-height:1.55 !important;
  max-width:780px !important;
}

/* ---------- Tarjetas generales ---------- */
.card{
  padding:22px !important;
}
.card h3{
  font-size:20px !important;
  line-height:1.18 !important;
  margin:7px 0 9px !important;
}
.card p{
  font-size:13.5px !important;
  line-height:1.55 !important;
}

/* ---------- Tarjetas fotográficas ---------- */
.visualcard{
  min-height:315px !important;
}
.visualcard .copy{
  padding:24px 26px !important;
}
.visualcard h3,
.visualcard .copy h3{
  font-size:24px !important;
  line-height:1.12 !important;
  letter-spacing:-.55px !important;
}
.visualcard p,
.visualcard .copy p{
  font-size:14px !important;
  line-height:1.5 !important;
}

/* ---------- Diagnóstico ---------- */
.diag h3{
  font-size:27px !important;
  line-height:1.12 !important;
}
.diag strong{
  font-size:48px !important;
}

/* ---------- Partners ---------- */
.brand-logo-grid a{
  min-height:145px !important;
}
.brand-logo-grid span{
  font-size:10.5px !important;
}

/* ---------- Marco normativo ---------- */
.normative-major{
  padding-top:60px !important;
  padding-bottom:60px !important;
}
.normative-major-head{
  display:block !important;
  margin-bottom:28px !important;
}
.normative-mark{
  display:none !important;
}
.normative-major-grid{
  margin-top:28px !important;
  gap:48px !important;
}
.normative-standard-item{
  grid-template-columns:175px 1fr !important;
  gap:25px !important;
}
.iso-standard-mark{
  width:175px !important;
}
.iso-standard-mark img{
  width:155px !important;
  height:106px !important;
}
.iso-standard-mark span{
  font-size:34px !important;
}
.normative-standard-item .normative-major-copy h3{
  font-size:29px !important;
  line-height:1.05 !important;
  letter-spacing:-.7px !important;
}
.normative-standard-item .normative-major-copy h4{
  font-size:18px !important;
  line-height:1.3 !important;
}
.normative-standard-item .normative-major-copy p{
  font-size:14px !important;
  line-height:1.55 !important;
}

/* ---------- Credenciales ---------- */
.credential-card{
  min-height:180px !important;
  padding:24px !important;
}
.credential-card h3{
  font-size:21px !important;
  line-height:1.15 !important;
}
.credential-card p{
  font-size:12.5px !important;
  line-height:1.5 !important;
}

/* ---------- Contacto / formularios ---------- */
.contactdata a{
  padding:13px !important;
}
form{
  padding:24px !important;
}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  .hero h1,.hero .hero-title{
    max-width:900px !important;
  }
}
@media(max-width:760px){
  .hero{
    min-height:520px !important;
  }
  .hero h1,.hero .hero-title{
    font-size:clamp(42px,11vw,56px) !important;
    letter-spacing:-1.5px !important;
    max-width:100% !important;
  }
  .hero p,.hero .lead{
    font-size:17px !important;
  }
  .section{
    padding:54px 0 !important;
  }
  .pagehero{
    padding:56px 0 44px !important;
  }
  .pagehero h1{
    font-size:clamp(36px,9vw,46px) !important;
  }
  .normative-major-grid{
    gap:28px !important;
  }
  .normative-standard-item{
    grid-template-columns:130px 1fr !important;
  }
  .iso-standard-mark{
    width:130px !important;
  }
  .iso-standard-mark img{
    width:120px !important;
    height:82px !important;
  }
  .iso-standard-mark span{
    font-size:28px !important;
  }
}
@media(max-width:520px){
  .hero h1,.hero .hero-title{
    font-size:40px !important;
    line-height:1 !important;
  }
  .section h2,.normative-major-head h2{
    font-size:32px !important;
  }
  .normative-standard-item{
    grid-template-columns:1fr !important;
    text-align:left !important;
  }
  .iso-standard-mark{
    margin:0 !important;
  }
}

/* ---------- Dark mode: ISO más legible ---------- */
html[data-theme="dark"] .iso-standard-mark img{
  filter:brightness(1.18) contrast(1.08) !important;
}
html[data-theme="dark"] .iso-standard-mark span{
  color:#3f9fe8 !important;
}

/* V31 — Recursos reconstruidos desde la referencia exacta */
.cyber-resources{
  padding-top:54px !important;
  padding-bottom:56px !important;
}
.shared-resources-ref{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:42px;
  margin-top:20px;
}
.shared-resource-ref{
  display:grid;
  grid-template-columns:minmax(260px,1.08fr) minmax(200px,.92fr);
  align-items:center;
  gap:26px;
  text-decoration:none;
  color:var(--ink);
}
.shared-resource-ref img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
  border-radius:14px;
}
.shared-resource-ref h3{
  margin:0 0 7px;
  font-size:20px !important;
  line-height:1.15 !important;
  color:var(--ink);
}
.shared-resource-ref p{
  margin:0 0 14px;
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}
.shared-resource-ref span{
  color:var(--accent) !important;
  font-size:14px;
  font-weight:800;
}
@media(max-width:980px){
  .shared-resources-ref{grid-template-columns:1fr}
}
@media(max-width:620px){
  .shared-resource-ref{grid-template-columns:1fr}
}

/* V32 — aliados: formato visual aprobado, 4 + 3 centrado */
.brand-card-grid{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:18px;
  margin-top:24px;
}
.brand-card{
  grid-column:span 2;
  min-height:190px;
  padding:24px 26px 20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--panel);
  text-decoration:none;
  color:var(--ink);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  box-shadow:0 8px 24px rgba(16,38,61,.05);
}
.brand-card:nth-child(5){grid-column:2 / span 2}
.brand-card:nth-child(6){grid-column:4 / span 2}
.brand-card:nth-child(7){grid-column:6 / span 2}
.brand-card img{
  width:100%;
  height:62px;
  object-fit:contain;
  object-position:left center;
  margin:0 0 14px;
}
.brand-card h3{
  margin:0 0 6px;
  font-size:15px !important;
  line-height:1.2 !important;
}
.brand-card p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}
html[data-theme="dark"] .brand-card{
  background:transparent;
  box-shadow:none;
}
html[data-theme="dark"] .brand-card img{
  filter:none;
}
/* Transparencias limpias en dark para CertiProf e INCIBE */
html[data-theme="dark"] .credential-card.ceh-real .credential-real-badge,
html[data-theme="dark"] .shared-resource-ref img[alt^="INCIBE"]{
  background:transparent !important;
}
@media(max-width:1000px){
  .brand-card-grid{grid-template-columns:repeat(2,1fr)}
  .brand-card,.brand-card:nth-child(5),.brand-card:nth-child(6),.brand-card:nth-child(7){grid-column:auto}
}
@media(max-width:620px){
  .brand-card-grid{grid-template-columns:1fr}
}

/* V33 — logos limpios: sin halo blanco y con variante óptica para dark mode */
.brand-logo-pair{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  height:62px;
  margin:0 0 14px;
}
.brand-logo-pair img{
  display:block;
  width:auto !important;
  max-width:100% !important;
  height:58px !important;
  max-height:58px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.brand-logo-dark{display:none !important}
html[data-theme="dark"] .brand-logo-light{display:none !important}
html[data-theme="dark"] .brand-logo-dark{display:block !important}

/* Homologación óptica por marca */
.brand-card:nth-child(1) .brand-logo-pair img{height:54px !important}
.brand-card:nth-child(2) .brand-logo-pair img{height:50px !important}
.brand-card:nth-child(3) .brand-logo-pair img{height:48px !important}
.brand-card:nth-child(4) .brand-logo-pair img{height:55px !important}
.brand-card:nth-child(5) .brand-logo-pair img{height:54px !important}
.brand-card:nth-child(6) .brand-logo-pair img{height:50px !important}
.brand-card:nth-child(7) .brand-logo-pair img{height:52px !important}

/* V34 — limpieza real de logos para light/dark: sin matte ni halos */
.brand-logo-pair{
  height:62px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin:0 0 14px !important;
}
.brand-logo-pair img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:58px !important;
  object-fit:contain !important;
  object-position:left center !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}
.brand-logo-dark{display:none !important}
html[data-theme="dark"] .brand-logo-light{display:none !important}
html[data-theme="dark"] .brand-logo-dark{display:block !important}

/* CertiProf limpio */
.credential-badge-pair{
  width:132px;
  height:132px;
  flex:0 0 132px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.credential-badge-pair img{
  display:block;
  max-width:132px;
  max-height:132px;
  width:auto;
  height:auto;
  object-fit:contain;
  background:transparent !important;
  border:0 !important;
}
.credential-badge-dark{display:none !important}
html[data-theme="dark"] .credential-badge-light{display:none !important}
html[data-theme="dark"] .credential-badge-dark{display:block !important}

/* INCIBE limpio */
.incibe-logo-pair{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:150px;
}
.incibe-logo-pair img{
  display:block;
  width:auto !important;
  max-width:100% !important;
  max-height:145px !important;
  height:auto !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.incibe-logo-dark{display:none !important}
html[data-theme="dark"] .incibe-logo-light{display:none !important}
html[data-theme="dark"] .incibe-logo-dark{display:block !important}

/* Evitar cualquier fondo heredado en dark */
html[data-theme="dark"] .credential-card.ceh-real,
html[data-theme="dark"] .shared-resource-ref{
  background:transparent !important;
}

/* V41 — brand layer rebuilt from clean assets */
.partners-final .brand-card{
  overflow:hidden;
}
.partners-final .brand-logo-v41{
  width:100%!important;
  height:76px!important;
  margin:0 0 16px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-position:left center!important;
  background-size:contain!important;
  box-shadow:none!important;
}
.partners-final .brand-blancco{background-image:url('../img/brands/v41/blancco-light.png')!important;background-size:auto 56px!important}
.partners-final .brand-controlcase{background-image:url('../img/brands/v41/controlcase-light.png')!important;background-size:auto 58px!important}
.partners-final .brand-webroot{background-image:url('../img/brands/v41/webroot.png')!important;background-size:auto 49px!important}
.partners-final .brand-bitdefender{background-image:url('../img/brands/v41/bitdefender-light.png')!important;background-size:auto 62px!important}
.partners-final .brand-arista{background-image:url('../img/brands/v41/arista-light.png')!important;background-size:auto 58px!important}
.partners-final .brand-easeus{background-image:url('../img/brands/v41/easeus.png')!important;background-size:auto 51px!important}
.partners-final .brand-barracuda{background-image:url('../img/brands/v41/barracuda-light.png')!important;background-size:auto 52px!important}

html[data-theme="dark"] .partners-final .brand-blancco{background-image:url('../img/brands/v41/blancco-dark.png')!important}
html[data-theme="dark"] .partners-final .brand-controlcase{background-image:url('../img/brands/v41/controlcase-dark.png')!important}
html[data-theme="dark"] .partners-final .brand-bitdefender{background-image:url('../img/brands/v41/bitdefender-dark.png')!important}
html[data-theme="dark"] .partners-final .brand-arista{background-image:url('../img/brands/v41/arista-dark.png')!important}
html[data-theme="dark"] .partners-final .brand-barracuda{background-image:url('../img/brands/v41/barracuda-dark.png')!important}

/* kill all legacy logo rules inside these seven cards */
.partners-final .brand-card > img,
.partners-final .brand-logo-pair,
.partners-final .brand-picture,
.partners-final .brand-picture-v40{
  display:none!important;
}

html[data-theme="dark"] .partners-final .brand-easeus{
  background-image:url('../img/brands/v41/easeus-dark.png')!important;
}
/* V41.1 — final optical sizing: only the four pending marks */
.partners-final .brand-controlcase{background-size:auto 46px!important;background-position:left center!important}
.partners-final .brand-webroot{background-size:auto 31px!important;background-position:left center!important}
.partners-final .brand-bitdefender{background-size:auto 46px!important;background-position:left center!important}
.partners-final .brand-easeus{background-size:auto 42px!important;background-position:left center!important}
/* v41.2 — final Webroot/Bitdefender optical correction */
.partners-final .brand-webroot{
  background-image:url('../img/brands/v41/webroot-light.png')!important;
  background-size:auto 42px!important;
  background-position:left center!important;
  background-repeat:no-repeat!important;
}
html[data-theme="dark"] .partners-final .brand-webroot{
  background-image:url('../img/brands/v41/webroot-dark.png')!important;
}
.partners-final .brand-bitdefender{
  background-size:auto 58px!important;
  background-position:left center!important;
  background-repeat:no-repeat!important;
}

/* v41.3 — Webroot final */
.partners-final .brand-webroot{
  background-image:url('../img/brands/v41/webroot-light.png')!important;
  background-size:contain!important;
  background-position:left center!important;
  background-repeat:no-repeat!important;
  width:min(100%,360px)!important;
  height:72px!important;
}
html[data-theme="dark"] .partners-final .brand-webroot{
  background-image:url('../img/brands/v41/webroot-dark.png')!important;
}

/* v41.7 — surgical recovery from last good base */

/* ISO: high-quality transparent mark, same existing structure */
.normative-major .iso-standard-mark{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.normative-major .iso-standard-mark img{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
  object-fit:contain!important;
}

/* Certifications: no enclosing boxes/plates */
.credential-card{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .credential-card,
html[data-theme="light"] .credential-card{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* v41.8 — Bitdefender Threat Map HD, estable en light/dark */
.shared-resource-ref img[src*="bitdefender-threat-map-hd"],
.cyber-resources img[src*="bitdefender-threat-map-hd"]{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:cover!important;
  object-position:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
}
html[data-theme="dark"] .shared-resource-ref img[src*="bitdefender-threat-map-hd"],
html[data-theme="light"] .shared-resource-ref img[src*="bitdefender-threat-map-hd"]{
  filter:none!important;
  opacity:1!important;
}

/* v41.9 — Threat Map específico para light/dark */
.bitdefender-threat-theme{
  display:block!important;
  width:100%!important;
}
.bitdefender-threat-theme img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:cover!important;
  object-position:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
}
.bitdefender-threat-dark{display:none!important}
html[data-theme="dark"] .bitdefender-threat-light{display:none!important}
html[data-theme="dark"] .bitdefender-threat-dark{display:block!important}
html[data-theme="light"] .bitdefender-threat-light{display:block!important}
html[data-theme="light"] .bitdefender-threat-dark{display:none!important}

/* v42 — illustrations on inner service pages; existing text untouched */
.service-illustration-section{
  padding:28px 0 0!important;
}
.service-illustration{
  display:block!important;
  width:100%!important;
  height:250px!important;
  object-fit:cover!important;
  object-position:center!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .service-illustration{
  border-color:rgba(84,124,154,.35)!important;
}

/* Nuestro enfoque — approved unique image */
.featureimg.featureimg-enfoque{
  background-image:url("../img/enfoque-mmp.jpg")!important;
  background-position:center!important;
  background-size:cover!important;
}

/* Contacto — one compact header, three data blocks */
.page-contacto .contact-pagehero{
  padding:58px 0 48px!important;
}
.page-contacto .contact-pagehero h1{
  margin-bottom:12px!important;
}
.page-contacto .contact-pagehero p{
  margin:0!important;
  max-width:900px!important;
}
.page-contacto .contact-pagehero .contact-scope{
  margin-top:9px!important;
  font-size:16px!important;
}
.page-contacto .section{
  padding-top:42px!important;
}
.page-contacto .contactdata{
  grid-template-columns:1fr 1.35fr 1fr!important;
  gap:12px!important;
  margin-top:0!important;
}
.page-contacto .contactdata a{
  min-height:82px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
@media(max-width:800px){
  .service-illustration{height:210px!important}
  .page-contacto .contactdata{grid-template-columns:1fr!important}
}

.regulatory-note{margin-top:10px!important;font-size:14px!important;line-height:1.45!important;opacity:.9!important}

/* v46 — contacto: sin branding redundante dentro del contenido */
.page-contacto .contact-pagehero .kicker:empty{display:none!important}
.page-contacto .contactgrid > div > .kicker:empty{display:none!important}

/* v48 hardening — no inline styles */
.visualcard-cyber{background-image:url('../img/scene-2.jpg')!important}
.visualcard-infra{background-image:url('../img/scene-3.jpg')!important}
.visualcard-infosec{background-image:url('../img/seguridad-informacion-home.jpg')!important}
.visualcard-managed{background-image:url('../img/scene-1.jpg')!important}
.form-submit{border:0!important;cursor:pointer!important}

/* v49 final — logo principal con mayor presencia */
.siteheader .brand img,
header .brand img{
  width:245px !important;
  max-width:245px !important;
  height:auto !important;
  max-height:76px !important;
}
@media (max-width:760px){
  .siteheader .brand img,
  header .brand img{
    width:205px !important;
    max-width:205px !important;
    max-height:66px !important;
  }
}

/* v50 — reparación del header: mayor presencia real del logo */
.siteheader{
  min-height:170px !important;
}
.siteheader .container,
.siteheader .navwrap{
  min-height:170px !important;
  align-items:center !important;
}
.siteheader .brand{
  display:flex !important;
  align-items:center !important;
  flex-shrink:0 !important;
}
.siteheader .brand img{
  width:310px !important;
  max-width:310px !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
}
@media (max-width:980px){
  .siteheader{
    min-height:130px !important;
  }
  .siteheader .container,
  .siteheader .navwrap{
    min-height:130px !important;
  }
  .siteheader .brand img{
    width:245px !important;
    max-width:245px !important;
  }
}
@media (max-width:760px){
  .siteheader{
    min-height:auto !important;
  }
  .siteheader .container,
  .siteheader .navwrap{
    min-height:auto !important;
  }
  .siteheader .brand img{
    width:205px !important;
    max-width:205px !important;
  }
}

/* v50 — reparación REAL del header.
   El HTML usa <header><div class="wrap nav">, no .siteheader. */
header .wrap.nav{
  width:min(1680px,calc(100% - 80px)) !important;
  height:158px !important;
  grid-template-columns:340px 1fr auto !important;
  gap:30px !important;
  align-items:center !important;
}

header .brandbox{
  width:330px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
}

header .brand{
  display:block !important;
  width:100% !important;
}

header .brand img{
  display:block !important;
  width:315px !important;
  max-width:315px !important;
  max-height:none !important;
  height:auto !important;
  object-fit:contain !important;
}

header .slogan{
  font-size:11px !important;
  line-height:1.15 !important;
  margin:4px 0 0 18px !important;
  letter-spacing:.3px !important;
}

@media (max-width:1450px){
  header .wrap.nav{
    width:min(1320px,calc(100% - 48px)) !important;
    height:138px !important;
    grid-template-columns:285px 1fr auto !important;
    gap:20px !important;
  }
  header .brandbox{width:275px !important}
  header .brand img{
    width:265px !important;
    max-width:265px !important;
  }
  header nav{gap:16px !important;font-size:12px !important}
  header .slogan{font-size:10px !important}
}

@media (max-width:1050px){
  header .wrap.nav{
    height:118px !important;
    grid-template-columns:230px 1fr auto !important;
  }
  header .brandbox{width:220px !important}
  header .brand img{
    width:215px !important;
    max-width:215px !important;
  }
  header .slogan{font-size:9px !important;margin-left:10px !important}
}

@media (max-width:720px){
  header .wrap.nav{
    width:min(100% - 32px,1240px) !important;
    height:76px !important;
    grid-template-columns:1fr auto !important;
  }
  header .brandbox{width:auto !important}
  header .brand img{
    width:190px !important;
    max-width:190px !important;
  }
  header .slogan{display:none !important}
}

/* v50 — optimización final del header */
header nav{
  font-size:14px !important;
  font-weight:500 !important;
  gap:24px !important;
}

header nav a{
  line-height:1.2 !important;
}

header .contactbtn,
header a.contactbtn,
header .btn-contact{
  font-size:14px !important;
  font-weight:700 !important;
}

header .slogan{
  font-size:12px !important;
  line-height:1.15 !important;
  margin-top:5px !important;
}

@media (max-width:1450px){
  header nav{
    font-size:13px !important;
    gap:18px !important;
  }
  header .contactbtn,
  header a.contactbtn,
  header .btn-contact{
    font-size:13px !important;
  }
  header .slogan{
    font-size:11px !important;
  }
}

@media (max-width:1050px){
  header nav{
    font-size:12px !important;
    gap:14px !important;
  }
  header .contactbtn,
  header a.contactbtn,
  header .btn-contact{
    font-size:12px !important;
  }
}

/* v50 — corrección final REAL de tipografía del header */
header nav{
  font-size:18px !important;
  font-weight:600 !important;
  gap:28px !important;
}

header nav a{
  font-size:18px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  padding:10px 0 14px !important;
  position:relative !important;
}

header nav a.active::after,
header nav a[aria-current="page"]::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  bottom:0 !important;
  width:34px !important;
  height:4px !important;
  transform:translateX(-50%) !important;
  background:#1689df !important;
  border-radius:3px !important;
}

header .contactbtn,
header a.contactbtn,
header .btn-contact{
  font-size:18px !important;
  font-weight:700 !important;
}

header .slogan{
  font-size:13px !important;
  font-weight:600 !important;
}

@media (max-width:1450px){
  header nav{
    font-size:16px !important;
    gap:20px !important;
  }
  header nav a{
    font-size:16px !important;
  }
  header .contactbtn,
  header a.contactbtn,
  header .btn-contact{
    font-size:16px !important;
  }
}

@media (max-width:1180px){
  header nav{
    font-size:14px !important;
    gap:15px !important;
  }
  header nav a{
    font-size:14px !important;
  }
  header .contactbtn,
  header a.contactbtn,
  header .btn-contact{
    font-size:14px !important;
  }
}

@media (max-width:980px){
  header nav{
    font-size:13px !important;
    gap:12px !important;
  }
  header nav a{
    font-size:13px !important;
  }
}
