/* Michael Butler Native WordPress 1.4 — deployment correction + gallery polish */

/* --------------------------------------------------------------------------
   The legacy Vue Home stylesheet used `.home img`, and WordPress adds `home`
   to the BODY class. That accidentally affected the header logo, intro GIF,
   drawer icons and footer signature. Reset those components explicitly.
---------------------------------------------------------------------------- */
body.home .mb-site-header img,
body.home .mb-site-drawer img,
body.home .mb-site-footer img,
body.home .intro img{
  position:static!important;
  inset:auto!important;
  top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  min-height:0!important;
  height:auto!important;
  object-fit:contain!important;
}
body.home .mb-site-header .mb-site-logo img{width:100%!important;max-width:100%!important;max-height:32px!important}
body.home .mb-site-drawer .social__links img{width:23px!important;height:23px!important;max-width:23px!important}
body.home .mb-site-footer img{width:100%!important;max-width:190px!important}

/* --------------------------------------------------------------------------
   Signature intro — same animation, controlled gallery-scale presentation
---------------------------------------------------------------------------- */
.intro{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  padding:28px!important;
}
.intro img,
body.home .intro img{
  display:block!important;
  width:min(52vw,340px)!important;
  max-width:340px!important;
  max-height:42vh!important;
  margin:0 auto!important;
  object-fit:contain!important;
  transform:none!important;
}
@media(max-width:767px){
  .intro img,body.home .intro img{width:min(68vw,260px)!important;max-width:260px!important;max-height:34vh!important}
}

/* --------------------------------------------------------------------------
   Header / logo / language — a little more presence, never oversized
---------------------------------------------------------------------------- */
.mb-site-header .mb-site-logo{display:block!important;opacity:1!important;visibility:visible!important;max-width:325px!important}
.mb-site-header .mb-site-logo img{display:block!important;opacity:1!important;visibility:visible!important;width:100%!important;height:auto!important;max-height:32px!important}
.locale__button{
  font-size:14px!important;
  letter-spacing:.055em!important;
  gap:10px!important;
  padding:11px 0!important;
}
.locale__globe,.locale__globe svg{width:19px!important;height:19px!important}
.locale__chevron{width:17px!important;height:17px!important}
.locale__menu{min-width:220px!important;padding:12px 0!important}
.locale__menu a{font-size:13.5px!important;padding:14px 22px!important}

/* --------------------------------------------------------------------------
   Drawer — fully detach it from the old Vue list state/opacity rules
---------------------------------------------------------------------------- */
.mb-site-drawer{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:min(370px,90vw)!important;
  top:var(--mb-header)!important;
  bottom:auto!important;
  height:calc(100vh - var(--mb-header))!important;
  height:calc(100dvh - var(--mb-header))!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
}
.mb-site-drawer .mb-drawer-inner{
  width:100%!important;
  min-height:100%!important;
  height:auto!important;
  margin:0!important;
  padding:clamp(44px,7vh,72px) 38px 34px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  box-sizing:border-box!important;
}
.mb-site-drawer .mb-drawer-main{flex:0 0 auto!important}
.mb-site-drawer .mb-drawer-footer{margin-top:auto!important;flex:0 0 auto!important}
.mb-drawer-main{display:block!important;visibility:visible!important;opacity:1!important}
.mb-drawer-label{
  margin:0 0 28px!important;
  color:#666!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}
.mb-site-drawer .mb-drawer-nav{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
  opacity:1!important;
  visibility:visible!important;
}
.mb-site-drawer .mb-drawer-nav li,
.header.toggle-menu .mb-site-drawer .mb-drawer-nav li,
.mb-site-drawer.toggle .mb-drawer-nav li{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  margin:0!important;
  padding:0!important;
  height:auto!important;
}
.mb-site-drawer .mb-drawer-nav a{
  display:block!important;
  color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  font-size:18px!important;
  font-weight:400!important;
  line-height:1.18!important;
  letter-spacing:.045em!important;
  padding:0 0 20px!important;
  text-transform:uppercase!important;
}
.mb-site-drawer .mb-drawer-nav a:hover{color:#aebaff!important}
.mb-drawer-footer{display:block!important;opacity:1!important;visibility:visible!important}

/* --------------------------------------------------------------------------
   Home — only media fills the viewport. Header/footer assets are excluded.
---------------------------------------------------------------------------- */
.mb-home__media>img,
.mb-home__media>video{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  object-fit:cover!important;
  object-position:center center!important;
}
.mb-home__actions{z-index:5!important}
.mb-home__actions .mb-home__action{cursor:pointer!important}

/* --------------------------------------------------------------------------
   Gallery grids — 3 large / 2 tablet / 1 mobile. Every visual frame aligns.
---------------------------------------------------------------------------- */
.mb-collection-grid,
.mb-artwork-grid,
.mb-film-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(48px,5vw,76px) clamp(24px,3.2vw,48px)!important;
  align-items:start!important;
}
.mb-collection-card,
.mb-artwork-card,
.mb-film-card{min-width:0!important;display:block!important}

/* Collection covers: curated crop, consistent 4:3 frame */
.mb-collection-card__image{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/3!important;
  margin:0!important;
  overflow:hidden!important;
  background:#050505!important;
}
.mb-collection-card__image img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Painting cards: same frame dimensions, preserve the complete artwork. */
.mb-artwork-card__image{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/3!important;
  margin:0!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#050505!important;
}
.mb-artwork-card__image img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Film cards: same frame dimensions with poster/thumbnail crop. */
.mb-film-card__image{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/3!important;
  margin:0!important;
  overflow:hidden!important;
  background:#050505!important;
}
.mb-film-card__image img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
}
.mb-artwork-card__meta,.mb-film-card__meta,.mb-collection-card__meta{min-height:76px!important}

/* --------------------------------------------------------------------------
   Typography — premium but restrained. Artwork stays louder than interface.
---------------------------------------------------------------------------- */
.mb-gallery-heading{max-width:920px!important;padding-top:clamp(48px,6vw,78px)!important;padding-bottom:clamp(38px,4.5vw,62px)!important}
.mb-gallery-heading h1{
  font-size:clamp(30px,2.3vw,40px)!important;
  line-height:1.08!important;
  letter-spacing:-.02em!important;
  font-weight:400!important;
}
.mb-collection-card__meta h2,.mb-artwork-card__meta h2,.mb-film-card__meta h2{
  font-size:clamp(15px,1.15vw,18px)!important;
  line-height:1.35!important;
  font-weight:500!important;
}
.mb-artwork-meta h1{font-size:clamp(25px,2vw,31px)!important;line-height:1.15!important;font-weight:400!important}
.mb-film-info h1{font-size:clamp(27px,2.3vw,36px)!important;line-height:1.12!important;font-weight:400!important}
.standard__layout .breadcrumb__title h2,
.contact .breadcrumb__title h3,
.mb-route-press-images .breadcrumb__title h2{font-size:clamp(28px,2.3vw,40px)!important}

/* --------------------------------------------------------------------------
   Footer — preserve original signature-led footer without legacy Home bleed.
---------------------------------------------------------------------------- */
.mb-site-footer{
  width:100%!important;
  background:#000!important;
  padding:54px 0 38px!important;
  border-top:1px solid rgba(255,255,255,.055)!important;
  display:block!important;
}
.mb-site-footer__inner{width:min(90%,1440px)!important;margin:0 auto!important;text-align:center!important}
.mb-site-footer__signature{display:flex!important;justify-content:center!important;align-items:center!important;margin:0!important}
.mb-site-footer__signature img{
  position:static!important;
  display:block!important;
  width:100%!important;
  max-width:190px!important;
  height:auto!important;
  min-height:0!important;
  margin:0 auto!important;
  opacity:.72!important;
  object-fit:contain!important;
}
.mb-site-footer__copyright{margin:24px 0 0!important;color:#777!important;font-size:11px!important;letter-spacing:.02em!important}

/* --------------------------------------------------------------------------
   404 — gallery-native, no unrelated gradient/error illustration
---------------------------------------------------------------------------- */
.mb-404{background:#000!important;display:flex!important;align-items:center!important;padding:var(--mb-header) 0 0!important}
.mb-404__inner{padding:clamp(80px,12vh,150px) 0!important;max-width:860px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
.mb-404__eyebrow{margin:0 0 24px!important;color:#637cff!important;font-size:12px!important;letter-spacing:.2em!important;text-transform:uppercase!important}
.mb-404 h1{margin:0!important;color:#fff!important;font-size:clamp(34px,4vw,56px)!important;line-height:1.05!important;font-weight:400!important;letter-spacing:-.03em!important;text-transform:none!important}
.mb-404__copy{max-width:560px;margin:24px auto 0!important;color:#919191!important;font-size:14px!important;line-height:1.7!important}
.mb-404__actions{display:flex!important;justify-content:center!important;align-items:center!important;gap:24px!important;margin-top:42px!important}
.mb-404__primary{display:flex!important;align-items:center!important;gap:34px!important;padding:18px 22px!important;border:1px solid rgba(255,255,255,.18)!important;font-size:12px!important;letter-spacing:.07em!important;text-transform:uppercase!important;color:#fff!important}
.mb-404__primary:hover{background:#fff!important;color:#000!important}
.mb-404__secondary{font-size:12px!important;letter-spacing:.07em!important;text-transform:uppercase!important;color:#8d8d8d!important}
.mb-404__secondary:hover{color:#fff!important}

/* --------------------------------------------------------------------------
   Responsive grid and interface
---------------------------------------------------------------------------- */
@media(max-width:1099px){
  .mb-collection-grid,.mb-artwork-grid,.mb-film-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:767px){
  .mb-site-header .mb-site-logo{max-width:220px!important}
  .mb-site-header .mb-site-logo img,body.home .mb-site-header .mb-site-logo img{max-height:25px!important}
  .locale__button{font-size:13px!important;gap:8px!important}
  .locale__globe,.locale__globe svg{width:18px!important;height:18px!important}
  .mb-site-drawer .mb-drawer-inner{padding:34px 28px 28px!important}
  .mb-site-drawer .mb-drawer-nav a{font-size:17px!important;padding-bottom:18px!important}
  .mb-collection-grid,.mb-artwork-grid,.mb-film-grid{grid-template-columns:1fr!important;gap:44px!important}
  .mb-gallery-heading h1{font-size:30px!important}
  .mb-collection-card__image,.mb-artwork-card__image,.mb-film-card__image{aspect-ratio:4/3!important}
  .mb-artwork-card__meta,.mb-film-card__meta,.mb-collection-card__meta{min-height:0!important}
  .mb-site-footer{padding:44px 0 30px!important}
  .mb-site-footer__signature img,body.home .mb-site-footer img{max-width:155px!important}
  .mb-404__actions{flex-direction:column!important;gap:18px!important}
  .mb-404__primary{gap:24px!important}
}
