/* Mobile & small-tablet polish. Customisable values (spacing, text, headline, artwork) come from
   Appearance → Bright Settings → Mobile and are injected as CSS variables. */

/* ---- navigation: burger up to 860px, full-screen menu ---- */
@media (max-width: 860px) {
  .br-header .br-header__cta { display: none !important; }
  .br-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: inline-flex !important; }
  .br-nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
  .br-nav .wp-block-navigation__responsive-container-open, .br-nav .wp-block-navigation__responsive-container-close { width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; margin-right: -.6rem; }
  .br-nav .wp-block-navigation__responsive-container-open svg, .br-nav .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }
  .br-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--br-s0) !important; color: var(--br-text) !important; padding: 0; }
  .br-nav .is-menu-open .wp-block-navigation__responsive-container-content, .br-nav .is-menu-open .wp-block-navigation__container, .br-nav .is-menu-open .wp-block-navigation-item { justify-content: flex-start !important; align-items: flex-start !important; text-align: left !important; }
  .br-nav .is-menu-open .wp-block-navigation__responsive-dialog { height: 100%; }
  .br-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding: 5.25rem var(--wp--custom--gutter) 2.5rem; align-items: flex-start; justify-content: flex-start; }
  .br-nav .is-menu-open .wp-block-navigation__responsive-container-close { position: absolute; top: 1rem; right: var(--wp--custom--gutter); }
  .br-nav .is-menu-open .wp-block-navigation__container { gap: .15rem !important; align-items: flex-start; width: 100%; }
  .br-nav .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: var(--br-border); }
  .br-nav .is-menu-open .wp-block-navigation-item__content { display: block; width: 100%; text-align: left; padding: 1rem 0; font-size: 1.6rem; letter-spacing: -0.03em; color: var(--br-text); font-weight: 520; }
  .br-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.br-nav__cta { display: block; border: 0; margin-top: 1.5rem; }
  .br-nav .is-menu-open .br-nav__cta .wp-block-navigation-item__content { display: inline-flex; width: auto; padding: .95rem 1.5rem; font-size: 1rem; background: var(--br-accent); color: #fff; border-radius: var(--wp--custom--radius--pill); letter-spacing: 0; }
}
.br-brand { min-height: 2.75rem; }

@media (max-width: 767px) {
  /* hero & headings */
  .br-hero { min-height: auto; padding-block: calc(var(--br-sec-pad) * .9) var(--br-sec-pad); align-items: flex-start; }
  .br-hero__title { font-size: var(--br-m-hero); max-width: 11ch; margin-block: 1.1rem 1.4rem; }
  .br-hero__lede { margin-bottom: 1.75rem; }
  .br-pagehero__title { font-size: clamp(2.4rem, 11vw, 3.2rem); }
  .br-final__title, .br-band__title { font-size: clamp(2.2rem, 10vw, 3rem); max-width: none; }
  .br-intro__title { font-size: clamp(1.9rem, 8.6vw, 2.5rem); }
  .br-statement, .br-triad .br-statement, .br-dark .br-statement { font-size: clamp(1.5rem, 7vw, 2rem); }
  .br-art { opacity: var(--br-m-art, .4); -webkit-mask-image: linear-gradient(180deg, #000 10%, transparent 80%); mask-image: linear-gradient(180deg, #000 10%, transparent 80%); }
  .br-intro { margin-bottom: 1.75rem; }

  /* diagrams: bigger type inside scaled-down SVGs */
  .dg--matrix text { font-size: 17px; } .dg--matrix .dg-axis-label { font-size: 15px !important; }
  .dg--fde text { font-size: 17px; } .dg--fde .dg-core-text { font-size: 17px; }
  .dg--matrix { max-width: 100%; }

  /* cards & grids */
  .br-compare__col { padding: 1.25rem; }
  .br-step, .br-case, .br-empty, .br-visual-wrap, .br-formcard { padding: 1.25rem; }
  .br-engage__item, .br-caps__item { padding: 1.4rem 1.25rem; }
  .br-steps__list { gap: 1rem; }
  .br-svc .br-split__text > * + * { margin-top: .9rem; }
  .br-cases { grid-template-columns: 1fr; }
  .br-booking__frame { height: 38rem; }

  /* tap targets: at least ~44px */
  .br-footer__grid { gap: 1.75rem 1.25rem; padding-block: 3rem 1.5rem; }
  .br-footer a { display: inline-block; padding: .7rem 0; }
  .br-footer ul { gap: 0; }
  .br-footer__legal { flex-direction: column; gap: .25rem; }
  .br-textlink { display: inline-block; padding-block: .85rem; min-height: 2.75rem; }
  .br-faq summary { min-height: 2.75rem; align-items: center; }
  .br-topics a { padding: .6rem 1rem; }
  .br-btn { min-height: 3rem; padding-inline: 1.5rem; justify-content: center; }
  .br-hero__actions .wp-block-bright-cta--primary, .br-actions { gap: .5rem 1.25rem !important; }
  .br-hero__actions, .br-band .br-actions, .br-final .br-actions { align-items: stretch; flex-direction: column; }
  .br-hero__actions .br-cta, .br-band .br-actions .br-cta, .br-final .br-actions .br-cta { width: 100%; }
  .br-hero__actions .br-btn, .br-band .br-btn, .br-final .br-btn { width: 100%; }
  .br-hero__actions .br-textlink, .br-band .br-textlink, .br-final .br-textlink { text-align: center; width: 100%; }

  .br-eyebrow { font-size: .8rem; }
  .br-post .wp-block-post-title a { display: inline-block; padding-block: .35rem; }

  /* forms: 16px+ prevents iOS zoom-on-focus */
  .br-form input, .br-form textarea { font-size: 1rem; min-height: 3rem; }
  .br-form .br-btn { width: 100%; }

  /* legal/long-form copy */
  .br-prose h2 { font-size: 1.5rem; margin-top: 2.25rem !important; }
  .br-prose h3 { font-size: 1.15rem; }

  /* sticky booking bar (optional) */
  .br-mbar { display: block; position: fixed; inset: auto 0 0 0; z-index: 60; padding: .7rem var(--wp--custom--gutter) calc(.7rem + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--br-s0) 92%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-top: var(--br-border); transform: translateY(110%); transition: transform .4s var(--br-ease-out); }
  .br-mbar.is-on { transform: none; }
  .br-mbar .br-btn { width: 100%; }
}
.br-mbar { display: none; }
@media (max-width: 767px) { .br-mbar { display: block; } }

/* very small phones */
@media (max-width: 360px) {
  .br-hero__title { font-size: min(var(--br-m-hero), 2.7rem); }
  .br-brand span { font-size: .95rem; }
  .br-journey__stage { grid-template-columns: 3rem 1fr; }
}
@media (prefers-reduced-motion: reduce) { .br-mbar { transition: none; } }
.br-btn, .wp-element-button, .br-mbar, .br-mbar * { box-sizing: border-box; }