*{box-sizing:border-box}
:root{--primary:#2563eb;--primary-dark:#1d4ed8;--text:#172033;--muted:#667085;--bg:#f6f8fb;--white:#fff;--border:#e4e8ef}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{text-decoration:none;color:inherit}
.landing-header{max-width:1180px;margin:auto;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;line-height:0}.brand-logo{display:block;width:185px;height:auto;object-fit:contain}
.landing-header nav{display:flex;align-items:center;gap:18px}
.landing-header nav>a:not(.btn){font-weight:700;color:#475467}
.landing-header nav>a:not(.btn):hover{color:var(--primary)}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:12px 18px;font-weight:700;font-size:15px;transition:.2s ease}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.18)}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px)}
.btn-secondary{background:#eef2f7;color:var(--text)}
.btn-secondary:hover{background:#e2e8f0}
.landing{max-width:1180px;margin:auto;padding:45px 24px 20px}
.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:70px;min-height:570px}
.eyebrow{display:inline-block;background:#e8f0ff;color:var(--primary);font-weight:800;font-size:13px;padding:7px 11px;border-radius:999px;margin-bottom:18px}
.hero h1{font-size:clamp(42px,6vw,68px);line-height:1.08;letter-spacing:-2px;margin:0 0 22px;max-width:700px}
.hero p{font-size:18px;color:var(--muted);max-width:650px;margin:0 0 30px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.preview-card{background:var(--white);border:1px solid var(--border);border-radius:22px;padding:25px;box-shadow:0 20px 60px rgba(23,32,51,.1)}
.preview-top{display:flex;justify-content:space-between;font-weight:800;margin-bottom:22px}.status-dot{color:#16a34a}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.stats-grid>div{background:#f7f9fc;border:1px solid #edf0f5;border-radius:13px;padding:15px}.stats-grid small{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}.stats-grid strong{font-size:22px}
.preview-row{display:flex;justify-content:space-between;gap:15px;padding:16px 0;border-top:1px solid var(--border);font-size:14px}.preview-row b{white-space:nowrap}
.feature-section{padding:70px 0}.feature-section h2{text-align:center;font-size:34px;line-height:1.2;margin:0 auto 35px;max-width:650px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature-grid article{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px}.feature-grid h3{margin:0 0 8px;font-size:18px}.feature-grid p{margin:0;color:var(--muted);font-size:14px}
footer{text-align:center;color:var(--muted);font-size:14px;padding:30px 20px;border-top:1px solid var(--border)}
@media(max-width:850px){.hero{grid-template-columns:1fr;gap:40px;min-height:auto;padding:35px 0}.hero h1{font-size:46px}.feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.landing-header{padding:18px 16px}.brand-logo{width:155px}.landing-header nav{gap:10px}.landing-header nav>a:not(.btn){display:none}.landing{padding:20px 16px}.hero h1{font-size:39px;letter-spacing:-1px}.hero p{font-size:16px}.stats-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr}.preview-card{padding:18px}.btn{width:100%}.hero-actions{display:grid}}
