:root{
  --navy:#0D1B2A; --navy-2:#11233a; --cyan:#00B4D8; --gold:#F7C548;
  --ink:#F0F7FF; --muted:#9fb3c8; --line:rgba(0,180,216,.18);
  --card:#0f2236;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--navy); color:var(--ink);
  font-family:'Inter',system-ui,sans-serif; line-height:1.65;
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(circle at 80% -10%,rgba(0,180,216,.10),transparent 45%),
                   radial-gradient(circle at 0% 30%,rgba(247,197,72,.05),transparent 40%);
}
h1,h2,h3,.brand span,.eyebrow,.kicker,.btn{font-family:'Space Grotesk',sans-serif}
.accent{color:var(--cyan)}
a{color:inherit;text-decoration:none}

/* nav */
.nav{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px clamp(20px,5vw,64px);
  background:rgba(13,27,42,.72);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.04em}
.brand span{font-size:18px}
.mark{width:34px;height:34px}
.nav-cta{
  font-size:14px;font-weight:500;color:var(--cyan);
  border:1px solid var(--line);border-radius:8px;padding:7px 14px;transition:.2s
}
.nav-cta:hover{background:var(--cyan);color:var(--navy)}

/* hero */
.hero{
  text-align:center;padding:clamp(60px,11vw,130px) clamp(20px,5vw,64px) 70px;
  max-width:880px;margin:0 auto
}
.eyebrow{
  text-transform:uppercase;letter-spacing:.28em;font-size:12px;
  color:var(--cyan);font-weight:500;margin-bottom:22px
}
h1{font-size:clamp(40px,8vw,76px);line-height:1.04;font-weight:700;letter-spacing:-.02em}
.lede{
  font-size:clamp(16px,2.4vw,20px);color:var(--muted);
  max-width:620px;margin:26px auto 0
}
.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:38px}
.btn{
  display:inline-block;font-weight:500;font-size:15px;
  padding:13px 26px;border-radius:10px;transition:.2s;cursor:pointer;border:1px solid transparent
}
.btn-primary{background:var(--cyan);color:var(--navy);font-weight:700}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px -10px var(--cyan)}
.btn-ghost{border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.ticker{
  display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;
  margin-top:54px;font-size:13px;letter-spacing:.04em;color:var(--muted)
}
.ticker i{width:4px;height:4px;border-radius:50%;background:var(--gold);display:inline-block}

/* sections */
.section{max-width:1000px;margin:0 auto;padding:clamp(50px,9vw,100px) clamp(20px,5vw,64px)}
.kicker{
  text-transform:uppercase;letter-spacing:.24em;font-size:12px;
  color:var(--gold);font-weight:500;margin-bottom:14px
}
h2{font-size:clamp(28px,5vw,42px);line-height:1.1;letter-spacing:-.01em}
.section-lede{color:var(--muted);font-size:clamp(15px,2vw,18px);max-width:600px;margin-top:16px}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:42px}
.card{
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:28px 24px;transition:.2s
}
.card:hover{transform:translateY(-3px);border-color:rgba(0,180,216,.45)}
.card-ico{color:var(--cyan);font-size:24px;margin-bottom:14px}
.card h3{font-size:19px;margin-bottom:8px}
.card p{color:var(--muted);font-size:15px}

/* offer */
.offer{padding:clamp(20px,5vw,40px) clamp(20px,5vw,64px)}
.offer-inner{
  max-width:1000px;margin:0 auto;
  background:linear-gradient(160deg,var(--navy-2),#0c1c2e);
  border:1px solid var(--line);border-radius:20px;
  padding:clamp(34px,5vw,60px)
}
.offer-list{list-style:none;margin:26px 0 30px;display:grid;gap:12px}
.offer-list li{position:relative;padding-left:28px;color:var(--ink);font-size:15.5px}
.offer-list li::before{
  content:"";position:absolute;left:0;top:8px;width:14px;height:14px;
  border:2px solid var(--cyan);border-radius:4px
}
.micro{color:var(--muted);font-size:13px;margin-top:14px}

/* link stack */
.linkstack{display:grid;gap:12px;margin-top:38px;max-width:560px}
.link-row{
  display:flex;align-items:center;gap:16px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:16px 20px;transition:.2s
}
.link-row:hover{transform:translateX(4px);border-color:rgba(0,180,216,.45)}
.lr-ico{font-size:20px;color:var(--cyan);width:24px;text-align:center}
.lr-text{display:flex;flex-direction:column;flex:1}
.lr-text strong{font-weight:500;font-size:16px}
.lr-text em{font-style:normal;color:var(--muted);font-size:13px}
.lr-arrow{color:var(--muted);transition:.2s}
.link-row:hover .lr-arrow{color:var(--cyan);transform:translateX(3px)}
.link-row.soon{opacity:.5;cursor:default}
.link-row.soon::after{content:"soon";font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border:1px solid var(--line);border-radius:5px;padding:2px 7px}
.link-row.soon:hover{transform:none;border-color:var(--line)}

/* footer */
.footer{
  text-align:center;padding:60px 24px 50px;border-top:1px solid var(--line);margin-top:40px
}
.footer .mark{width:30px;height:30px;margin-bottom:16px}
.foot-line{font-family:'Space Grotesk',sans-serif;font-size:15px;color:var(--ink)}
.foot-micro{color:var(--muted);font-size:13px;margin-top:8px}