/*
 * Boudoir by Brent — responsive refinement, October 2026.
 * Loaded after the core styles. Keep photographic gallery aspect ratios intact.
 */

/* Tablet layout and a navigation breakpoint that leaves room for the wordmark. */
@media (max-width: 980px) {
  body.bbb-theme .bbb-primary-nav,
  body.bbb-theme .bbb-header-actions .bbb-header-enquire { display: none !important; }
  body.bbb-theme .bbb-mobile-menu { display: block !important; position: relative; z-index: 90; flex: 0 0 auto; }
  body.bbb-theme .bbb-header-inner { min-height: 72px; gap: 12px; }
  body.bbb-theme .bbb-mobile-menu summary {
    display: flex; align-items: center; justify-content: center;
    gap: 9px; min-width: 74px; min-height: 48px; padding: 9px 12px;
    color: #f4efe7; border: 1px solid #78675a;
    cursor: pointer; list-style: none; font: 600 11px/1.1 "DM Sans",sans-serif;
    text-transform: uppercase; letter-spacing: .13em;
    -webkit-tap-highlight-color: transparent;
  }
  body.bbb-theme .bbb-mobile-menu summary::-webkit-details-marker { display: none; }
  body.bbb-theme .bbb-mobile-menu[open] summary {
    border-color: #b69a76; background: #342b29; color: #fff;
  }
  body.bbb-theme .bbb-mobile-dropdown {
    position: absolute; top: calc(100% + 8px); right: 0;
    width: min(340px,calc(100vw - 28px)); min-width: 0; max-width: calc(100vw - 28px);
    max-height: min(75dvh,570px); overflow-y: auto;
    overscroll-behavior: contain; padding: 9px 20px 12px;
    border: 1px solid #8b6f57; background: #292422;
    box-shadow: 0 16px 34px #08060680;
  }
  body.bbb-theme .bbb-mobile-dropdown a {
    display: flex; align-items: center; min-height: 49px;
    padding: 12px 4px; border-bottom: 1px solid #554640;
    color: #f4efe7; text-decoration: none; font-size: 12px;
  }
  body.bbb-theme .bbb-mobile-dropdown a:last-child { border-bottom: 0; }
  body.bbb-theme .bbb-mobile-dropdown a:hover,
  body.bbb-theme .bbb-mobile-dropdown a:focus-visible { color: #e2c5a4; }
  body.bbb-theme .bbb-collection-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px; }
  body.bbb-theme .bbb-collection-image { height: auto; aspect-ratio: 4/5; }
  body.bbb-theme .bbb-photo-gallery {
    columns: 2 auto !important; column-count: 2 !important;
    column-width: auto !important; column-gap: 15px !important;
  }
  body.bbb-theme .bbb-gallery-photo,
  body.bbb-theme .bbb-gallery-place { margin-bottom: 15px !important; }
  body.bbb-theme .bbb-gallery-collection-title { overflow-wrap: break-word; }
  body.bbb-theme .bbb-inner-page h1 { overflow-wrap: anywhere; }
}

/* Keep all three homepage collection covers together at the two
   requested medium viewport widths (768px portrait and 844px landscape).
   Other breakpoint behaviour is deliberately unchanged. */
@media (min-width: 740px) and (max-width: 870px) {
  body.bbb-theme .bbb-collection-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }
  body.bbb-theme .bbb-collection-card { min-width: 0; }
  body.bbb-theme .bbb-collection-image {
    height: auto;
    aspect-ratio: 4 / 5;
  }
  body.bbb-theme .bbb-collection-meta {
    gap: 7px;
    margin-top: 13px;
    align-items: baseline;
  }
  body.bbb-theme .bbb-collection-meta h3 {
    font-size: clamp(23px, 3.35vw, 29px);
    line-height: 1.17;
    overflow-wrap: break-word;
  }
  body.bbb-theme .bbb-collection-card > span {
    display: block;
    margin-top: 5px;
    line-height: 1.55;
  }
}

/* Improve tap targets and layout on phones. */
@media (max-width: 640px) {
  body.bbb-theme .bbb-shell { width: calc(100% - 36px); }
  body.bbb-theme .bbb-wordmark { min-width: 0; }
  body.bbb-theme .bbb-wordmark-name { font-size: clamp(23px,7vw,29px); line-height: 1; }
  body.bbb-theme .bbb-wordmark-sub {
    font-size: 7px; letter-spacing: .13em; line-height: 1.5; margin-top: 6px;
  }
  body.bbb-theme .bbb-header-inner { min-height: 70px; }
  body.bbb-theme .bbb-hero-art { min-height: clamp(250px,72vw,390px); }
  body.bbb-theme .bbb-art-note { left: 18px; bottom: 25px; right: 18px; font-size: 9px; }
  body.bbb-theme .bbb-hero-copy { padding: 52px 23px 56px; }
  body.bbb-theme .bbb-hero-copy::before { top: 25px; left: 23px; }
  body.bbb-theme .bbb-hero-title {
    font-size: clamp(50px,11.8vw,72px) !important;
    overflow-wrap: break-word; line-height: .96 !important;
  }
  body.bbb-theme .bbb-hero-lead { font-size: 15px; }
  body.bbb-theme .bbb-hero-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  body.bbb-theme .bbb-hero-actions .bbb-btn { width: 100%; min-height: 48px; }
  body.bbb-theme .bbb-scroll-band .bbb-shell { gap: 10px; }
  body.bbb-theme .bbb-scroll-band span { font-size: 9px; line-height: 1.5; }
  body.bbb-theme .bbb-intro,
  body.bbb-theme .bbb-collections,
  body.bbb-theme .bbb-feature,
  body.bbb-theme .bbb-experience,
  body.bbb-theme .bbb-about,
  body.bbb-theme .bbb-artwork { padding-block: 66px; }
  body.bbb-theme .bbb-collection-grid { grid-template-columns: minmax(0,1fr); gap: 32px; }
  body.bbb-theme .bbb-collection-image { aspect-ratio: 4/5; }
  body.bbb-theme .bbb-collection-meta { margin-top: 15px; }
  body.bbb-theme .bbb-collection-meta h3 { font-size: 30px; }
  body.bbb-theme .bbb-feature-copy h2 { font-size: clamp(44px,10vw,64px); }
  body.bbb-theme .bbb-feature-art { min-height: 280px; }
  body.bbb-theme .bbb-steps { grid-template-columns: 1fr; gap: 22px; }
  body.bbb-theme .bbb-step h3 { font-size: 28px; }
  body.bbb-theme .bbb-about-photo { height: auto; min-height: 320px; }
  body.bbb-theme .bbb-about-photo img { width: 100%; height: auto; max-height: none; object-fit: contain; }
  body.bbb-theme .bbb-product-grid { grid-template-columns: 1fr; }
  body.bbb-theme .bbb-product-visual { width: 100%; height: auto; aspect-ratio: 4 / 3; }
  body.bbb-theme .bbb-gallery-section { padding-block: 55px 65px; }
  body.bbb-theme .bbb-gallery-collection { padding-block: 55px; }
  body.bbb-theme .bbb-gallery-section .bbb-section-heading { margin-bottom: 35px; }
  body.bbb-theme .bbb-gallery-collection-description { font-size: 14px; margin-bottom: 21px; }
  body.bbb-theme .bbb-photo-gallery { column-gap: 11px !important; }
  body.bbb-theme .bbb-gallery-photo,
  body.bbb-theme .bbb-gallery-place { margin-bottom: 11px !important; }
  body.bbb-theme .bbb-cta { padding: 72px 18px 82px; }
  body.bbb-theme .bbb-cta h2 { font-size: clamp(42px,10vw,62px); overflow-wrap: break-word; }
  body.bbb-theme .bbb-cta .bbb-btn,
  body.bbb-theme .bbb-faq-footer .bbb-page-cta,
  body.bbb-theme .bbb-contact-page .bbb-page-cta { min-height: 48px !important; }
  body.bbb-theme .bbb-footer-grid { padding-bottom: 40px; gap: 23px; }
  body.bbb-theme .bbb-site-footer { padding-top: 55px; }
  body.bbb-theme .bbb-faq-answer { padding-right: 4px; }
  body.bbb-theme .bbb-contact-panel { padding: 30px 24px; }
  body.bbb-theme .bbb-contact-page h1 { font-size: clamp(51px,11vw,70px) !important; }
  body.bbb-theme .bbb-profile-page .bbb-section-heading,
  body.bbb-theme .bbb-faq-page .bbb-section-heading { margin-bottom: 45px; }
}

/* Extra clearance for WordPress' crowded, two-row editing toolbar in short
   tablet-landscape previews. Admin-only; public visitors are unaffected. */
@media (min-width: 783px) and (max-width: 980px) and (max-height: 500px) {
  body.admin-bar.bbb-theme .bbb-site-header { margin-top: 32px; }
}

/* Very narrow devices get full-width photographs with their natural ratios. */
@media (max-width: 420px) {
  body.bbb-theme .bbb-photo-gallery {
    columns: 1 auto !important; column-count: 1 !important;
    column-width: auto !important;
  }
  body.bbb-theme .bbb-wordmark-name { font-size: 24px; }
  body.bbb-theme .bbb-mobile-menu summary { min-width: 64px; padding-inline: 9px; }
}

/* Full-screen viewer: respect phone notches, home indicators, and narrow widths. */
body.bbb-theme dialog.bbb-lightbox {
  box-sizing: border-box; width: 100vw !important; max-width: 100vw !important;
  height: 100dvh !important; max-height: 100dvh !important; overflow: hidden;
  padding: max(14px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right))
           max(18px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) !important;
}
body.bbb-theme .bbb-lightbox-inner { box-sizing: border-box; min-width: 0; }
body.bbb-theme .bbb-lightbox-image { max-width: 100% !important; max-height: calc(100dvh - 180px) !important; object-fit: contain !important; }
body.bbb-theme .bbb-lightbox-toolbar { z-index: 1; }
body.bbb-theme .bbb-lightbox-controls {
  width: 100%; max-width: 560px; bottom: 0; left: 50%;
  display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center; gap: 12px; transform: translateX(-50%);
}
body.bbb-theme .bbb-lightbox-controls button { min-height: 48px; white-space: nowrap; }
body.bbb-theme .bbb-lightbox button:focus-visible { outline: 3px solid #dfbc87; outline-offset: 3px; }

@media (max-width: 600px) {
  body.bbb-theme .bbb-lightbox-inner { gap: 10px; }
  body.bbb-theme .bbb-lightbox-caption { font-size: 11px; line-height: 1.4; max-width: 100%; }
  body.bbb-theme .bbb-lightbox-controls { gap: 7px; max-width: 100%; }
  body.bbb-theme .bbb-lightbox-controls button {
    min-width: 44px; padding: 9px 6px !important; font-size: 11px !important;
  }
  body.bbb-theme .bbb-lightbox-image { max-height: calc(100dvh - 170px) !important; }
}
@media (max-width: 380px) {
  body.bbb-theme .bbb-lightbox-controls button { font-size: 0 !important; }
  body.bbb-theme .bbb-lightbox-controls button[data-action="prev"]::after { content: "←"; font-size: 21px; }
  body.bbb-theme .bbb-lightbox-controls button[data-action="next"]::after { content: "→"; font-size: 21px; }
  body.bbb-theme .bbb-lightbox-counter { font-size: 10px; }
}
