.portfolio>.automation-hero{background:#e1e6e9;color:#061c3e;min-height:580px;isolation:isolate}.automation-hero:before{display:none}
.automation-stage{position:absolute;left:50%;top:50%;width:min(100vw,177.68svh);aspect-ratio:1672/941;transform:translate(-50%,-50%);container-type:inline-size}
.automation-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.automation-copy{position:absolute;z-index:2;left:4%;top:14.2%;width:36%}
.automation-eyebrow{display:flex;align-items:center;gap:1.4cqw;font-size:.86cqw;letter-spacing:.22cqw;line-height:1.5;margin:0 0 2.2cqw;white-space:nowrap}.automation-eyebrow span{display:block;width:4cqw;height:1px;background:#102c4d}
.automation-copy h1{font:750 5.2cqw/.97 Arial,Helvetica,sans-serif;letter-spacing:-.2cqw;margin:0 0 2cqw;color:#041b3e}
.automation-description{font-size:1.45cqw;line-height:1.35;max-width:31cqw;margin:0 0 2.2cqw;color:#142b4c}
.automation-cta{display:inline-flex;align-items:center;justify-content:center;gap:1cqw;padding:1.2cqw 2.4cqw;min-height:46px;font-size:1.25cqw;line-height:1.3;border-radius:100px;background:#0e2347;color:#fff;transition:background .2s,transform .2s}.automation-cta:hover{background:#234779;transform:translateY(-2px)}.automation-cta span{font-size:1.2em}
#aqua>.city-loader{position:absolute}
@media(max-aspect-ratio:6/5){
 .portfolio>.automation-hero{min-height:760px;background:#e1e6e9}
 .automation-stage{width:100%;height:100%;aspect-ratio:auto;left:0;top:0;transform:none;overflow:hidden}
 .automation-art{inset:auto;top:360px;left:-64%;width:164%;height:auto;mask-image:linear-gradient(transparent,#000 14%,#000 90%,transparent)}
 .automation-copy{left:6%;right:6%;top:34px;width:auto}
 .automation-eyebrow{font-size:10px;letter-spacing:2px;gap:16px;margin-bottom:24px}.automation-eyebrow span{width:35px}
 .automation-copy h1{font-size:clamp(38px,9.6vw,64px);line-height:1;letter-spacing:-1.7px;margin-bottom:18px}
 .automation-description{font-size:14px;line-height:1.5;max-width:360px;margin-bottom:24px}
 .automation-cta{font-size:14px;gap:14px;padding:15px 24px;min-height:48px}
}
@media(max-aspect-ratio:6/5) and (min-width:600px){.portfolio>.automation-hero{min-height:1000px}.automation-art{top:350px;left:-50%;width:150%}.automation-copy h1{font-size:60px}.automation-copy{top:45px}.automation-description{font-size:16px;max-width:460px}}
@media(max-height:600px) and (min-aspect-ratio:6/5){.portfolio>.automation-hero{min-height:100svh}.automation-cta{min-height:40px}.automation-copy{top:10%}}
@media(prefers-reduced-motion:reduce){.automation-cta{transition:none}.automation-cta:hover{transform:none}}
/* Gentle settling near a section edge; tall mobile sections remain freely scrollable. */
html{scroll-snap-type:y proximity}.portfolio>.page{scroll-snap-align:start;scroll-snap-stop:normal}
.section-transition-status{position:fixed;z-index:50;left:50%;bottom:24px;transform:translateX(-50%);max-width:calc(100% - 32px);padding:14px 22px;border-radius:24px;background:#10223bed;color:#fff;font-size:13px;box-shadow:0 4px 24px #0002;text-align:center}.section-transition-status[hidden]{display:none}
a[aria-busy="true"]{cursor:progress}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none}}

html.section-settle-enabled{scroll-snap-type:none}

/* One viewport-anchored control, shared by every story. */
.project-navigation{position:fixed;z-index:20;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));display:flex;gap:8px;--nav-bg:#f7faf5ed;--nav-fg:#203e3a;--nav-border:#ffffff90}
.project-navigation[data-theme="fitness"],.project-navigation[data-theme="contact"]{--nav-bg:#382835ed;--nav-fg:#ffe8c9;--nav-border:#ffe8c945}
.project-navigation a{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--nav-border);border-radius:50%;background:var(--nav-bg);color:var(--nav-fg);box-shadow:0 4px 18px #0002;backdrop-filter:blur(12px);transition:background .15s,opacity .15s}
.project-navigation svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.project-navigation a:hover{filter:brightness(1.1)}.project-navigation a:focus-visible{outline:3px solid var(--nav-fg);outline-offset:3px}
.project-navigation a[aria-disabled="true"]{opacity:.3;pointer-events:none}
.fitness-footer .exercise-status{margin-right:120px}
@media(max-width:700px){.project-navigation{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}.fitness-footer .exercise-status{position:absolute;left:0;bottom:56px;margin:0}}

/* Fill the viewport independently of the composition grid used by the copy. */
@media(min-aspect-ratio:6/5){
 .automation-art{inset:auto;left:50%;top:50%;width:100vw;height:max(100svh,580px);max-width:none;object-fit:cover;transform:translate(-50%,-50%)}
}
@media(max-height:600px) and (min-aspect-ratio:6/5){.automation-art{height:100svh}}

/* First-screen navigation keeps direct access to each part of the portfolio. */
.hero-navigation{position:absolute;z-index:5;top:24px;right:4%;display:flex;align-items:center;gap:28px;padding:14px 24px;border:1px solid #ffffff80;border-radius:40px;background:#edf2f5e8;color:#0e2347;backdrop-filter:blur(12px);font-size:14px;line-height:1.5}
.hero-navigation a{padding:4px 0;border-bottom:1px solid transparent}
.hero-navigation a:hover{border-bottom-color:currentColor}
@media(max-aspect-ratio:6/5){
 .hero-navigation{top:18px;left:6%;right:6%;justify-content:space-between;gap:12px;padding:10px 18px;font-size:14px}
 .automation-copy{top:104px}
 .automation-art{top:435px}
 .portfolio>.automation-hero{min-height:830px}
}
@media(max-aspect-ratio:6/5) and (min-width:600px){.portfolio>.automation-hero{min-height:1000px}.automation-art{top:430px}}
@media(max-height:600px) and (min-aspect-ratio:6/5){.hero-navigation{top:12px;padding:8px 20px}}
