/* ── Mobile first ── */
@media only screen and (max-width: 767px) {
  .survey-box {
    padding: 24px 16px;
  }

  .survey-title {
    font-size: 2.6rem;
  }

  #surveyForm .d-flex {
    flex-direction: column;
  }

  .site-header {
    flex-direction: column;
  }

  .header-cta {
    min-width: unset;
    width: 100%;
    padding: 12px 16px;
  }

  section.hero .hero-title {
    font-size: 3.2rem;
    text-align: center;
  }

  section.hero .hero-subtitle,
  section.hero .hero-instruction {
    text-align: center;
  }

  section.hero .offer-code-input,
  section.hero .btn-apply-now {
    max-width: 100%;
  }

  section.hero .no-code-text,
  section.hero .speak-link {
    text-align: center;
    display: block;
  }

  section.features .features-divider {
    display: none;
  }

  section.features .features-heading,
  section.features .cta-heading {
    font-size: 1.9rem;
  }
}

/* ── Tablet / side-by-side breakpoint (768px) ── */
@media only screen and (min-width: 768px) {
  section.hero .hero-title {
    font-size: 4rem;
  }

  section.hero .hero-img {
    min-width: 320px;
  }

  .thankyou-box {
    padding: 60px 40px;
  }

  .thankyou-title {
    font-size: 4rem;
  }

  .survey-box {
    padding: 48px;
  }
}

/* ── Desktop ── */
@media only screen and (min-width: 992px) {
  section.hero .hero-title {
    font-size: 4.4rem;
  }

  section.hero .hero-img {
    min-width: 380px;
  }
}

@media only screen and (min-width: 1200px) {
  section.hero .hero-img {
    max-width: 560px;
  }
}