:root{--blue:#0057ff;--dark:#0f172a;--light:#f8fafc;--text:#0f172a;--muted:#475569;--border:#dbe3f0}
*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);background:var(--light);line-height:1.5}
.container{width:min(1120px,92%);margin:0 auto}.section{padding:72px 0}.light{background:#fff}
.navbar{position:sticky;top:0;background:#ffffffea;backdrop-filter:blur(6px);border-bottom:1px solid var(--border);z-index:50}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}.brand{font-weight:800;color:var(--dark);text-decoration:none;font-size:1.25rem}
.menu{display:flex;gap:18px}.menu a{text-decoration:none;color:var(--dark);font-weight:600}.menu a:hover{color:var(--blue)}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;font-weight:700;text-decoration:none;transition:.2s}.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:#0045cc;transform:translateY(-1px)}
.btn-secondary{border:1px solid var(--border);color:var(--dark);background:#fff}.btn-secondary:hover{border-color:#9fb6ff;background:#f4f7ff}
.hero{background:linear-gradient(135deg,#eaf1ff,#ffffff);padding:82px 0}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}
.tag{display:inline-block;background:#dbe7ff;color:#0b3fb3;font-weight:700;border-radius:999px;padding:6px 12px;font-size:.82rem}
h1{font-size:clamp(2rem,4vw,3.15rem);line-height:1.15;margin:.9rem 0 1rem}h2{font-size:clamp(1.7rem,3vw,2.35rem);margin:0 0 24px}h3{margin:.2rem 0 .5rem}
.hero p{font-size:1.05rem;color:var(--muted);max-width:58ch}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.mockup{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:0 16px 40px rgba(15,23,42,.08)}.mockup-header{font-weight:800;margin-bottom:12px}
.mockup-field{margin-bottom:12px}.mockup-field label{display:block;font-size:.85rem;color:#334155;margin-bottom:5px}.mockup-field input,.mockup-field select{width:100%;padding:11px;border:1px solid #cbd5e1;border-radius:10px;background:#fff}
.upload-chip{padding:10px;border-radius:10px;background:#eef4ff;color:#0a3bb5;font-weight:600}.checkbox-row{display:flex;align-items:center;gap:8px}
.cards-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:0 8px 24px rgba(15,23,42,.05)}.card p{color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.step{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px}.step span{width:32px;height:32px;display:grid;place-items:center;background:var(--blue);color:#fff;border-radius:50%;font-weight:800}
.pricing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.price-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;position:relative}.price-card ul{padding-left:18px;color:var(--muted)}.price{font-size:2rem;font-weight:800}.price span{font-size:1rem;color:var(--muted);font-weight:600}
.featured{border:2px solid var(--blue);box-shadow:0 18px 40px rgba(0,87,255,.16)}.badge{position:absolute;top:-12px;right:18px;background:var(--blue);color:#fff;padding:5px 10px;border-radius:999px;font-size:.8rem;font-weight:700}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}details{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px}summary{font-weight:700;cursor:pointer}
.cta-box{background:linear-gradient(135deg,#0f172a,#1d4ed8);border-radius:20px;padding:40px;color:#fff;text-align:center}.cta-box p{opacity:.95;max-width:720px;margin:0 auto 18px}
.footer{background:#0f172a;color:#e2e8f0;padding:34px 0}.footer-inner{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.footer a{color:#cbd5e1;text-decoration:none;display:block;margin-bottom:8px}.footer a:hover{color:#fff}
@media (max-width:980px){.hero-grid,.cards-4,.steps,.pricing,.faq-grid{grid-template-columns:1fr 1fr}.menu{display:none}}
@media (max-width:680px){.hero-grid,.cards-4,.steps,.pricing,.faq-grid{grid-template-columns:1fr}.section{padding:56px 0}.footer-inner{flex-direction:column}}
