:root{
  --color-primary:#4C7EFF;
  --color-secondary:#60D394;
  --color-accent:#FFC15E;
  --color-success:#60D394;
  --color-warning:#FFB74D;
  --color-error:#FF6B6B;
  --color-background:#F8F9FA;
  --color-surface:#F1F3F4;
  --color-card:#FFFFFF;
  --color-text-primary:#1A1A1A;
  --color-text-secondary:#6B7280;
  --color-text-tertiary:#9CA3AF;
  --color-border:#E5E7EB;
  --ring-shadow:0 10px 30px rgba(76,126,255,0.15);
  --container:1200px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--color-background);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;font-family:-apple-system, system-ui, Roboto, sans-serif}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
header{position:sticky;top:0;background:rgba(255,255,255,.7);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--color-border)}
.row{display:flex;gap:12px;align-items:center}
.between{justify-content:space-between}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:12px 18px;font-weight:600}
.btn-primary{background:var(--color-primary);color:#fff;box-shadow:var(--ring-shadow)}
.btn-outline{border:1px solid var(--color-border);background:#fff;color:var(--color-text-primary)}
.hero{padding-top:72px;padding-bottom:56px}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:1.2fr 1fr}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--color-border);border-radius:16px;padding:18px}
.phone{background:#fff;border-radius:20px;height:520px;border:1px solid var(--color-border);background-image:radial-gradient(1200px 400px at 50% -20%, rgba(76,126,255,0.08), transparent)}
.footer{border-top:1px solid var(--color-border)}
.muted{color:var(--color-text-secondary)}

@media (max-width: 960px){
  .grid-2{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr 1fr}
}
@media (max-width: 600px){
  .grid-4{grid-template-columns:1fr}
}


