/* responsive.css
   Global responsive tokens and shared controls only.
   Component breakpoint rules live next to their modules:
   home.css, services.css, booking.css, header.css, footer.css, modals.css.
   Breakpoint map:
   - 1440: common desktop / large laptop container tokens
   - 1366: 13-inch laptop button tokens
   - 1179: tablet / mobile shared container and button tokens
   - 767: phone tokens
   - <=374: narrow legacy phone tokens
*/

@media (max-width: 1440px) {
  :root {
    --container-wide: min(100vw - 48px, 1480px);
    --container: min(100vw - 48px, 1180px);
  }
}

@media (max-width: 1366px) {
  :root {
    --button-height: 46px;
    --button-padding-x: 24px;
  }
}

@media (max-width: 1179px) {
  :root {
    --container-wide: min(100vw - 32px, 1480px);
    --container: min(100vw - 32px, 1180px);
  }

  .button-primary,
  .button-secondary,
  .wp-block-button__link {
    padding-left: 22px;
    padding-right: 22px;
  }
}

@media (max-width: 767px) {
  :root {
    --container-wide: min(100vw - 28px, 1480px);
    --container: min(100vw - 28px, 1180px);
    --button-padding-x: 20px;
  }
}

@media (min-width: 375px) and (max-width: 767px) {
  :root {
    --button-circle-size: 44px;
  }

  .button-primary,
  .button-secondary,
  .wp-block-button__link {
    min-height: 44px;
  }
}

@media (max-width: 374px) {
  :root {
    --container-wide: min(100vw - 20px, 1480px);
    --container: min(100vw - 20px, 1180px);
    --button-padding-x: 16px;
    --button-circle-size: 40px;
  }
}

@media (hover: none) and (pointer: coarse) {
  .button-primary,
  .button-secondary,
  .button-circle {
    touch-action: manipulation;
  }
}