/* =========================================================================
   ZION Cybersecurity — Rediseño 2026 (Fase 2)
   Hoja de estilos dedicada al rediseño. Se carga DESPUÉS de main.css/
   custom.css para poder sobreescribir con seguridad sin tocar los
   archivos generados por CoffeeCup.
   ========================================================================= */

:root{
  --zion-bg: #060b14;
  --zion-surface: #0d1520;
  --zion-surface-2: #121c2b;
  --zion-border: #1c2836;
  --zion-text: #eef3f1;
  --zion-text-muted: #8695a3;
  --zion-green: #00e600;
  --zion-green-dim: #0a3d1f;
  --zion-cyan: #2fd9ff;
  --zion-cyan-dim: #0a2b3a;
  --zion-font-display: 'Space Grotesk', sans-serif;
  --zion-font-body: 'Inter', sans-serif;
  --zion-font-mono: 'JetBrains Mono', monospace;
}

/* ---------- Header / Nav ---------- */

.zion-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 32px; background:var(--zion-bg); border-bottom:1px solid var(--zion-border);
  position:relative; z-index:50; font-family:var(--zion-font-body);
}
.zion-logo-group{display:flex; flex-direction:column; gap:2px;}
.zion-logo{display:flex; align-items:center;}
.zion-logo img{display:block;}
.zion-logo-tagline{
  font-family:var(--zion-font-body); font-size:9.5px; font-weight:500;
  letter-spacing:0.4px; color:var(--zion-text-muted); text-transform:uppercase;
}
.zion-nav-desktop{display:flex; align-items:center; gap:34px; font-size:14px; color:var(--zion-text-muted);}
.zion-nav-desktop > a{color:var(--zion-text-muted); text-decoration:none; transition:color .2s;}
.zion-nav-desktop > a:hover{color:var(--zion-text);}

.zion-has-dropdown{position:relative;}
.zion-has-dropdown > a{display:flex; align-items:center; gap:5px; cursor:pointer; color:var(--zion-text-muted); text-decoration:none;}
.zion-has-dropdown > a:hover{color:var(--zion-text);}
.zion-chev{font-size:10px; transition:transform .2s;}
.zion-has-dropdown.open .zion-chev, .zion-has-dropdown:hover .zion-chev{transform:rotate(180deg);}

.zion-mega-menu{
  position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%) translateY(-8px);
  width:640px; background:var(--zion-surface); border:1px solid var(--zion-border); border-radius:12px;
  padding:22px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:4px;
  box-shadow:0 20px 50px rgba(0,0,0,0.5);
  opacity:0; pointer-events:none; transition:opacity .18s, transform .18s;
  z-index:60;
}
.zion-has-dropdown.open .zion-mega-menu, .zion-has-dropdown:hover .zion-mega-menu{
  opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0);
}
.zion-mega-item{
  padding:12px 10px 12px 14px; border-radius:8px; transition:background .15s, border-color .15s;
  display:flex; flex-direction:column; gap:3px; border-left:2px solid transparent;
  text-decoration:none;
}
.zion-mega-item:hover{
  background:var(--zion-surface-2); border-left:2px solid var(--zion-cyan);
  box-shadow:inset 0 0 18px rgba(47,217,255,0.08);
}
.zion-mega-item .cat{font-size:12.5px; color:var(--zion-text); font-weight:500; line-height:1.3; transition:color .15s;}
.zion-mega-item:hover .cat{color:#fff;}
.zion-mega-item .brand{font-family:var(--zion-font-mono); font-size:11px; color:var(--zion-cyan); transition:text-shadow .15s;}
.zion-mega-item:hover .brand{text-shadow:0 0 8px rgba(47,217,255,0.7);}

.zion-btn-contact{
  background:var(--zion-green); color:#04240f; font-weight:600; font-size:13.5px;
  padding:10px 20px; border-radius:6px; letter-spacing:0.2px; text-decoration:none;
  transition:box-shadow .25s;
}
.zion-btn-contact:hover{box-shadow:0 0 18px rgba(0,230,0,0.4);}

/* hamburguesa mobile */
.zion-mobile-toggle{
  display:none; width:44px; height:44px; border:1px solid var(--zion-border); border-radius:8px;
  flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer;
}
.zion-mobile-toggle span{width:18px; height:2px; background:var(--zion-text);}

/* overlay mobile de pantalla completa */
.zion-mobile-overlay{
  display:none; position:fixed; inset:0; background:var(--zion-bg); z-index:200;
  flex-direction:column; padding-top:24px; overflow-y:auto;
}
.zion-mobile-overlay.open{display:flex;}
.zion-mobile-top{display:flex; align-items:center; justify-content:space-between; padding:0 18px 22px; border-bottom:1px solid var(--zion-border);}
.zion-mobile-close{
  width:44px; height:44px; border:1px solid var(--zion-border); border-radius:8px;
  display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--zion-text-muted);
  cursor:pointer;
}
.zion-mobile-list{display:flex; flex-direction:column; padding:20px 22px; gap:6px;}
.zion-mobile-item{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 4px; border-bottom:1px solid var(--zion-border);
  font-family:var(--zion-font-display); font-weight:600; font-size:21px; color:var(--zion-text);
  text-decoration:none; cursor:pointer;
}
.zion-mobile-item .arrow{color:var(--zion-text-muted); font-size:16px;}

.zion-accordion-item .zion-mobile-item .arrow{transition:transform .25s;}
.zion-accordion-item.open .zion-mobile-item .arrow{transform:rotate(90deg); color:var(--zion-cyan);}
.zion-accordion-panel{max-height:0; overflow:hidden; transition:max-height .3s ease; display:flex; flex-direction:column;}
.zion-accordion-item.open .zion-accordion-panel{max-height:600px;}
.zion-accordion-sub{
  display:flex; flex-direction:column; gap:2px; padding:6px 4px 14px 14px;
  border-left:2px solid var(--zion-cyan-dim);
}
.zion-accordion-sub .row{
  padding:9px 8px 9px 12px; border-radius:6px; border-left:2px solid transparent;
  transition:background .15s, border-color .15s; text-decoration:none;
}
.zion-accordion-sub .row:hover, .zion-accordion-sub .row:active{
  background:var(--zion-surface); border-left:2px solid var(--zion-cyan);
  box-shadow:inset 0 0 16px rgba(47,217,255,0.08);
}
.zion-accordion-sub .cat{display:block; font-size:13.5px; color:var(--zion-text); font-weight:500; transition:color .15s;}
.zion-accordion-sub .row:hover .cat, .zion-accordion-sub .row:active .cat{color:#fff;}
.zion-accordion-sub .brand{display:block; font-family:var(--zion-font-mono); font-size:10.5px; color:var(--zion-cyan); margin-top:2px; transition:text-shadow .15s;}
.zion-accordion-sub .row:hover .brand, .zion-accordion-sub .row:active .brand{text-shadow:0 0 8px rgba(47,217,255,0.7);}

.zion-menu-cta{
  display:block; margin:14px 22px 20px; background:var(--zion-green); color:#04240f;
  text-align:center; padding:16px; border-radius:8px; font-weight:700;
  font-family:var(--zion-font-body); font-size:15.5px; letter-spacing:0.2px; text-decoration:none;
}
.zion-menu-footer-note{
  text-align:center; font-family:var(--zion-font-mono); font-size:10.5px; color:var(--zion-text-muted);
  padding-bottom:24px;
}

@media(max-width:820px){
  .zion-nav-desktop, .zion-btn-contact{display:none;}
  .zion-mobile-toggle{display:flex;}
}

/* utilidades de scroll-reveal usadas en bloques siguientes de la Fase 2 */
.zion-reveal{opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease;}
.zion-reveal.in{opacity:1; transform:none;}
@media(prefers-reduced-motion: reduce){
  .zion-reveal{opacity:1; transform:none; transition:none;}
}

/* =========================================================================
   Bloque 2 — Hero con canvas de red de nodos + tarjetas de soluciones
   ========================================================================= */

/* base oscura global, forzada para ganar sobre main.css */
body{background:var(--zion-bg) !important; color:var(--zion-text) !important; font-family:var(--zion-font-body);}
h1,h2,h3,h4,h5,h6{font-family:var(--zion-font-display);}

.zion-hero{position:relative; overflow:hidden; border-bottom:1px solid var(--zion-border); background:var(--zion-bg);}
.zion-hero canvas{position:absolute; inset:0; width:100%; height:100%; opacity:0.85;}
.zion-hero::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(6,11,20,0.55) 0%, rgba(6,11,20,0.15) 45%, transparent 70%);
}
.zion-hero-inner{position:relative; z-index:2; padding:120px 32px 100px; max-width:780px; margin:0 auto; text-align:center;}
.zion-eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--zion-font-mono);
  font-size:12px; color:var(--zion-cyan); background:var(--zion-cyan-dim); border:1px solid #164a5e;
  padding:6px 14px; border-radius:20px; margin-bottom:28px;
}
.zion-dot{width:6px; height:6px; border-radius:50%; background:var(--zion-cyan); box-shadow:0 0 8px var(--zion-cyan);}
.zion-hero h1{font-size:46px; font-weight:700; line-height:1.15; letter-spacing:-0.5px; margin-bottom:20px; color:var(--zion-text);}
.zion-hero h1 em{font-style:normal; color:var(--zion-green);}
.zion-hero p{font-size:17px; color:var(--zion-text-muted); max-width:560px; margin:0 auto 36px;}
.zion-hero-ctas{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.zion-btn-primary{
  background:var(--zion-green); color:#04240f; font-weight:600; font-size:15px;
  padding:14px 28px; border-radius:6px; transition:box-shadow .25s, transform .25s; text-decoration:none; display:inline-block;
}
.zion-btn-primary:hover{box-shadow:0 0 24px rgba(0,230,0,0.45); transform:translateY(-1px);}
.zion-btn-secondary{
  border:1px solid var(--zion-border); color:var(--zion-text); font-weight:500; font-size:15px;
  padding:14px 26px; border-radius:6px; transition:box-shadow .25s, border-color .25s, transform .25s; text-decoration:none; display:inline-block;
}
.zion-btn-secondary:hover{border-color:var(--zion-cyan); box-shadow:0 0 20px rgba(47,217,255,0.3); transform:translateY(-1px);}

@media(max-width:820px){
  .zion-hero h1{font-size:32px;}
}

/* ---------- CTA principal de página de producto/marca (Fase 2, punto 9) ---------- */
.zion-product-cta{margin:24px 0 40px;}
.zion-product-cta .zion-btn-primary{font-size:16px; padding:15px 30px;}

/* ---------- tarjetas de soluciones (10) ---------- */
.zion-solutions{padding:90px 32px;}
.zion-sec-head{max-width:600px; margin:0 auto 54px; text-align:center;}
.zion-sec-head .zion-tag{font-family:var(--zion-font-mono); font-size:12px; color:var(--zion-green); margin-bottom:12px; display:block;}
.zion-sec-head h2{font-size:30px; font-weight:600; color:var(--zion-text);}
.zion-grid{max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.zion-card{
  background:var(--zion-surface); border:1px solid var(--zion-border); border-radius:10px;
  padding:26px; transition:border-color .3s, box-shadow .3s, transform .3s;
  text-decoration:none; display:block;
}
.zion-card:hover{border-color:var(--zion-cyan); box-shadow:0 0 26px rgba(47,217,255,0.16); transform:translateY(-3px);}
.zion-card-icon{
  width:38px; height:38px; border-radius:8px; background:var(--zion-green-dim);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
  color:var(--zion-green); font-size:13px; font-weight:700; font-family:var(--zion-font-mono);
}
.zion-card h3{font-size:16px; font-weight:600; margin-bottom:8px; color:var(--zion-text);}
.zion-card .brand{font-family:var(--zion-font-mono); font-size:12px; color:var(--zion-cyan); margin-bottom:10px; display:block;}
.zion-card p{font-size:13.5px; color:var(--zion-text-muted); margin:0;}

@media(max-width:820px){
  .zion-grid{grid-template-columns:1fr;}
}

/* ---------- retema oscuro de las secciones existentes de ManageEngine (sin tocar su HTML) ---------- */
.container.product-overview,
.container.section_newsletter,
.container.product-details-wrapper,
.container.product-description,
.container.section-head-wrapper{
  background:var(--zion-bg) !important;
}
/* la 1a fila del grid de product-details-wrapper venia fija en 100px (main.css),
   pensada para el H2 mas pequeno original; con el titulo ahora en H1 (Fase 3,
   auditoria de jerarquia) el texto se sale de esa altura fija y se monta sobre
   el boton de CTA de la fila de abajo -- se deja crecer segun el contenido. */
.container.product-details-wrapper{
  grid-template-rows:auto auto !important;
}
.product-card.featured-product,
.container.product-card{
  background:var(--zion-surface) !important; border:1px solid var(--zion-border) !important; border-radius:10px;
}
.product-title, .product-section-title, .heading-2, h1, h2, h3, h4, h5, h6{
  color:var(--zion-text) !important;
}
.paragraph, .paragraph span, blockquote, blockquote span{
  color:var(--zion-text-muted) !important;
}
.card-btn, a.link-button.button{
  background:var(--zion-green) !important; color:#04240f !important; border-radius:6px !important;
  transition:box-shadow .25s;
}
.card-btn:hover, a.link-button.button:hover{box-shadow:0 0 18px rgba(0,230,0,0.4);}
.rule hr{border-color:var(--zion-border) !important;}

/* =========================================================================
   Bloque 3 — Footer completo
   ========================================================================= */

.container.footer{background:var(--zion-bg) !important; border-top:1px solid var(--zion-border); padding:0 !important;}

.zion-values-section{
  background:var(--zion-green); max-width:1180px; margin:48px auto 50px; padding:44px 32px;
  border-radius:14px;
}
.zion-values-header{
  font-family:var(--zion-font-display); font-size:15px; font-weight:700; color:#04240f;
  text-align:center; margin-bottom:32px; letter-spacing:0.3px;
}
.zion-values-list{display:grid; grid-template-columns:repeat(4,1fr); gap:0;}
.zion-value-item{padding:0 22px; border-left:1px solid rgba(4,36,15,0.25);}
.zion-value-item:first-child{border-left:none; padding-left:0;}
.zion-value-icon{
  width:30px; height:30px; border-radius:7px; background:rgba(4,36,15,0.15);
  display:flex; align-items:center; justify-content:center; color:#04240f; font-size:14px; margin-bottom:14px;
}
.zion-value-text-secondary{
  font-family:var(--zion-font-display); font-size:12.5px; font-weight:700; color:#04240f;
  margin-bottom:10px; letter-spacing:0.2px;
}
.zion-value-text{font-size:12.5px; color:#123a1f; line-height:1.6;}

.zion-footer-grid{
  max-width:1180px; margin:0 auto 32px; padding:0 32px; display:grid;
  grid-template-columns:1.4fr 1fr 1.3fr 0.8fr 1fr; gap:24px;
}
.zion-footer-col-title{
  font-size:12px; color:var(--zion-text-muted); font-weight:500; margin-bottom:14px;
  letter-spacing:0.4px; font-family:var(--zion-font-body); text-transform:uppercase;
}
.zion-footer-col a, .zion-footer-col p{display:block; font-size:13px; color:#6b7986; margin-bottom:8px; text-decoration:none;}
.zion-footer-col a:hover{color:var(--zion-cyan);}
.zion-footer-quarter{font-family:var(--zion-font-mono); color:var(--zion-text-muted) !important;}
.zion-social-icons{display:flex; gap:10px;}
.zion-social-icons a{
  width:36px; height:36px; border-radius:8px; background:var(--zion-surface-2);
  display:flex; align-items:center; justify-content:center; border:1px solid var(--zion-border);
  margin-bottom:0;
}
.zion-social-icons img{width:18px; height:18px; object-fit:contain;}

.zion-footer-bottom{
  max-width:1180px; margin:0 auto; padding:22px 32px 40px; border-top:1px solid var(--zion-border);
  font-size:12px; color:#4a5661;
}

@media(max-width:820px){
  .zion-values-section{margin:32px 16px 40px; border-radius:14px;}
  .zion-values-list{grid-template-columns:1fr; gap:26px;}
  .zion-value-item{border-left:none; border-top:1px solid rgba(4,36,15,0.25); padding:22px 0 0;}
  .zion-value-item:first-child{border-top:none; padding-top:0;}
  .zion-footer-grid{grid-template-columns:1fr 1fr;}
}

/* =========================================================================
   Bloque 4 — Banner de cookies
   ========================================================================= */
.zion-cookie{
  position:fixed; left:20px; right:20px; bottom:20px; z-index:1000;
  max-width:1180px; margin:0 auto; background:var(--zion-surface-2); border:1px solid var(--zion-green);
  border-radius:10px; padding:16px 20px; display:flex; align-items:center; gap:18px;
  justify-content:space-between; flex-wrap:wrap;
  box-shadow:0 10px 40px rgba(0,0,0,0.4);
  font-family:var(--zion-font-body);
  animation:zionCookieSlideUp .4s ease;
}
@keyframes zionCookieSlideUp{ from{transform:translateY(20px); opacity:0;} to{transform:translateY(0); opacity:1;} }
.zion-cookie.hidden{display:none;}
.zion-cookie p{font-size:13px; color:var(--zion-text-muted); flex:1; min-width:260px; margin:0;}
.zion-cookie p a{color:var(--zion-green); text-decoration:underline;}
.zion-cookie-btns{display:flex; gap:10px;}
.zion-cookie-btns button{
  font-family:inherit; font-size:12.5px; font-weight:600; border:none; border-radius:6px;
  padding:14px 18px; cursor:pointer; min-height:44px;
}
.zion-cookie-accept{background:var(--zion-green); color:#04240f;}
.zion-cookie-reject{background:transparent; border:1px solid var(--zion-border) !important; color:var(--zion-text);}

@media(prefers-reduced-motion: reduce){
  .zion-cookie{animation:none;}
}

/* ---------- página de Eventos (Fase 2, punto 10) ---------- */
.zion-events-h1{
  font-family:var(--zion-font-display); font-size:32px; font-weight:700; color:var(--zion-text);
  text-align:center; margin:56px 32px 0; padding-top:1px;
}
.zion-events-upcoming{padding:32px 32px 40px; max-width:720px; margin:0 auto; text-align:center;}
.zion-events-upcoming h2{font-size:28px; color:var(--zion-text); margin-bottom:10px;}
.zion-quarter-dynamic{font-family:var(--zion-font-mono); font-size:13px; color:var(--zion-cyan); margin-bottom:18px;}
.zion-events-upcoming p{color:var(--zion-text-muted); font-size:16px; margin-bottom:24px;}
.zion-events-past{padding:20px 32px 90px; max-width:900px; margin:0 auto;}
.zion-events-past h2{font-size:28px; color:var(--zion-text); margin-bottom:30px; text-align:center;}
.zion-event-card{
  background:var(--zion-surface); border:1px solid var(--zion-border); border-radius:10px;
  padding:26px 28px; margin-bottom:18px; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px;
}
.zion-event-card h3{font-size:17px; color:var(--zion-text); margin:0 0 6px;}
.zion-event-card p{font-size:14px; color:var(--zion-text-muted); margin:0;}
.zion-event-card a{color:var(--zion-green); font-weight:600; text-decoration:none; white-space:nowrap;}
.zion-event-card a:hover{text-decoration:underline;}
.zion-event-details-card{
  background:var(--zion-surface); border:1px solid var(--zion-border); border-radius:10px;
  padding:18px 24px; margin:24px 0; display:inline-flex; gap:32px; flex-wrap:wrap;
}
.zion-event-details-card p{margin:0; font-size:14px; color:var(--zion-text);}
.zion-event-details-card strong{color:var(--zion-cyan);}

/* Equivalente de h5.about-content-h (main.css) para h2 -- la jerarquia de
   encabezados (Fase 3) promovio este heading de H5 a H2 en about.html y
   privacy-policy.html; las reglas originales en main.css estan escritas
   para el selector h5 y dejaron de aplicar. Mismos valores visuales. */
h2.about-content-h{
  padding-left:40px; font-size:22px; font-family:'Montserrat', sans-serif; text-align:center;
}
h2 span.heading-text-51, h2 span.heading-text-52{color:#00e600;}

/* =========================================================================
   Auditoria de regresion CSS post-jerarquia (Fase 3) -- re-chequeo sistematico
   solicitado tras el hallazgo de about.html: cada promocion/degradacion de
   nivel de heading puede dejar huerfano un selector de main.css atado a la
   etiqueta ANTIGUA (main.css estiliza casi todo por tag+clase, no por clase
   sola). Un caso por bloque, con el/las pagina(s) afectada(s) y el selector
   original de main.css que dejo de aplicar.
   ========================================================================= */

/* h1.heading-7 -> h2.heading-7 (Bloque 2, H1 sobrante bajado a H2):
   blackberry-access-request-a-demo.html, blackberry-cylance-request-a-demo.html,
   darktrace-enterprise-immune-system-request-a-demo-mexico.html, index.html,
   ivanti-it-management-software-mexico.html (x3 instancias). */
h2.heading-7{
  background-color:transparent;
  text-align:center;
}
@media screen and (min-width:64rem){
  h2.heading-7{font-size:48px;}
}

/* h1.heading-15 -> h2.heading-15 (Bloque 2, Patron B):
   cyera-ai-native-..., cylance-optics-..., darktrace-antigena-...,
   darktrace-self-learning-..., manageengine-gestion-unificada-...,
   secure-work-from-home-with-blackberry-access.html, securiti-ai-...,
   solucion-de-mesa-de-ayuda-..., soluciones-de-gestion-de-eventos-...,
   soluciones-de-gestion-de-identidades-..., soluciones-de-gestion-de-operaciones-... */
h2.heading-15{text-align:center;}

/* h2.product-title -> h1.product-title (ronda final, darktrace-cyber-ai-platform.html:
   el H2 "DARKTRACE Cyber AI Platform" se promovio a H1; main.css no tiene una
   regla base para h1 sin clase, asi que este heading se quedo sin NINGUN estilo
   propio -- solo el default del navegador. Se replica el h2.product-title
   original (text-align:left) mas los valores base del h2{} generico de
   main.css, ya que h1 tampoco hereda ese fallback. */
h1.product-title{
  text-align:left;
  margin-top:10px; margin-bottom:14px;
  letter-spacing:2px; font-size:36px; font-family:'Teko', sans-serif;
}

/* h3 span.heading-text-34 -> h2 span.heading-text-34 (index.html,
   "Ciberseguridad especializada para proteger el futuro digital de tu empresa") */
h2 span.heading-text-34{color:#fff;}

/* h4 span.heading-text-35 -> h3 span.heading-text-35 (index.html, "Testimoniales") */
h3 span.heading-text-35{color:#fff;}

/* h6 span.heading-text-9 -> h2 span.heading-text-9 (darktrace-cyber-ai-platform.html,
   2 instancias: "El sistema de autoaprendizaje Enterprise Immune System" y
   "La tecnologia Antigena Autonomous Response"). Color base y color en el
   breakpoint >=97.625rem son distintos en el main.css original. */
h2 span.heading-text-9{color:#ef5e60;}
@media screen and (min-width:97.625rem){
  h2 span.heading-text-9{color:#ff8040;}
}

/* h3 span.heading-text-50 -> h2 span.heading-text-50 (cylance-endpoint-protection-...html,
   "CylancePROTECT"; color consistente en las 4 variantes/breakpoints de main.css) */
h2 span.heading-text-50{color:#00e600;}

/* h3 span.heading-text-49 -> h2 span.heading-text-49 (darktrace-mexico-proof-of-value.html,
   "Prueba de Valor de Darktrace") */
h2 span.heading-text-49{color:#00e600;}

/* =========================================================================
   Auditoria de cierre Fase 1-2-3 (escaneo estatico completo, sin historial de
   commits para Fase 1-2): 5 selectores huerfanos NUEVOS no detectados en el
   barrido anterior -- son los hijos internos (span/font/a) de headings que YA
   habian sido promovidos, no los headings mismos.
   ========================================================================= */

/* h1 a.heading-text-14 -> h2 a.heading-text-14 (Bloque 2, heading-7 con <a>
   envolvente): blackberry-access-request-a-demo.html,
   blackberry-cylance-request-a-demo.html,
   darktrace-enterprise-immune-system-request-a-demo-mexico.html.
   Antes del fix: el <a> se quedaba sin color/tamano propio. */
h2 a.heading-text-14{color:#00e600; font-size:1.375rem;}
@media screen and (min-width:64rem){
  h2 a.heading-text-14{font-size:1.5rem;}
}

/* h1 span.heading-text-4 -> h2 span.heading-text-4 (Bloque 2, heading-7,
   index.html "Proveedor de Software y Servicios de Ciberseguridad...") */
h2 span.heading-text-4{color:#fff;}

/* h2 span.heading-text-47 -> h1 span.heading-text-47 (darktrace-cyber-ai-platform.html,
   span interno de "DARKTRACE Cyber AI Platform"; el H2->H1 de product-title
   solo se corrigio para el heading externo, no para este span hijo.
   Antes del fix: color rgb(238,243,241) en vez de verde -- confirmado con
   getComputedStyle). */
h1 span.heading-text-47{color:#00e600;}

/* h6 font.heading-text-16 -> h2 font.heading-text-16 (darktrace-cyber-ai-platform.html,
   2 instancias -- el <font> interno de "El sistema de autoaprendizaje..." y
   "La tecnologia Antigena..."; el H6->H2 solo cubrio el span.heading-text-9
   externo, no este font hijo. Antes del fix: color rgb(244,130,36) [naranja,
   ganaba el atributo inline font sin CSS que lo overridee] y font-size 36px
   heredado, en vez de verde/18px -- confirmado con getComputedStyle). */
h2 font.heading-text-16{color:#00e600; font-size:1.125rem;}

/* h1 font.heading-text-48 -> h2 font.heading-text-48 (ivanti-it-management-software-mexico.html,
   "GESTION UNIFICADA DEL ENDPOINT", una de las 3 promociones heading-7 de
   Patron C tiene un <font> interno en vez de texto plano). */
h2 font.heading-text-48{color:#00e600;}

/* Hub de ManageEngine (manageengine-aplicaciones-en-la-nube-gestion-ti.html):
   el wrapper #gestion-ti de las 5 tarjetas nuevas reutiliza la clase
   .container.product-section.secondary-products de main.css, que trae un
   box-shadow decorativo con offset negativo (0 -5px 10px) pensado para las
   tarjetas de producto viejas -- ese glow se monta visualmente sobre el
   boton CTA "CONTACTAR AHORA" de la seccion anterior. Se neutraliza solo por
   ID en esta pagina; las otras 18 paginas que comparten esa misma clase
   conservan el glow original (es decorativo e intencional ahi). */
#gestion-ti{box-shadow:none;}

/* Mismo wrapper #gestion-ti: main.css tambien aplica transform:translateY(-59px)
   a .container.product-section.secondary-products (linea 673), pensado para
   que las tarjetas viejas de fondo blanco se "encimaran" ligeramente bajo el
   divisor de la seccion anterior. Con las tarjetas nuevas (.zion-card, fondo
   oscuro, sin ese diseno de solape intencional) ese desplazamiento de 59px
   hacia arriba monta el contenedor completo sobre el boton CTA del hero --
   superposicion fisica real, no solo visual del glow. Neutralizado solo por
   ID; las otras 18 paginas que comparten la clase conservan el translateY
   original (fue disenado para su layout, no es un bug ahi). */
#gestion-ti{transform:none;}

/* Se pidio conservar el acento verde decorativo que traia main.css en
   #gestion-ti, pero SIN el offset negativo que causaba el solape (0 -5px).
   En vez de un box-shadow en el contenedor completo, se aplica un glow
   verde simetrico (sin offset direccional) por tarjeta individual -- mismo
   idioma ya usado en el sitio para hover states (.zion-card:hover,
   .card-btn:hover, .zion-btn-primary:hover, todos con "0 0 Npx", sin
   desplazamiento). Ambient sutil siempre visible + intensificado en hover,
   con borde verde en vez del cyan por defecto de .zion-card:hover, para que
   el acento coincida con la marca ManageEngine (verde) del resto de esta
   pagina. */
#gestion-ti .zion-card{box-shadow:0 0 16px rgba(0,230,0,0.12);}
#gestion-ti .zion-card:hover{box-shadow:0 0 26px rgba(0,230,0,0.28); border-color:var(--zion-green);}

/* Bug confirmado (inspeccion visual en staging, 2026-08-06): el mismo
   transform:translateY(-59px) de main.css que se neutralizo arriba solo
   para #gestion-ti tambien afecta a las otras 19 paginas que comparten
   la clase .container.product-section.secondary-products (confirmado con
   getComputedStyle en ctpat-program-certification-and-compliance-mexico.html
   y secure-vpn-alternative-with-awingu-mexico.html: transform activo,
   11px de superposicion real sobre el boton "MAS INFORMACION" anterior).
   El background-color y el color del box-shadow de esas paginas ya
   resuelven correctamente en oscuro/verde por otra regla posterior de
   main.css (linea ~2042) que no toca transform -- por eso NO hace falta
   tocar box-shadow ni background aqui, solo neutralizar transform, igual
   que en #gestion-ti. Se usa el selector de clase (en vez de repetir 19
   IDs) porque el ID de #gestion-ti ya gana por especificidad sobre esta
   regla mas general, así que no hay conflicto entre ambas. */
.container.product-section.secondary-products{transform:none;}