/* cti-base.css — chrome compartido (tokens, header en 3 capas, mega-menu, footer).
   Extraído de index.html para que las páginas internas usen exactamente el mismo sistema. */
:root{
  --bg:#050505; --ink:#f4f4f4; --muted:#b8b8b8; --muted-2:#d4d4d4;
  --line:#1a1a1a; --line-2:#272727; --red:#c41e3a; --red-2:#a3182f; --gold:#e0b34a;
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.page{min-height:100dvh;width:100%;display:flex;flex-direction:column;position:relative}

/* ═══ 3-LAYER HEADER (CrowdStrike-style, dark Cyber Threat Intelligence LATAM) ═══ */
.announce{width:100%;background:#c41e3a;color:#fff;font-size:12px;line-height:1.4;position:relative;z-index:50}
.announce[hidden],.announce.is-dismissed{display:none!important}
.announce-inner{display:flex;align-items:center;justify-content:center;gap:10px 16px;padding:8px clamp(40px,4vw,48px) 8px clamp(16px,4vw,48px);text-align:center;flex-wrap:wrap}
.announce a{color:#fff;text-decoration:underline;text-underline-offset:2px;font-weight:600}
.announce a:hover{opacity:.88}
.announce-dismiss{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:none;background:transparent;color:#fff;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;border-radius:2px}
.announce-dismiss:hover{background:rgba(0,0,0,.18)}
.utility{width:100%;background:#0a0a0a;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--muted);z-index:45}
.utility-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px clamp(16px,4vw,48px);min-height:28px}
.utility-left{opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.utility-right{display:flex;align-items:center;justify-content:flex-end;gap:0;margin-left:auto;flex-wrap:wrap}
.utility-right a,.utility-right .utility-lang{padding:0 8px;color:var(--muted)}
.utility-right a:hover{color:var(--ink)}
.utility-right .sep{color:#333;padding:0 2px;user-select:none}
.utility-lang .lang-on{color:var(--ink);font-weight:500}
.utility-lang .lang-off{color:#555}
.top{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,3vw,40px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40;background:rgba(5,5,5,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.top>.brand{position:relative;z-index:2;flex:0 0 auto}
.top>.right{position:relative;z-index:2;flex:0 0 auto;margin-left:0}
@media(min-width:861px){
  #primary-nav{position:static;transform:none;flex:1 1 auto;justify-content:flex-start;margin-left:clamp(8px,1.5vw,24px);z-index:1}
}
.brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:700;letter-spacing:-.03em;white-space:nowrap;z-index:2}
.brand img{width:28px;height:auto;display:block}
.brand span{color:var(--red)}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;background:transparent;border:1px solid var(--line-2);cursor:pointer;z-index:2}
.nav-toggle span{display:block;height:2px;width:100%;background:var(--ink);transition:transform .2s,opacity .2s}
.top.is-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.top.is-open .nav-toggle span:nth-child(2){opacity:0}
.top.is-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
#primary-nav{display:flex;align-items:center;justify-content:flex-start;gap:clamp(12px,1.8vw,22px);flex:1 1 auto;min-width:0;position:static;transform:none;font-size:13px;font-weight:600;color:var(--muted-2)}
#primary-nav > a:hover,#primary-nav .nav-trigger:hover{color:var(--red)}
#primary-nav a[aria-current="page"]{color:var(--red)}

/* CrowdStrike-style nav selection */
#primary-nav > a,
#primary-nav .nav-trigger{
  position:relative;
  transition:color .2s ease;
}
#primary-nav > a::after,
#primary-nav .nav-trigger::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-6px;
  height:2px;
  border-radius:1px;
  background:linear-gradient(90deg,var(--red),var(--gold));
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .2s ease;
  pointer-events:none;
}
#primary-nav > a:hover,
#primary-nav > a:focus-visible,
#primary-nav a[aria-current="page"],
#primary-nav .nav-trigger:hover,
#primary-nav .nav-trigger:focus-visible,
#primary-nav .nav-item:hover > .nav-trigger,
#primary-nav .nav-item:focus-within > .nav-trigger,
#primary-nav .nav-item.is-open > .nav-trigger{
  color:var(--red);
}
#primary-nav > a:hover::after,
#primary-nav > a:focus-visible::after,
#primary-nav a[aria-current="page"]::after,
#primary-nav .nav-trigger:hover::after,
#primary-nav .nav-trigger:focus-visible::after,
#primary-nav .nav-item:hover > .nav-trigger::after,
#primary-nav .nav-item:focus-within > .nav-trigger::after,
#primary-nav .nav-item.is-open > .nav-trigger::after{
  transform:scaleX(1);
}
@media(max-width:860px){
  #primary-nav > a::after,
  #primary-nav .nav-trigger::after{bottom:8px;left:0;right:auto;width:28px}
}

#primary-nav .nav-util{display:none}
.right{display:flex;align-items:center;gap:16px;z-index:2;margin-left:auto}
.cta-nav{background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:9px 16px;letter-spacing:.06em;text-transform:uppercase}
.cta-nav:hover{background:var(--red-2)}

/* ═══ MEGA-MENU (desktop, CrowdStrike-inspired white panel) ═══ */
.nav-item{position:relative}
.nav-item>a.nav-trigger{display:inline-flex;align-items:center;gap:5px;color:inherit;font:inherit;font-weight:600;background:none;border:none;cursor:pointer;padding:0;font-family:inherit}
.nav-item>a.nav-trigger:hover,.nav-item:focus-within>a.nav-trigger{color:var(--red)}
.nav-item>a.nav-trigger .caret{display:inline-block;width:0;height:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-top:4px solid currentColor;opacity:.55;margin-top:1px}
.mega{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(8px);min-width:320px;max-width:420px;padding:22px 24px;background:#fff;color:#111;border:1px solid #e8e8e8;border-radius:18px;box-shadow:0 18px 48px rgba(0,0,0,.28),0 2px 8px rgba(0,0,0,.08);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .22s ease,visibility .22s;z-index:60}
.mega::before{content:"";position:absolute;top:-10px;left:0;right:0;height:14px}
.nav-item:hover>.mega,.nav-item:focus-within>.mega,.nav-item.is-open>.mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-col{display:flex;flex-direction:column;gap:4px}
.mega-h{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#8a8a8a;margin-bottom:10px;font-weight:500}
.mega a.mega-link{display:block;padding:10px 10px;margin:0 -10px;border-radius:10px;color:#111;text-decoration:none;transition:background .15s}
.mega a.mega-link:hover,.mega a.mega-link:focus-visible{background:#f4f4f4;outline:none}
.mega-title{display:block;font-size:13px;font-weight:700;letter-spacing:-.01em;color:#111;line-height:1.3}
.mega-desc{display:block;font-size:12px;color:#6b6b6b;line-height:1.45;margin-top:3px;font-weight:400}

/* Meridiano footer */
.site-footer{background:#050505;border-top:1px solid var(--line);padding:48px clamp(16px,4vw,48px) 28px;color:var(--muted)}
.site-footer-grid{max-width:min(1200px,100%);margin:0 auto;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:36px 28px}
.sf-brand{display:flex;flex-direction:column;gap:12px;max-width:280px}
.sf-brand-row{display:flex;align-items:center;gap:12px}
.sf-brand-row img{width:48px;height:auto;display:block}
.sf-wordmark{font-size:18px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.sf-wordmark span{color:var(--red)}
.sf-tag{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);line-height:1.5}
.sf-col h3{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;font-weight:500}
.sf-col a{display:block;font-size:13px;color:var(--muted-2,var(--muted2,#b8b8b8));padding:5px 0;transition:color .15s}
.sf-col a:hover{color:var(--ink)}
.sf-bottom{max-width:min(1200px,100%);margin:36px auto 0;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:#5e5e5e}
.sf-bottom a{color:var(--gold);text-decoration:none}
.sf-bottom a:hover{color:var(--ink)}
@media(max-width:860px){
  .site-footer-grid{grid-template-columns:1fr 1fr;gap:28px 20px}
  .sf-brand{grid-column:1/-1;max-width:none}
}
@media(max-width:520px){
  .site-footer-grid{grid-template-columns:1fr}
}
