/* Neutral reading surfaces replace peach while retaining orange accents. */
.bg-orange-100, .bg-orange-200 { background-color: #f5f5f2; }
.home-device-band { overflow: hidden; background: #101117; }
.home-device-stage {
  position: relative; width: 100%; max-width: 1100px;
  aspect-ratio: 1 / 1; margin: 0 auto; isolation: isolate;
}
.home-device {
  position: absolute; left: var(--device-x); top: var(--device-y);
  width: var(--device-width); z-index: var(--device-layer); margin: 0;
  transform: translate3d(0, var(--device-shift, 0px), 0) rotate(var(--device-rotation));
}
.home-device img { display: block; width: 100%; height: auto; }
@media (max-width: 767px) {
  .home-device-stage { aspect-ratio: 0.93 / 1; }
}
@media (prefers-reduced-motion: reduce) {
  .home-device { transform: rotate(var(--device-rotation)); }
}

/* Hero review: one real project, with the established type and dark palette. */
.home-hero--work .home-hero__stage {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(40px, 5vw, 88px);
  width: min(1440px, calc(100% - 88px));
  min-height: 0;
  margin: 0 auto;
  padding: calc(var(--header-h) + var(--adminbar-h) + 64px) 0 64px;
}
.home-hero--work .home-hero__stage-inner {
  display: block;
  width: 100%;
  min-height: 0;
  max-width: none;
  padding: 0;
  margin: 0;
}
.home-hero--work .home-hero__headline-wrap { width: 100%; max-width: none; padding: 0; }
.home-hero--work::before, .home-hero--work::after { display: none; }
.home-hero--work .home-hero__headline { font-size: clamp(44px, 4.55vw, 72px); }
.home-hero--work .home-hero__intro { max-width: 640px; font-size: 18px; line-height: 1.55; }
.home-hero--work .home-hero__work { margin: 0; min-width: 0; }
.home-hero__work-link { display: block; color: inherit; text-decoration: none; }
.home-hero__work-link img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; }
.home-hero__work-link figcaption {
  display: flex; justify-content: space-between; gap: 16px;
  padding-top: 18px; font-size: 16px; line-height: 1.4;
  border-top: 1px solid rgba(255,255,255,.18);
}
.home-hero__work-link figcaption span:last-child { color: rgba(255,255,255,.7); }
.home-hero__work-link:focus-visible { outline: 2px solid #ff8561; outline-offset: 8px; }
@media (max-width: 1000px) {
  .home-hero--work .home-hero__stage { grid-template-columns: 1fr; width: calc(100% - 48px); gap: 32px; }
  .home-hero--work .home-hero__work { width: min(640px, 100%); }
}
@media (max-width: 767px) {
  .home-hero--work .home-hero__stage { width: calc(100% - 36px); padding-top: calc(var(--header-h) + var(--adminbar-h) + 36px); padding-bottom: 36px; }
  .home-hero--work .home-hero__headline { font-size: clamp(36px, 9vw, 48px); }
  .home-hero--work .home-hero__intro { font-size: 16px; line-height: 1.55; }
}

/* Local native case cards: composite image and gradient before one rounded clip.
   Shared by the /werk grid and every case-slider; preserve geometry and anchor focus. */
body.wab-local-ui-contract .case-card--project .case-card__media{isolation:isolate;transform:translateZ(0)}

/* One approved native case-card appearance, shared by grids and sliders. */
body.wab-local-ui-contract .case-card--project{min-width:0;overflow:hidden;border:0!important;border-radius:20px!important;box-shadow:none!important;background:#101117;text-decoration:none!important}
body.wab-local-ui-contract .case-card--project::before,body.wab-local-ui-contract .case-card--project::after,body.wab-local-ui-contract .case-card--project .case-card__media::before,body.wab-local-ui-contract .case-card--project .case-card__media::after{display:none!important}
body.wab-local-ui-contract .case-card--project .case-card__img{position:absolute;inset:-1px!important;width:calc(100% + 2px)!important;height:calc(100% + 2px)!important;max-width:none!important;object-fit:cover!important;transform:none!important;transition:none!important;border:0!important}
body.wab-local-ui-contract .case-card--project .case-card__overlay{position:absolute;inset:0!important;display:flex;flex-direction:column;justify-content:flex-end;padding:38px!important;background:linear-gradient(180deg,#10111708 20%,#10111735 42%,#101117df 78%,#101117fa 100%)!important;border:0!important;box-shadow:none!important}
body.wab-local-ui-contract .case-card--project .case-card__logo{position:absolute;left:38px!important;top:30px!important;width:240px!important;height:85px!important;display:flex;align-items:center}
body.wab-local-ui-contract .case-card--project .case-card__logo img{width:calc(200px * var(--case-logo-scale,1))!important;height:85px!important;max-width:260px!important;max-height:85px!important;object-fit:contain;object-position:left center;filter:brightness(0) invert(1)}
body.wab-local-ui-contract .wab-case-logo--lennmedia{--case-logo-scale:1.28}body.wab-local-ui-contract .wab-case-logo--under-your-skin-foundation{--case-logo-scale:1.2}body.wab-local-ui-contract .wab-case-logo--spares-center-rotterdam{--case-logo-scale:.85}
body.wab-local-ui-contract .case-card--project .case-card__overlay-bottom{position:static;display:block;width:100%;min-height:0!important;overflow:visible}
body.wab-local-ui-contract .case-card--project .case-card__overlay-copy{transform:none!important}
body.wab-local-ui-contract .case-card--project .case-card__title{font-family:"Graphik Super",sans-serif!important;font-size:clamp(26px,2.5vw,36px)!important;font-weight:900!important;text-transform:uppercase;line-height:1.06!important;letter-spacing:-.025em;max-width:100%!important;margin:0!important;color:#fff!important;text-decoration:none!important}
body.wab-local-ui-contract .case-card--project .case-card__client{margin-top:15px;font-size:16px;color:#ffffffb8!important;opacity:1!important;transform:none!important}
body.wab-local-ui-contract .case-card--project .case-card__cta-link{display:inline-flex!important;align-items:center;gap:10px;margin-top:18px;font-size:15px;color:#fff!important;opacity:1!important;visibility:visible!important;transform:none!important;text-decoration:none!important}
body .wab-case-slider .case-card__cta-link i{font-size:10px}
@media(max-width:767px){body.wab-local-ui-contract .case-card--project .case-card__overlay{padding:25px!important}body.wab-local-ui-contract .case-card--project .case-card__logo{left:25px!important;top:24px!important;width:200px!important;height:65px!important}body.wab-local-ui-contract .case-card--project .case-card__logo img{width:calc(150px * var(--case-logo-scale,1))!important;height:65px!important;max-height:65px!important;max-width:200px!important}body.wab-local-ui-contract .case-card--project .case-card__title{font-size:clamp(24px,7vw,35px)!important}}
body.wab-local-ui-contract .case-card--project :is(.case-card__overlay-bottom,.case-card__overlay-copy,.case-card__title){min-width:0!important;max-width:100%!important}
body.wab-local-ui-contract .case-card--project .case-card__title{overflow-wrap:anywhere!important;word-break:normal!important;white-space:normal!important}
/* Project action appears on desktop intent; touch retains a visible affordance. */
@media(hover:hover) and (pointer:fine){
 body.wab-local-ui-contract .case-card--project .case-card__cta-link{opacity:0!important;visibility:hidden!important;transform:translateY(4px)!important;transition:opacity .16s ease,transform .16s ease,visibility .16s!important}
 body.wab-local-ui-contract .case-card--project:is(:hover,:focus-within) .case-card__cta-link{opacity:1!important;visibility:visible!important;transform:none!important}
}
@media(prefers-reduced-motion:reduce){body.wab-local-ui-contract .case-card--project .case-card__cta-link{transition:none!important}}

/* Optional concise project scope, shared by work cards and sliders. */
body.wab-local-ui-contract .case-card--project .case-card__description{margin:8px 0 0;font-family:inherit;font-size:16px;line-height:1.35;color:#ffffffd9;overflow-wrap:anywhere}
