:root{
  --bg:#eef4fb;
  --card:#ffffff;
  --text:#102239;
  --muted:#5c6c7d;
  --primary:#123d73;
  --primary2:#2a5fa5;
  --soft:#f5f9ff;
  --border:#d9e3ee;
  --shadow:0 16px 40px rgba(16,34,57,.08);
  --radius:24px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, Arial, sans-serif;
  background:linear-gradient(180deg,#edf4fb 0%, #f7fafc 100%);
  color:var(--text);
  line-height:1.5;
}
img{max-width:100%;display:block}
.page{
  width:min(1100px, calc(100% - 28px));
  margin:28px auto 42px;
}
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.hero{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  align-items:center;
  padding:28px;
}
.eyebrow{
  display:inline-block;
  margin:0 0 12px;
  padding:8px 12px;
  border-radius:999px;
  background:#e7f0fb;
  color:var(--primary);
  font-weight:800;
}
h1{
  margin:0 0 14px;
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:1.02;
}
.subhead{
  margin:0 0 16px;
  color:var(--muted);
  font-size:1.08rem;
  max-width:58ch;
}
.urgency-box{
  background:#fff7ec;
  border:1px solid #f2debc;
  color:#6b4b10;
  border-radius:18px;
  padding:14px 16px;
  margin:0 0 18px;
}
.benefits{
  list-style:none;
  padding:0;
  margin:0 0 16px;
}
.benefits li{
  position:relative;
  padding-left:30px;
  margin:10px 0;
  font-weight:700;
}
.benefits li::before{
  content:"✓";
  position:absolute;
  left:0; top:0;
  width:22px;height:22px;
  border-radius:50%;
  display:grid;place-items:center;
  background:#e9f6ed;
  color:#166534;
  font-size:.9rem;
}
.trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:16px 0 22px;
}
.trust-pill{
  padding:10px 12px;
  border-radius:999px;
  background:#f3f7fc;
  border:1px solid #dbe5f0;
  color:var(--primary);
  font-weight:700;
  font-size:.95rem;
}
.cta-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 20px;
  border-radius:16px;
  text-decoration:none;
  font-weight:800;
  transition:transform .15s ease, opacity .15s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{
  color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary2));
}
.btn-secondary{
  color:var(--primary);
  background:#eef5fd;
  border:1px solid #d1dff0;
}
.btn.large{
  min-height:58px;
  padding:0 26px;
  font-size:1.02rem;
}
.microcopy{
  color:var(--muted);
  margin-top:12px;
  font-size:.94rem;
}
.hero-visual{
  display:flex;
  justify-content:center;
}
.image-frame{
  width:min(100%, 430px);
  background:#f8fbff;
  border:1px solid var(--border);
  border-radius:28px;
  padding:14px;
}
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:22px;
}
.mini-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:22px;
  padding:22px;
  box-shadow:var(--shadow);
}
.mini-card h2{margin:0 0 10px;font-size:1.15rem}
.mini-card p{margin:0;color:var(--muted)}
.proof, .cta-card{
  margin-top:22px;
  padding:24px;
}
.proof{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;
  align-items:center;
}
.proof h2,.cta-card h2{
  margin:0 0 10px;
  font-size:clamp(1.45rem,3vw,2rem);
}
.proof p,.cta-card p{margin:0;color:var(--muted)}
.proof-list{
  display:grid;
  gap:10px;
}
.proof-item{
  padding:14px 16px;
  border-radius:16px;
  background:#f5f9ff;
  border:1px solid #d7e3f0;
  font-weight:700;
  color:var(--primary);
}
.cta-card{
  text-align:center;
}
.footer{
  padding:24px 6px 0;
  text-align:center;
  color:var(--muted);
  font-size:.92rem;
}
@media (max-width: 860px){
  .hero,.proof{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .page{width:min(100% - 18px, 1100px); margin:18px auto 30px;}
  .hero,.proof,.cta-card{padding:18px}
}