/* Human Systems, chapter 05: daylight, textile and measured possibility. */
.systems-hero.hero{grid-template-columns:.95fr 1.15fr;gap:6%;padding-block:70px;min-height:700px}
.systems-hero.hero h1{font-size:clamp(54px,6vw,85px);line-height:1.05;letter-spacing:-.06em}
.systems-hero.hero h1 em{color:#b9dce8}
.systems-hero.hero .hero-logo{height:560px;object-position:70% center;border-radius:8px}
.systems-hero .hero-description{font-size:17px;line-height:1.8}
.systems-hero .button.primary{background:#c7e0e7;border-color:#c7e0e7;color:#14292d}
.systems-hero .button.primary:hover{background:#e6f3f4}
.systems-hero .frontier-image-label{background:#142e34e8;border-color:#b0d2da70}
.systems-hero .text-link{font-size:13px}
.systems-gateway{background:#dbe7e9;color:#192f35;padding:78px 0;border-block:1px solid #587778}
.systems-gateway-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:7%;align-items:center}
.systems-layer-art{position:relative;margin:0;min-width:0}
.systems-layer-art img{display:block;width:100%;height:auto;aspect-ratio:1.05;object-fit:cover;object-position:61% center;border-radius:8px}
.systems-layer-art figcaption{position:absolute;bottom:19px;left:19px;padding:8px 11px;background:#eff5f3ed;border:1px solid #c0d1d5;border-radius:3px;font:9px/1.5 'Courier New',monospace;letter-spacing:1px;color:#314f54}
.systems-gateway-copy .eyebrow{font-size:10px;color:#506b71;letter-spacing:1.5px;margin:0 0 25px}
.systems-gateway-copy .eyebrow::before{content:'';display:inline-block;width:10px;height:1px;background:currentColor;vertical-align:middle;margin-right:9px}
.systems-gateway-copy h2{font-size:clamp(35px,4vw,58px);line-height:1.1;letter-spacing:-.05em;font-weight:400;margin:0 0 24px;text-wrap:balance}
.systems-gateway-copy>p:not(.eyebrow):not(.systems-concept-note){font-size:16px;line-height:1.8;max-width:460px;color:#435d62;margin:0 0 25px}
.systems-studio-steps{display:flex;border-block:1px solid #a6bbc0;padding:17px 0;gap:28px;margin:27px 0;font-size:12px}
.systems-studio-steps>span{display:flex;gap:9px;align-items:center}
.systems-studio-steps b{font:9px 'Courier New',monospace;color:#607d83;font-weight:400}
.systems-gateway .button.primary{background:#19373f;border-color:#19373f;color:#eef6f5}
.systems-gateway .button.primary:hover{background:#2b505a}
.systems-secondary{display:block;margin-top:20px;font-size:12px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#a4b9bd}
.systems-gateway-copy .systems-concept-note{margin:25px 0 0;color:#586e73;font-size:11px;line-height:1.7;max-width:430px}
.systems-gateway a:focus-visible{outline:3px solid #456a74;outline-offset:5px}
@media(max-width:1050px){.systems-hero.hero{grid-template-columns:1fr 1fr;gap:5%}.systems-hero.hero h1{font-size:clamp(46px,6vw,70px)}.systems-hero.hero .hero-logo{height:510px}.systems-studio-steps{gap:18px}}
@media(max-width:700px){.systems-hero.hero{grid-template-columns:1fr;padding-block:45px 10px;min-height:0;gap:0}.systems-hero.hero h1{font-size:clamp(52px,12vw,80px)}.systems-hero.hero .hero-logo{height:auto;aspect-ratio:1.12;object-position:72% center}.systems-hero .hero-description{font-size:16px}.systems-gateway{padding:45px 0}.systems-gateway-grid{grid-template-columns:1fr;gap:35px}.systems-layer-art img{aspect-ratio:1.5;object-position:center}.systems-gateway-copy h2{font-size:clamp(35px,9vw,53px)}.systems-studio-steps{justify-content:space-between;gap:12px}.systems-gateway-copy .eyebrow::before{width:8px}.systems-layer-art figcaption{font-size:8px;left:12px;bottom:12px}}