/* Big Boom / WordPress compatibility layer.
 * It loads after the approved design styles and affects only managed pages.
 */

/* GeneratePress prints its own off-canvas navigation through wp_body_open().
 * The Big Boom template has its own menu, so the theme copy must not take space
 * or sit over it on mobile. Other wp_body_open integrations remain available.
 */
body[data-bbsw-page] > :is(#side-nav, #generate-slideout-menu, .slideout-overlay) {
  display: none !important;
}

/* WordPress can inject a global white heading rule. Restore every title while
 * preserving the original red spans and the white titles on dark sections.
 */
body[data-bbsw-page] main :is(h1, h2, h3, h4, h5, h6),
body[data-bbsw-page] .project-index :is(h1, h2, h3, h4, h5, h6) {
  color: inherit !important;
}

body[data-bbsw-page] :is(.work-selector, .services, .about-origin, .about-difference, .about-bombi, .case-story, .case-development) :is(h1, h2, h3),
body[data-bbsw-page].editorial-case .case-hero h1 {
  color: #111 !important;
}

body[data-bbsw-page].home-page .hero-kinetic h1,
body[data-bbsw-page] .studio-strip h2,
body[data-bbsw-page] .result-body h2,
body[data-bbsw-page] .about-hero h1,
body[data-bbsw-page] .project-index h2,
body[data-bbsw-page] .boom-contact h2 {
  color: #fff !important;
}

/* Text arrows built with a vector mask so iOS never substitutes emoji art. */
.bb-arrow {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -.12em;
}
.bb-arrow::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}
.bb-arrow-ne::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M9 5h10v10' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M9 5h10v10' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.bb-arrow-right::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.bb-arrow-left::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 12H4m6-6-6 6 6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 12H4m6-6-6 6 6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.bb-arrow-down::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v16m-6-6 6 6 6-6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v16m-6-6 6 6 6-6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.index-arrow .bb-arrow,
.work-card-arrow .bb-arrow,
.work-card-open .bb-arrow {
  width: 1.05em;
  height: 1.05em;
}

/* One menu owns the mobile viewport, including the header. */
@media (max-width: 650px) {
  body[data-bbsw-page].menu-open .header {
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    min-height: 90px;
    margin: 0 !important;
    padding-inline: var(--gutter) !important;
    background: var(--red) !important;
    color: #fff !important;
    border-bottom-color: #ffffff70 !important;
    z-index: 50;
  }
  body[data-bbsw-page].menu-open .header .wordmark img {
    filter: none !important;
  }
  body[data-bbsw-page].menu-open .menu-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  body[data-bbsw-page] .mobile-menu {
    inset: 0;
    width: 100%;
    height: 100dvh;
    min-height: 100svh;
    padding: calc(90px + 1.5rem) var(--gutter) max(1.5rem, env(safe-area-inset-bottom));
    background: var(--red) !important;
    color: #fff !important;
    z-index: 45;
  }
  body[data-bbsw-page] .mobile-menu[hidden] {
    display: none !important;
  }
  body[data-bbsw-page] .mobile-menu:not([hidden]) {
    display: flex !important;
  }
  body[data-bbsw-page] .mobile-menu nav :is(a, button) {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100% !important;
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #ffffff70 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-transform: none !important;
  }
  body[data-bbsw-page] .mobile-menu nav :is(a, button):is(:focus, :active, :hover) {
    background: transparent !important;
    color: #fff !important;
  }
  body[data-bbsw-page] .mobile-menu nav :is(a, button):focus-visible {
    outline: 2px solid #fff;
    outline-offset: -3px;
  }
}

/* The shared footer and form use release.css so WordPress matches Sites. */
body[data-bbsw-page].contact-page .contact-heading h1 { color:#111!important; }
@media (forced-colors: active) {
  body[data-bbsw-page] main :is(h1,h2,h3,h4,h5,h6),
  body[data-bbsw-page] .project-index :is(h1,h2,h3,h4,h5,h6) { color:CanvasText!important; }
}

/* Flexible project media keeps the original typography and spacing. */
body[data-bbsw-page] .bbsw-mixed-gallery { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem); }
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-item { min-width:0;grid-column:auto; }
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-wide,
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-gallery-text { grid-column:1/-1; }
body[data-bbsw-page] .bbsw-mixed-gallery video { display:block;width:100%;height:auto;max-height:85vh;background:#111; }
body[data-bbsw-page] .bbsw-gallery-text { max-width:54rem;padding:clamp(1rem,3vw,3rem) 0; }
body[data-bbsw-page] .bbsw-gallery-text h3 { color:#111!important;font-size:clamp(1.8rem,3vw,3rem);line-height:var(--heading-leading,1.02);letter-spacing:-.04em;margin:0 0 var(--space-copy,1rem); }
body[data-bbsw-page] .bbsw-gallery-text p { font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.65;margin:1rem 0; }
body[data-bbsw-page] main [hidden] { display:none!important; }
@media(max-width:650px) { body[data-bbsw-page] .bbsw-mixed-gallery { grid-template-columns:minmax(0,1fr); } }

/* Dark service section retains its intended heading color. */
body[data-bbsw-page].home-page .services-studio h2 { color:#fff!important; }

/* Edited Black Jack galleries retain the compact photo strip and full artwork. */
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery { width:min(100%,80rem);margin-inline:auto;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.6rem,1.2vw,1.25rem); }
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item { grid-column:span 2; }
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item:has(img[src*="blackjack-art-"],video) { grid-column:span 6; }
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery img[src*="blackjack-art-"] { height:clamp(20rem,37vw,29rem);object-fit:contain; }
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item:has(img[src*="blackjack-hand-"]) { grid-column:span 3; }
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-wide,
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-gallery-text { grid-column:1/-1; }

/* Explicit media choices override the artwork-specific presets only for that piece. */
body[data-bbsw-page] :is([data-bbsw-media-size="small"],[data-bbsw-single-size="small"]) { --bbsw-width:33.333333%;--bbsw-span:4; }
body[data-bbsw-page] :is([data-bbsw-media-size="medium"],[data-bbsw-single-size="medium"]) { --bbsw-width:50%;--bbsw-span:6; }
body[data-bbsw-page] :is([data-bbsw-media-size="large"],[data-bbsw-single-size="large"]) { --bbsw-width:75%;--bbsw-span:9; }
body[data-bbsw-page] :is([data-bbsw-media-size="full"],[data-bbsw-single-size="full"]) { --bbsw-width:100%;--bbsw-span:12; }
body[data-bbsw-page] .bbsw-mixed-gallery:has([data-bbsw-media-size]) { grid-template-columns:repeat(12,minmax(0,1fr)); }
body[data-bbsw-page]:not(.blackjack-page) .bbsw-mixed-gallery:has([data-bbsw-media-size]) .bbsw-media-item:not([data-bbsw-media-size]) { grid-column:span 6; }
body[data-bbsw-page]:not(.blackjack-page) .bbsw-mixed-gallery:has([data-bbsw-media-size]) .bbsw-media-wide:not([data-bbsw-media-size]) { grid-column:1/-1; }
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-item[data-bbsw-media-size][data-bbsw-align] { display:block;grid-column:span var(--bbsw-span);width:100%;max-width:none;min-width:0;padding:0;margin:0;align-self:start;justify-self:stretch;background:transparent; }
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-item[data-bbsw-media-size][data-bbsw-align]:not([data-bbsw-align="auto"]) { grid-column:1/-1; }
body[data-bbsw-page] .bbsw-mixed-gallery [data-bbsw-media-size] > :is(.bbsw-media-frame,figcaption) { width:100%;min-width:0;box-sizing:border-box; }
body[data-bbsw-page] .bbsw-mixed-gallery [data-bbsw-media-size]:not([data-bbsw-align="auto"]) > :is(.bbsw-media-frame,figcaption) { width:var(--bbsw-width); }
body[data-bbsw-page] .bbsw-mixed-gallery [data-bbsw-align="center"] > :is(.bbsw-media-frame,figcaption) { margin-inline:auto; }
body[data-bbsw-page] .bbsw-mixed-gallery [data-bbsw-align="right"] > :is(.bbsw-media-frame,figcaption) { margin-left:auto;margin-right:0; }
body[data-bbsw-page] .bbsw-mixed-gallery [data-bbsw-align="left"] > :is(.bbsw-media-frame,figcaption) { margin-left:0;margin-right:auto; }
body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-item[data-bbsw-media-size] .bbsw-media-frame :is(img,video) { display:block;width:100%;max-width:100%;height:auto;max-height:none;min-height:0;aspect-ratio:auto;object-fit:contain;padding:0;transform:none; }
body[data-bbsw-page] .case-cover[data-bbsw-single-size][data-bbsw-align] { display:block;height:auto;min-height:0;aspect-ratio:auto; }
body[data-bbsw-page] .case-cover[data-bbsw-single-size][data-bbsw-align] > img,
body[data-bbsw-page] img[data-bbsw-single-size][data-bbsw-align] { display:block;width:var(--bbsw-width);max-width:100%;height:auto;max-height:none;min-height:0;aspect-ratio:auto;object-fit:contain;transform:none; }
body[data-bbsw-page] [data-bbsw-single-size][data-bbsw-align="center"] > img,
body[data-bbsw-page] img[data-bbsw-single-size][data-bbsw-align="center"] { margin-inline:auto; }
body[data-bbsw-page] [data-bbsw-single-size][data-bbsw-align="left"] > img,
body[data-bbsw-page] img[data-bbsw-single-size][data-bbsw-align="left"] { margin-left:0;margin-right:auto; }
body[data-bbsw-page] [data-bbsw-single-size][data-bbsw-align="right"] > img,
body[data-bbsw-page] img[data-bbsw-single-size][data-bbsw-align="right"] { margin-left:auto;margin-right:0; }
@media(max-width:650px) {
  body[data-bbsw-page] .bbsw-mixed-gallery .bbsw-media-item[data-bbsw-media-size][data-bbsw-align],
  body[data-bbsw-page]:not(.blackjack-page) .bbsw-mixed-gallery:has([data-bbsw-media-size]) .bbsw-media-item:not([data-bbsw-media-size]) { grid-column:1/-1; }
  body[data-bbsw-page] :is([data-bbsw-media-size],[data-bbsw-single-size]) { --bbsw-width:100%; }
}
body[data-bbsw-page].editorial-case .bbsw-mixed-gallery :is(img,video) { object-fit:contain; }
@media(max-width:900px) {
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item { grid-column:span 4; }
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item:has(img[src*="blackjack-art-"],video) { grid-column:span 6; }
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item:has(img[src*="blackjack-hand-"]) { grid-column:span 3; }
}
@media(max-width:650px) {
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery { grid-template-columns:repeat(12,minmax(0,1fr)); }
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item,
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-item:has(img[src*="blackjack-hand-"]) { grid-column:span 6; }
  body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery img[src*="blackjack-art-"] { height:clamp(15rem,58vw,22rem); }
}
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-media-wide,
body[data-bbsw-page].blackjack-page .bbsw-mixed-gallery .bbsw-gallery-text { grid-column:1/-1; }