html {
  overflow-x: hidden;
}

body {
  min-width: 0;
  overflow-x: hidden;
}

.container {
  width: min(100% - 32px, var(--container)) !important;
}

.section {
  padding-block: 64px !important;
}

.hero {
  padding-block: 48px 64px !important;
}

.hero-grid,
.feature-grid,
.about-grid,
.faq-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 42px !important;
}

.hero-copy,
.hero-visual,
.feature-copy,
.feature-visual,
.about-copy,
.about-image-wrap,
.faq-intro,
.faq-list,
.cta-copy,
.cta-action {
  min-width: 0;
}

.hero h1 {
  font-size: clamp(2.65rem, 9vw, 4.5rem) !important;
  line-height: 1.04 !important;
  overflow-wrap: anywhere;
}

.section-heading h2,
.feature-copy h2,
.about-copy h2,
.faq-intro h2,
.cta-copy h2 {
  font-size: clamp(2rem, 6.5vw, 3.5rem) !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere;
}

.hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px !important;
}

.button,
.text-link,
.faq-question {
  min-height: 44px !important;
}

.hero-actions .button {
  width: 100% !important;
  justify-content: center !important;
}

.hero-visual,
.feature-visual,
.about-image-wrap {
  width: 100% !important;
  max-width: 700px !important;
  margin-inline: auto !important;
}

.hero-image-wrap,
.feature-image-wrap,
.about-image-wrap {
  overflow: hidden;
}

.hero-image,
.feature-image-wrap img,
.about-image-wrap img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

.hero-floating-card {
  max-width: calc(100% - 24px) !important;
}

.value-strip-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 18px !important;
}

.value-item {
  width: 100% !important;
  min-width: 0;
}

.services-grid,
.process-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 20px !important;
}

.service-card,
.process-card {
  min-width: 0;
}

.feature-list,
.footer-links {
  padding-left: 0;
}

.cta-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 28px !important;
  padding: 32px 24px !important;
}

.cta-action,
.cta-action .button {
  width: 100% !important;
}

.cta-action .button {
  justify-content: center !important;
}

.contact-form-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 20px !important;
}

.field,
.field input,
.field select,
.field textarea {
  min-width: 0;
  width: 100% !important;
}

.field input,
.field select {
  min-height: 48px !important;
}

.field textarea {
  min-height: 150px !important;
  resize: vertical;
}

.faq-question {
  width: 100% !important;
  gap: 16px !important;
  text-align: left;
}

img,
svg {
  max-width: 100%;
}

.reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition:
    opacity 600ms var(--ease),
    transform 600ms var(--ease);
  will-change: opacity, transform;
}

.reveal.delay-1 {
  transition-delay: 90ms;
}

.reveal.delay-2 {
  transition-delay: 180ms;
}

.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  will-change: auto;
}

.hero-visual.reveal,
.feature-visual.reveal,
.about-image-wrap.reveal {
  transform: translate3d(0, 28px, 0) scale(.985);
}

.hero-visual.reveal.is-visible,
.feature-visual.reveal.is-visible,
.about-image-wrap.reveal.is-visible {
  transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  .reveal,
  .hero-visual.reveal,
  .feature-visual.reveal,
  .about-image-wrap.reveal {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }
}

@media (min-width: 480px) {
  .container {
    width: min(100% - 40px, var(--container)) !important;
  }

  .hero-actions .button,
  .cta-action,
  .cta-action .button {
    width: auto !important;
  }

  .cta-panel {
    padding: 40px !important;
  }
}

@media (min-width: 768px) {
  .container {
    width: min(100% - 56px, var(--container)) !important;
  }

  .section {
    padding-block: 84px !important;
  }

  .hero {
    padding-block: 72px 88px !important;
  }

  .services-grid,
  .process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  .value-strip-inner {
    flex-direction: row !important;
    flex-wrap: wrap !important;
  }

  .value-item {
    flex: 1 1 200px !important;
  }

  .contact-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
  }

  .cta-panel {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 48px !important;
  }

  .cta-copy {
    max-width: 720px;
  }
}

@media (min-width: 1024px) {
  .section {
    padding-block: 104px !important;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1.02fr) minmax(420px, .98fr) !important;
    align-items: center !important;
    gap: clamp(48px, 7vw, 88px) !important;
  }

  .feature-grid,
  .about-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: clamp(52px, 7vw, 92px) !important;
  }

  .faq-layout {
    grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr) !important;
    align-items: start !important;
    gap: clamp(52px, 7vw, 96px) !important;
  }

  .services-grid,
  .process-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 28px !important;
  }

  .hero-visual,
  .feature-visual,
  .about-image-wrap {
    max-width: none !important;
  }
}