/*
 * BFO theme — global shell stylesheet
 * Carried over verbatim from staging (Twenty Twenty-Five export, 30 Sep 2026).
 * Breakpoints: mobile <=767px | tablet 768-1024px | desktop >=1025px
 */

/*
 * BFO Phase 1 — Controlled CSS Foundation
 * Breakpoints: mobile ≤767px | tablet 768–1024px | desktop ≥1025px
 * Keep page-specific art direction in component CSS, not here.
 */

/* Reusable application utility: add to standard cards and panels only. */
.bfo-card,
.bfo-panel {
  border-radius: 18px;
}

/* Mobile foundation */
@media (max-width: 767px) {
  body .wp-site-blocks :where(p, li) {
    font-size: 15px;
    line-height: 1.7;
  }

  /* Apply .bfo-hero to the hero wrapper when building a page. */
  body .wp-site-blocks .bfo-hero h1 {
    font-size: 46px;
    line-height: 1.01;
    letter-spacing: -0.04em;
  }
}

/* Tablet deliberately interpolates between the approved mobile and desktop systems. */
@media (min-width: 768px) and (max-width: 1024px) {
  body .wp-site-blocks :where(p, li) {
    font-size: 16px;
    line-height: 1.72;
  }
}

/* Desktop typography foundation */
@media (min-width: 1025px) {
  body .wp-site-blocks h1 {
    font-size: clamp(58px, calc(4.819vw + 8.615px), 78px);
    line-height: 0.98;
    letter-spacing: -0.05em;
  }

  body .wp-site-blocks h2 {
    font-size: clamp(38px, calc(3.373vw + 3.423px), 52px);
    line-height: 1.02;
    letter-spacing: -0.04em;
  }

  body .wp-site-blocks h3 {
    font-size: 24px;
    line-height: 1.18;
    letter-spacing: -0.02em;
  }
}

/* BFO Phase 2 — reusable global shell */
.bfo-offer-banner {
  padding: 8px 16px;
}
.bfo-offer-banner p {
  margin-block: 0;
}
.bfo-site-header {
  padding: 18px 24px;
}
.bfo-site-header > .wp-block-group {
  gap: clamp(20px, 3vw, 48px);
}
.bfo-site-header .wp-block-navigation__container {
  gap: clamp(12px, 1.25vw, 20px);
}
.bfo-site-header .wp-block-navigation-item__content,
.bfo-booking-cta .wp-block-button__link,
.bfo-footer-booking .wp-block-button__link {
  white-space: nowrap;
}
.bfo-site-header .wp-block-buttons {
  margin-block: 0;
}
.bfo-site-footer .wp-block-navigation__container {
  gap: 10px;
}
.bfo-site-footer .wp-block-buttons {
  margin-top: 16px;
}

@media (min-width: 768px) and (max-width: 1024px) {
  .bfo-site-header > .wp-block-group {
    flex-wrap: wrap;
  }
  .bfo-site-header > .wp-block-group > .wp-block-group:last-child {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .bfo-site-header {
    padding: 14px 18px;
  }
  .bfo-site-header > .wp-block-group {
    gap: 12px;
  }
  .bfo-site-footer {
    padding-inline: 18px;
  }
}

/* Footer uses its reversed BFO treatment. */
.bfo-site-footer .wp-block-site-title,
.bfo-site-footer .wp-block-site-title a {
  color: #FFFFFF;
}
/* Collapse Navigation when the full Header row becomes crowded. */
@media (max-width: 1100px) {

  .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex !important;
  }

  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
}

/* Restore normal desktop navigation above the Header breakpoint. */
@media (min-width: 1101px) {

  .wp-block-navigation__responsive-container-open {
    display: none !important;
  }

  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: block !important;
    position: relative !important;
    width: auto !important;
  }
}

/* Header QA, 29 Sep 2026: let the white row stick beyond its template part. */
header.wp-block-template-part:has(> .bfo-site-header) {
  display: contents;
}
.bfo-site-header {
  background: #FFFFFF;
  z-index: 100;
}
@media (max-width: 1100px) {
  .bfo-site-header > .wp-block-group {
    flex-wrap: nowrap;
  }
  .bfo-site-header > .wp-block-group > .wp-block-group:last-child {
    width: auto;
  }
}

/* Keep the single booking button in the responsive Header row. */
@media (max-width: 1100px) {
  .bfo-site-header > .wp-block-group > .wp-block-group:last-child {
    gap: 12px;
  }
  .bfo-site-header .wp-block-navigation {
    order: 2;
  }
  .bfo-site-header .wp-block-buttons {
    order: 1;
  }
}
@media (max-width: 600px) {
  .bfo-site-header {
    padding-inline: 12px;
  }
  .bfo-site-header > .wp-block-group {
    gap: 8px;
  }
  .bfo-site-header > .wp-block-group > .wp-block-group:last-child {
    gap: 8px;
  }
  .bfo-site-header .wp-block-site-logo img {
    width: 110px;
  }
  .bfo-site-header .bfo-booking-cta .wp-block-button__link {
    padding: 10px 12px;
    font-size: 12px;
  }
}

/* ---------- Footer: desktop composition (approved) ---------- */
.bfo-footer-family{background:#033B5A;color:#fff;padding:32px 24px 36px}
.bfo-footer-panel{max-width:1200px;margin:auto;padding:52px 54px 36px;background:#084462;border-radius:24px}
.bfo-footer-grid{display:grid;grid-template-columns:.9fr .7fr 1.2fr;gap:60px;align-items:start}
.bfo-footer-logo{width:270px;min-height:132px;display:flex;align-items:center}.bfo-footer-logo img{display:block;width:270px!important;max-width:100%!important;height:auto!important}
.bfo-footer-label{margin:0 0 18px;color:#F2A01F;font:700 12px/1.2 Oxygen,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.bfo-footer-links{display:grid;grid-template-columns:1fr 1fr;column-gap:38px;row-gap:16px}
.bfo-footer-links a{color:#fff;text-decoration:none;font:15px/1.35 Poppins,sans-serif}
.bfo-footer-newsletter h2{max-width:440px;margin:0 0 22px;color:#fff;font-family:"Fira Sans",sans-serif!important;font-synthesis:none;font-size:22px!important;font-weight:800!important;line-height:1.35!important;letter-spacing:-.025em!important}
.bfo-footer-signup{display:flex;gap:10px}.bfo-footer-signup input{flex:1;min-width:0;height:49px;padding:0 15px;border:1px solid rgba(255,255,255,.30);border-radius:16px;background:rgba(255,255,255,.06);color:#fff;font:14px Poppins,sans-serif}.bfo-footer-signup input::placeholder{color:rgba(255,255,255,.42)}
.bfo-footer-signup button{height:49px;border:0;border-radius:16px;padding:0 18px;background:#F2A01F;color:#033B5A;font:900 12px "Fira Sans",sans-serif;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.bfo-footer-divider{border:0;border-top:1px solid rgba(255,255,255,.2);margin:42px 0 22px}
.bfo-footer-legal{display:flex;justify-content:space-between;gap:18px;align-items:center;color:rgba(255,255,255,.70);font:13px/1.55 Poppins,sans-serif}.bfo-footer-legal nav{display:flex;gap:24px;flex-wrap:wrap;padding-right:160px;transform:translateX(-54px)}.bfo-footer-socials{box-sizing:border-box;position:relative;z-index:3;max-width:1200px;margin:-94px auto 0!important;padding:0 54px!important;justify-content:flex-end;gap:14px}.bfo-footer-socials .wp-social-link{background:transparent!important;width:22px;height:22px}.bfo-footer-socials .wp-block-social-link-anchor{color:#F2A01F!important;padding:0!important}.bfo-footer-socials svg{width:21px!important;height:21px!important}.bfo-footer-legal a{color:#F2A01F;text-decoration:none;font-weight:600}
@media(max-width:820px){.bfo-footer-newsletter h2{font-size:26px!important;font-weight:800!important;line-height:1.28!important}.bfo-footer-family{padding:20px 14px}.bfo-footer-panel{padding:34px 24px;border-radius:20px}.bfo-footer-grid{grid-template-columns:1fr;gap:34px}.bfo-footer-logo{min-height:90px}.bfo-footer-legal nav{padding-right:0}.bfo-footer-socials{margin:24px 0 0!important;padding:0!important;justify-content:flex-start}.bfo-footer-signup{flex-direction:column}.bfo-footer-signup button{width:100%}.bfo-footer-legal{flex-direction:column;align-items:flex-start}}

/* ---------- Footer: mobile composition (approved) ---------- */
.bfo-mobile-footer{display:none}@media(max-width:820px){.bfo-footer-family,.bfo-footer-socials{display:none!important}.bfo-mobile-footer{display:block!important;background:#033B5A;color:white;margin:0!important;padding:40px 24px 28px;box-sizing:border-box}.bfo-mobile-footer *{box-sizing:border-box}.bfo-mobile-footer .bfo-footer-label{font-size:11px;margin-bottom:16px}.bfo-mobile-footer .bfo-footer-newsletter h2{margin:0 0 24px}.bfo-mobile-footer .bfo-footer-signup{display:flex;flex-direction:column;gap:14px}.bfo-mobile-footer .bfo-footer-signup input{flex:none!important;width:100%!important;height:58px!important;min-height:58px;padding:0 18px;border-radius:16px}.bfo-mobile-footer .bfo-footer-signup button{width:100%;height:50px;font-size:14px;border-radius:16px}.bfo-mobile-footer hr{border:0;border-top:1px solid rgba(255,255,255,.2);margin:34px 0}.bfo-mobile-logo{display:block;width:150px;max-width:100%;height:auto;margin:0 auto 24px}.bfo-mobile-nav{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.bfo-mobile-nav a{font:700 12px/1.4 Poppins,sans-serif;color:white;text-decoration:none}.bfo-mobile-socials{justify-content:center!important;gap:16px!important;margin:24px 0 0!important;padding:0!important}.bfo-mobile-socials .wp-social-link{background:transparent!important}.bfo-mobile-socials a{color:#F2A01F!important;padding:0!important}.bfo-mobile-socials svg{width:22px!important;height:22px!important;fill:#F2A01F!important}.bfo-mobile-socials .wp-block-social-link-anchor{color:#F2A01F!important;padding:0!important}.bfo-mobile-legal{text-align:center;font:13px/1.6 Poppins,sans-serif;color:rgba(255,255,255,.6)}.bfo-mobile-legal p{margin:0 0 12px}.bfo-mobile-legal nav{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}.bfo-mobile-legal a{font-weight:600;color:#F2A01F;text-decoration:none}}

/* ---------- v0.1 additions ---------- */
/* Punch-list attempt: hold the 16px booking-button radius at every width. */
.bfo-site-header .bfo-booking-cta .wp-block-button__link {
  border-radius: 16px !important;
}
/* Never let browsers fake missing font weights. */
body { font-synthesis: none; }
/* Full-width BFO pages: no gap between header and first section. */
.bfo-page-main { margin-block: 0; }
.bfo-page-main > .wp-block-post-content > :first-child { margin-block-start: 0; }
.bfo-page-main > .wp-block-post-content > :last-child { margin-block-end: 0; }

/* =========================================================
   v0.3 — Offer banner: BFO Navy, white text, Fira Sans (all sizes).
   Phones (<=767px): two-line layout from 04 / MOBILE / BFO Mobile Banner:Menu,
   amber BOOK ONLINE button with navy text, strip sticks on scroll.
   Desktop + tablet header row unchanged.
   ========================================================= */
.bfo-offer-banner > p,
.bfo-offer-banner > p strong {
  font-family: "Fira Sans", sans-serif;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.bfo-banner-mobile { display: none; }

@media (max-width: 767px) {
  .wp-block-group.bfo-offer-banner { padding: 14px 16px; }
  .bfo-offer-banner > p { display: none; }

  .bfo-offer-banner .wp-block-group.bfo-banner-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    max-width: none;
    margin: 0;
  }
  .bfo-banner-mobile.bfo-banner-mobile > *,
  .bfo-banner-copy.bfo-banner-copy > * { margin: 0; }
  .bfo-banner-mobile .bfo-banner-copy { min-width: 0; }
  .bfo-banner-mobile p.bfo-banner-l1 {
    font: 800 17px/1.2 "Fira Sans", sans-serif;
    letter-spacing: -0.01em;
    color: #FFFFFF;
  }
  .bfo-banner-mobile p.bfo-banner-l2 {
    margin-top: 3px;
    font: 600 13px/1.35 "Fira Sans", sans-serif;
    color: rgba(255, 255, 255, 0.85);
  }
  .bfo-banner-mobile .bfo-banner-cta { flex: 0 0 auto; margin: 0; }
  .bfo-banner-mobile .bfo-banner-cta .wp-block-button__link {
    padding: 12px 16px;
    border: 2px solid #FFFFFF;
    border-radius: 16px;
    background: #F2A01F;
    color: #033B5A;
    font: 800 13px/1 "Fira Sans", sans-serif;
    letter-spacing: 0.03em;
    white-space: nowrap;
  }
  .bfo-banner-mobile .bfo-banner-cta .wp-block-button__link:focus-visible {
    outline: 2px solid #F2A01F;
    outline-offset: 3px;
  }

  /* Logo bar: logo + menu only — the booking button now lives in the banner. */
  .bfo-site-header .bfo-booking-cta { display: none; }

  /* Keep BOOK ONLINE on screen: the navy strip sticks, the logo bar scrolls away. */
  .wp-site-blocks > .wp-block-template-part:has(> .bfo-offer-banner) { display: contents; }
  .wp-block-group.bfo-offer-banner { position: sticky; top: 0; z-index: 60; }
  .wp-block-group.bfo-site-header { position: relative !important; top: auto !important; }
  .bfo-site-header > .wp-block-group { position: static !important; }
}
@media (min-width: 601px) and (max-width: 767px) {
  body.admin-bar .wp-block-group.bfo-offer-banner { top: 46px; }
}

/* v0.4.1 — pin locked mobile heading sizes (WP fluid type was shrinking them) */
@media (max-width:767px){
  body .wp-site-blocks h2{ font-size:34px !important; line-height:1.06 !important; }
  body .wp-site-blocks h3{ font-size:22px !important; line-height:1.18 !important; }
}

/* v0.6.1 — no white gap between the last page section and the footer */
.wp-site-blocks > .bfo-page-main + *,
.wp-site-blocks > footer.wp-block-template-part,
.wp-site-blocks > .wp-block-template-part:last-child { margin-block-start: 0 !important; }
.wp-site-blocks > footer.wp-block-template-part { background: #033B5A; }
footer.wp-block-template-part > :first-child { margin-block-start: 0 !important; }
.bfo-page-main > .wp-block-post-content > :last-child,
.bfo-page-main > :last-child { margin-block-end: 0 !important; }
.wp-site-blocks { padding-bottom: 0 !important; }

/* ---------- v0.14.1 — Header dropdowns: navy type on white (matches the menu) ---------- */
.bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-container,
.bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-icon,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  color: #033B5A !important;
}
.bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-icon svg { stroke: #033B5A; }
@media (min-width: 1101px) {
  .bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
    background: #FFFFFF !important;
    border: 1px solid #D9E0E5 !important;
    border-radius: 14px;
    padding: 8px 0;
    box-shadow: 0 18px 40px rgba(3, 59, 90, .12);
  }
  .bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    padding: 9px 18px;
  }
}
.bfo-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
  text-decoration: underline;
  text-decoration-color: #F2A01F;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

/* v0.20.0: tablet (821–1024px) footer was wider than the screen (fixed 270px logo + 60px gaps). Desktop look unchanged. */
@media (min-width:821px) and (max-width:1024px){
  .bfo-footer-panel{ padding-left:36px; padding-right:36px; }
  .bfo-footer-grid{ gap:32px; grid-template-columns:minmax(0,.9fr) minmax(0,.7fr) minmax(0,1.2fr); }
  .bfo-footer-logo, .bfo-footer-logo img{ width:100% !important; max-width:220px !important; }
}

/* v0.27.1: small desktops (1025–1199px) had the same footer overflow as tablet. Desktop look unchanged above 1199px. */
@media (min-width:1025px) and (max-width:1199px){
  .bfo-footer-grid{ gap:40px; grid-template-columns:minmax(0,.9fr) minmax(0,.7fr) minmax(0,1.2fr); }
  .bfo-footer-logo img{ max-width:100%; height:auto; }
}
.bfo-mobile-logo-link{display:block}
/* v0.28.18 — footer social icons row overlapped Privacy/Terms on desktop and swallowed their clicks. Only the icons take clicks now. */
.bfo-footer-socials{pointer-events:none}.bfo-footer-socials > li,.bfo-footer-socials a{pointer-events:auto}

/* v0.28.27 — phones: logo + menu bar slides back in when scrolling up (assets/js/bfo-header.js). */
@media (max-width: 767px) {
  .wp-block-group.bfo-site-header.bfo-header--pinned {
    position: sticky !important;
    z-index: 59;
    background: #FFFFFF;
    box-shadow: 0 8px 20px rgba(3, 59, 90, 0.12);
    animation: bfoHeaderIn 0.22s ease-out;
  }
  @keyframes bfoHeaderIn { from { transform: translateY(-100%); } to { transform: none; } }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .wp-block-group.bfo-site-header.bfo-header--pinned { animation: none; }
}