@media(max-width:1320px){.desktop-nav>a,.nav-item>a{font-size:.72rem;padding:0 .38rem}.desktop-nav>a:after,.nav-item>a:after{left:.38rem;right:.38rem}.brand{min-width:190px}.brand-wordmark{font-size:.94rem}}
@media(max-width:1180px){.desktop-nav{display:none}.menu-toggle{display:block}.header-quote{margin-left:auto}.mobile-nav.open{display:block}.brand{min-width:auto}.home-hero{grid-template-columns:1fr minmax(430px,48%)}.home-hero-copy{grid-column:2;padding-right:34px}.work-rail{grid-auto-columns:minmax(300px,45%)}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.home-hero{display:flex;flex-direction:column;min-height:0;background:#080808}.home-hero-media{position:relative;height:min(66vw,520px)}.home-hero-media img{object-position:36% 34%}.home-hero-media:after{background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 46%)}.home-hero-copy{padding:34px 22px 44px;display:block}.home-hero h1{font-size:clamp(3.2rem,10.5vw,5.4rem)}.home-work{padding:62px 0}.home-work-head,.ba-header,.portfolio-controls{grid-template-columns:1fr;display:grid;gap:18px}.work-rail{grid-auto-columns:minmax(290px,64%)}.ba-section{padding:62px 0}.ba-img{min-height:300px}.design-proof .work-rail{grid-auto-columns:minmax(280px,55%)}.page-hero{padding:90px 22px 58px}}
@media(max-width:620px){.header-inner{height:64px;padding:0 14px}.brand-mark{width:36px!important;height:36px!important}.brand-wordmark{font-size:.86rem}.header-quote{display:none}.mobile-nav{max-height:calc(100vh - 64px)}.home-hero-media{height:72vw;min-height:300px}.home-hero-copy{padding:28px 18px 36px}.home-hero h1{font-size:clamp(2.9rem,13vw,4.35rem)}.home-hero-lede{font-size:.95rem}.home-hero-actions .btn{width:100%}.home-work .section-inner,.ba-inner{padding-left:18px;padding-right:18px}.work-rail{grid-auto-columns:84%}.rail-actions{justify-content:flex-start}.home-work-footer{align-items:flex-start;flex-direction:column}.ba-img{min-height:245px}.ba-handle-btn{width:44px;height:44px}.portfolio-grid{grid-template-columns:1fr}.portfolio-filter{padding-right:10px;margin-right:10px}.design-proof .work-rail{grid-auto-columns:84%}.page-hero{padding:82px 18px 50px}.page-hero h1{font-size:clamp(2.8rem,13vw,4.4rem)}.footer-grid{grid-template-columns:1fr}}

@media(max-width:700px){
  .option-groups.single-group .option-list{grid-template-columns:1fr}
  .faq summary{padding:18px 0;font-size:.96rem;gap:16px}
  .faq details>p{padding:0 42px 20px 0}
}



@media(max-width:1100px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:calc((100% - 28px)/3)!important}
}
@media(max-width:760px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:calc((100% - 14px)/2)!important}
}
@media(max-width:520px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:82%!important;gap:12px!important}
}



@media(max-width:1100px){.work-rail{grid-auto-columns:calc((100% - 28px)/3)!important}}
@media(max-width:820px){
  .work-rail{grid-auto-columns:calc((100% - 14px)/2)!important}
  .testimonials{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .testimonial,.testimonial:nth-child(n/**/+4){grid-column:auto!important}
  .testimonial:last-child{grid-column:1/-1!important}
}
@media(max-width:560px){
  .work-rail{grid-auto-columns:86%!important;gap:12px!important}
  .testimonials{grid-template-columns:1fr!important}
  .testimonial,.testimonial:nth-child(n/**/+4),.testimonial:last-child{grid-column:auto!important}
  .home-work{padding-left:0!important;padding-right:0!important}
  .home-work .section-inner{padding-left:18px!important;padding-right:18px!important}
}



@media(max-width:1100px){
  .work-tile{flex-basis:calc((100% - 28px)/3)!important}
  .business-card-feature-grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media(max-width:820px){
  .work-tile{flex-basis:calc((100% - 14px)/2)!important}
  .business-card-feature,.business-card-hub-feature{padding:62px 0}
  .business-card-feature-grid{grid-template-columns:1fr;gap:28px}
  .business-card-feature-image{aspect-ratio:16/10}
}
@media(max-width:560px){
  .work-tile{flex-basis:86%!important}
  .business-card-feature,.business-card-hub-feature{padding:52px 0}
  .business-card-feature-grid{gap:24px}
  .business-card-feature-copy h2,.google-reviews-copy h2{font-size:clamp(2.5rem,12vw,3.9rem)}
  .business-card-finishes{grid-template-columns:1fr}
  .business-card-finishes li:nth-child(n){padding:11px 0;border-left:0}
  .business-card-feature-image{aspect-ratio:4/3}
}


@media(max-width:1100px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:calc((100% - 28px)/3)!important}
  .business-card-project-grid-page{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:calc((100% - 14px)/2)!important}
  .business-card-feature-grid{grid-template-columns:1fr!important}
  .business-card-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .work-rail,.design-proof .work-rail{grid-auto-columns:84%!important;gap:12px!important}
  .business-card-project-grid,.business-card-project-grid-page{grid-template-columns:1fr}
  .business-card-project{aspect-ratio:16/10}
}

@media (max-width:1100px){
  .business-card-showcase{min-height:380px}
  .business-card-feature-grid{grid-template-columns:1fr 1fr;gap:28px}
  .business-card-finishes.compact-finishes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .business-card-feature-grid{grid-template-columns:1fr!important;gap:22px}
  .business-card-showcase{min-height:340px}
  .card-primary{width:58%;left:10%;top:14%}
  .card-secondary{width:44%;right:4%;top:9%}
  .card-tertiary{width:43%;left:5%;bottom:4%}
  .card-accent{width:41%;right:10%;bottom:8%}
}
@media (max-width:560px){
  .business-card-feature,.business-card-hub-feature{padding:48px 0}
  .business-card-showcase{min-height:290px}
  .business-card-showcase::before{inset:20px 10px 20px 10px}
  .business-card-finishes.compact-finishes{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .business-card-finishes.compact-finishes li{font-size:.94rem;padding:9px 10px}
  .card-primary{width:62%;left:3%;top:14%}
  .card-secondary{width:46%;right:1%;top:8%}
  .card-tertiary{width:46%;left:1%;bottom:2%}
  .card-accent{width:44%;right:5%;bottom:4%}
}

@media(max-width:900px){.work-category-filter{margin-right:21px;padding-top:10px}.home-work.is-business-cards .work-tile:not([hidden]){flex-basis:calc((100% - 14px)/2)!important}}
@media(max-width:620px){.work-category-nav{margin-bottom:18px}.work-category-filter{font-size:.72rem;margin-right:18px;padding-bottom:9px}.home-work.is-business-cards .work-tile:not([hidden]){flex-basis:84%!important}}


/* Final responsive hardening: phone, tablet, laptop and wide desktop */
@supports not (overflow:clip){html,body{overflow-x:hidden}}
@media(max-width:1180px){
  .header-inner{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
  .mobile-nav{overflow-y:auto;overscroll-behavior:contain;max-height:calc(100dvh - 72px);padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .mega-panel{max-width:calc(100vw - 32px)}
}
@media(max-width:820px){
  .section-inner,.ba-inner{min-width:0}
  .home-work-head>*,.section-head>*,.portfolio-intro>*,.google-reviews-head>*{min-width:0}
  .work-category-nav{scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .work-category-filter{scroll-snap-align:start}
}
@media(max-width:620px){
  .header-inner{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
  .mobile-nav{max-height:calc(100dvh - 64px)}
  .site-footer{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));padding-bottom:max(22px,env(safe-area-inset-bottom))}
  .lightbox{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));padding-bottom:max(10px,env(safe-area-inset-bottom))}
  .google-rating-panel{width:100%;max-width:100%}
  .google-review-actions a{white-space:normal}
  .work-category-nav{margin-left:-2px;margin-right:-2px;padding-left:2px;padding-right:12px}
}
@media(max-width:390px){
  .brand-wordmark{font-size:.79rem;letter-spacing:.055em}
  .brand{gap:7px}
  .menu-toggle{margin-left:auto}
  .home-hero-copy{padding-left:16px;padding-right:16px}
  .home-work .section-inner,.ba-inner{padding-left:16px!important;padding-right:16px!important}
  .page-hero{padding-left:16px;padding-right:16px}
  .work-category-filter{margin-right:15px;font-size:.69rem}
  
  
}
@media(max-width:1180px) and (pointer:coarse){
  .menu-toggle,.mobile-nav>a,.mobile-nav summary,.mobile-nav details a,.btn,.header-quote,.work-category-filter,.portfolio-filter,.lightbox-close,.lightbox-prev,.lightbox-next{min-height:44px}
}
@media(max-width:900px) and (orientation:landscape) and (max-height:540px){
  .mobile-nav{max-height:calc(100dvh - 64px)}
  .home-hero-media{height:62vh;min-height:260px}
  .home-hero-copy{padding-top:24px}
}


/* Exact-fit comparison on phones and tablets: show the complete van, never crop it. */
@media(max-width:900px){
  .ba-wrap{aspect-ratio:1200/498;background:#090909}
  .ba-img{width:100%;height:100%;min-height:0!important;object-fit:contain;object-position:center}
  .ba-after-wrap img{height:100%;object-fit:contain;object-position:center}
}
@media(max-width:620px){
  .ba-section{overflow:hidden}
  .ba-inner{width:100%;max-width:100%;padding-left:18px!important;padding-right:18px!important}
  .ba-wrap{width:100%;max-width:100%;margin:0;aspect-ratio:1200/498}
  .ba-handle-btn{width:42px;height:42px}
  .ba-label{top:10px;padding:.3rem .52rem;font-size:.68rem}
  .ba-label-before{left:10px}.ba-label-after{right:10px}
  .ba-hint{margin-top:10px}
}


/* v26 final cross-device lightbox and viewport hardening */
body.is-lightbox-open{position:fixed;left:0;right:0;width:100%;overflow:hidden;overscroll-behavior:none}
.lightbox-count{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);z-index:3;color:#bfc1c7;font-size:.72rem;font-weight:700;letter-spacing:.12em;font-variant-numeric:tabular-nums}
@media(max-width:620px){
  html,body{min-width:0}
  .lightbox{padding:0!important;align-items:stretch;justify-content:stretch;overscroll-behavior:contain}
  .lightbox-stage{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;padding:max(58px,calc(env(safe-area-inset-top) + 50px)) max(14px,env(safe-area-inset-right)) max(82px,calc(env(safe-area-inset-bottom) + 72px)) max(14px,env(safe-area-inset-left));display:grid;place-items:center;box-sizing:border-box}
  .lightbox img{display:block;max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain;box-shadow:0 18px 58px rgba(0,0,0,.56)}
  .lightbox-close{position:fixed!important;top:max(12px,env(safe-area-inset-top))!important;right:max(12px,env(safe-area-inset-right))!important;left:auto!important;bottom:auto!important;width:46px!important;height:46px!important;transform:none!important;background:rgba(10,10,10,.94);font-size:1.45rem}
  .lightbox-prev,.lightbox-next{position:fixed!important;top:auto!important;bottom:max(14px,env(safe-area-inset-bottom))!important;width:48px!important;height:48px!important;transform:none!important;background:rgba(10,10,10,.94);font-size:1.15rem}
  .lightbox-prev{left:calc(50% - 76px)!important;right:auto!important}
  .lightbox-next{right:calc(50% - 76px)!important;left:auto!important}
  .lightbox-count{position:fixed;bottom:max(30px,calc(env(safe-area-inset-bottom) + 16px));left:50%;transform:translateX(-50%);font-size:.68rem;color:#aeb1b8;pointer-events:none}
  .lightbox-close:active,.lightbox-prev:active,.lightbox-next:active{background:var(--gold);color:#090909;border-color:var(--gold)}
}
@media(max-width:360px){
  .lightbox-stage{padding-left:10px;padding-right:10px}
  .lightbox-prev{left:calc(50% - 70px)!important}.lightbox-next{right:calc(50% - 70px)!important}
  .brand-wordmark{font-size:.74rem}
}
@media(min-width:621px) and (max-width:1180px){
  .lightbox-stage{width:min(100%,1080px);height:min(90dvh,820px)}
  .lightbox-close{right:8px;top:8px}.lightbox-prev{left:8px}.lightbox-next{right:8px}
  .lightbox-count{bottom:8px}
}
@media(max-height:520px) and (orientation:landscape){
  .lightbox-stage{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(58px,calc(env(safe-area-inset-bottom) + 52px))}
  .lightbox-close{top:max(8px,env(safe-area-inset-top))!important;right:max(8px,env(safe-area-inset-right))!important}
  .lightbox-prev,.lightbox-next{bottom:max(8px,env(safe-area-inset-bottom))!important;width:44px!important;height:44px!important}
  .lightbox-count{bottom:max(24px,calc(env(safe-area-inset-bottom) + 13px))}
}


/* v26 final small-screen layout safeguards */
@media(max-width:620px){
  main,section,footer,.section-inner,.ba-inner,.footer-grid,.contact-layout,.form-shell,.form-grid{max-width:100%;min-width:0}
  input,select,textarea,button{max-width:100%}
  iframe,video,svg{max-width:100%}
  h1,h2,h3,p,a,span,label{overflow-wrap:break-word}
  .btn{max-width:100%}
  .lightbox-stage{touch-action:pan-y pinch-zoom}
}


/* v28 responsive category navigation */
@media(max-width:1320px) and (min-width:1181px){
  .category-top-link,.category-direct{font-size:.7rem;padding-left:.48rem;padding-right:.48rem}
  .category-top-link:after,.category-direct:after{left:.48rem;right:.48rem}
  .utility-nav a{padding-left:.48rem;padding-right:.48rem}
  .header-phone{display:none}
}
@media(max-width:1180px){
  html{scroll-padding-top:84px}
  .utility-nav,.header-phone,.category-shell{display:none}
  .category-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-detail-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .category-card-grid{grid-template-columns:1fr}
  .category-card{display:grid;grid-template-columns:42% 58%;align-items:stretch}
  .category-card img{height:100%;aspect-ratio:auto;min-height:180px}
  .category-card>div{min-height:180px;padding:16px}
  .category-card-grid.compact .category-card>div{min-height:150px}
  .category-card-grid.compact .category-card img{min-height:150px}
  .catalog-detail-grid{grid-template-columns:1fr}
  .catalog-detail{padding:28px 22px 30px;scroll-margin-top:84px}
  .catalog-links{grid-template-columns:1fr}
}
@media(max-width:520px){
  .category-card{grid-template-columns:1fr}
  .category-card img{aspect-ratio:16/9;min-height:0}
  .category-card>div,.category-card-grid.compact .category-card>div{min-height:0}
  .category-explorer{padding-top:56px;padding-bottom:58px}
  .mobile-quick{grid-template-columns:1fr}
}


/* v29 final responsive polish */
@media(max-width:1450px) and (min-width:1181px){
  .category-top-link,.category-direct{font-size:.74rem;padding-left:.42rem;padding-right:.42rem}
  .category-top-link:after,.category-direct:after{left:.42rem;right:.42rem}
  .category-mega-inner{padding-left:28px;padding-right:28px;gap:26px}
}
@media(max-width:1220px) and (min-width:1181px){
  .category-top-link,.category-direct{font-size:.7rem;padding-left:.34rem;padding-right:.34rem}
  .category-top-link:after,.category-direct:after{left:.34rem;right:.34rem}
}
@media(max-width:1180px){
  
  .catalog-detail-grid-final{grid-template-columns:repeat(2,minmax(0,1fr))}
  .deep-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1.3fr 1fr 1fr}
}
@media(max-width:760px){
  .category-card-grid-final .category-card>div{padding:18px;min-height:190px}
  .category-card-grid-final .category-card h3{font-size:1.7rem}
  .category-card-grid-final .category-card p{font-size:.94rem}
  
  
  
  
  
  .deep-link-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .category-card-grid-final .category-card>div{min-height:0;padding:18px 18px 20px}
  .category-card-grid-final .category-card h3{font-size:1.65rem}
  .category-card-grid-final .category-card p{font-size:.95rem}
  
  .footer-grid{grid-template-columns:1fr}
}

@media(max-width:1280px){
  .utility-nav,.header-phone,.category-shell{display:none!important}
  .menu-toggle{display:block}
  .header-quote{margin-left:auto}
  .mobile-nav.open{display:block}
}
@media(min-width:1281px) and (max-width:1450px){
  .category-top-link,.category-direct{font-size:.77rem;padding-left:.43rem;padding-right:.43rem}
  .category-top-link:after,.category-direct:after{left:.43rem;right:.43rem}
}
@media(min-width:1451px){
  .category-top-link,.category-direct{font-size:.8rem}
}


/* Mobile menu and catalog card hardening */
@media(max-width:1280px){
  .mobile-nav{
    position:fixed;
    top:72px;
    left:0;
    right:0;
    bottom:0;
    z-index:1005;
    width:100%;
    height:auto;
    max-height:none!important;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding-left:max(20px,env(safe-area-inset-left));
    padding-right:max(20px,env(safe-area-inset-right));
    padding-bottom:max(28px,env(safe-area-inset-bottom));
    box-shadow:0 26px 60px rgba(0,0,0,.46);
  }
  body.menu-open{overflow:visible!important}
}
@media(max-width:760px){
  .category-card-grid,.category-card-grid-final{grid-template-columns:1fr!important}
  .category-card,.category-card-grid-final .category-card{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    overflow:hidden;
    transform:none!important;
    background:#fff;
  }
  .category-card img,.category-card-grid-final .category-card img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    object-fit:cover!important;
    object-position:center!important;
    position:relative;
    z-index:0;
    flex:0 0 auto;
  }
  .category-card>div,.category-card-grid-final .category-card>div,
  .category-card-grid.compact .category-card>div{
    position:relative;
    z-index:1;
    width:100%;
    min-height:0!important;
    padding:18px 18px 20px!important;
    background:#fff!important;
    border-top:1px solid rgba(0,0,0,.09);
  }
  .category-card-grid-final .category-card h3{font-size:clamp(1.5rem,7vw,1.8rem);line-height:1}
  .category-card-grid-final .category-card p{font-size:.94rem;line-height:1.5;margin-bottom:15px}
  .category-card-grid-final .category-card b{font-size:.8rem;line-height:1.2}
}
@media(max-width:620px){
  .mobile-nav{top:64px;max-height:none!important}
  .category-explorer-final{padding-top:58px;padding-bottom:62px}
  .category-card-grid-final{gap:18px;margin-top:28px}
}
@media(max-width:390px){
  .mobile-nav{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  .category-card>div,.category-card-grid-final .category-card>div{padding:16px 16px 18px!important}
}

/* iOS and Safari mobile navigation viewport fix */
@media(max-width:1280px){
  .site-header{
    z-index:2147483000!important;
    background:#090909!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .mobile-nav{
    position:fixed!important;
    top:72px!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:2147483001!important;
    width:100vw!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    background:#0f0f0f!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    isolation:isolate;
  }
  .mobile-nav.open{display:block!important}
  body.menu-open{overflow:visible!important}
}
@media(max-width:620px){
  .mobile-nav{top:64px!important}
}

/* Fresh Work Factory production release */

/* Responsive web showcase */
@media (max-width:820px){.web-showcase-grid{grid-template-columns:1fr;gap:18px}.web-project-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
@media (max-width:520px){.web-project-strip-grid{grid-template-columns:1fr 1fr;gap:8px}.web-showcase-card{box-shadow:none}}


/* Viewport-safe image viewer */
.lightbox.open{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  overflow:hidden!important;
}
.lightbox .lightbox-stage{
  position:relative!important;
  width:100vw!important;
  height:100dvh!important;
  max-width:100vw!important;
  max-height:100dvh!important;
  box-sizing:border-box!important;
  padding:58px 86px 58px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
.lightbox .lightbox-stage>img{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  object-fit:contain!important;
  object-position:center!important;
  align-self:center!important;
  justify-self:center!important;
  box-shadow:0 24px 90px rgba(0,0,0,.48)!important;
}
.lightbox .lightbox-close{
  position:fixed!important;
  top:max(12px,env(safe-area-inset-top))!important;
  right:max(16px,env(safe-area-inset-right))!important;
  left:auto!important;
  bottom:auto!important;
  transform:none!important;
}
.lightbox .lightbox-prev,
.lightbox .lightbox-next{
  position:fixed!important;
  top:50%!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
}
.lightbox .lightbox-prev{left:max(16px,env(safe-area-inset-left))!important;right:auto!important}
.lightbox .lightbox-next{right:max(16px,env(safe-area-inset-right))!important;left:auto!important}
.lightbox .lightbox-count{
  position:fixed!important;
  left:50%!important;
  bottom:max(14px,env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
}
.lightbox .lightbox-caption{
  position:fixed!important;
  left:50%!important;
  bottom:max(34px,calc(env(safe-area-inset-bottom) + 28px))!important;
  transform:translateX(-50%)!important;
  max-width:min(70vw,760px)!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}
@media(max-width:820px){
  .lightbox .lightbox-stage{
    padding:max(58px,calc(env(safe-area-inset-top) + 50px)) max(12px,env(safe-area-inset-right)) max(76px,calc(env(safe-area-inset-bottom) + 66px)) max(12px,env(safe-area-inset-left))!important;
  }
  .lightbox .lightbox-prev,
  .lightbox .lightbox-next{
    top:auto!important;
    bottom:max(12px,env(safe-area-inset-bottom))!important;
    transform:none!important;
  }
  .lightbox .lightbox-prev{left:calc(50% - 74px)!important}
  .lightbox .lightbox-next{right:calc(50% - 74px)!important}
  .lightbox .lightbox-count{bottom:max(28px,calc(env(safe-area-inset-bottom) + 15px))!important}
  .lightbox .lightbox-caption{display:none!important}
}
@media(max-height:620px) and (orientation:landscape){
  .lightbox .lightbox-stage{
    padding:max(10px,env(safe-area-inset-top)) max(62px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(62px,env(safe-area-inset-left))!important;
  }
  .lightbox .lightbox-prev,
  .lightbox .lightbox-next{top:50%!important;bottom:auto!important;transform:translateY(-50%)!important}
  .lightbox .lightbox-prev{left:max(8px,env(safe-area-inset-left))!important}
  .lightbox .lightbox-next{right:max(8px,env(safe-area-inset-right))!important}
  .lightbox .lightbox-count,.lightbox .lightbox-caption{display:none!important}
}


/* Responsive fit pass */
@media(max-width:1120px) and (min-width:761px){
  .category-card-grid,.category-card-grid-final{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .web-case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .web-offer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .industry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .web-process{grid-template-columns:repeat(2,minmax(0,1fr))}
  .web-process article:last-child{grid-column:1/-1}
  .seo-proof-grid{grid-template-columns:1fr}
  .seo-method-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .web-case-grid,.web-offer-grid,.industry-grid,.web-process,.seo-proof-grid,.seo-method-grid{grid-template-columns:1fr!important}
  .web-process article:last-child{grid-column:auto}
  .seo-proof-card img{aspect-ratio:auto;height:auto;max-height:none;object-fit:contain}
  .web-case-card,.web-offer-card,.industry-card,.web-process article,.seo-method{min-height:0}
}
@media(max-width:420px){
  .seo-proof-copy,.web-case-card,.web-offer-card,.industry-card,.web-process article,.seo-method{padding-left:18px;padding-right:18px}
}

/* v54 FINAL RESPONSIVE SYSTEM — stable browser sizing, uniform project cards, no crop/stretch regressions. */
:root{--max:1440px!important}
html{font-size:16px!important;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;overflow-x:hidden}
.section-inner,.footer-grid,.footer-bottom{width:100%!important;max-width:1440px!important;margin-left:auto!important;margin-right:auto!important;min-width:0!important}
.header-inner{width:100%!important;max-width:1440px!important;margin-left:auto!important;margin-right:auto!important;min-width:0!important}
.ba-inner{width:100%!important;max-width:1440px!important;margin-left:auto!important;margin-right:auto!important;min-width:0!important}
main,section,footer{min-width:0;max-width:100%}

/* Landscape project work must look like the rest of the portfolio: one ratio, no black dead space. */
.web-project-strip-grid.web-project-strip-grid-landscape{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;align-items:stretch!important}
.web-project-strip-grid.web-project-strip-grid-landscape a{display:block!important;aspect-ratio:16/9!important;min-width:0!important;overflow:hidden!important;background:#111!important}
.web-project-strip-grid.web-project-strip-grid-landscape img{display:block!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center!important;background:#111!important}

/* Dedicated Web Design page keeps the responsive-device project art in a uniform four-card set. */
.web-showcase-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;align-items:stretch!important}
.web-showcase-card{aspect-ratio:3/4!important;min-width:0!important;overflow:hidden!important;background:#111!important}
.web-showcase-card img{display:block!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center!important;background:#111!important}

/* Web-design entries inside regular portfolio rails are now true landscape source images. */
.work-tile[data-work-category~="web-design"] img,
.gallery-card[data-gallery-category~="web-design"] img{object-fit:cover!important;object-position:center!important;background:#111!important}

/* SEO reporting: generated Google-style sample dashboards, complete image visible, sharp HTML copy below. */
.seo-proof-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important;align-items:stretch!important}
.seo-proof-card{min-width:0!important}
.seo-proof-screen{aspect-ratio:auto!important;overflow:hidden!important;background:#fff!important}
.seo-proof-screen img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;filter:none!important;transform:none!important;background:#fff!important}

/* Viewer always contains the complete source image. */
.lightbox.open{display:grid!important;place-items:center!important;padding:0!important;overflow:hidden!important}
.lightbox .lightbox-stage{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;box-sizing:border-box!important;padding:max(58px,calc(env(safe-area-inset-top) + 50px)) max(72px,calc(env(safe-area-inset-right) + 60px)) max(58px,calc(env(safe-area-inset-bottom) + 50px)) max(72px,calc(env(safe-area-inset-left) + 60px))!important;display:grid!important;place-items:center!important;overflow:hidden!important}
.lightbox .lightbox-stage>img{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;margin:auto!important}

/* Homepage Design & Web card keeps the clean Olive Branch capture. */
.category-card-grid-final .category-card img[src*="olive-branch-home-v54"]{object-fit:cover!important;object-position:center!important}

@media(max-width:1180px){
  .web-showcase-grid,.web-project-strip-grid.web-project-strip-grid-landscape{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .seo-proof-grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .section-inner,.footer-grid,.footer-bottom,.ba-inner{max-width:100%!important}
  .web-showcase-grid,.web-project-strip-grid.web-project-strip-grid-landscape{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
}
@media(max-width:620px){
  .lightbox .lightbox-stage{padding:max(58px,calc(env(safe-area-inset-top) + 50px)) max(8px,env(safe-area-inset-right)) max(82px,calc(env(safe-area-inset-bottom) + 72px)) max(8px,env(safe-area-inset-left))!important}
  .seo-proof-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;row-gap:14px!important}
  .seo-proof-metric:nth-child(2){border-right:0!important}
  .seo-proof-metric:nth-child(3),.seo-proof-metric:nth-child(4){padding-top:14px!important;border-top:1px solid rgba(255,255,255,.08)!important}
  .seo-proof-metric:nth-child(3){padding-left:0!important}
  .seo-proof-metric:nth-child(4){border-right:0!important}
}
@media(max-width:420px){
  .web-showcase-grid,.web-project-strip-grid.web-project-strip-grid-landscape{gap:8px!important}
}

/* v54 final release hardening: sharp SEO reporting viewer + no image over-expansion. */
.lightbox .lightbox-stage>img{width:auto!important;height:auto!important;max-width:min(100%,1600px)!important;max-height:calc(100dvh - 116px)!important;object-fit:contain!important}
.lightbox-card-preview{width:min(1180px,calc(100vw - 190px));max-height:calc(100dvh - 96px);overflow:auto;overscroll-behavior:contain;background:#151515;border:1px solid rgba(255,255,255,.16);box-shadow:0 24px 90px rgba(0,0,0,.55);scrollbar-width:thin}
.lightbox-card-preview[hidden]{display:none!important}
.lightbox-card-preview .seo-proof-card{width:100%!important;margin:0!important;border:0!important;background:#151515!important;overflow:hidden!important}
.lightbox-card-preview .seo-proof-screen{cursor:default!important}
.lightbox-card-preview .seo-proof-screen img{width:100%!important;height:auto!important;max-width:1200px!important;margin:0 auto!important;object-fit:contain!important}
.lightbox-card-preview .seo-proof-copy{padding:24px 28px 28px!important}
.lightbox-card-mode .lightbox-stage{padding-top:48px!important;padding-bottom:48px!important}
.lightbox-card-mode .lightbox-count{bottom:12px!important}
@media(max-width:1180px){
  .lightbox-card-preview{width:min(940px,calc(100vw - 110px));max-height:calc(100dvh - 92px)}
}
@media(max-width:620px){
  .lightbox-card-preview{width:calc(100vw - max(18px,env(safe-area-inset-left)) - max(18px,env(safe-area-inset-right)));max-height:calc(100dvh - max(132px,calc(env(safe-area-inset-top) + env(safe-area-inset-bottom) + 112px)));margin:auto}
  .lightbox-card-preview .seo-proof-copy{padding:20px 18px 24px!important}
  .lightbox-card-mode .lightbox-stage{padding-top:max(58px,calc(env(safe-area-inset-top) + 50px))!important;padding-bottom:max(82px,calc(env(safe-area-inset-bottom) + 72px))!important}
}



/* v54 FINAL HEADER SYSTEM — one persistent navigation standard across desktop, laptop, tablet and phone. */
:root{--fwf-header-desktop:127px;--fwf-header-compact:73px;--fwf-header-phone:65px}
.site-header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;z-index:2147483000!important;transform:none!important;translate:none!important;visibility:visible!important;opacity:1!important}
body{padding-top:var(--fwf-header-desktop)!important}
html{scroll-padding-top:calc(var(--fwf-header-desktop) + 12px)!important}
:target{scroll-margin-top:calc(var(--fwf-header-desktop) + 12px)!important}
@media(max-width:1280px){
  body{padding-top:var(--fwf-header-compact)!important}
  html{scroll-padding-top:calc(var(--fwf-header-compact) + 12px)!important}
  :target{scroll-margin-top:calc(var(--fwf-header-compact) + 12px)!important}
  .header-inner{height:72px!important}
  .mobile-nav{top:var(--fwf-header-compact)!important;max-height:calc(100dvh - var(--fwf-header-compact))!important}
}
@media(max-width:620px){
  body{padding-top:var(--fwf-header-phone)!important}
  html{scroll-padding-top:calc(var(--fwf-header-phone) + 12px)!important}
  :target{scroll-margin-top:calc(var(--fwf-header-phone) + 12px)!important}
  .header-inner{height:64px!important}
  .mobile-nav{top:var(--fwf-header-phone)!important;max-height:calc(100dvh - var(--fwf-header-phone))!important}
}


/* v54 FINAL REGRESSION FIX — explicit global stacking order and review dividers. */
/* Keep persistent navigation above page content, but always below dialogs/lightboxes. */
.site-header{z-index:2000!important}
@media(max-width:1280px){
  .site-header{z-index:2000!important}
  .mobile-nav{z-index:2100!important}
}

/* The image viewer must cover the fixed header on every browser/device. */
.lightbox{z-index:10000!important}
.lightbox .lightbox-stage{z-index:10001!important}
.lightbox .lightbox-close,
.lightbox .lightbox-prev,
.lightbox .lightbox-next,
.lightbox .lightbox-count{z-index:10002!important}
.lightbox .lightbox-close,
.lightbox .lightbox-prev,
.lightbox .lightbox-next{
  display:grid!important;
  place-items:center!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  width:44px!important;
  height:44px!important;
  background:transparent!important;
  color:#fff!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  text-shadow:0 2px 14px rgba(0,0,0,.7)!important;
}
.lightbox .lightbox-close{
  top:max(14px,env(safe-area-inset-top))!important;
  right:max(14px,env(safe-area-inset-right))!important;
  font-size:1.55rem!important;
  line-height:1!important;
}
.lightbox .lightbox-prev,.lightbox .lightbox-next{font-size:1.12rem!important}
.lightbox .lightbox-close:hover,
.lightbox .lightbox-close:focus-visible,
.lightbox .lightbox-prev:hover,
.lightbox .lightbox-prev:focus-visible,
.lightbox .lightbox-next:hover,
.lightbox .lightbox-next:focus-visible{background:transparent!important;color:var(--gold)!important;border:0!important;outline:0!important;box-shadow:none!important}

/* Review separators live in premium CSS only. Responsive rules change columns, not borders. */

/* v62 lightbox safe inset for tall device portfolios. */
@media(min-width:821px){.lightbox .lightbox-stage>img{max-width:calc(100% - 28px)!important;max-height:calc(100% - 20px)!important}}

@media(max-width:1280px){
  .site-header{
    background:rgba(9,9,9,.84)!important;
    -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
    backdrop-filter:blur(18px) saturate(135%)!important;
  }
  .mobile-nav{
    display:block!important;
    position:fixed!important;
    top:var(--fwf-header-compact)!important;
    left:0!important;
    right:auto!important;
    bottom:0!important;
    width:min(88vw,430px)!important;
    max-width:430px!important;
    height:auto!important;
    max-height:calc(100dvh - var(--fwf-header-compact))!important;
    padding:20px max(22px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    background:linear-gradient(180deg,rgba(15,15,15,.90),rgba(12,12,12,.78))!important;
    border:0!important;
    border-right:1px solid rgba(255,255,255,.13)!important;
    box-shadow:28px 0 70px rgba(0,0,0,.38)!important;
    -webkit-backdrop-filter:blur(28px) saturate(145%)!important;
    backdrop-filter:blur(28px) saturate(145%)!important;
    transform:translate3d(-104%,0,0)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .30s cubic-bezier(.22,.72,.18,1),opacity .20s ease,visibility 0s linear .30s!important;
    will-change:transform,opacity;
    z-index:2100!important;
  }
  .mobile-nav.open{
    transform:translate3d(0,0,0)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition-delay:0s!important;
  }
  .mobile-nav-backdrop{
    display:block;
    position:fixed;
    top:var(--fwf-header-compact);
    left:0;
    right:0;
    bottom:0;
    background:rgba(0,0,0,.34);
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .20s ease,visibility 0s linear .20s;
    z-index:2050;
  }
  .mobile-nav-backdrop.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition-delay:0s;
  }
  body.menu-open{overflow:hidden!important;overscroll-behavior:none!important}
  .mobile-nav>a,.mobile-nav summary{background:transparent!important}
}
@media(max-width:620px){
  .mobile-nav{
    top:var(--fwf-header-phone)!important;
    width:min(91vw,390px)!important;
    max-width:390px!important;
    max-height:calc(100dvh - var(--fwf-header-phone))!important;
    padding:18px max(18px,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;
  }
  .mobile-nav-backdrop{top:var(--fwf-header-phone)}
}
@media(min-width:1281px){.mobile-nav-backdrop{display:none!important}}
@media(prefers-reduced-motion:reduce){
  .mobile-nav,.mobile-nav-backdrop{transition:none!important}
}

/* V1.0.1 desktop drawer availability: keep the slide/glass menu accessible at every viewport width. */
@media(min-width:1281px){
  .menu-toggle{display:block!important;margin-left:0!important;flex:0 0 auto}
  .mobile-nav{
    display:block!important;position:fixed!important;top:var(--fwf-header-desktop)!important;left:0!important;right:auto!important;bottom:0!important;
    width:min(32vw,430px)!important;max-width:430px!important;height:auto!important;max-height:calc(100dvh - var(--fwf-header-desktop))!important;
    padding:20px 24px max(28px,env(safe-area-inset-bottom))!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;
    background:linear-gradient(180deg,rgba(15,15,15,.90),rgba(12,12,12,.78))!important;border:0!important;border-right:1px solid rgba(255,255,255,.13)!important;
    box-shadow:28px 0 70px rgba(0,0,0,.38)!important;-webkit-backdrop-filter:blur(28px) saturate(145%)!important;backdrop-filter:blur(28px) saturate(145%)!important;
    transform:translate3d(-104%,0,0)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:transform .30s cubic-bezier(.22,.72,.18,1),opacity .20s ease,visibility 0s linear .30s!important;will-change:transform,opacity;z-index:2100!important
  }
  .mobile-nav.open{transform:translate3d(0,0,0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important}
  .mobile-nav-backdrop{display:block!important;position:fixed;top:var(--fwf-header-desktop);left:0;right:0;bottom:0;background:rgba(0,0,0,.34);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .20s ease,visibility 0s linear .20s;z-index:2050}
  .mobile-nav-backdrop.open{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  body.menu-open{overflow:hidden!important;overscroll-behavior:none!important}
}

/* V1.0.4 final desktop header alignment: use the full black bar width while preserving the existing nav. */
@media(min-width:1281px){
  .header-main .header-inner{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:clamp(28px,2.4vw,48px)!important;
    padding-right:clamp(28px,2.4vw,48px)!important;
    box-sizing:border-box!important;
  }
}