/* FleetFixer marketing design tokens + base
   Imported by every marketing page (index, about, pricing, docs,
   contact, blog, blog-post, careers, news, legal, platforms, learn, games). */

*{box-sizing:border-box;margin:0;padding:0}

:root{
  --accent:#1f5fa8;
  --accent-2:#2e7fc1;
  --accent-light:#4fb3d6;
  --accent-glow:#6fd0ea;
  --accent-red:#c8102e;
  --accent-red-dark:#a00d24;
  --bg:#f8fafc;
  --panel:#ffffff;
  --stroke:#e2e8f0;
  --text:#0b2545;
  --muted:#64748b;
  --radius:16px;
  --brand-gradient:linear-gradient(135deg,#1f5fa8 0%,#2e7fc1 50%,#4fb3d6 100%);
  --brand-gradient-soft:linear-gradient(135deg,#2e7fc1 0%,#6fd0ea 100%);
  --hero-dark:#060d1b;
}

html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}

/* Shared section layout */
.sec{padding:96px 24px}
.sec-inner{max-width:1200px;margin:0 auto}
.sec-label{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;
  color:var(--accent);background:rgba(31,95,168,.07);
  padding:6px 14px;border-radius:99px;margin-bottom:16px;
}
.sec-title{font-size:clamp(28px,4vw,42px);font-weight:800;letter-spacing:-.03em;line-height:1.15;margin-bottom:12px}
.sec-sub{font-size:17px;color:var(--muted);line-height:1.7;max-width:580px}
.sec-header{margin-bottom:56px}
.sec-header.center{text-align:center}
.sec-header.center .sec-sub{margin:0 auto}

@media(max-width:768px){
  .sec{padding:64px 20px}
  .sec-title{font-size:clamp(24px,5vw,36px)}
}