/* Site-wide edge spacing fix v1.0.0 */
html, body {
  overflow-x: clip;
}

/* Base slight safety padding so elements do not visually stick to edges */
.wrap {
  width: min(calc(100% - 48px), var(--container-lg));
}

.site-header .wrap {
  width: min(calc(100% - 44px), var(--container-lg));
}

.header-inner {
  gap: 14px;
}

.logo {
  min-width: 0;
  padding-inline-start: 2px;
}

.logo svg {
  flex: none;
}

.logo span,
.logo b {
  white-space: nowrap;
}

.desktop-nav {
  min-width: 0;
}

.hero-grid,
.inner-hero,
.section,
.cta,
.site-footer {
  overflow-x: clip;
}

@media (max-width: 980px) {
  .site-header .wrap {
    width: min(calc(100% - 40px), var(--container-lg));
  }

  .mobile-nav {
    padding-inline: 20px;
  }
}

@media (max-width: 680px) {
  .wrap {
    width: min(calc(100% - 40px), var(--container-lg));
  }

  .site-header .wrap {
    width: min(calc(100% - 36px), var(--container-lg));
  }

  .header-inner {
    gap: 10px;
  }

  .logo {
    gap: 9px;
    font-size: 15px;
    max-width: calc(100% - 112px);
  }

  .logo svg {
    width: 30px;
    height: 30px;
  }

  .header-actions {
    gap: 8px;
    margin-left: auto;
    flex: none;
  }

  .theme-toggle,
  .menu-toggle {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }

  .hero-grid {
    padding-top: 54px;
  }
}