.hero {
  position:relative;
  overflow:hidden;
  padding:72px 24px 56px;
  background:
    radial-gradient(circle at top right, rgba(153,246,228,.14), transparent 24%),
    linear-gradient(135deg, #1a3a5c 0%, #2d5986 100%);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 24%, rgba(153,246,228,.14), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  pointer-events:none;
}
.hero::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:1px;
  background:rgba(255,255,255,.08);
}
.hero-container,.hero-follow-container,.problem-container,.features-container,.how-it-works-container,.stats-container,.final-cta-container { position:relative; max-width:var(--max-page); margin:0 auto; }
.hero-container { display:grid; gap:20px; align-items:end; }
.hero h2 { max-width:840px; margin:0; font-size:clamp(3rem,6vw,5.4rem); line-height:.94; color:#f5fbff; }
.hero p { max-width:760px; margin:0; font-size:1.28rem; line-height:1.68; color:rgba(231,240,248,.84); }
.hero-follow { padding:28px 24px 10px; }
.hero-follow-container { display:grid; gap:22px; }
.hero-buttons { display:flex; flex-wrap:wrap; gap:14px; }
.hero-trust { font-size:1rem; color:rgba(201,216,229,.86); }
.hero-visual { max-width:920px; }
.calculator-preview-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 12px; padding:0 4px; }
.calculator-preview-head p { margin:0; max-width:none; font-size:.96rem; line-height:1.5; color:rgba(221,234,244,.78); }
.calculator-preview-badge { display:inline-flex; align-items:center; min-height:32px; padding:0 12px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#eaf4fb; }
.calculator-preview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; padding:18px; background:linear-gradient(180deg, rgba(23,50,79,.96) 0%, rgba(27,61,93,.92) 100%); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); }
.calculator-preview-item { min-height:168px; padding:18px; border-radius:22px; background:rgba(242,247,251,.08); border:1px solid rgba(255,255,255,.08); display:flex; flex-direction:column; justify-content:space-between; }
.calculator-preview-item h4 { margin:0; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(235,242,248,.62); }
.calculator-preview-item .value { font-family:var(--font-display); font-size:2rem; font-weight:800; line-height:1; color:#f5fbff; }
.calculator-preview-item .detail { font-size:.98rem; color:rgba(235,242,248,.7); }
.problem-section,.features-section,.how-it-works,.stats-section,.final-cta { padding:36px 24px 28px; }
.section-title { margin:0 0 22px; font-size:clamp(2rem,3vw,3rem); line-height:1.05; color:var(--primary); }
.problem-grid,.features-grid,.steps-grid,.stats-grid { display:grid; gap:18px; }
.problem-grid,.features-grid,.steps-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.stats-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.problem-card,.feature-card,.step,.stat,.final-cta-container { background:var(--card); border:1px solid var(--border); border-radius:28px; box-shadow:var(--shadow-sm); }
.problem-card,.feature-card,.step,.stat { padding:28px; }
.problem-card h3,.feature-card h3,.step h3 { margin:0 0 10px; font-size:1.38rem; line-height:1.2; color:var(--primary); }
.problem-card p,.feature-card p,.step p,.stat-label { margin:0; font-size:1.07rem; line-height:1.68; color:var(--foreground-soft); }
.problem-icon,.feature-icon { margin-bottom:20px; display:inline-flex; align-items:center; justify-content:center; min-width:76px; min-height:32px; padding:0 12px; border-radius:999px; background:var(--accent-soft); font-size:0; }
.problem-icon::before { content:"Issue"; font-size:1rem; font-weight:700; color:var(--accent); letter-spacing:.12em; text-transform:uppercase; }
.feature-icon::before { content:"Feature"; font-size:1rem; font-weight:700; color:var(--accent); letter-spacing:.12em; text-transform:uppercase; }
.step-number { display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; margin-bottom:18px; border-radius:999px; background:var(--primary); color:var(--primary-foreground); font-family:var(--font-display); font-size:1.1rem; font-weight:800; }
.how-it-works-cta { margin-top:22px; }
.stat-number { margin-bottom:10px; font-family:var(--font-display); font-size:2.6rem; font-weight:800; line-height:1; color:var(--primary); }
.stat-note { margin-top:10px; font-size:.98rem; color:var(--foreground-muted); }
.final-cta-container { max-width:860px; padding:40px 42px; text-align:center; }
.final-cta h2 { margin:0 0 14px; font-size:clamp(2rem,3vw,3.3rem); line-height:1.04; color:var(--primary); }
.final-cta p { margin:0 0 24px; font-size:1.15rem; color:var(--foreground-soft); }
@media (max-width: 960px) { .problem-grid,.features-grid,.steps-grid,.stats-grid,.calculator-preview { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 768px) {
  .hero { padding:48px 18px 40px; }
  .hero-follow { padding:24px 18px 6px; }
  .hero p { font-size:1.12rem; }
  .hero-buttons { flex-direction:column; }
  .btn,.btn-primary,.btn-secondary { width:100%; }
  .problem-section,.features-section,.how-it-works,.stats-section,.final-cta { padding-left:18px; padding-right:18px; }
  .calculator-preview-head { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 560px) {
  .problem-grid,.features-grid,.steps-grid,.stats-grid,.calculator-preview { grid-template-columns:1fr; }
  .problem-card,.feature-card,.step,.stat,.final-cta-container { padding:22px; border-radius:22px; }
}