
:root {
  --color-bg: #F7F8FA;
  --color-surface: #FFFFFF;
  --color-text: #111827;
  --color-muted: #6B7280;
  --color-primary: #0F3D5E;
  --color-primary-light: #1D5F8C;
  --color-accent: #F59E0B;
  --color-border: #E5E7EB;
  --font-display: 'Manrope';
  --font-body: 'Inter';
  --section-y: 96px;
  --container-x: 24px;
  --grid-gap: 24px;
  --radius-card: 20px;
  --radius-button: 14px;
  --shadow-card: 0 20px 50px rgba(17,24,39,0.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-body), sans-serif;
  color: var(--color-text);
  background: linear-gradient(180deg, var(--color-bg) 0%, #ffffff 30%, var(--color-bg) 100%);
}
img { max-width: 100%; display: block; border-radius: calc(var(--radius-card) - 4px); }
a { color: inherit; text-decoration: none; }
.container { width: min(1160px, calc(100% - (var(--container-x) * 2))); margin: 0 auto; }
.section { padding: var(--section-y) 0; }
.hero { padding: calc(var(--section-y) + 12px) 0 var(--section-y); }
.hero-grid, .services-grid, .proof-grid, .review-grid, .steps-grid {
  display: grid;
  gap: var(--grid-gap);
}
.hero-grid { grid-template-columns: 1.2fr 0.8fr; align-items: center; }
.hero-copy h1, h2, h3 { font-family: var(--font-display), sans-serif; margin: 0 0 12px; line-height: 1.05; }
.hero-copy h1 { font-size: clamp(2.8rem, 5vw, 4.6rem); }
.lead { font-size: 1.1rem; line-height: 1.7; color: var(--color-muted); max-width: 64ch; }
.eyebrow {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.14);
  color: var(--color-primary);
  font-weight: 700;
  font-size: 0.85rem;
}
.card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  padding: 24px;
  box-shadow: var(--shadow-card);
}
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 18px;
  border-radius: var(--radius-button);
  font-weight: 700;
}
.btn-primary { background: var(--color-accent); color: #111827; }
.btn-secondary { background: transparent; border: 1px solid var(--color-border); }
.chip-list, .coverage-list, .checklist, .contact-list, .stats-list {
  list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 12px;
}
.chip-list li, .coverage-list li, .checklist li {
  padding: 10px 14px; border-radius: 999px; background: var(--color-surface); border: 1px solid var(--color-border);
}
.services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.review-grid, .steps-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.faq-list { display: grid; gap: 16px; }
.faq-item summary { cursor: pointer; font-weight: 700; }
.footer { padding: 28px 0 36px; background: #0f172a; color: #e5e7eb; }
.footer-row { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: center; }
.footer nav { display: flex; flex-wrap: wrap; gap: 14px; }
.section-title { margin-bottom: 22px; }
@media (max-width: 980px) {
  .hero-grid, .services-grid, .review-grid, .steps-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .hero-grid, .services-grid, .review-grid, .steps-grid { grid-template-columns: 1fr; }
  .hero-copy h1 { font-size: 2.4rem; }
}
