:root{--navy:#0a2a44;--navy2:#123c59;--blue:#0b7fc1;--bg:#f4f8fb;--line:#d7e4ec;--text:#17384f;--muted:#647c8e;--green:#20a464;--amber:#d99a22;--red:#d84c58;--shadow:0 18px 50px rgba(20,52,73,.08);--shell:min(100% - 32px,1180px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}.shell{width:var(--shell);margin:auto}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px}
.site-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--line)}.header-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:10px;color:var(--navy);text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid #c9dce7;border-radius:10px;background:#f7fbfd}.brand-mark svg{width:24px;height:24px;fill:none;stroke:var(--blue);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.brand strong{display:block;font-size:.92rem}.brand small{display:block;margin-top:1px;color:var(--blue);font-size:.56rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.nav-back{display:inline-flex;padding:8px 13px;border-radius:7px;background:var(--navy2);color:#fff;text-decoration:none;font-size:.7rem;font-weight:900}.nav-back:hover{background:var(--blue)}
.hero{position:relative;overflow:hidden;padding:58px 0 72px;background:linear-gradient(rgba(35,96,137,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(35,96,137,.045) 1px,transparent 1px),#f8fbfd;background-size:30px 30px;border-bottom:1px solid var(--line)}.hero:after{content:"";position:absolute;right:-80px;top:-110px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(34,158,215,.12),transparent 68%)}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:70px;align-items:center}.eyebrow{margin:0;color:var(--blue);font-size:.62rem;font-weight:900;letter-spacing:.15em}.hero h1{margin:11px 0 16px;color:var(--navy);font-size:clamp(3rem,5vw,4.45rem);line-height:.98;letter-spacing:-.052em}.hero h1 span{color:var(--blue)}.hero-copy{max-width:760px;margin:0;color:#567184;font-size:.94rem;line-height:1.75}.hero-meta{overflow:hidden;border:1px solid #cfdee7;border-radius:12px;background:#fff;box-shadow:var(--shadow)}.hero-meta-row{padding:18px 19px}.hero-meta span{display:block;color:#748a9a;font-size:.57rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.hero-meta strong{display:block;margin-top:7px;color:var(--navy);font-size:.84rem}.countdown-card{display:flex;justify-content:space-between;align-items:end;gap:16px;padding:15px 19px;border-top:1px solid var(--line);background:#f1f7fa}.countdown-card span{max-width:145px}.countdown-card strong{color:var(--blue);font-size:1.45rem;font-variant-numeric:tabular-nums}
.status-overview{position:relative;z-index:2;margin-top:-28px}.overall-card{display:grid;grid-template-columns:minmax(280px,.95fr) minmax(0,1.35fr);overflow:hidden;border:1px solid #cfdee7;border-radius:13px;background:#fff;box-shadow:0 20px 50px rgba(20,52,73,.09)}.overall-state{display:flex;align-items:center;gap:18px;padding:24px 26px;border-right:1px solid var(--line)}.overall-indicator{width:18px;height:18px;flex:0 0 auto;border-radius:50%;background:#9aabb6;box-shadow:0 0 0 8px #eef3f6}.overall-card.operational .overall-indicator{background:var(--green);box-shadow:0 0 0 8px #e6f6ee}.overall-card.degraded .overall-indicator{background:var(--amber);box-shadow:0 0 0 8px #fff4d9}.overall-card.outage .overall-indicator{background:var(--red);box-shadow:0 0 0 8px #fdebed}.overall-state p{margin:0;color:#718899;font-size:.57rem;font-weight:900;letter-spacing:.12em}.overall-state h2{margin:5px 0 3px;color:var(--navy);font-size:1.35rem}.overall-state span:last-child{color:#607889;font-size:.73rem}.overall-kpis{display:grid;grid-template-columns:repeat(4,1fr)}.overall-kpis>div{display:flex;flex-direction:column;justify-content:center;padding:18px 17px;border-right:1px solid var(--line)}.overall-kpis>div:last-child{border-right:0}.overall-kpis span{color:#708697;font-size:.56rem;font-weight:800}.overall-kpis strong{margin-top:6px;color:var(--navy);font-size:1.18rem;letter-spacing:-.03em}.overall-kpis small{margin-top:3px;color:#8a9aa6;font-size:.54rem}
.section{padding:58px 0 66px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px}.section-heading h2{margin:7px 0 0;color:var(--navy);font-size:2rem;letter-spacing:-.035em}.legend{display:flex;gap:14px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#61798a;font-size:.65rem;font-weight:800}.legend span{display:flex;align-items:center;gap:5px}.dot{width:7px;height:7px;border-radius:50%}.dot.operational{background:var(--green)}.dot.degraded{background:var(--amber)}.dot.outage{background:var(--red)}
.service-group+.service-group{margin-top:32px}.group-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 2px}.group-heading h3{margin:0;color:var(--navy);font-size:.86rem}.group-heading span{color:#758a99;font-size:.62rem}.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.service-grid.is-single{grid-template-columns:1fr}.service-card{overflow:hidden;border:1px solid var(--line);border-radius:11px;background:#fff;box-shadow:0 9px 28px rgba(21,51,70,.04)}.service-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:16px 17px 14px;border-bottom:1px solid #e1e9ee}.service-kicker{display:block;margin-bottom:4px;color:#8395a2;font-size:.49rem;font-weight:900;letter-spacing:.12em}.service-card-head a{color:#0a3654;font-size:.88rem;font-weight:900;text-decoration:none}.service-card-head a:hover{color:var(--blue)}.status-pill{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:var(--green);font-size:.61rem;font-weight:900}.status-pill:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.status-pill.degraded{color:var(--amber)}.status-pill.outage{color:var(--red)}.service-metrics{display:grid;grid-template-columns:.8fr .65fr 1.35fr;border-bottom:1px solid #e1e9ee}.service-metrics>div{min-width:0;padding:12px 15px;border-right:1px solid #e1e9ee}.service-metrics>div:last-child{border-right:0}.service-metrics span{display:block;color:#7d909d;font-size:.5rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.service-metrics strong{display:block;margin-top:4px;overflow:hidden;color:#173e59;font-size:.69rem;text-overflow:ellipsis;white-space:nowrap}.history-head{display:flex;justify-content:space-between;padding:11px 15px 6px;color:#60798b;font-size:.58rem;font-weight:800}.history-head small{color:#91a0aa}.uptime-bars{display:grid;grid-template-columns:repeat(90,1fr);gap:2px;height:20px;padding:0 15px 16px}.history-day{display:block;width:100%;height:100%;padding:0;border:0;border-radius:2px;background:#72d69a;cursor:pointer}.history-day.degraded{background:#edbc58}.history-day.outage{background:#e96671}.history-day:focus-visible{outline:2px solid var(--navy)}
.incidents-section{background:#edf4f8;border-top:1px solid var(--line)}.incidents-list{display:grid;gap:12px}.incident-card,.no-incidents{padding:18px 20px;border:1px solid var(--line);border-radius:10px;background:#fff}.no-incidents{border-left:4px solid var(--green);color:#5c7485}.incident-head{display:flex;justify-content:space-between;gap:18px}.incident-card h3{margin:0;color:var(--navy);font-size:.9rem}.incident-card time{color:#7a8e9c;font-size:.62rem}.incident-status{padding:4px 8px;border-radius:6px;background:#fff2d8;color:#8f6100;font-size:.58rem;font-weight:900;text-transform:uppercase}.incident-card p{margin:10px 0 0;color:#61798a;font-size:.74rem}
.status-footer{background:#071f33;color:#fff}.status-footer-main{display:grid;grid-template-columns:1fr 260px;gap:48px;align-items:center;padding:35px 0 26px}.status-footer-main strong{font-size:.95rem}.status-footer-main p{margin:6px 0 0;color:#a9bfcc;font-size:.68rem}.status-footer-main svg{width:100%;height:auto;fill:none;stroke:#45b8ee;stroke-width:2}.status-footer-main circle{fill:#45b8ee}.status-footer-bottom{border-top:1px solid rgba(255,255,255,.1)}.status-footer-bottom .shell{display:flex;justify-content:space-between;padding:13px 0 15px;color:#7f9aaa;font-size:.58rem}.history-tooltip{position:fixed;z-index:9999;max-width:290px;padding:9px 11px;border-radius:8px;background:#071f33;color:#fff;box-shadow:0 14px 34px rgba(7,38,49,.24);font-size:.66rem;line-height:1.45;white-space:pre-line;pointer-events:none}
@media(max-width:900px){.hero-grid,.overall-card{grid-template-columns:1fr}.overall-state{border-right:0;border-bottom:1px solid var(--line)}.overall-kpis{grid-template-columns:repeat(2,1fr)}.service-grid{grid-template-columns:1fr}.status-footer-main{grid-template-columns:1fr}.status-footer-main svg{width:220px}.header-inner{padding:12px 0}}
@media(max-width:620px){:root{--shell:min(100% - 24px,1180px)}.brand small{display:none}.hero{padding:42px 0 58px}.hero h1{font-size:2.65rem}.section-heading{align-items:flex-start;flex-direction:column}.overall-kpis{grid-template-columns:1fr 1fr}.service-metrics{grid-template-columns:1fr}.service-metrics>div{border-right:0;border-bottom:1px solid #e1e9ee}.service-metrics>div:last-child{border-bottom:0}.legend{flex-wrap:wrap}.status-footer-bottom .shell{flex-direction:column;gap:4px}.uptime-bars{gap:1px}}


/* =========================================================
   Estado global · panel corporativo NAVY
   Sustituye visualmente la versión con línea verde lateral.
   El verde queda reservado al estado semántico OPERATIVO.
   ========================================================= */
.status-overview{
  margin-top:-30px;
  position:relative;
  z-index:3;
}

.overall-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(360px,1.12fr) minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(82,177,223,.28)!important;
  border-radius:14px!important;
  background:
    radial-gradient(circle at 92% 20%,rgba(33,163,218,.15),transparent 28%),
    linear-gradient(135deg,#082a46 0%,#0a3b60 58%,#082a46 100%)!important;
  box-shadow:0 24px 58px rgba(8,42,70,.18)!important;
  color:#fff;
}

.overall-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.14;
  background-image:
    radial-gradient(circle at 78% 34%,#63c7ef 1px,transparent 1px);
  background-size:9px 9px;
  mask-image:linear-gradient(90deg,transparent 54%,#000 72%,transparent 100%);
}

.overall-state{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:20px;
  padding:26px 28px!important;
  border-right:1px solid rgba(255,255,255,.13)!important;
}

.overall-indicator{
  width:20px!important;
  height:20px!important;
  flex:0 0 auto;
  border-radius:50%;
  background:#94aab8;
  box-shadow:
    0 0 0 8px rgba(255,255,255,.06),
    0 0 0 16px rgba(255,255,255,.035)!important;
}

.overall-card.operational .overall-indicator{
  background:#39d889!important;
  box-shadow:
    0 0 0 8px rgba(57,216,137,.16),
    0 0 0 16px rgba(57,216,137,.07)!important;
}
.overall-card.degraded .overall-indicator{
  background:#efb13f!important;
  box-shadow:
    0 0 0 8px rgba(239,177,63,.16),
    0 0 0 16px rgba(239,177,63,.07)!important;
}
.overall-card.outage .overall-indicator{
  background:#ef6670!important;
  box-shadow:
    0 0 0 8px rgba(239,102,112,.16),
    0 0 0 16px rgba(239,102,112,.07)!important;
}

.overall-state p{
  margin:0!important;
  color:#66c7ef!important;
  font-size:.57rem!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
  text-transform:uppercase;
}

.overall-state h2{
  margin:6px 0 5px!important;
  color:#fff!important;
  font-size:1.45rem!important;
  letter-spacing:-.025em;
}

.overall-state span:last-child{
  color:#bed2df!important;
  font-size:.72rem!important;
  line-height:1.55;
}

.overall-kpis{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.overall-kpis>div{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:21px 18px!important;
  border-right:1px solid rgba(255,255,255,.12)!important;
}
.overall-kpis>div:last-child{border-right:0!important}

.overall-kpis span{
  color:#9fc2d7!important;
  font-size:.55rem!important;
  font-weight:800!important;
  line-height:1.35;
}

.overall-kpis strong{
  margin-top:7px!important;
  color:#fff!important;
  font-size:1.24rem!important;
  letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
}

.overall-kpis small{
  margin-top:4px!important;
  color:#6fb2d4!important;
  font-size:.52rem!important;
}

/* etiqueta semántica discreta dentro del estado */
.overall-card.operational .overall-state h2::after,
.overall-card.degraded .overall-state h2::after,
.overall-card.outage .overall-state h2::after{
  display:inline-flex;
  align-items:center;
  margin-left:10px;
  padding:4px 7px;
  border-radius:999px;
  vertical-align:middle;
  font-size:.5rem;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.overall-card.operational .overall-state h2::after{
  content:"Operativo";
  border:1px solid rgba(57,216,137,.35);
  background:rgba(57,216,137,.1);
  color:#66e7a5;
}
.overall-card.degraded .overall-state h2::after{
  content:"Degradado";
  border:1px solid rgba(239,177,63,.35);
  background:rgba(239,177,63,.1);
  color:#ffd27a;
}
.overall-card.outage .overall-state h2::after{
  content:"Interrupción";
  border:1px solid rgba(239,102,112,.35);
  background:rgba(239,102,112,.1);
  color:#ffadb3;
}

@media(max-width:900px){
  .overall-card{grid-template-columns:1fr!important}
  .overall-state{
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.13)!important;
  }
  .overall-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .overall-kpis{grid-template-columns:1fr 1fr!important}
  .overall-kpis>div:nth-child(2){border-right:0!important}
  .overall-kpis>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}
  .overall-state{padding:22px!important}
  .overall-state h2{font-size:1.25rem!important}
}


/* =========================================================
   Histórico 90 días · barras verticales técnicas
   ========================================================= */
.uptime-bars{
  display:grid!important;
  grid-template-columns:repeat(90,minmax(3px,1fr))!important;
  gap:2px!important;
  height:28px!important;
  padding:0 15px 13px!important;
  align-items:stretch!important;
}
.history-day{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:15px!important;
  padding:0!important;
  border:0!important;
  border-radius:2px!important;
  background:#72d69a!important;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.04);
  cursor:pointer;
}
.history-day.degraded{background:#edbc58!important}
.history-day.outage{background:#e96671!important}
.history-day.maintenance{background:#6cb9e8!important}
.history-day.unknown{background:#c8d4dc!important}

.service-card-technical .uptime-bars{
  height:30px!important;
  padding:0 16px 14px!important;
}
.service-card-technical .history-day{
  min-height:16px!important;
}

@media(max-width:760px){
  .uptime-bars{
    grid-template-columns:repeat(45,minmax(4px,1fr))!important;
    height:auto!important;
    row-gap:3px!important;
  }
  .history-day{height:14px!important}
}


/* =========================================================
   Histórico 90 días · refinamiento final
   ========================================================= */
.uptime-bars,
.service-card-technical .uptime-bars{
  display:grid!important;
  grid-template-columns:repeat(90,minmax(2px,1fr))!important;
  gap:3px!important;
  height:24px!important;
  padding:0 16px 12px!important;
  align-items:stretch!important;
}

.history-day,
.service-card-technical .history-day{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:12px!important;
  border-radius:2px!important;
  background:#79d8a0!important;
  opacity:.96;
  transition:
    transform .12s ease,
    filter .12s ease,
    opacity .12s ease;
}

.history-day:hover{
  transform:translateY(-2px) scaleY(1.08);
  filter:saturate(1.12);
  opacity:1;
}

.history-day.degraded{background:#e8b24d!important}
.history-day.outage{background:#df5a66!important}
.history-day.maintenance{background:#62afe0!important}
.history-day.unknown{background:#c4d0d8!important}

.history-header{
  padding-bottom:8px!important;
}

@media(max-width:980px){
  .uptime-bars,
  .service-card-technical .uptime-bars{
    grid-template-columns:repeat(90,minmax(2px,1fr))!important;
    gap:2px!important;
  }
}

@media(max-width:700px){
  .uptime-bars,
  .service-card-technical .uptime-bars{
    display:flex!important;
    gap:3px!important;
    overflow-x:auto;
    overflow-y:hidden;
    height:28px!important;
    padding:0 14px 10px!important;
    scrollbar-width:thin;
    scrollbar-color:#aac2d1 transparent;
  }

  .history-day,
  .service-card-technical .history-day{
    flex:0 0 6px;
    width:6px!important;
    min-width:6px!important;
    height:16px!important;
    min-height:16px!important;
  }
}