/* Overrides shared by sections, followed by narrow-screen adaptations. */
.nav-demo {
  margin-left: 0;
}
.cw-g2 > *,
.cw-g3 > *,
.cw-g4 > * {
  min-width: 0;
}
.preview-section {
  padding-top: 24px;
}
.challenge-item:last-child {
  border-right: 0;
}
.closing-button:hover {
  background: var(--color-accent-900);
  color: white;
}
.closing-email:hover {
  color: var(--color-accent-900);
  border-color: var(--color-accent-900);
}
.footer-links a {
  overflow-wrap: anywhere;
}

@media (max-width: 1050px) {
  .cw-g3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .nav {
    gap: 10px 16px;
  }
  .nav-brand {
    flex: 1 1 100%;
  }
  .client-area {
    margin-left: auto;
  }
  html {
    scroll-padding-top: 160px;
  }
}

@media (max-width: 640px) {
  .site-nav {
    position: static;
  }
  .nav {
    gap: 8px 16px;
  }
  .nav-brand {
    margin-bottom: 8px;
  }
  .client-area {
    margin-left: 0;
  }
  .nav .btn {
    flex: 1 1 calc(50% - 16px);
  }
  html {
    scroll-padding-top: 20px;
  }
  .cw-g2,
  .cw-g3,
  .cw-g4,
  .preview-fields {
    grid-template-columns: minmax(0, 1fr);
  }
  .cw-g4 {
    margin-inline: 0;
  }
  .challenge-item {
    padding-inline: 0;
    border-right: 0;
    border-bottom: 1px solid var(--color-divider);
  }
  .hero-promises {
    flex-direction: column;
    gap: 8px;
  }
  .table {
    min-width: 740px;
  }
  .table caption {
    max-width: 260px;
  }
  .closing-email {
    font-size: 16px;
    overflow-wrap: anywhere;
  }
  .footer-links {
    flex-direction: column;
    gap: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;
  }
}