@media only screen and (max-width: 600px) {
  .top-bar {
    display: block;
    text-align: center;
  }
  .left-content,
  .right-content {
    display: block;
  }
  /* remove horizontal padding so logo/menu sit flush to edges */
  .bottom-nav {
    padding: 10px 10px;
  }
  .web-log img {
    margin: 0;
    width: 140px;
    object-fit: contain;
  }

  /* ensure hamburger touches the right edge and has no extra margin */
  .menu-toggle {
    margin: 0 8px 0 0;
  }

  /* Disable logo animations on small screens (improves performance & accessibility) */
  .web-log img.float,
  .loading-logo,
  .footer-logo {
    animation: none !important;
    transform: none !important;
    transition: none !important;
  }

  .hero-content h1 {
    font-size: 30px;
    margin-bottom: 0px;
  }
  .hero-content p {
    font-size: 18px;
    margin-bottom: 20px;
  }
  .slide {
    padding: 50px 20px;
  }
  .slide .hero-content {
    padding: 0 12px;
  }
  .cta-button {
    padding: 7px 20px;
  }

  .dot {
    width: 7px;
    height: 7px;
  }

  .slider-dots {
    padding: 7px 7px;
  }

  .middle-heading h1 {
    font-size: 25px;
    text-align: left;
  }

  .middle-heading p {
    font-size: 16px;
    text-align: left;
  }
  .intersect-smallbox {
    max-width: 200px;
    transform: translate(-15%, 15%);
  }
  .grid-section {
    display: block;
  }
  .text-content h1 {
    font-size: 25px;
    margin-top: 50px;
  }

  .text-content p {
    font-size: 16px;
  }
  .grid-section {
    padding: 0px;
  }

  h1.center-heading {
    font-size: 25px;
    margin-bottom: 25px;
  }

  .grid-cards {
    display: block;
  }

  .advance-thermal {
    width: unset;
    max-width: unset;
    padding: 50px 20px;
  }
  .card {
    margin: 25px 0;
  }

  .card-content h1 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .card-content p {
    font-size: 16px;
    margin: 10px 0 !important;
  }

  .key-benifits .center-heading {
    text-align: center;
  }
  .key-benifits .center-heading h1 {
    font-size: 25px !important;
    line-height: 1.5;
  }
  .key-benifits h1 {
    margin-left: 30px;
  }
  .ulgrid {
    display: block;
    text-align: center;
    padding-left: 12px;
    padding-right: 12px;
  }
  .recovery-section {
    padding: 50px 20px;
  }

  .ulgrid .multiple-columns {
    padding: 0 !important;
    padding-bottom: 15px !important;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    max-width: 90%;
  }

  .ulgrid .multiple-columns strong {
    display: block;
    margin-bottom: 6px;
  }

  .multiple-columns::before {
    content: unset !important;
  }
  .technology-power .bottom-section {
    max-width: unset;
  }
  .technology-power .bottom-section p {
    font-size: 16px;
  }

  .technology-power .bottom-section {
    padding: 0;
  }
  .technology-power ul li {
    font-size: 18px;
  }
  .cta-section {
    display: block;
    padding: 30px 20px;
  }
  .cta-section .content-center {
    display: block;
    width: unset !important;
  }
  .cta-section .content-center h1 {
    position: unset !important;
    transform: unset;
  }
  .cta-section .right-flex-end {
    width: 100%;
  }
  .cta-section::after {
    content: unset;
  }
  .cta-section .content-center h1 {
    font-size: 30px;
  }
  .newsletter-card {
    width: unset;
    padding: 30px;
  }
  h3.hours-title {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .hours-grid {
    display: block;
  }

  .day-group {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .time-label {
    font-size: 14px;
  }
  .newsletter-subtitle {
    margin-bottom: 20px;
  }
  .email-input {
    width: unset;
  }
  .newsletter-title {
    margin-top: 10px;
  }
  section.wellness-summary-section {
    padding: 50px 20px !important;
  }
  section.wellness-summary-section h2 {
    font-size: 25px !important;
  }

  section.wellness-summary-section p {
    font-size: 16px !important;
    margin: 10px 0;
  }
  .footer-container {
    gap: 0;
  }
  .footer-links,
  .footer-features {
    margin-top: 0;
  }
  .footer-logo {
    width: 200px;
    margin-bottom: 0;
  }
  .footer-desc {
    font-size: 14px;
    line-height: 1.5;
  }
  .footer-bottom {
    display: block;
    text-align: center;
  }

  .footer-bottom span {
    display: inline-block;
    margin: 10px 0 20px;
    font-size: 16px;
  }
  .footer-policy-links {
    display: flex;
    gap: 0;
    justify-content: space-around;
    align-items: center;
  }

  /* Mobile typography adjustments (overall page) */
  body {
    font-size: 15px;
    line-height: 1.45;
    -webkit-text-size-adjust: 100%;
  }

  h1 {
    font-size: 24px;
    line-height: 1.2;
  }
  h2 {
    font-size: 20px;
    line-height: 1.25;
  }
  h3 {
    font-size: 18px;
    line-height: 1.3;
  }
  p {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 12px;
  }

  .hero-content h1 {
    font-size: 28px;
  }
  .hero-content p {
    font-size: 16px;
  }

  .center-heading h1 {
    font-size: 22px;
  }
  .key-benifits .center-heading h1 {
    font-size: 22px !important;
  }

  .nav-links a {
    font-size: 16px;
    padding: 12px 10px;
  }
  .card-content h1 {
    font-size: 18px;
  }
  .card-content p {
    font-size: 15px;
  }
  .ulgrid .multiple-columns {
    font-size: 15px;
  }
  .footer-desc {
    font-size: 14px;
    line-height: 1.5;
  }
  .footer-bottom span {
    font-size: 14px;
  }

  .book-now .btn,
  .subscribe-btn,
  .email-input {
    font-size: 15px;
  }

  ul.grid-list {
    display: block;
    margin-top: 40px;
  }

  ul.grid-list li {
    width: 100%;
    margin: 20px 0;
  }

  .pill-note {
    width: unset;
  }

  .performance-col {
    width: unset;
  }

  .closing-statement {
    width: unset;
    padding: 15px 19px;
    border-radius: 10px;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
  }
  .closing-statement span {
    border-radius: 5px;
    padding: 6px 20px;
  }

  .offer-cta-right {
    width: unset;
  }

  .ulgrid .multiple-columns {
    padding: 20px !important;
    margin: 20px 0;
  }

  .ulgrid .multiple-columns strong {
    margin-bottom: 0;
  }

  .footer-container {
    width: unset;
    display: block;
    padding: 30px 20px !important;
  }

  .section h2 {
    font-size: 25px;
  }

  .assessment-note {
    font-size: 16px;
  }

  .section {
    max-width: unset;
    width: unset;
    padding: 50px 20px !important;
  }

  .radius-marker {
    display: block;
  }
  .section__heading {
    font-size: 24px;
  }
  .trust-badge-col {
    flex: unset;
  }
  .who-its-bg {
    padding: 50px 20px;
  }

  .audience-grid {
    align-items: start;
  }

  .checklist-col {
    width: 100% !important;
  }

  .checklist li {
    width: unset;
  }

  .performance-col {
    width: 100% !important;
    transform: unset;
    max-width: 100%;
    margin: 20px 0;
  }
  .highlight .clinic-note {
    font-size: 16px;
  }
  .promo-card {
    padding: 30px;
  }
  .offer-cta h2 {
    margin: 0;
    padding: 0;
  }
  .promo-title {
    font-size: 24px;
  }

  .promo-sub {
    font-size: 18px;
  }

  a.promo-highlight {
    font-size: 16px;
  }
  .offer-cta-block {
    padding: 20px 30px;
  }
  .offer-cta-left {
    font-size: 18px;
    margin-bottom: 10px;
  }
  .offer-cta-right {
    font-size: 14px;
  }
  .contact-section h2 {
    font-size: 25px !important;
  }
  .form-intro p {
    font-size: 16px;
  }
  .bookform {
    flex-direction: column;
    padding: 0;
    gap: 0;
  }

  .booking-form {
    width: 100%;
  }

  .booking-image {
    width: 100%;
  }

  .booking-image img {
    height: 350px;
  }

  button.btn-option {
    font-size: 16px;
  }
}

@media only screen and (max-width: 420px) {
  body {
    font-size: 14px;
  }
  .hero-content h1 {
    font-size: 24px;
  }
  .nav-links a {
    font-size: 15px;
  }
}
