/* Flat illustrations share the site's palette and do not add a separate backdrop. */
.page-home .home-hero { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:24px; min-height:520px; }
.page-home .home-hero h1 { font-size:clamp(40px,5vw,64px); }
.hero-art { min-width:0; }
.hero-art img { display:block; width:100%; height:auto; }
.service-tile.illustrated { position:relative; }
.service-art { position:absolute; top:24px; right:24px; width:112px; height:78px; pointer-events:none; }
.service-tile.illustrated > .row-number { display:block; min-height:72px; padding-top:20px; }
.home-journey { padding:24px 0; }
.home-journey .process-panel { padding:32px; }
.home-journey .client-journey { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.home-journey .process-panel h2 { font-size:32px; }
@media(prefers-reduced-motion:no-preference){
 .hero-art { animation:graphic-enter .65s ease-out both; }
 .service-art { transition:transform .3s ease; }
 .service-tile:is(:hover,:focus-within) .service-art { transform:translateY(-3px); }
}
@keyframes graphic-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:720px){
 .page-home .home-hero { grid-template-columns:1fr; min-height:0; gap:24px; }
 .page-home .home-hero h1 { font-size:clamp(38px,10.8vw,46px); }
 .hero-art { width:100%; max-width:480px; margin:0 auto; }
 .home-journey .client-journey { grid-template-columns:1fr; gap:0; }
 .home-journey .process-panel { padding:26px; }
 .home-journey .process-panel h2 { font-size:29px; }
}

/* Compact mobile composition: keep the introduction and first service close. */
@media(max-width:720px){
 .page-home .home-hero { padding:28px 0 24px; gap:8px; }
 .page-home .home-hero .eyebrow { margin-bottom:16px; }
 .page-home .home-hero h1 { font-size:clamp(34px,9.5vw,40px); line-height:1.08; margin-bottom:18px; }
 .page-home .home-hero .lead { font-size:15px; line-height:1.6; margin-bottom:0; }
 .page-home .home-hero .actions { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10px; margin-top:22px; }
 .page-home .home-hero .actions .button { padding:12px 10px; font-size:13px; text-align:center; }
 .page-home .home-hero .actions .text-link { justify-content:center; min-height:48px; font-size:12px; line-height:1.4; gap:6px; }
 .page-home .home-hero .hero-note { margin-top:12px; font-size:11px; align-items:flex-start; }
 .page-home .home-hero .hero-note:before { flex-shrink:0; margin-top:5px; }
 .hero-art { max-width:260px; }
 .service-tile.illustrated { padding:20px; gap:12px; }
 .service-art { top:14px; right:18px; width:88px; height:62px; }
 .service-tile.illustrated > .row-number { min-height:44px; padding-top:8px; }
 .service-tile.illustrated :is(h2,h3) { font-size:23px; line-height:1.2; }
 .service-tile.illustrated .text-link { margin-top:4px; min-height:44px; }
 .page-services .page-hero { padding:28px 0 24px; }
 .page-services .page-hero h1 { font-size:36px; margin-bottom:16px; }
 .page-services .page-hero .lead { font-size:15px; line-height:1.6; }
 .home-journey .process-panel { padding:22px; }
 .home-journey .process-panel h2 { font-size:27px; }
 .home-journey .client-journey { margin-top:20px; }
 .home-journey .client-journey li { padding:14px 0; gap:10px; }
}

/* Service illustrations form a quiet background beneath the copy. */
.service-tile.illustrated{isolation:isolate;overflow:hidden}
.service-tile.illustrated .service-art{z-index:-1;top:50%;right:-12px;width:240px;height:168px;opacity:.16;transform:translateY(-40%);object-fit:contain;transition:opacity .35s ease,transform .35s ease}
.service-tile.illustrated > .row-number{min-height:0;padding-top:0;margin-bottom:8px}
.service-tile.illustrated:is(:hover,:focus-within) .service-art{opacity:.22;transform:translateY(-44%)}
@media(max-width:720px){.service-tile.illustrated{padding:24px;gap:16px}.service-tile.illustrated .service-art{width:230px;height:161px;right:-15px;top:50%;opacity:.14}.service-tile.illustrated > .row-number{min-height:0;padding-top:0;margin-bottom:4px}.service-tile.illustrated :is(h2,h3){margin-top:0}.service-tile.illustrated .text-link{position:relative}}
@media(prefers-reduced-motion:reduce){.service-tile.illustrated .service-art{transition:none}}

@media(min-width:721px){
 .service-tile.illustrated .service-art{top:calc(50% - 36px)}
}