/* Airbrush Some Stuff V136 — scroll-layout repair
   Stabilizes V135's cinematic motion so visual effects never obscure real content. */

:root{
  --v136-ink:#071016;
  --v136-panel:#07131b;
  --v136-cyan:#27dcff;
  --v136-ease:cubic-bezier(.2,.72,.18,1);
}

/* 1. Large editorial statement: keep it entirely in normal flow. */
body.theme-v38.page-index .statement{
  position:relative!important;
  z-index:2!important;
  overflow:clip!important;
  min-height:0!important;
  margin:0 auto!important;
  padding-top:clamp(70px,7vw,110px)!important;
  padding-bottom:clamp(70px,7vw,110px)!important;
}
body.theme-v38.page-index .statement h2{
  max-width:15ch!important;
  font-size:clamp(54px,5.5vw,88px)!important;
  line-height:.96!important;
  letter-spacing:-.04em!important;
  text-wrap:balance;
  overflow-wrap:normal;
}

/* 2. Signature collage: the old fixed 90px title row could not contain the headline.
      Give the title its own real row and move parallax to image pixels, not whole cards. */
body.page-index .v135-collage{
  width:min(1440px,calc(100% - 40px))!important;
  margin:clamp(34px,5vw,78px) auto clamp(80px,8vw,130px)!important;
  padding:clamp(28px,4vw,58px)!important;
  display:grid!important;
  grid-template-columns:minmax(230px,.72fr) minmax(0,1.35fr) minmax(230px,.78fr)!important;
  grid-template-rows:auto minmax(460px,610px) 145px!important;
  gap:18px!important;
  background:linear-gradient(145deg,#061018,#091722 68%,#07131b)!important;
  border:1px solid rgba(39,220,255,.12)!important;
  border-radius:38px!important;
  color:#fff!important;
  overflow:clip!important;
  isolation:isolate;
}
body.page-index .v135-collage-copy{
  grid-column:1/-1!important;
  grid-row:1!important;
  align-self:auto!important;
  max-width:930px!important;
  padding:0 0 clamp(14px,2vw,26px)!important;
  position:relative!important;
  z-index:6!important;
}
body.page-index .v135-collage-copy h2{
  max-width:12ch!important;
  font-size:clamp(48px,5.3vw,82px)!important;
  line-height:.94!important;
  letter-spacing:-.04em!important;
  text-wrap:balance;
}
body.page-index .v135-collage-frame{
  margin:0!important;
  min-width:0!important;
  min-height:0!important;
  transform:none!important;
  overflow:hidden!important;
}
body.page-index .v135-collage-frame.main{grid-column:2/4!important;grid-row:2/4!important}
body.page-index .v135-collage-frame.left{grid-column:1!important;grid-row:2!important;height:100%!important;align-self:stretch!important}
body.page-index .v135-collage-frame.detail{grid-column:1!important;grid-row:3!important;width:82%!important;height:100%!important;justify-self:end!important}
body.page-index .v135-collage-frame img{
  position:absolute!important;
  inset:-5% 0 auto 0!important;
  width:100%!important;
  height:110%!important;
  max-width:none!important;
  object-fit:cover!important;
  display:block!important;
  transform:translate3d(0,var(--v136-parallax-y,0px),0) scale(1.015)!important;
  will-change:transform;
}
body.page-index .v135-collage-frame.left img{object-position:center 42%!important}
body.page-index .v135-collage-frame.detail img{object-position:center!important}
body.page-index .v135-collage .v135-orbit-line{transform:none!important;pointer-events:none}

/* 3. Service panels: keep the layered visual language, but never physically cover another panel. */
@media (min-width:1101px){
  html.v135-motion body.page-index .service-river.service-showcase{
    display:grid!important;
    gap:28px!important;
    padding-bottom:clamp(95px,8vw,140px)!important;
    overflow:visible!important;
  }
  html.v135-motion body.page-index .service-showcase .service-panel.service-feature{
    position:relative!important;
    top:auto!important;
    margin:0!important;
    transform:translate3d(0,var(--v136-panel-y,0px),0)!important;
    opacity:1!important;
    box-shadow:0 24px 65px rgba(0,0,0,.13)!important;
    isolation:isolate;
  }
  html.v135-motion body.page-index .service-showcase .service-panel.service-feature.is-v136-pending{
    --v136-panel-y:26px;
    opacity:.01!important;
    transition:transform .72s var(--v136-ease),opacity .72s ease,box-shadow .35s ease!important;
  }
  html.v135-motion body.page-index .service-showcase .service-panel.service-feature.is-v136-visible{
    --v136-panel-y:0px;
    opacity:1!important;
  }
  body.page-index .service-panel-media{position:relative!important;overflow:hidden!important}
  body.page-index .service-panel-media img.v135-parallax-img{
    position:absolute!important;
    inset:-5% 0 auto 0!important;
    width:100%!important;
    height:110%!important;
    max-width:none!important;
    object-fit:cover!important;
    transform:translate3d(0,var(--v136-service-parallax-y,0px),0) scale(1.012)!important;
  }
}

/* 4. Process story: replace the clipped horizontal scrub with a stable editorial grid.
      Cards still reveal on scroll, but the document never slides off the viewport. */
html.v135-motion body.page-index .process.v135-process-story{
  height:auto!important;
  position:relative!important;
  max-width:1540px!important;
  padding:clamp(75px,7vw,105px) clamp(20px,6vw,90px)!important;
  overflow:visible!important;
}
html.v135-motion body.page-index .process.v135-process-story>.eyebrow{
  position:static!important;
  top:auto!important;
  width:auto!important;
  padding:0!important;
  margin:0 0 34px!important;
  color:#0078a7!important;
}
html.v135-motion body.page-index .process.v135-process-story .process-line{
  position:static!important;
  top:auto!important;
  width:100%!important;
  max-width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:14px!important;
  margin:0!important;
  border:0!important;
  transform:none!important;
  will-change:auto!important;
}
html.v135-motion body.page-index .process.v135-process-story .process-line>div{
  width:auto!important;
  min-width:0!important;
  min-height:280px!important;
  padding:28px!important;
  border:1px solid rgba(39,220,255,.16)!important;
  border-radius:26px!important;
  background:linear-gradient(150deg,#07131b,#040b10)!important;
  color:#fff!important;
  opacity:1!important;
  transform:none!important;
  overflow:hidden!important;
}
html.v135-motion body.page-index .process.v135-process-story .process-line b{margin:0 0 48px!important}
html.v135-motion body.page-index .process.v135-process-story .process-line h3{
  font-size:clamp(35px,3.2vw,54px)!important;
  line-height:.92!important;
}

/* 5. Apparel sample cards: keep favorite and pricing controls away from the card action text. */
body.theme-v38.page-apparel-samples .apparel-sample-card{position:relative!important;isolation:isolate}
body.theme-v38.page-apparel-samples .v97-favorite{
  top:12px!important;
  right:12px!important;
  bottom:auto!important;
  min-height:38px!important;
  padding:8px 13px!important;
  z-index:8!important;
  line-height:1!important;
}
body.theme-v38.page-apparel-samples .sample-price{
  top:auto!important;
  right:12px!important;
  bottom:12px!important;
  z-index:5!important;
}
body.theme-v38.page-apparel-samples .sample-merch-badge{
  left:12px!important;
  bottom:12px!important;
  max-width:calc(100% - 122px)!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body.theme-v38.page-apparel-samples .sample-number{top:12px!important;left:12px!important;z-index:5!important}
body.theme-v38.page-apparel-samples .sample-card-bottom{padding-right:0!important}

/* 6. Footer promo cards: keep large editorial copy fully inside each panel. */
body.theme-v38 .site-ad-grid{align-items:stretch!important}
body.theme-v38 .site-ad-grid a{
  min-width:0!important;
  min-height:260px!important;
  padding:clamp(28px,3vw,42px)!important;
  overflow:hidden!important;
}
body.theme-v38 .site-ad-grid strong{
  font-size:clamp(30px,2.65vw,44px)!important;
  line-height:1.02!important;
  max-width:15ch!important;
  overflow-wrap:normal;
}
body.theme-v38 .v131-local-footer{clear:both!important;position:relative!important;z-index:3!important}
body.theme-v38 .v131-local-footer-inner{min-width:0!important}
body.theme-v38 .v131-local-footer a{min-width:0!important;overflow:hidden!important}

/* 7. Tablet refinement: switch choreography before the layout gets cramped. */
@media (max-width:1280px) and (min-width:701px){
  body.page-index .v135-collage{
    grid-template-columns:minmax(210px,.7fr) minmax(0,1.3fr)!important;
    grid-template-rows:auto 500px 180px!important;
  }
  body.page-index .v135-collage-frame.main{grid-column:2!important;grid-row:2/4!important}
  body.page-index .v135-collage-frame.left{grid-column:1!important;grid-row:2!important}
  body.page-index .v135-collage-frame.detail{grid-column:1!important;grid-row:3!important;width:100%!important}
  html.v135-motion body.page-index .process.v135-process-story .process-line{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media (max-width:1100px){
  body.page-index .v135-collage{
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:auto 420px 220px!important;
    padding:26px!important;
  }
  body.page-index .v135-collage-copy{grid-column:1/-1!important}
  body.page-index .v135-collage-frame.main{grid-column:1/-1!important;grid-row:2!important}
  body.page-index .v135-collage-frame.left{grid-column:1!important;grid-row:3!important}
  body.page-index .v135-collage-frame.detail{grid-column:2!important;grid-row:3!important;width:100%!important}
  body.page-index .v135-collage-frame img{inset:0!important;height:100%!important;transform:none!important}
  html.v135-motion body.page-index .process.v135-process-story .process-line{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:700px){
  body.theme-v38.page-index .statement h2{font-size:clamp(42px,11vw,60px)!important;max-width:100%!important}
  body.page-index .v135-collage{
    width:calc(100% - 24px)!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto 360px 220px 160px!important;
    padding:18px!important;
    border-radius:26px!important;
  }
  body.page-index .v135-collage-copy h2{font-size:clamp(40px,11vw,58px)!important;max-width:100%!important}
  body.page-index .v135-collage-frame.main{grid-column:1!important;grid-row:2!important}
  body.page-index .v135-collage-frame.left{grid-column:1!important;grid-row:3!important}
  body.page-index .v135-collage-frame.detail{grid-column:1!important;grid-row:4!important;width:100%!important}
  html.v135-motion body.page-index .process.v135-process-story .process-line{grid-template-columns:1fr!important}
  html.v135-motion body.page-index .process.v135-process-story .process-line>div{min-height:220px!important}
  body.theme-v38 .site-ad-grid a{min-height:220px!important}
  body.theme-v38.page-apparel-samples .v97-favorite{top:10px!important;right:10px!important}
}

@media (prefers-reduced-motion:reduce){
  body.page-index .v135-collage-frame img,
  body.page-index .service-panel-media img.v135-parallax-img{transform:none!important}
  html.v135-motion body.page-index .service-showcase .service-panel.service-feature{opacity:1!important;transform:none!important}
}