
/* Hero variant 2: synchronized photo, typography and foreground layers. */
.hero-layered { isolation:isolate; background:var(--forest-900); min-height:900px; min-height:max(800px,100svh); --hero-position:center center; }
.hero-layered::after { display:none; }
.hero-background,.hero-shade,.hero-foreground { position:absolute; inset:0; pointer-events:none; }
.hero-background,.hero-foreground { background-size:cover; background-position:var(--hero-position); background-repeat:no-repeat; }
.hero-background { z-index:0; background-image:url("/hero-full.webp"); }
.hero-shade { z-index:1; background:linear-gradient(90deg,rgba(10,15,8,.54),rgba(10,15,8,.27) 50%,rgba(10,15,8,.06) 78%),linear-gradient(180deg,rgba(10,15,8,.5),transparent 25%,transparent 65%,rgba(10,15,8,.5)); }
.hero-foreground { z-index:3; background-image:url("/hero-staebchen.webp"); clip-path:polygon(40% 14%,60% 14%,82% 40%,82% 55%,73% 55%,40% 32%); }
.hero-layered .nav { z-index:5; }
.hero-layered .hero-content { z-index:auto; flex:1; justify-content:flex-start; padding-block:50px 64px; }
.hero-layered .hero-content > * { position:relative; animation:none; }
.hero-layered .hero-content .eyebrow { z-index:4; margin-bottom:24px; font-size:12px; }
.hero-layered h1 { z-index:2; font-size:clamp(62px,6.8vw,108px); line-height:1.12; letter-spacing:-.035em; text-wrap:initial; max-width:none; }
.hero-title-line { display:block; width:max-content; max-width:100%; }
.hero-layered .hero-copy-group { z-index:4; display:block; max-width:430px; margin-top:28px; }
.hero-layered .hero-copy-group p { font-size:16px; line-height:1.65; color:var(--cream-100); }
.hero-layered .hero-actions { z-index:4; gap:16px; margin-top:28px; align-items:center; flex-direction:row; flex-wrap:wrap; }
.hero-layered .hero-actions .button { min-height:54px; padding-inline:24px; font-size:12px; letter-spacing:.09em; }
.hero-secondary { border-color:rgba(251,246,234,.7); background:rgba(20,29,13,.16); color:var(--cream-100); }
.hero-secondary:hover { background:var(--cream-100); color:var(--forest-900); }
.hero-layered .hero-foot { z-index:4; }
@media(min-width:1600px) { .hero-layered .hero-content { padding-top:70px; } }
@media(min-width:641px) and (max-width:980px) {
 .hero-layered { min-height:850px; --hero-position:54% center; }
 .hero-layered h1 { font-size:clamp(58px,8.8vw,80px); }
 .hero-layered .hero-content { padding-top:70px; }
}
@media(max-width:640px) {
 .hero-layered { min-height:850px; min-height:max(850px,100svh); --hero-position:58% top; }
 .hero-layered .hero-background,.hero-layered .hero-foreground { bottom:auto; height:480px; background-size:auto 480px; }
 .hero-layered .hero-shade { background:linear-gradient(180deg,rgba(10,15,8,.5),rgba(10,15,8,.12) 150px,rgba(20,29,13,.25) 285px,var(--forest-900) 480px); }
 .hero-layered .hero-content { padding-top:205px; padding-bottom:40px; justify-content:flex-start; }
 .hero-layered .hero-content .eyebrow { margin-bottom:18px; font-size:11px; }
 .hero-layered h1 { font-size:clamp(36px,10.3vw,62px); line-height:1.14; }
 .hero-layered .hero-copy-group { margin-top:24px; max-width:360px; }
 .hero-layered .hero-copy-group p { font-size:16px; }
 .hero-layered .hero-actions { display:grid; grid-template-columns:1fr; width:100%; max-width:360px; gap:12px; margin-top:24px; }
 .hero-layered .hero-foot { min-height:66px; font-size:10px; }
}
/* Mobile refinement: no foreground-mask seam, no page-wide image overflow. */
.hero-layered .hero-content { padding-top:94px; }
@media(min-width:1600px) { .hero-layered .hero-content { padding-top:114px; } }
@media(min-width:641px) and (max-width:980px) { .hero-layered .hero-content { padding-top:114px; } }
@media(max-width:640px) {
 html,body { overflow-x:clip; }
 main { overflow-x:clip; }
 .motion-reveal.motion-image:not(.is-visible) { transform:translate3d(0,18px,0); }
 .hero-layered .hero-foreground { display:none; }
 .hero-layered .nav { border-bottom:0; }
 .hero-layered .hero-shade { background:linear-gradient(180deg,rgba(10,15,8,.36),transparent 95px,transparent 185px,rgba(20,29,13,.25) 285px,var(--forest-900) 480px); }
 .hero-layered .hero-content { padding-top:235px; padding-bottom:40px; }
 .gallery-item,.gallery-item.portrait { width:calc(100vw - 64px); }
 .gallery-image { height:auto; aspect-ratio:4 / 3; }
 .gallery-item.portrait img { object-position:center 30%; }
 .gallery-caption { gap:12px; }
 .gallery-caption > :last-child { min-width:0; }
}
