/* IDMA Security - sitio. Hereda de tokens.css y base.css */
.skip { position: absolute; left: -999px; top: 0; background: var(--idma-naranja); color: var(--idma-noche); padding: .6rem 1rem; z-index: 100; }
.skip:focus { left: 1rem; top: 1rem; }

/* Cabecera */
.hd { position: sticky; top: 0; z-index: 50; background: rgba(10,20,32,.94); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.hd-in { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5); padding-block: .7rem; }
.hd .brand img { height: 46px; width: auto; }
.nav { display: flex; align-items: center; gap: var(--sp-5); }
.nav a:not(.btn) { color: var(--idma-blanco); text-decoration: none; font-weight: 500; font-size: var(--fs-sm); }
.nav a:not(.btn):hover { color: var(--idma-guardia-claro); }
.nav .btn { padding: .75rem 1.1rem; font-size: var(--fs-sm); }
.burger { display: none; background: none; border: 1px solid var(--line); color: var(--idma-blanco); border-radius: var(--radius-s); padding: .55rem .7rem; cursor: pointer; font: 500 var(--fs-sm) var(--font-body); }
@media (max-width: 980px) {
  .burger { display: block; }
  .nav { position: absolute; top: 100%; left: 0; right: 0; background: var(--idma-noche); border-bottom: 1px solid var(--line); flex-direction: column; align-items: stretch; padding: var(--sp-4) var(--sp-5) var(--sp-5); display: none; }
  .nav.open { display: flex; }
  .nav a:not(.btn) { padding: .7rem 0; border-bottom: 1px solid var(--line); }
}

/* Secciones */
.s { padding-block: var(--sp-9); }
.s.dark { background: var(--idma-noche); }
.s.steel { background: var(--idma-acero); }
.s.paper { background: var(--idma-papel); color: var(--idma-noche); }
.s.white { background: var(--idma-blanco); color: var(--idma-noche); }
.s.paper .soft, .s.white .soft { color: var(--idma-texto-claro); }
.s.paper a:not(.btn), .s.white a:not(.btn) { color: var(--idma-guardia); }
.eb { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: .12em; text-transform: uppercase; color: var(--idma-guardia-claro); margin-bottom: var(--sp-4); display: flex; align-items: center; gap: .6rem; }
.eb::before { content: ""; width: 22px; height: 2px; background: currentColor; }
.s.paper .eb, .s.white .eb { color: var(--idma-guardia); }
.h2 { font-size: var(--fs-2xl); max-width: 20ch; }
.lead2 { margin-top: var(--sp-4); max-width: 68ch; font-size: var(--fs-lg); color: var(--text-soft); }
.s.paper .lead2, .s.white .lead2 { color: var(--idma-texto-claro); }
.head { margin-bottom: var(--sp-7); }
.center { text-align: center; } .center .h2, .center .lead2 { margin-inline: auto; } .center .eb { justify-content: center; }
.btn-dark { background: var(--idma-noche); color: var(--idma-blanco); }
.btn-outline-dark { border-color: var(--idma-noche); color: var(--idma-noche); }
.btn-lg { padding: 1.1rem 1.8rem; font-size: 1.05rem; }
.tbd { font-family: var(--font-mono); font-size: .8em; background: rgba(239,140,34,.16); color: var(--idma-naranja); padding: .05em .4em; border-radius: 3px; white-space: nowrap; }
.s.paper .tbd, .s.white .tbd { color: var(--idma-naranja-texto); background: rgba(168,86,6,.1); }

/* Estado en vivo (compartido: tablero de Inteligencia de datos). Estilos del Hero: css/hero.css */
.live { display: inline-flex; align-items: center; gap: .5rem; color: var(--idma-naranja); }
.live i { width: 8px; height: 8px; border-radius: 50%; background: var(--idma-naranja); animation: pulse 2s infinite; }
@keyframes pulse { 50% { opacity: .3; } }

/* Franja */
.strip { background: var(--idma-acero); border-block: 1px solid var(--line); }
.strip-in { display: grid; grid-template-columns: repeat(3, 1fr); }
.strip-in > div { padding: var(--sp-5); border-right: 1px solid var(--line); display: grid; gap: .3rem; }
.strip-in > div:last-child { border-right: 0; }
.strip-in b { font-family: var(--font-display); font-size: var(--fs-base); display: flex; gap: .5rem; align-items: center; }
.strip-in b::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--idma-naranja); flex: none; }
.strip-in span { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-soft); letter-spacing: .05em; text-transform: uppercase; }

/* Perfiles */
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); }
.pcard { background: var(--idma-blanco); border: 1px solid var(--idma-filete); border-radius: var(--radius-m); padding: var(--sp-6); }
.pcard h3 { font-size: var(--fs-lg); margin-bottom: var(--sp-3); color: var(--idma-noche); }
.pcard p { color: var(--idma-texto-claro); font-size: var(--fs-sm); }
.grid2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-5); }

/* Servicios */
.svc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-5); }
.svc { background: var(--idma-blanco); border: 1px solid var(--idma-filete); border-radius: var(--radius-l); padding: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-4); transition: box-shadow .25s var(--ease), transform .25s var(--ease); }
.svc:hover { box-shadow: 0 14px 36px rgba(10,20,32,.1); transform: translateY(-2px); }
.svc .ico { width: 52px; height: 52px; border-radius: 12px; background: var(--idma-noche); display: grid; place-items: center; }
.svc .ico svg { width: 28px; height: 28px; stroke: var(--idma-blanco); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.svc .ico svg .acc { stroke: var(--idma-naranja); fill: var(--idma-naranja); }
.svc .kicker { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: .1em; text-transform: uppercase; color: var(--idma-guardia); }
.svc h3 { font-size: var(--fs-xl); }
.svc > p { color: var(--idma-texto-claro); }
.svc ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .45rem; font-size: var(--fs-sm); }
.svc li { padding-left: 1.3rem; position: relative; }
.svc li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; background: var(--idma-guardia); border-radius: 1px; }
.svc .more { margin-top: auto; padding-top: var(--sp-3); font-weight: 600; color: var(--idma-naranja-texto) !important; text-decoration: none; display: inline-flex; gap: .4rem; border-bottom: 1.5px solid currentColor; width: fit-content; }
.svc.rastro { background: var(--idma-noche); color: var(--idma-blanco); border-color: var(--idma-noche); }
.svc.rastro > p { color: var(--text-soft); }
.svc.rastro .ico { background: var(--idma-acero); }
.svc.rastro .kicker { color: var(--idma-guardia-claro); }
.svc.rastro li::before { background: var(--idma-guardia-claro); }
.svc.rastro .more { color: var(--idma-naranja) !important; }
.svc-bar { margin-top: var(--sp-5); background: var(--idma-acero); color: var(--idma-blanco); border-radius: var(--radius-l); padding: var(--sp-5) var(--sp-6); display: flex; justify-content: space-between; align-items: center; gap: var(--sp-5); flex-wrap: wrap; }
.svc-bar p { max-width: 60ch; color: var(--text-soft); }
.svc-bar b { color: var(--idma-blanco); font-family: var(--font-display); font-size: var(--fs-lg); display: block; margin-bottom: .2rem; }

/* Operacion: linea de respuesta */
.flow { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-5); counter-reset: step; }
.flow::before { content: ""; position: absolute; left: 6%; right: 6%; top: 21px; height: 2px; background: linear-gradient(90deg, var(--idma-guardia-claro), var(--idma-guardia-claro) 75%, var(--idma-naranja)); opacity: .7; }
.step { position: relative; padding-top: 60px; }
.step::before { counter-increment: step; content: counter(step, decimal-leading-zero); position: absolute; top: 0; left: 0; width: 44px; height: 44px; border-radius: 50%; background: var(--idma-noche); border: 2px solid var(--idma-guardia-claro); display: grid; place-items: center; font: 500 var(--fs-sm) var(--font-mono); color: var(--idma-guardia-claro); }
.step:last-child::before { border-color: var(--idma-naranja); color: var(--idma-naranja); box-shadow: 0 0 0 6px rgba(239,140,34,.15); animation: halo 3s infinite; }
@keyframes halo { 50% { box-shadow: 0 0 0 12px rgba(239,140,34,0); } }
.step h3 { font-size: var(--fs-lg); margin-bottom: var(--sp-2); }
.step p { color: var(--text-soft); font-size: var(--fs-sm); }
.step .mono { display: block; margin-top: var(--sp-3); color: var(--idma-guardia-claro); font-size: var(--fs-xs); }
.note-line { margin-top: var(--sp-6); font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-soft); }

/* Inteligencia */
.intel { display: grid; grid-template-columns: .95fr 1.05fr; gap: var(--sp-7); align-items: start; }
.intel-list { margin: var(--sp-5) 0 0; padding: 0; list-style: none; display: grid; gap: var(--sp-4); }
.intel-list li { display: grid; grid-template-columns: 34px 1fr; gap: var(--sp-3); }
.intel-list .n { width: 34px; height: 34px; border-radius: 8px; background: var(--idma-noche); color: var(--idma-guardia-claro); font: 500 var(--fs-xs) var(--font-mono); display: grid; place-items: center; }
.intel-list b { display: block; font-family: var(--font-display); }
.intel-list span { color: var(--idma-texto-claro); font-size: var(--fs-sm); }
.dash { background: var(--idma-noche); color: var(--idma-blanco); border-radius: var(--radius-l); padding: var(--sp-5); display: grid; gap: var(--sp-4); position: sticky; top: 90px; }
.dash-top { display: flex; justify-content: space-between; font: var(--fs-xs) var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text-soft); }
.kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
.kpi { background: var(--idma-acero); border-radius: var(--radius-m); padding: var(--sp-4); }
.kpi small { display: block; font: var(--fs-xs) var(--font-mono); color: var(--text-soft); text-transform: uppercase; letter-spacing: .06em; }
.kpi b { font: 700 1.6rem var(--font-display); }
.kpi b.o { color: var(--idma-naranja); }
.chart { background: var(--idma-acero); border-radius: var(--radius-m); padding: var(--sp-4); }
.chart small { font: var(--fs-xs) var(--font-mono); color: var(--text-soft); text-transform: uppercase; letter-spacing: .06em; }
.bars { display: flex; align-items: flex-end; gap: 8px; height: 110px; margin-top: var(--sp-3); }
.bars i { flex: 1; background: var(--idma-guardia); border-radius: 3px 3px 0 0; min-height: 6px; }
.bars i.hot { background: var(--idma-naranja); }
.axis { display: flex; justify-content: space-between; font: .65rem var(--font-mono); color: var(--text-soft); margin-top: 6px; }
.dash-note { font: var(--fs-xs) var(--font-mono); color: var(--text-soft); }

/* Cadena del grupo */
.chain { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; position: relative; }
.link { padding: var(--sp-6); border: 1px solid var(--line); background: rgba(22,39,58,.6); position: relative; }
.link + .link { border-left: 0; }
.link:first-child { border-radius: var(--radius-l) 0 0 var(--radius-l); }
.link:last-child { border-radius: 0 var(--radius-l) var(--radius-l) 0; }
.link .ph { font: var(--fs-xs) var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--text-soft); }
.link h3 { font-size: var(--fs-xl); margin: var(--sp-2) 0 var(--sp-1); }
.link .role { color: var(--idma-guardia-claro); font-weight: 600; margin-bottom: var(--sp-3); }
.link p { color: var(--text-soft); font-size: var(--fs-sm); }
.link.me { background: var(--idma-guardia); border-color: var(--idma-guardia); }
.link.me .ph, .link.me p { color: #EAF2F9; }
.link.me .role { color: var(--idma-blanco); }
.link.me::after { content: "Usted está aquí"; position: absolute; top: -13px; right: 18px; background: var(--idma-naranja); color: var(--idma-noche); font: 500 .7rem var(--font-mono); padding: .25rem .6rem; border-radius: 99px; }
.data-thread { margin-top: var(--sp-5); display: flex; align-items: center; gap: var(--sp-3); font: var(--fs-xs) var(--font-mono); color: var(--text-soft); text-transform: uppercase; letter-spacing: .06em; }
.data-thread i { flex: 1; height: 2px; background: linear-gradient(90deg, var(--idma-guardia-claro), var(--idma-naranja)); }
.grupo-quote { margin-top: var(--sp-6); max-width: 70ch; color: var(--text-soft); }
.grupo-quote a { color: var(--idma-guardia-claro); }
.link-more { display: inline-block; margin-top: var(--sp-3); color: var(--idma-guardia-claro); font-weight: 600; text-decoration: none; }
.link-more:hover { text-decoration: underline; }
.no-grupo [data-grupo] { display: none !important; }

/* Sectores */
.sect { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.sect div { background: var(--idma-blanco); border: 1px solid var(--idma-filete); border-radius: var(--radius-m); padding: var(--sp-5); }
.sect b { font-family: var(--font-display); display: block; margin-bottom: .3rem; }
.sect span { font-size: var(--fs-sm); color: var(--idma-texto-claro); }

/* Revision del caso */

/* Contacto */
.contact { display: grid; grid-template-columns: .8fr 1.2fr; gap: var(--sp-7); align-items: start; }
.contact-info { display: grid; gap: var(--sp-4); }
.ci { display: grid; gap: .15rem; padding-bottom: var(--sp-4); border-bottom: 1px solid var(--idma-filete); }
.ci small { font: var(--fs-xs) var(--font-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--idma-texto-claro); }
.ci b { font-family: var(--font-display); font-size: var(--fs-lg); }
form.f { background: var(--idma-blanco); border: 1px solid var(--idma-filete); border-radius: var(--radius-l); padding: var(--sp-6); display: grid; gap: var(--sp-4); }
.f .row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.f label { display: grid; gap: .35rem; font-size: var(--fs-sm); font-weight: 500; }
.f input[type=text], .f input[type=tel], .f input[type=email], .f textarea, .f select { font: inherit; padding: .8rem .9rem; border: 1.5px solid #B8C3CE; border-radius: var(--radius-s); background: #fff; color: var(--idma-noche); width: 100%; }
.f input:focus, .f textarea:focus, .f select:focus { outline: 2px solid var(--idma-guardia); outline-offset: 1px; border-color: var(--idma-guardia); }
.f fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: .5rem; }
.f legend { font-size: var(--fs-sm); font-weight: 500; margin-bottom: .4rem; }
.checks { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem var(--sp-4); }
.chk { display: flex; gap: .55rem; align-items: center; font-weight: 400 !important; }
.chk input { width: 18px; height: 18px; accent-color: var(--idma-guardia); }
.consent { font-size: var(--fs-xs); color: var(--idma-texto-claro); display: flex; gap: .6rem; align-items: flex-start; }
.consent input { margin-top: .2rem; width: 18px; height: 18px; accent-color: var(--idma-guardia); flex: none; }
.f .msg { font-size: var(--fs-sm); color: var(--idma-texto-claro); min-height: 1.2em; }

/* FAQ */
.faq { max-width: 860px; margin-inline: auto; display: grid; gap: var(--sp-3); }
.faq details { background: var(--idma-acero); border: 1px solid var(--line); border-radius: var(--radius-m); }
.faq summary { cursor: pointer; padding: var(--sp-4) var(--sp-5); font: 600 var(--fs-base) var(--font-display); list-style: none; display: flex; justify-content: space-between; gap: var(--sp-4); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--font-mono); color: var(--idma-naranja); font-size: 1.3rem; line-height: 1; }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 var(--sp-5) var(--sp-5); color: var(--text-soft); }

/* Cierre y cobertura */
.close { text-align: center; background: linear-gradient(180deg, var(--idma-noche), #0d1b2b); }
.close h2 { font-size: var(--fs-3xl); }
.close h2 em { font-style: normal; color: var(--idma-naranja); }
.close p { margin: var(--sp-4) auto var(--sp-6); max-width: 54ch; color: var(--text-soft); font-size: var(--fs-lg); }
.cov { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5); }
.cov span { border: 1px solid var(--idma-filete); background: var(--idma-blanco); padding: .45rem .9rem; border-radius: 99px; font-size: var(--fs-sm); }

/* Pie */
.ft { background: #070e17; border-top: 1px solid var(--line); padding-block: var(--sp-8) var(--sp-5); font-size: var(--fs-sm); color: var(--text-soft); }
.ft-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--sp-6); }
.ft img { height: 54px; width: auto; margin-bottom: var(--sp-4); }
.ft h4 { font: 500 var(--fs-xs) var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--idma-blanco); margin-bottom: var(--sp-3); }
.ft ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.ft a { color: var(--text-soft); text-decoration: none; } .ft a:hover { color: var(--idma-blanco); }
.ft-legal { margin-top: var(--sp-7); padding-top: var(--sp-4); border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; font: var(--fs-xs) var(--font-mono); }
.endoso-ft { margin-top: var(--sp-4); }
.endoso-ft img { height: 40px; margin: 0; }
.endoso-ft a { display: inline-block; }

.wa { position: fixed; right: 18px; bottom: 18px; z-index: 40; background: var(--idma-guardia); color: var(--idma-blanco); border-radius: 99px; padding: .85rem 1.2rem; font-weight: 600; text-decoration: none; box-shadow: 0 8px 24px rgba(0,0,0,.35); font-size: var(--fs-sm); }

.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } .live i, .step:last-child::before { animation: none; } }

@media (max-width: 980px) {
  .s { padding-block: var(--sp-8); }
  .intel, .contact { grid-template-columns: 1fr; }
  .dash { position: static; }
  .strip-in { grid-template-columns: 1fr; }
  .strip-in > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .strip-in > div:last-child { border-bottom: 0; }
  .grid3, .grid2, .sect { grid-template-columns: 1fr; }
  .svc-grid { grid-template-columns: 1fr; }
  .flow { grid-template-columns: 1fr 1fr; row-gap: var(--sp-6); } .flow::before { display: none; }
  .chain { grid-template-columns: 1fr; }
  .link, .link:first-child, .link:last-child { border-radius: 0; border: 1px solid var(--line); border-top: 0; }
  .link:first-child { border-top: 1px solid var(--line); border-radius: var(--radius-l) var(--radius-l) 0 0; }
  .link:last-child { border-radius: 0 0 var(--radius-l) var(--radius-l); }
  .ft-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .flow, .kpis, .f .row, .checks, .ft-grid { grid-template-columns: 1fr; }
  .strip-in { grid-template-columns: 1fr; } .strip-in > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .wa span { display: none; }
}
.f label.chk, .f label.consent { display: flex; flex-direction: row; align-items: center; gap: .55rem; }
.f label.consent { align-items: flex-start; }

/* Navegacion entre paginas */
@view-transition { navigation: auto; }
.nav a[aria-current="page"]:not(.btn) { color: var(--idma-guardia-claro); box-shadow: 0 2px 0 var(--idma-guardia-claro); }
.mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.mini { display: grid; gap: .5rem; align-content: start; padding: var(--sp-5); background: var(--idma-papel); border: 1px solid var(--idma-filete); border-radius: var(--radius-m); color: var(--idma-noche); text-decoration: none; transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.mini:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(10,20,32,.1); }
.mini .ico { width: 46px; height: 46px; border-radius: 10px; background: var(--idma-noche); display: grid; place-items: center; margin-bottom: .4rem; }
.mini .ico svg { width: 26px; height: 26px; stroke: var(--idma-blanco); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mini .ico svg .acc { stroke: var(--idma-naranja); fill: var(--idma-naranja); }
.mini b { font-family: var(--font-display); font-size: var(--fs-lg); }
.mini span:last-child { font-size: var(--fs-sm); color: var(--idma-texto-claro); }
.explore { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-4); }
.explore a { display: grid; gap: .45rem; align-content: start; padding: var(--sp-5); background: var(--idma-acero); border: 1px solid var(--line); border-radius: var(--radius-m); color: var(--idma-blanco); text-decoration: none; transition: border-color .25s var(--ease), transform .25s var(--ease); }
.explore a:hover { border-color: var(--idma-guardia-claro); transform: translateY(-2px); }
.explore small { color: var(--idma-naranja); }
.explore b { font-family: var(--font-display); font-size: var(--fs-lg); }
.explore span { font-size: var(--fs-sm); color: var(--text-soft); }
.explore i { font-style: normal; color: var(--idma-guardia-claro); font-weight: 600; margin-top: .4rem; }
@media (max-width: 980px) { .explore { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .mini-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .explore { grid-template-columns: 1fr; } }