:root {
  --ink: #1d1d1f;
  --muted: #54545a;
  --blue: #005bb9;
  --wash: #f5f5f7;
  color: var(--ink);
}
.shell { max-width: 1160px; }
.header-inner { height: 66px; }
.brand { letter-spacing: 0; }
.language { color: var(--blue); white-space: nowrap; font-size: 14px; }
.hero { padding: clamp(36px, 6vw, 85px) 0 0; }
.hero-copy { max-width: 870px; margin: 0 auto 38px; }
.hero .lead { max-width: 690px; margin: 0 auto 24px; }
.hero .button { border-radius: 100px; }
.cover { aspect-ratio: 2.7; border-radius: 28px; background: var(--wash); object-position: center 48%; }
.section { padding-block: clamp(48px, 8vw, 92px); }
.offers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 26px; }
.offer { border-radius: 22px; padding: clamp(20px, 3vw, 34px); background: var(--wash); }
.offer h3 { font-size: clamp(22px, 2.3vw, 31px); margin: 0 0 12px; }
.offer p { margin-bottom: 20px; }
.offer small { color: var(--blue); line-height: 1.55; }
.about { background: var(--wash); }
.about .lead { max-width: 730px; margin-top: 16px; }
#solutions, #about { scroll-margin-top: 65px; }
@media (max-width: 700px) {
  .header-inner { flex-wrap: wrap; height: auto; min-height: 60px; gap: 0 12px; padding-block: 10px; }
  .header nav { display: flex; position: static; gap: 12px; padding: 0; border: 0; background: transparent; }
  .header nav a { padding: 7px 0; }
  .header .brand { font-size: 15px; }
  .cover { aspect-ratio: 1.55; border-radius: 18px; }
  .offers { grid-template-columns: 1fr; }
}