.hero{padding:46px 0 26px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:36px;align-items:center}
.hero h1{font-size:2.7rem;margin:14px 0 14px;line-height:1.1}
.hero h1 span{color:var(--blue);display:block}
.lead{font-size:1.12rem;color:#3b4664;max-width:560px}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 10px}
.cta .btn{padding:13px 20px;font-size:1rem}
.mock{position:relative;min-height:400px}
.mock-card{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(16,40,80,.14);padding:18px 20px;width:78%;position:relative;z-index:2}
.mock-top{height:6px;background:var(--blue);border-radius:6px;margin:-6px -8px 14px}
.mock-title{font-weight:800;color:var(--navy);font-size:1.15rem;margin-bottom:10px}
.mock-lbl{font-size:.78rem;font-weight:700;color:var(--navy);margin:10px 0 4px}
.mock-in{height:30px;border:1px solid #d5ddeb;border-radius:8px;background:#fbfcff}
.mock-opts{display:flex;gap:6px;flex-wrap:wrap}
.mock-opts span{font-size:.78rem;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:#4a5470}
.mock-opts span.on{background:#eaf1ff;border-color:#b8cbf3;color:var(--blue);font-weight:700}
.mock-sig{height:54px;border:1px dashed #b9c4da;border-radius:8px;background:#fbfcff;padding:2px 10px}
.mock-sig svg{width:100%;height:100%}
.mock-btn{margin-top:14px;background:var(--blue);color:#fff;font-weight:700;text-align:center;border-radius:9px;padding:9px;font-size:.9rem}
.mock-he{position:absolute;right:0;bottom:-6px;width:56%;z-index:3;transform:rotate(2deg)}
.sec{padding:34px 0}
.sec-h{font-size:1.8rem;text-align:center;margin-bottom:22px}
.feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.feat h3{font-size:1.08rem;margin:8px 0 6px}
.feat p{margin:0;color:#4a5470;font-size:.95rem}
.fi{width:40px;height:40px;border-radius:11px;background:#eaf1ff;color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:s}
.steps li{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;counter-increment:s;display:flex;flex-direction:column;gap:4px}
.steps li::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.steps b{color:var(--navy)}
.steps span{color:#4a5470;font-size:.93rem}
#pricing .plans{max-width:760px;margin:0 auto 14px}
.center{text-align:center}
.final-box{text-align:center;padding:30px}
.final-box h2{font-size:1.5rem}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero h1{font-size:2.1rem}
  .mock{min-height:360px;max-width:520px}
  .feat{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .feat,.steps{grid-template-columns:1fr}
  .hero{padding-top:28px}
  .hero h1{font-size:1.85rem}
  .mock-card{width:88%}
  .mock-he{width:66%}
}