/* Selected Work imagery and overflow correction — 2026-08-01 */
html,body{max-width:100%;overflow-x:hidden}
@supports(overflow:clip){html,body{overflow-x:clip}}
main,#work,#work .rail-shell{min-width:0;max-width:100%}
#work .rail-shell{width:100%;overflow:hidden}
#work .rail{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
#work .case,#work .case-visual,#work .case-body{min-width:0}
#work .case-body{overflow-wrap:normal;word-break:normal}
#work .case h3{text-wrap:balance;overflow-wrap:normal;hyphens:none}

.case-visual.visual-image{
  --case-photo:none;
  position:relative;
  align-self:stretch;
  padding:0;
  overflow:hidden;
  background:#070907;
  isolation:isolate;
}
.case-visual.visual-image::before{
  content:"";
  position:absolute;
  inset:-12%;
  z-index:0;
  background-image:linear-gradient(180deg,rgba(7,9,7,.05),rgba(7,9,7,.4)),var(--case-photo);
  background-size:cover;
  background-position:center;
  filter:blur(24px) brightness(.72) saturate(.92);
  transform:scale(1.08);
  pointer-events:none;
}
.case-visual.visual-image::after{z-index:3}
.case-visual.visual-image>img{
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:transparent;
}

.visual-calpoly-source{--case-photo:url("/assets/portfolio/folio-06-calpoly.webp")}
.visual-scream-source{--case-photo:url("/assets/portfolio/folio-01-scream.webp")}
.visual-vinyl-source{--case-photo:url("/assets/portfolio/folio-02-vinyl.webp")}
.visual-mchappy-image{--case-photo:url("/assets/portfolio/case-mchappy.jpg")}
.visual-fanta-image{--case-photo:url("/assets/portfolio/case-fanta.jpg")}
.visual-volkswagen-image{--case-photo:url("/assets/portfolio/folio-05-volkswagen.webp")}
.visual-sg-image{--case-photo:url("/assets/portfolio/case-societe-generale.jpg")}
.visual-burning-source{--case-photo:url("/assets/portfolio/folio-14-burning-man.webp")}

@media(min-width:981px){
  #work .case{min-height:660px}
  #work .case-body{padding:40px 42px;gap:22px}
  #work .case h3{font-size:clamp(2.55rem,3.45vw,4.2rem);margin:14px 0}
  #work .case-body>div>p{font-size:.93rem;line-height:1.55}
  #work .impact{margin-top:18px}
  #work .impact div{padding:12px 14px}
  #work .case-visual.visual-image>img{padding:16px;box-sizing:border-box}
}

/* Clean vertical previews: visual evidence + large logos only. All project copy remains in the adjacent case body. */
#work .case-visual.visual-ai,
#work .case-visual.visual-scream,
#work .case-visual.visual-vinyl,
#work .case-visual.visual-bm{
  position:relative;
  align-self:stretch;
  padding:0!important;
  overflow:hidden;
  background-color:#050705!important;
  background-image:var(--clean-preview)!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
  isolation:isolate;
}
#work .case-visual.visual-ai{--clean-preview:url("https://drive.google.com/thumbnail?id=1fq3__9qopTWPYMM3pQpZA-PdnE2vlTmu&sz=w1600")}
#work .case-visual.visual-scream{--clean-preview:url("https://drive.google.com/thumbnail?id=1MVKA_74KmMUM2dPC8RY0FDaTMzHrIglH&sz=w1600")}
#work .case-visual.visual-vinyl{--clean-preview:url("https://drive.google.com/thumbnail?id=1oYpzvYQphKdGiA-sR5tSnjb9oLTi6x7E&sz=w1600")}
#work .case-visual.visual-bm{--clean-preview:url("https://drive.google.com/thumbnail?id=1_K7pOU92PA-_sRYhY4r7VP1jHWTFJD1z&sz=w1600")}
#work .case-visual.visual-ai::before,
#work .case-visual.visual-ai::after,
#work .case-visual.visual-scream::before,
#work .case-visual.visual-scream::after,
#work .case-visual.visual-vinyl::before,
#work .case-visual.visual-vinyl::after,
#work .case-visual.visual-bm::before,
#work .case-visual.visual-bm::after{display:none!important}
#work .case-visual.visual-ai>*,
#work .case-visual.visual-scream>*,
#work .case-visual.visual-vinyl>*,
#work .case-visual.visual-bm>*{display:none!important}

@media(max-width:640px){
  #work .case-visual.visual-image,
  #work .case-visual.visual-ai,
  #work .case-visual.visual-scream,
  #work .case-visual.visual-vinyl,
  #work .case-visual.visual-bm{
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:3/2;
    padding:0;
  }
  #work .case-visual.visual-image>img{
    width:100%;
    height:100%;
    object-fit:contain;
  }
}

.visual-xfactor-image{--case-photo:url("/assets/portfolio/case-xfactor.webp")}
.visual-mageworx-image{--case-photo:url("/assets/portfolio/case-mageworx.webp")}
.visual-unicef-image{--case-photo:url("/assets/portfolio/case-unicef.webp")}
.visual-globalfund-image{--case-photo:url("/assets/portfolio/case-global-fund.webp")}

@media(max-width:640px){
  #work .case h3{font-size:clamp(1.78rem,8.1vw,2.15rem);line-height:.98;letter-spacing:-.052em}
  #work .case-index{font-size:.62rem;line-height:1.35}
  #work .case-body>div>p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
  #work .impact div:nth-child(n+3),#work .tags .tag:nth-child(n+3),#work .case-meta{display:none}
  #work .case-footer{justify-content:flex-start}
}