:root{
  --blue:#2D88E8; --blue-deep:#1A5FB4; --blue-soft:#E6F0FB;
  --ink:#0E1B2C; --ink-2:#1F2D42; --muted:#6B7484;
  --paper:#FBFAF6; --cloud:#F4F2EC; --line:#E8E5DD;
  --white:#FFFFFF; --coral:#FF6B47; --sage:#6B9080;
  --radius:16px; --maxw:1080px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--ink); color:var(--white);
  font-family:"DM Sans",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  line-height:1.55; overflow-x:hidden;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit}

.wrap{max-width:var(--maxw); margin:0 auto; padding:20px 18px 56px}
h1,h2,h3{font-family:"Space Grotesk",var(--ink),sans-serif; line-height:1.12; margin:0}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}

.topbar{display:flex; align-items:center; gap:10px; padding:6px 0 18px}
.topbar img{width:38px; height:38px; border-radius:9px; background:var(--white); padding:4px}
.topbar .brand{font-family:"Space Grotesk"; font-weight:600; letter-spacing:.2px}

.eyebrow{
  font-family:"JetBrains Mono"; font-size:12.5px; letter-spacing:.4px;
  color:#9FC6F2; text-transform:none; margin:0 0 14px; display:inline-block;
  background:rgba(45,136,232,.14); border:1px solid rgba(45,136,232,.32);
  padding:7px 12px; border-radius:999px;
}
.grid{display:grid; grid-template-columns:1fr; gap:26px; align-items:start}

h1.title{font-size:clamp(28px,7vw,46px); font-weight:600; letter-spacing:-.5px}
h1.title .hl{color:#7FB6F5}
.subtitle{color:#C5CEDA; font-size:clamp(16px,4.2vw,19px); margin:16px 0 0; max-width:30ch}

.meta{margin:22px 0 0; display:flex; flex-direction:column; gap:12px}
.meta .row{display:flex; gap:11px; align-items:flex-start; font-size:15px; color:#DCE3EC}
.meta .row b{color:var(--white); font-weight:600}
.meta .ic{flex:0 0 auto; width:22px; text-align:center}

.bullets{margin:22px 0 0; display:grid; gap:10px}
.bullets .b{display:flex; gap:10px; align-items:flex-start; font-size:14.5px; color:#CBD4DF}
.bullets .b svg{flex:0 0 auto; margin-top:3px}

/* Form card */
.card{
  background:var(--white); color:var(--ink); border-radius:var(--radius);
  padding:22px 20px; box-shadow:0 18px 50px rgba(0,0,0,.28); border:1px solid var(--line);
}
.card .lead{font-family:"Space Grotesk"; font-weight:600; font-size:19px; margin:0 0 4px}
.card .sub{color:var(--muted); font-size:14px; margin:0 0 16px}
label.fld{display:block; font-size:13px; font-weight:600; color:var(--ink-2); margin:0 0 7px}
input[type=email]{
  width:100%; height:52px; border:1.6px solid var(--line); border-radius:12px;
  padding:0 15px; font-size:16px; color:var(--ink); background:var(--paper);
  font-family:inherit; transition:border-color .15s, box-shadow .15s;
}
input[type=email]:focus{outline:none; border-color:var(--blue); box-shadow:0 0 0 4px rgba(45,136,232,.18); background:#fff}
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}

.cta{
  margin-top:14px; width:100%; height:54px; border:0; border-radius:12px; cursor:pointer;
  background:var(--blue); color:#fff; font-size:17px; font-weight:600;
  font-family:"Space Grotesk"; letter-spacing:.2px;
  transition:transform .12s, background .15s, box-shadow .15s;
  box-shadow:0 10px 24px rgba(45,136,232,.35);
}
.cta:hover{background:var(--blue-deep)}
.cta:active{transform:translateY(1px)}
.cta[disabled]{opacity:.7; cursor:default}
.note{margin:13px 0 0; font-size:12.5px; color:var(--muted); text-align:center}
.msg{margin:12px 0 0; font-size:14px; min-height:1px}
.msg.err{color:#C0392B}

.trust{margin-top:18px; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,.08)}
.trust img{width:100%; aspect-ratio:16/10; object-fit:cover}
.host{display:flex; gap:12px; align-items:center; margin-top:16px; color:#CBD4DF; font-size:13.5px}
.host img{width:54px; height:54px; border-radius:12px; object-fit:cover; flex:0 0 auto}

/* Success screen */
.screen{transition:opacity .22s ease, transform .22s ease}
.screen.hidden{display:none}
.fade-out{opacity:0; transform:translateY(8px)}
.success{max-width:560px; margin:0 auto; text-align:center; padding-top:18px}
.success .check{width:78px; height:78px; margin:0 auto 18px; border-radius:50%;
  background:rgba(107,144,128,.18); border:2px solid var(--sage); display:flex; align-items:center; justify-content:center}
.success h2{font-size:clamp(26px,6vw,36px); font-weight:600}
.success p.ins{color:#C5CEDA; font-size:16px; margin:14px auto 0; max-width:42ch}
.calbtns{display:grid; gap:12px; margin:26px 0 0}
.calbtn{display:flex; align-items:center; justify-content:center; gap:10px;
  height:54px; border-radius:12px; text-decoration:none; font-weight:600;
  font-family:"Space Grotesk"; font-size:16px;}
.calbtn.g{background:var(--blue); color:#fff}
.calbtn.a{background:var(--white); color:var(--ink); border:1.5px solid var(--line)}
.success .final{margin-top:20px; color:var(--muted); font-size:13.5px}
.email-pill{font-family:"JetBrains Mono"; color:#7FB6F5; font-size:13px}

@media(min-width:860px){
  .wrap{padding:30px 28px 70px}
  .grid{grid-template-columns:1.1fr .9fr; gap:48px; align-items:center}
  .topbar img{width:42px; height:42px}
  .card{padding:28px 26px; position:sticky; top:24px}
  .subtitle{font-size:19px}
}
@media (prefers-reduced-motion: reduce){
  .screen,.cta{transition:none}
}
