/* Real source RGB and a quiet attribution keep the hero focused on the city. */
.pointcloud-figure { align-self:center; width:100%; min-width:0; }
.pointcloud-view { position:relative; width:100%; aspect-ratio:1000/820; isolation:isolate; overflow:hidden; }
.pointcloud-view canvas,.pointcloud-view>img { position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:contain; }
.pointcloud-view canvas[hidden],.pointcloud-view>img[hidden] { display:none; }
.pointcloud-view canvas { touch-action:pan-y; cursor:grab; }
.pointcloud-view canvas:active { cursor:grabbing; }
.pointcloud-view canvas:focus-visible { outline-offset:-4px; }
.cloud-mark-label { position:absolute; z-index:2; transform:translate(-50%,-155%); background:#132720e8; color:var(--lime); border:1px solid #9fc56899; padding:4px 7px; font:400 .75rem/1.2 var(--mono); white-space:nowrap; pointer-events:none; }
.cloud-mark-label[hidden] { display:none; }
.pointcloud-figure .cloud-attribution { display:flex; flex-direction:column; gap:5px; padding:12px; font:400 .8125rem/1.6 var(--sans); letter-spacing:0; text-transform:none; color:var(--muted); }
.pointcloud-figure .cloud-attribution>span { display:block; }
.cloud-attribution a { color:inherit; text-decoration:underline; text-decoration-color:#687e70; text-underline-offset:3px; }
.cloud-attribution a:hover { color:var(--lime); text-decoration-color:currentColor; }
.project-cloud { isolation:isolate; }
.project-cloud canvas,.project-cloud img { position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:contain; }
.project-cloud canvas[hidden],.project-cloud img[hidden] { display:none; }
.project-cloud canvas { touch-action:pan-y; cursor:grab; }
.project-cloud canvas:active { cursor:grabbing; }
.project-cloud canvas:focus-visible { outline-offset:-4px; }
.project:hover .project-cloud img { transform:none; }
@media(min-width:1101px) { .hero-grid { grid-template-columns:1fr 1.16fr; gap:20px; padding-block:50px 44px; } .hero h1 { font-size:clamp(3.1rem,4.8vw,4.5rem); } }
@media(max-width:850px) and (min-width:681px) { .hero-grid { grid-template-columns:1fr; gap:45px; } .hero-content { max-width:610px; } .hero h1 br { display:none; } .pointcloud-figure { width:min(650px,100%); justify-self:center; } }
@media(max-width:680px) { .pointcloud-figure { margin-top:36px; } .pointcloud-figure .cloud-attribution { padding:12px 0; } }
@media print { .pointcloud-figure { display:block; width:70%; } .pointcloud-view canvas,.cloud-mark-label { display:none; } .pointcloud-view>img[hidden] { display:block; } }