/* =========================================
   MOBILE FIXES (Bricksy Pro)  ≤ 781px
   - Buttons: stacked, 100% width
   - Footer: centered & stacked
   - Header nav: no mid-word wrapping
   ========================================= */
@media (max-width: 781px) {

  /* A) HEADER / NAV — prevent mid-word breaks */
  .wp-block-navigation a,
  .wp-block-navigation__responsive-container a,
  .wp-block-navigation-item__content,
  .wp-block-navigation-item__label {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    -webkit-hyphens: none !important;
    hyphens: none !important;
  }

  /* B) BUTTONS — stack + 100% width (overrides 50/50 desktop inline styles) */
  .wp-block-buttons,
  .wp-block-buttons.is-layout-flex {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;   /* make children fill width */
    gap: 12px !important;
  }
  .wp-block-buttons > .wp-block-button {
    flex: 0 0 100% !important;          /* beats inline flex-basis: calc(50% - …) */
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
  }
  .wp-block-buttons > .wp-block-button > .wp-block-button__link {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }
  .wp-block-buttons > .wp-block-button + .wp-block-button {
    margin-top: 12px !important;        /* comfy gap between stacked buttons */
  }

  /* C) FOOTER — center everything & stack columns */
  .wp-block-template-part[area="footer"],
  footer,
  .site-footer {
    text-align: center !important;
  }
  .wp-block-template-part[area="footer"] .wp-block-columns,
  footer .wp-block-columns,
  .site-footer .wp-block-columns {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
  }
  .wp-block-template-part[area="footer"] .wp-block-column,
  footer .wp-block-column,
  .site-footer .wp-block-column {
    flex-basis: 100% !important;
    max-width: 720px !important;        /* keeps text measure nice */
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .wp-block-template-part[area="footer"] .wp-block-buttons,
  footer .wp-block-buttons,
  .site-footer .wp-block-buttons {
    justify-content: center !important; /* footer CTAs centered */
    align-items: stretch !important;    /* full-width if you add buttons there */
  }
  .wp-block-template-part[area="footer"] .wp-block-buttons .wp-block-button,
  footer .wp-block-buttons .wp-block-button,
  .site-footer .wp-block-buttons .wp-block-button {
    width: 100% !important;
  }
}
/* === Footer: center social icons on mobile/tablet === */
@media (max-width: 1024px) {  /* change to 781px if you want phone-only */
  .footer-social-row {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  .footer-social-row .wp-block-social-links {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 12px auto 0 !important;
    width: 100% !important;
    gap: 14px;
  }

  .footer-social-row .wp-block-social-links .wp-social-link {
    margin: 0 !important;
  }
}
/* ===========================
   Booking / Calendly (mobile)
   =========================== */

/* Base safety: make sure the container doesn't constrain width */
.booking-embed {
  max-width: 100%;
}

/* Desktop: keep as-is; make sure the inline widget has a sensible height */
.booking-embed .calendly-inline-widget {
  min-width: 320px;
  width: 100% !important;
  height: 780px; /* desktop default height */
}

/* Tablet */
@media (max-width: 1024px) {
  .booking-embed {
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 12px;
    padding-right: 12px;
  }

  .booking-embed .calendly-inline-widget {
    width: 100% !important;
    height: 920px; /* a bit taller for Calendly’s mobile layout */
  }
}

/* Phone */
@media (max-width: 781px) {
  .booking-embed {
    /* Center the whole block and give breathing room */
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 16px;
    padding-right: 16px;
  }

  /* Calendly (inside an iframe) — you can only control the frame size */
  .booking-embed .calendly-inline-widget {
    width: 100% !important;
    height: 1100px; /* most phones need >1000px to avoid cutting off UI */
  }

  /* If the booking section sits in 2 columns, make sure it stacks nicely */
  .booking-embed .wp-block-columns {
    gap: 18px !important;
  }
  .booking-embed .wp-block-column {
    width: 100% !important;
    margin: 0 !important;
  }
}
/* Booking hero heading: prevent mid-word breaks and scale on phones */
@media (max-width: 781px){
  .book-title {
    /* keep words intact, no automatic hyphenation */
    hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
    white-space: normal;

    /* scale down a touch so it fits without forcing breaks */
    font-size: clamp(28px, 8.5vw, 40px);
    line-height: 1.15;
  }
}

/* (Optional) Also prevent hyphenation on larger screens */
.book-title {
  hyphens: none;
  word-break: normal;
  overflow-wrap: normal;
}