.topic-hero{min-height:clamp(380px,47vw,670px);display:flex;align-items:end;padding:clamp(25px,7vw,110px);color:#fff;background:linear-gradient(90deg,#142f28 0%,#18382dbf 42%,transparent 85%),var(--topic-image) right 12% center/auto 88% no-repeat,#a9beb3}.topic-hero h1,.topic-article h1{font-size:clamp(40px,7vw,102px);line-height:1.05;letter-spacing:-.045em;margin:0 0 15px}.topic-hero p{max-width:36ch;font-size:clamp(17px,1.6vw,24px);margin:0;line-height:1.55}.topic-bands{width:min(90%,1400px);margin:50px auto 85px}.topic-band{display:grid;grid-template-columns:1.1fr 1fr;background:#f2f4ef;margin-bottom:24px;align-items:center;border-radius:16px;overflow:hidden}.topic-band-1 .topic-visual{order:2}.topic-visual{display:grid;place-items:center;background:radial-gradient(#fafcf9,#d4e2da);overflow:hidden}.topic-visual img{display:block;width:78%;height:clamp(210px,29vw,380px);object-fit:contain;mix-blend-mode:multiply}.topic-band-1 img{transform:scale(1.27)}.topic-band-2 img{transform:scale(1.15);transform-origin:50% 75%}.topic-copy{padding:clamp(25px,5vw,65px)}.topic-copy h2{font-size:clamp(27px,3vw,49px);letter-spacing:-.035em;line-height:1.1;margin:0 0 16px}.topic-copy p,.topic-article p{line-height:1.7;color:#485b52}.topic-article{width:min(88%,900px);margin:55px auto 90px}.topic-article h1{font-size:clamp(40px,6vw,76px);margin-top:25px}.topic-article figure{margin:28px 0;background:#e8f0ea;border-radius:15px}.topic-article img{display:block;width:100%;height:min(420px,70vw);object-fit:contain;mix-blend-mode:multiply}.topic-article section{margin:32px 0}.topic-article section h2{margin-bottom:8px}@media(max-width:700px){.topic-hero{background-position:center,right top;background-size:cover,auto 70%;min-height:430px}.topic-band{grid-template-columns:1fr}.topic-band-1 .topic-visual{order:0}}

/* Grow with desktop screens, then stack at the mobile breakpoint. */
.topic-hero{align-items:center;min-height:clamp(430px,39vw,840px)}
.topic-hero>div{max-width:52%}
.topic-bands{width:min(90%,2280px);margin-block:clamp(32px,4vw,95px)}
.topic-band{margin-bottom:clamp(18px,1.6vw,42px)}
.topic-visual img{height:clamp(240px,28vw,610px)}
.topic-copy{padding:clamp(24px,4.5vw,110px)}
.topic-copy h2{font-size:clamp(30px,3vw,70px)}
.topic-copy p{font-size:clamp(16px,1.05vw,25px);max-width:48ch}
@media(max-width:700px){.topic-hero{align-items:end;min-height:450px}.topic-hero>div{max-width:100%}.topic-hero h1{font-size:clamp(36px,9vw,54px)}.topic-visual img{height:clamp(210px,60vw,325px)}}
