.real-work{display:flex;gap:10px;overflow-x:auto;margin:18px 0 0;padding:2px 0 5px;scroll-snap-type:x proximity}.real-work a{flex:0 0 160px;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:10px;background:#edf2f1;scroll-snap-align:start}.real-work img{display:block;width:100%;height:100%;object-fit:cover}.real-work a:focus-visible{outline:3px solid #0754a1;outline-offset:2px}.real-work--wide{margin:20px 0 4px}.real-work--wide a{flex-basis:180px}.real-work-wrap{grid-column:1/-1}.real-work-more{margin-top:8px;color:#53677a;font-size:13px}@media(max-width:600px){.real-work a,.real-work--wide a{flex-basis:135px}}.item:has(.real-work){min-width:0}.item:has(.real-work)>div{min-width:0;flex:1}.real-work{max-width:100%}
.real-work:focus-visible{outline:3px solid #0754a1;outline-offset:3px}

/* Keep long headings, images and career layouts within their containers. */
.phero__grid > *{min-width:0}.phero h1{overflow-wrap:anywhere;hyphens:auto}.phero__img{overflow:hidden}.phero__img img,.ref-card__img img{width:100%;height:100%;object-fit:cover;object-position:center}.career-first .career-intro{margin-bottom:48px}.career-first .career-intro p{margin:0}.job-details{padding-top:20px}.job-details li{margin-bottom:.55em}.project-slider{position:relative}.project-slider img[hidden]{display:none}.project-slider__controls{position:absolute;z-index:2;bottom:14px;right:14px;display:flex;align-items:center;gap:8px;padding:5px;border-radius:999px;background:rgba(5,25,45,.78);color:white;font-size:13px}.project-slider__controls button{width:34px;height:34px;border:0;border-radius:50%;background:white;color:#0a2a4d;font-size:25px;line-height:1;cursor:pointer}.project-slider__controls button:focus-visible{outline:3px solid #70c8ff;outline-offset:2px}.project-slider__controls span{min-width:48px;text-align:center}
.phero__grid h1,.phero h1{overflow-wrap:anywhere!important;word-break:normal;white-space:normal!important;hyphens:auto!important}
.process-section .service-context{color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8)}

/* Avoid unnecessary hyphenation of short place names in hero headings. */
.phero h1{hyphens:manual!important}
/* A soft, timed insulation layer wraps each reached step. */
.insulation-wrap>li{position:relative;isolation:isolate}
.insulation-wrap>li::after{content:"";position:absolute;inset:-6px;border-radius:23px;padding:6px;pointer-events:none;z-index:-1;background:repeating-linear-gradient(135deg,#d5dce1 0 7px,#eef2f3 7px 14px,#bbc8ce 14px 16px);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;clip-path:inset(0 100% 0 0);opacity:0}
.insulation-wrap>li.is-reached::after{animation:wrap-insulation 1.1s ease-out forwards}
@keyframes wrap-insulation{0%{clip-path:inset(0 100% 0 0);opacity:0}20%{opacity:1}100%{clip-path:inset(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.insulation-wrap>li::after{animation:none!important;clip-path:none;opacity:1}}

/* Fit long headings without inserting automatic hyphens. */
.phero__grid h1,.phero h1{hyphens:none!important;overflow-wrap:normal!important;word-break:normal!important;max-width:100%!important}
.insulation-wrap>li::after{background:repeating-linear-gradient(135deg,var(--c,#d7263d) 0 8px,color-mix(in srgb,var(--c,#d7263d) 48%,white) 8px 15px,color-mix(in srgb,var(--c,#d7263d) 75%,white) 15px 18px)}
/* Compact introductory spacing on reference and editorial pages. */
.compact-references main>.phero{padding-bottom:clamp(28px,4vw,48px)}
.compact-references main>.phero + .section{padding-top:clamp(28px,4vw,48px);padding-bottom:24px}
.compact-references .reference-filters{padding-top:0;padding-bottom:12px}
.compact-references .reference-filter-section{padding-top:48px;padding-bottom:48px}
.compact-blog main .ref-grid{align-items:start}
.compact-blog main article.prose p,.compact-blog main .prose article p{margin:0 0 1em}
.compact-blog main .prose article figure{margin-bottom:24px}
/* A restrained service-colour accent, matching the quality note. */
.insulation-wrap>li::after{content:none!important;animation:none!important}
.insulation-wrap>li{border-left:3px solid transparent;background:#f1f4f9;transition:border-color .65s ease,background-color .65s ease}
.insulation-wrap>li.is-reached{border-left-color:var(--c,#d7263d)}
/* Reference photos fill a consistent frame on all devices. */
.ref-card[id^='reference-'] .reference-figure>.ref-card__img img{object-fit:cover;object-position:center}
@media(prefers-reduced-motion:reduce){.insulation-wrap>li{transition:none}}
/* Logos remain complete and readable within the same reference image frame. */
.ref-card[id^='reference-'] .reference-figure>.reference-image--logo{background:#fff}
.ref-card[id^='reference-'] .reference-figure>.reference-image--logo img{object-fit:contain;object-position:center;padding:20px;box-sizing:border-box}
