:root{
  --bg:#02070c;
  --panel:#06111b;
  --panel2:#071825;
  --text:#f2f6fb;
  --muted:#c8d2df;
  --blue:#4fa2ff;
  --blue2:#1f77dc;
  --line:rgba(255,255,255,.22);
}

*{ box-sizing:border-box; }

html,body{
  margin:0;
  padding:0;
  background:#000;
  color:var(--text);
  font-family:Arial, Helvetica, sans-serif;
}

body{
  background:
    radial-gradient(circle at top center, rgba(28,89,155,.22), transparent 34%),
    linear-gradient(180deg,#02070c 0%,#000 100%);
}

.site-wrap{
  width:100%;
  max-width:1536px;
  margin:0 auto;
  background:#02070c;
  min-height:100vh;
}

.header-section{
  position:relative;
  width:100%;
  background:#000;
}

.header-section img{
  display:block;
  width:100%;
  height:auto;
}

.header-hotspot{
  position:absolute;
  top:36.8%;
  height:18.2%;
  display:block;
  z-index:20;
}

.logo-home-link{
  position:absolute;
  left:0;
  top:0;
  width:29%;
  height:100%;
  display:block;
  z-index:20;
}

.about-link{ left:65.45%; width:7.35%; }
.focus-link{ left:73.75%; width:7.35%; }
.status-link{ left:81.95%; width:7.85%; }
.contact-link{ left:90.55%; width:8.75%; }

.focus-main{
  padding:clamp(1rem, 3vw, 2rem);
}

.page-title{
  text-align:center;
  padding:clamp(1.5rem, 5vw, 3rem) 1rem 2rem;
}

.page-title h1{
  margin:0;
  font-size:clamp(3rem, 9vw, 7rem);
  letter-spacing:.18em;
  line-height:.95;
  text-transform:uppercase;
  color:#f3f5f7;
  text-shadow:0 0 18px rgba(79,162,255,.18);
}

.title-rule{
  width:110px;
  height:3px;
  background:var(--blue);
  margin:1rem auto;
}

.page-title p{
  max-width:760px;
  margin:0 auto;
  color:#edf4ff;
  font-size:clamp(1.05rem, 2.2vw, 1.35rem);
  line-height:1.5;
}

.history-panel{
  display:grid;
  grid-template-columns:1fr 1.95fr;
  gap:clamp(1rem, 3vw, 2rem);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(5,20,32,.95),rgba(2,7,12,.98));
  box-shadow:0 0 30px rgba(22,105,190,.14);
}

.history-image{
  min-height:360px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.1),rgba(0,0,0,.6)),
    linear-gradient(135deg,#3b2f24,#111820);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem;
  color:#b9c8d8;
  text-align:center;
  font-size:1.1rem;
  line-height:1.4;
}

.history-content{
  padding:clamp(1.25rem, 3vw, 2rem);
}

.kicker{
  margin:0 0 .9rem;
  color:var(--blue);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:clamp(1rem,2.5vw,1.45rem);
}

.history-content p{
  color:#edf4ff;
  line-height:1.55;
  font-size:clamp(1rem,2vw,1.16rem);
}

.history-content a{
  color:#62b2ff;
  text-decoration:none;
}

.source-note{
  color:#b8c7d6;
  font-size:.9rem;
  margin-top:1rem;
}

.timeline{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  margin-top:1.5rem;
  border-top:1px solid rgba(79,162,255,.55);
  padding-top:1.25rem;
}

.timeline-item strong{
  display:block;
  color:var(--blue);
  font-size:1.35rem;
  margin-bottom:.35rem;
}

.timeline-item span{
  display:block;
  font-weight:bold;
  color:#fff;
  margin-bottom:.4rem;
}

.timeline-item p{
  margin:0;
  color:#d8e2ee;
  font-size:.95rem;
}

.card-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(1rem,2vw,1.35rem);
  margin-top:1.4rem;
}

.focus-card{
  border:1px solid var(--line);
  border-radius:8px;
  padding:clamp(1.1rem,2vw,1.55rem);
  background:linear-gradient(180deg,rgba(6,22,35,.96),rgba(2,8,13,.98));
  min-height:100%;
}

.icon-circle{
  width:78px;
  height:78px;
  border:2px solid var(--blue);
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 1rem;
  color:var(--blue);
  font-size:2.1rem;
}

.focus-card h2{
  text-align:center;
  margin:.3rem 0 .75rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:clamp(1.45rem,2.6vw,2rem);
}

.focus-card .small-rule{
  width:70px;
  height:2px;
  background:var(--blue);
  margin:0 auto 1rem;
}

.focus-card p,
.focus-card li{
  color:#e5edf7;
  line-height:1.5;
  font-size:1rem;
}

.focus-card ul{
  padding-left:1.25rem;
}

.focus-card li::marker{
  color:var(--blue);
}

.sources-box{
  border:1px solid rgba(255,255,255,.18);
  border-radius:5px;
  padding:.85rem;
  margin-top:1rem;
  background:rgba(0,0,0,.18);
}

.sources-box h3{
  margin:0 0 .4rem;
  color:var(--blue);
  font-size:.95rem;
  text-transform:uppercase;
  letter-spacing:.18em;
}

.card-link{
  display:block;
  text-align:center;
  margin-top:1.1rem;
  padding:.75rem 1rem;
  border:1px solid var(--blue2);
  color:#69b6ff;
  text-decoration:none;
  border-radius:4px;
}

.card-link:hover{
  background:rgba(79,162,255,.13);
  color:#fff;
}

.mission-strip{
  display:grid;
  grid-template-columns:120px 1fr 330px;
  gap:1.25rem;
  align-items:center;
  margin-top:1.4rem;
  border:1px solid rgba(79,162,255,.55);
  border-radius:8px;
  padding:1.25rem;
  background:linear-gradient(90deg,rgba(5,20,32,.95),rgba(2,8,13,.98));
}

.vault-icon{
  width:92px;
  height:92px;
  border-radius:999px;
  border:2px solid rgba(79,162,255,.75);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2.7rem;
  color:var(--blue);
}

.mission-strip p{
  margin:0;
  line-height:1.5;
  color:#eef5ff;
  font-size:1.1rem;
}

.mission-strip strong{
  display:block;
  margin-top:.65rem;
  color:var(--blue);
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:1.35rem;
}

.contact-mini{
  border-left:1px solid rgba(255,255,255,.35);
  padding-left:1.25rem;
}

.contact-mini a{
  color:#fff;
  font-size:1.15rem;
  text-decoration:none;
}

.contact-mini p{
  margin:.6rem 0 0;
  font-size:.96rem;
  color:#d8e2ee;
}

.hidden-future-block{
  display:none;
}

.detail-page{
  padding:clamp(2rem,6vw,5rem);
  min-height:62vh;
}

.detail-page h1{
  color:var(--blue);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:clamp(2.2rem,7vw,5rem);
  margin:0 0 1rem;
}

.detail-page p,
.detail-page li{
  max-width:950px;
  color:#e9f1fb;
  line-height:1.6;
  font-size:clamp(1rem,2vw,1.2rem);
}

.back-link{
  display:inline-block;
  margin-top:1.5rem;
  color:#79bbff;
  border:1px solid rgba(79,162,255,.7);
  padding:.8rem 1rem;
  text-decoration:none;
}

@media (max-width:900px){
  .history-panel,
  .card-grid,
  .mission-strip{
    grid-template-columns:1fr;
  }

  .timeline{
    grid-template-columns:1fr 1fr;
  }

  .contact-mini{
    border-left:none;
    border-top:1px solid rgba(255,255,255,.35);
    padding-left:0;
    padding-top:1rem;
  }
}

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


/* Local review polish additions */
.focus-intent, .examples-panel{
  border:1px solid rgba(79,162,255,.36);
  border-radius:8px;
  padding:clamp(1.1rem,2.4vw,1.7rem);
  margin:1.4rem 0;
  background:linear-gradient(135deg,rgba(4,18,30,.95),rgba(0,0,0,.65));
}
.focus-intent h2, .examples-panel h2{
  color:var(--blue);
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-top:0;
}
.brick-hospital{
  position:relative;
  width:min(310px,90%);
  height:245px;
  margin:auto;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.45));
}
.brick-hospital .tower{
  position:absolute;
  left:58px;
  bottom:0;
  width:168px;
  height:228px;
  border:1px solid rgba(255,255,255,.18);
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, transparent 1px 17px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.18) 0 1px, transparent 1px 28px),
    linear-gradient(135deg,#7f3c2e,#3a211f);
}
.brick-hospital .wing{
  position:absolute;
  left:0;
  bottom:0;
  width:300px;
  height:92px;
  border:1px solid rgba(255,255,255,.15);
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.07) 0 1px, transparent 1px 15px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.16) 0 1px, transparent 1px 26px),
    linear-gradient(135deg,#6e3329,#241a1b);
}
.brick-hospital .roof{
  position:absolute;
  left:48px;
  bottom:226px;
  width:188px;
  height:12px;
  background:#10151b;
}
.brick-hospital .door{
  position:absolute;
  left:132px;
  bottom:0;
  width:38px;
  height:52px;
  background:#101a24;
  border:1px solid rgba(120,185,255,.35);
}
.brick-hospital .cross{
  position:absolute;
  left:125px;
  top:24px;
  width:38px;
  height:38px;
}
.brick-hospital .cross::before, .brick-hospital .cross::after{content:"";position:absolute;background:#d9e8f5;opacity:.78;}
.brick-hospital .cross::before{left:15px;top:0;width:8px;height:38px;}
.brick-hospital .cross::after{left:0;top:15px;width:38px;height:8px;}
.brick-hospital .window{
  position:absolute;
  width:18px;
  height:20px;
  background:rgba(150,197,230,.3);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 0 12px rgba(79,162,255,.10);
}
.shadow-systems{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 18%, rgba(79,162,255,.16), transparent 18%),
    linear-gradient(120deg, transparent 52%, rgba(0,0,0,.45) 53% 100%);
}
.flow-row{
  display:flex;
  gap:.7rem;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  margin:1.5rem 0;
  color:#dceaf8;
}
.flow-pill{
  border:1px solid rgba(79,162,255,.5);
  padding:.55rem .8rem;
  border-radius:999px;
  background:rgba(0,0,0,.22);
}
.detail-nav{
  margin-top:2rem;
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
}
.detail-nav a{
  color:#79bbff;
  border:1px solid rgba(79,162,255,.7);
  padding:.8rem 1rem;
  text-decoration:none;
}
@media (max-width:700px){.logo-home-link{width:45%;}.brick-hospital{height:220px;transform:scale(.9);}}