/* Bound the opening composition to the available screen, without clipping content. */
:root{--page-width:1240px;--page-gutter:clamp(20px,4vw,48px)}
header,.hero,.projects,.approach,.about,.comparison,footer{width:100%;max-width:var(--page-width);padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
header{height:80px}
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:40px;padding-top:40px;padding-bottom:40px;min-height:0}
.hero-copy{min-width:0}
.hero h1{font-size:clamp(46px,4.7vw,68px);letter-spacing:-3px;margin:22px 0;line-height:1.12}
.hero p{font-size:14px;line-height:1.8;max-width:350px}
.hero .button{margin-top:25px;padding:14px 20px}
.hero-note{margin-top:26px;line-height:1.8;flex-wrap:wrap}
.atlas{width:100%;height:clamp(340px,calc(100svh - 230px),480px);aspect-ratio:auto;margin:0}
.pins{fill:currentColor}
.intro-strip{width:100%;max-width:var(--page-width);margin-inline:auto;padding:20px var(--page-gutter);min-height:60px;flex-wrap:wrap}
.intro-strip p{line-height:1.8}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.project,.about-body>div,.comparison-grid>a{min-width:0}
@media(min-width:901px) and (max-height:740px){header{height:68px}.hero{padding-top:24px;padding-bottom:24px;gap:32px}.hero h1{font-size:clamp(42px,4.3vw,58px);margin:16px 0}.hero .eyebrow{font-size:9px;letter-spacing:1.5px}.hero .button{margin-top:18px}.hero-note{margin-top:18px}.atlas{height:clamp(300px,calc(100svh - 190px),430px)}}
@media(max-width:900px){.hero{gap:26px}.hero h1{font-size:clamp(40px,5.5vw,54px);letter-spacing:-2px}.atlas{height:380px}.hero .eyebrow{font-size:8px;letter-spacing:1.3px}.hero-note{font-size:8px}.intro-strip>span:last-child{display:none}}
@media(max-width:650px){header{height:72px}.hero{grid-template-columns:minmax(0,1fr);padding-top:32px;padding-bottom:30px;gap:28px}.hero h1{font-size:clamp(43px,11vw,58px);letter-spacing:-2px}.hero p{max-width:420px}.atlas{height:auto;aspect-ratio:1.22;max-height:390px;min-height:270px}.intro-strip{align-items:start;flex-direction:column;gap:12px}.intro-strip b{margin-inline:6px}.project-grid{grid-template-columns:minmax(0,1fr)}.hero-note{margin-top:22px}.map-caption{display:block;bottom:68px}.map-caption span{display:block;margin-top:6px}.map-top{left:18px;right:18px;font-size:7px}.layer-tabs{left:18px}.projects,.approach,.about{padding-top:50px;padding-bottom:50px}}
