/* Image atmospheres sit behind content and never change the document geometry. */
main>section{position:relative;isolation:isolate}
.section-atmosphere{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none;border-radius:inherit;background:var(--paper)}
.section-atmosphere img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--atmosphere-position,50% 50%);opacity:.42;mix-blend-mode:normal;animation:section-image-drift var(--atmosphere-duration,26s) ease-in-out infinite alternate;animation-play-state:paused;transform:scale(1.06)}
.section-atmosphere:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--paper) 0%,transparent 48%,var(--paper) 100%);opacity:.7}
[data-theme=dark] .section-atmosphere img{opacity:.35;mix-blend-mode:normal}
.section-background-visible>.section-atmosphere img{animation-play-state:running}
.backgrounds-paused .section-atmosphere img,.backgrounds-hidden .section-atmosphere img,body:has(dialog[open]) .section-atmosphere img{animation-play-state:paused}
.background-motion-toggle{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border:1px solid var(--line);background:var(--raised);color:var(--ink);border-radius:50%;cursor:pointer;padding:0}
.background-motion-toggle svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bg-play-icon{display:none}.background-motion-toggle[aria-pressed=true] .bg-play-icon{display:block}.background-motion-toggle[aria-pressed=true] .bg-pause-icon{display:none}
.background-motion-toggle:focus-visible{outline:2px solid var(--rust);outline-offset:4px}
.background-motion-toggle:hover{border-color:var(--rust)}
@keyframes section-image-drift{from{transform:scale(1.06) translate3d(-1%,0,0)}to{transform:scale(1.12) translate3d(1%,-1%,0)}}
@media(max-width:600px){.nav{column-gap:10px}.background-motion-toggle{width:36px;flex-basis:36px;height:44px;border-radius:18px}.section-atmosphere img{opacity:.3}[data-theme=dark] .section-atmosphere img{opacity:.28}}
@media(prefers-reduced-motion:reduce){.section-atmosphere img{animation:none!important}}

/* Natural color and daylight, with a calm surface behind the copy. */
.section-atmosphere img{max-height:900px;object-position:var(--atmosphere-position,50% 50%);mask-image:linear-gradient(#000 0%,#000 70%,transparent 100%)}
.section-atmosphere:after{background:linear-gradient(90deg,var(--paper) 0%,var(--paper) 12%,transparent 100%);opacity:.82}
.hero .section-atmosphere img{opacity:.23}
@media(max-width:600px){.section-atmosphere img{max-height:680px}.section-atmosphere:after{opacity:.72}.hero-image-caption{font-size:7px;letter-spacing:.5px}}
/* Section-specific systems and environments; keep captions within small screens. */
.hero-image-label{right:20px}.hero-image-label>span:last-child{min-width:0}.hero-image-label small{line-height:1.6}
@media(max-width:600px){.hero-image-label{right:16px;font-size:14px}.hero-image-label small{font-size:7px;letter-spacing:.35px}}
