/* Ajustes v3: navbar proporcional, margens consistentes e navegação inglesa. */
:root {
  --page-gutter: clamp(28px, 7vw, 132px);
}

.site-header {
  height: 100px;
  grid-template-columns: minmax(220px, 310px) 1fr auto;
  padding-inline: var(--page-gutter);
}

.site-header.is-scrolled { height: 76px; }
.brand { width: clamp(218px, 17vw, 292px); }
.desktop-nav {
  gap: clamp(17px, 1.65vw, 30px);
  padding-inline: clamp(18px, 2.6vw, 42px);
}
.desktop-nav a {
  font-size: 10px;
  letter-spacing: .055em;
}

.hero { padding-top: 100px; }
.inner-hero { padding-top: 100px; }
.inner-hero-copy { padding-inline: var(--page-gutter); }
.section-gutter { padding-inline: var(--page-gutter); }
footer { padding-inline: var(--page-gutter); }
.statement-section::before,
.founder-section::before,
.news-section::before { left: var(--page-gutter); }

@media (max-width: 1220px) {
  :root { --page-gutter: 6vw; }
  .site-header {
    grid-template-columns: minmax(205px, 250px) 1fr auto;
    padding-inline: var(--page-gutter);
  }
  .brand { width: clamp(205px, 20vw, 244px); }
  .desktop-nav { gap: 16px; padding-inline: 20px; }
  .section-gutter { padding-inline: var(--page-gutter); }
}

@media (max-width: 980px) {
  :root { --page-gutter: clamp(24px, 5vw, 48px); }
  html { scroll-padding-top: 76px; }
  .site-header,
  .site-header.is-scrolled {
    height: 76px;
    padding-inline: var(--page-gutter);
  }
  .brand { width: 232px; }
  .mobile-menu {
    inset: 76px 0 0;
    padding-inline: var(--page-gutter);
  }
  .hero { padding-top: 76px; }
  .inner-hero { padding-top: 76px; }
  .inner-hero-copy { padding-inline: var(--page-gutter); }
}

@media (max-width: 700px) {
  :root { --page-gutter: 20px; }
  html { scroll-padding-top: 70px; }
  .site-header,
  .site-header.is-scrolled {
    height: 70px;
    padding-inline: var(--page-gutter);
  }
  .brand { width: min(55vw, 205px); }
  .mobile-menu { inset: 70px 0 0; }
  .hero { padding-top: 70px; }
  .hero-photo { top: 70px; }
  .inner-hero { padding-top: 70px; }
  .inner-hero-copy,
  .inner-hero-team .inner-hero-copy { padding-inline: var(--page-gutter); }
  .section-gutter { padding-inline: var(--page-gutter); }
}
