@media (max-width: 767px) {
  body {
    overflow-x: hidden;
  }

  nav.hidden.md\:flex {
    display: none !important;
  }

  button[data-mobile-menu-toggle] {
    display: none !important;
  }

  [data-mobile-menu] {
    display: block !important;
  }

  [data-mobile-menu] a {
    display: block;
  }

  h1.text-5xl.md\:text-7xl {
    font-size: 2.75rem !important;
    line-height: 1.05 !important;
  }

  .text-lg.md\:text-xl {
    font-size: 1rem !important;
  }

  .py-32.md\:py-40,
  .py-32.md\:py-48 {
    padding-top: 4.5rem !important;
    padding-bottom: 4.5rem !important;
  }

  .w-24.shrink-0.text-right.font-bold.text-\[\#00BFFF\].text-xl.pt-1 {
    width: auto !important;
    text-align: left !important;
    padding-top: 0 !important;
  }

  .flex.gap-6.mb-8.relative {
    flex-direction: column !important;
    gap: 0.75rem !important;
  }

  .flex.items-start.gap-6.bg-gray-50.p-8.rounded-2xl.border.border-gray-100,
  .flex.items-start.gap-6.bg-white.p-8.rounded-2xl.border.border-gray-100 {
    flex-direction: column !important;
  }

  .inline-flex.items-center.gap-4.bg-white\/20 {
    flex-direction: column !important;
    border-radius: 1.5rem !important;
  }

  .pt-8.border-t.border-gray-800.flex.flex-col.md\:flex-row.justify-between.items-center.gap-4.text-sm.text-gray-500,
  .flex.gap-6 {
    flex-wrap: wrap;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body {
    overflow-x: hidden;
  }

  nav.hidden.md\:flex {
    gap: 1rem !important;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  h1.text-5xl.md\:text-7xl {
    font-size: 3.75rem !important;
  }

  .flex.gap-6.mb-8.relative {
    gap: 1rem !important;
  }
}