*{box-sizing:border-box}
:root{
  --bg:#020811;
  --text:#f4f8fb;
  --muted:#a9bbca;
  --line:rgba(115,181,255,.18);
  --cyan:#18d9ff;
  --teal:#18d9b8;
}
html,body{margin:0;min-height:100%;font-family:"Manrope",system-ui,sans-serif;background:#020811;color:var(--text)}
body{
  background:
/*    linear-gradient(180deg, rgba(2,8,17,.2) 0%, rgba(2,8,17,.48) 30%, rgba(2,8,17,.76) 100%),    */
    url("background.png") center center / cover no-repeat fixed;
}
.page{
  min-height:100vh;
  padding:32px 44px 24px;
  display:flex;
  flex-direction:column;
  position:relative;
  backdrop-filter:saturate(110%);
}
.overlay{
  position:absolute;inset:0;pointer-events:none;
  background:
    /*linear-gradient(90deg, rgba(2,8,17,.82) 0%, rgba(2,8,17,.62) 42%, rgba(2,8,17,.16) 100%),*/
    linear-gradient(180deg, rgba(2,8,17,.08) 0%, rgba(2,8,17,.18) 100%);
  z-index:0;
}
.topbar,.hero,.highlights,.footer{position:relative;z-index:1}
.topbar{
  display:flex;justify-content:space-between;align-items:center;gap:16px
}
.logo{width:min(560px,52vw);height:auto;display:block}
.pill{
  border:1px solid var(--line);border-radius:999px;padding:10px 14px;
  background:rgba(5,17,29,.55);backdrop-filter:blur(8px);
  color:#c4d4df;font-size:13px;display:flex;align-items:center;gap:10px
}
.dot{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 18px rgba(24,217,184,.85)}
.hero{
  max-width:860px;
  padding:12vh 0 9vh;
  margin:auto 0;
}
.eyebrow{
  margin:0 0 18px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.18em
}
h1{
  margin:0;
  max-width:900px;
  font-size:clamp(36px,12vw,46px);
  line-height:.95;
  /*letter-spacing:-.06em;
  font-weight:700;*/
}
.lead{
  margin:28px 0 0;max-width:760px;font-size:clamp(18px,1.7vw,24px);line-height:1.5;color:var(--muted)
}
.cta-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:34px}
.btn{
  text-decoration:none;color:#00111d;font-weight:800;
  background:linear-gradient(90deg,#29d9ff,#22e0b4);
  padding:14px 20px;border-radius:12px;box-shadow:0 10px 30px rgba(37,206,255,.18)
}
.microcopy{font-size:14px;color:#7f96a8}
.highlights{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);background:rgba(3,13,23,.38);backdrop-filter:blur(8px)
}
.card{padding:24px 26px 26px;min-height:160px}
.card + .card{border-left:1px solid var(--line)}
.index{display:block;color:#5c7690;font-size:12px;margin-bottom:16px}
.card h2{margin:0 0 8px;font-size:18px}
.card p{margin:0;color:#89a0b4;font-size:14px;line-height:1.5}
.footer{
  display:flex;justify-content:space-between;gap:20px;
  padding-top:18px;color:#587185;font-size:12px
}
@media (max-width: 900px){
  .page{padding:24px 22px 18px}
  .logo{width:min(520px,78vw)}
  .pill{display:none}
  .hero{padding:10vh 0 7vh}
  h1{font-size:clamp(20px,12vw,32px)}
  .highlights{grid-template-columns:1fr}
  .card + .card{border-left:0;border-top:1px solid var(--line)}
  .footer{flex-direction:column}
}