/*21Oct: photo backdrop begins behind header; keep existing centered copy. */
@media(max-width:767px){
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero{--svc-photo-top:0px!important;padding-top:max(140px,calc(100vw * 941 / 1672 + 24px))!important}
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero__image{top:0!important}
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero:before{background:linear-gradient(180deg,#10111755 0,#10111722 70px,#101117 calc(100vw * 941 / 1672 + 8px))!important}
 .services-overview .overview-hero--photo{--svc-photo-top:0px!important;padding-top:max(140px,calc(100vw * 941 / 1672 + 24px))!important}
 .services-overview .overview-hero__photo{top:0!important}
 .services-overview .overview-hero--photo:before{background:linear-gradient(180deg,#10111755 0,#10111722 70px,#101117 calc(100vw * 941 / 1672 + 8px))!important}
}
/* Foreground photos stay wholly within the viewport, near the centered text frame. */
.studio-pages--about .sp-hero-bubble--1{left:clamp(20px,calc((100vw - 820px)/2 - 230px),180px);right:auto}
.studio-pages--about .sp-hero-bubble--2{right:clamp(20px,calc((100vw - 820px)/2 - 245px),180px);left:auto}
.studio-pages--about .sp-hero-bubble--3{left:clamp(20px,calc((100vw - 820px)/2 - 210px),180px);right:auto}
.studio-pages--about .sp-hero-bubble--4{right:clamp(20px,calc((100vw - 820px)/2 - 220px),180px);left:auto}
@media(max-width:1100px){.studio-pages--about .sp-hero--cinematic{padding-top:220px}.studio-pages--about .sp-hero-bubble--1,.studio-pages--about .sp-hero-bubble--2{top:90px;width:135px;left:20px;right:auto}.studio-pages--about .sp-hero-bubble--2{right:20px;left:auto}}
@media(max-width:650px){.studio-pages--about .sp-hero--cinematic{padding-top:185px}.studio-pages--about .sp-hero-bubble--1{left:14px;top:90px;width:95px}.studio-pages--about .sp-hero-bubble--2{right:14px;left:auto;top:auto;bottom:25px;width:100px}.studio-pages--about .sp-hero-bubble--3{left:14px;width:64px;bottom:15px}}
.studio-pages--about #wie-bedrijf-fotos .wab-photo-composition__item:first-child img{object-position:70% 50%}
.local-home-studio-intro__photos figure:first-child img{object-position:70% 50%}

/* Face-safe mobile photo area: soft same-source bleed behind navigation; sharp full frame below it. */
@media(max-width:767px){
 body.wab-local-ui-contract .svc-page--websites .svc-photo-hero{--photo-bleed:url('office-selection-20261020/ready-v3-116.webp')}
 body.wab-local-ui-contract .svc-page--branding .svc-photo-hero{--photo-bleed:url('office-selection-20261020/ready-v3-110.webp')}
 body.wab-local-ui-contract .svc-page--systemen .svc-photo-hero{--photo-bleed:url('office-selection-20261020/111-36-duo-imac.webp')}
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero{padding-top:calc(96px + 100vw * 941 / 1672 + 24px)!important}
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero__image{top:0!important;height:calc(96px + 100vw * 941 / 1672)!important;aspect-ratio:auto!important;padding-top:96px!important;box-sizing:border-box!important;object-fit:contain!important;object-position:center bottom!important}
 body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero:before{inset:0 0 auto!important;height:calc(100px + 100vw * 941 / 1672)!important;z-index:-4;background-image:linear-gradient(180deg,#101117aa,#10111722 70%,#101117),var(--photo-bleed)!important;background-size:cover!important;background-position:50% 28%!important;filter:blur(12px);transform:scale(1.04)}
 .services-overview .overview-hero--photo{--photo-bleed:url('office-selection-20261020/ready-v3-124.webp');padding-top:calc(96px + 100vw * 941 / 1672 + 24px)!important}
 .services-overview .overview-hero__photo{top:0!important;height:calc(96px + 100vw * 941 / 1672)!important;aspect-ratio:auto!important;padding-top:96px!important;box-sizing:border-box!important;object-fit:contain!important;object-position:center bottom!important}
 .services-overview .overview-hero--photo:before{inset:0 0 auto!important;height:calc(100px + 100vw * 941 / 1672)!important;z-index:-3;background-image:linear-gradient(180deg,#101117aa,#10111722 70%,#101117),var(--photo-bleed)!important;background-size:cover!important;background-position:50% 28%!important;filter:blur(12px);transform:scale(1.04)}
}

@media(max-width:767px){body.wab-local-ui-contract :is(.svc-page--websites,.svc-page--branding,.svc-page--systemen) .svc-photo-hero__image,.services-overview .overview-hero__photo{mask-image:linear-gradient(180deg,transparent 96px,#000 124px,#000 calc(100% - 26px),transparent);-webkit-mask-image:linear-gradient(180deg,transparent 96px,#000 124px,#000 calc(100% - 26px),transparent)}}

/* Exact Ben-approved B: a real landscape photograph below mobile navigation, no blur/fake extension. */
@media(max-width:767px){
 body.wab-local-ui-contract .svc-page--websites .svc-photo-hero{padding-top:calc(var(--header-h,96px) + 12px + 100vw * 941 / 1672 + 24px)!important;--photo-bleed:none}
 body.wab-local-ui-contract .svc-page--websites .svc-photo-hero__image{top:calc(var(--header-h,96px) + 12px)!important;height:calc(100vw * 941 / 1672)!important;padding:0!important;object-fit:cover!important;object-position:40% 45%!important;mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 32px),transparent 100%)!important;-webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 32px),transparent 100%)!important}
 body.wab-local-ui-contract .svc-page--websites .svc-photo-hero:before{height:calc(var(--header-h,96px) + 12px + 100vw * 941 / 1672)!important;background:linear-gradient(180deg,#10111722,transparent 70%,#101117)!important;filter:none!important;transform:none!important}
}
.home-support__photo img[src*="/support-sanne-airpod-v1.webp"]{object-position:38% 45%}
