/* Mobile hero: a wall of real client sites up top (first six shown, best first), headline and buttons below. Desktop is unchanged. */
.site-wall,.photo-hero-actions{display:none}
.site-wall img:nth-child(n+7){display:none!important}
@media(max-width:767px){
 .flow-hero.photo-hero{padding-top:0}
 .photo-hero .studio-project{display:none!important}
 .photo-hero .flow-hero-grid{--tile-h:calc((100vw - 2 * var(--pad) - 20px) / 3 * 530 / 360);--wall-h:calc(16px + 2 * var(--tile-h) + 10px + 22px);
  position:relative;isolation:isolate;display:block;width:100vw;margin-left:calc(50% - 50vw);padding:calc(var(--wall-h) - 64px) var(--pad) 8px}
 .photo-hero .flow-hero-grid>.site-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-content:start;position:absolute;z-index:-1;top:0;left:0;right:0;height:var(--wall-h);padding:16px var(--pad) 0;overflow:hidden}
 .site-wall img{display:block;width:100%;height:auto;aspect-ratio:360/530;object-fit:cover;object-position:top;border-radius:10px;border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 24px rgba(0,0,0,.45)}
 .site-wall img:nth-child(3n+2){transform:translateY(22px)}
 .site-wall::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,14,18,0) 0,rgba(10,14,18,0) calc(100% - 150px),rgba(10,14,18,.9) calc(100% - 66px),rgba(10,14,18,.97) calc(100% - 30px),#0A0E12 100%)}
 .photo-hero .flow-hero-grid>div{position:relative}
 .photo-hero .studio-eyebrow{color:var(--soft);margin-bottom:14px}
 .photo-hero h1{font-size:clamp(1.6rem,7.9vw,2.25rem);line-height:1.12}
 .photo-hero .flow-intro{color:var(--text);margin-top:16px;font-size:1rem;line-height:1.6;padding-right:60px!important}
 .photo-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
 .photo-hero-actions .btn{width:100%;padding:13px 10px;font-size:.88rem}
 .photo-hero-actions .btn-o{background:transparent;color:var(--text);border-color:var(--edge-2)}
 .photo-hero .flow-routes{margin-top:36px}
}
/* Desktop: the same wall replaces the single laptop photo. */
@media(min-width:768px){
 .photo-hero .studio-project{display:none}
 .photo-hero .flow-hero-grid>.site-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-content:start;position:relative;max-height:430px;overflow:hidden;padding-top:4px}
 .site-wall img{display:block;width:100%;height:auto;aspect-ratio:360/530;object-fit:cover;object-position:top;border-radius:12px;border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px rgba(0,0,0,.5)}
 .site-wall img:nth-child(3n+2){transform:translateY(30px)}
 .site-wall::after{content:"";position:absolute;left:0;right:0;bottom:0;height:130px;pointer-events:none;background:linear-gradient(180deg,rgba(10,14,18,0),#0A0E12 90%)}
}