/* Stage 1: shared homepage background, geometry and typography retained. */
body { --home-scene-bg: #394A54; }
body > .top, .home-panels, #inspiration, #inspiration .style-filters { background: var(--home-scene-bg); }
#inspiration .inspiration-bg { background-image: none; background-color: var(--home-scene-bg); filter: none; }
#inspiration .style-filters { backdrop-filter: none; }
@media(max-width:800px){ body > .top nav.open { background:var(--home-scene-bg); color:#f5f3ee; } }

/* All inspiration surfaces use one opaque color, including the closing mask. */
#inspiration, #inspiration .style-filters, #inspiration .inspiration-end, #inspiration .inspiration-bg { background: #394A54 !important; }
#inspiration .inspiration-bg { opacity:1; background-image:none !important; }
#inspiration .style-filters { backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none; }

/* Keep the sticky filter and the whole section on one opaque colour plane. */
#inspiration::after { display:none; }
#inspiration .style-filters { margin-left:0; margin-right:0; padding-left:0; padding-right:0; }

/* Stage 2: independent flat arch foreground over the retained photographs. */
#home .home-arch-mask { position:absolute; inset:0; z-index:2; pointer-events:none; background:linear-gradient(to right,var(--home-scene-bg) 4%,transparent 4%,transparent 96%,var(--home-scene-bg) 96%); }
#home .home-arch-mask::before { content:''; position:absolute; top:0; left:0; right:0; height:24px; background:var(--home-scene-bg); }
#home .home-arch-mask svg { position:absolute; top:24px; left:0; display:block; width:100%; height:auto; aspect-ratio:2; fill:var(--home-scene-bg); }

/* Homepage: seamless header and arch field. */
body > .top { border-bottom:0; }

/* Gallery categories sit below the curved arch head. */
#home-gallery .home-panel-links { top:calc(50% + 44px); }

/* Characters are independent cutouts; all existing text stays in front. */
#home .home-panel-title, #home .home-panel-links { z-index:6; }
.home-characters { position:absolute; inset:0; z-index:4; pointer-events:none; overflow:hidden; }
.home-character { position:absolute; bottom:10px; width:300px; aspect-ratio:2/3; will-change:transform,opacity; }
#home .home-character img, #home .home-character svg { display:block; width:100%; height:100%; object-fit:contain; }
.master-working-arm { transform-origin:475px 455px; animation:trowel-work 4s ease-in-out infinite; }
.character-master { bottom:24px; }
@keyframes trowel-work { 0%,100%{transform:translateX(0) rotate(0deg)} 48%,58%{transform:translateX(3px) rotate(-.65deg)} }
@media(prefers-reduced-motion:reduce){ .master-working-arm { animation:none; } }

/* Foreground feet extend onto a reserved solid-colour field. */
#home { padding-bottom:100px; overflow:hidden; }
#home .home-characters { bottom:0; overflow:hidden; }
#home .character-youth { bottom:42px !important; }
#home .character-master { bottom:124px; }
#home .character-consultant { margin-bottom:0; }

#home .character-consultant img { transition:transform 1.8s cubic-bezier(.22,.61,.36,1), opacity 1.8s ease; will-change:transform,opacity; }

.home-front-text{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:hidden}.home-front-text .front-copy{position:absolute;text-transform:uppercase;color:white;text-decoration:none}.home-front-text .home-panel-links{display:flex;flex-direction:column;text-transform:none}.front-original{color:transparent!important}.front-original>a{color:transparent!important}

/* Colors: independent sculpture in the depth of the room, beneath the arch. */
.home-colors-scene{--statue-color:0;isolation:isolate}
.home-colors-scene>.colors-statue{position:absolute;z-index:1;right:4%;bottom:26.5%;height:43%;width:auto;aspect-ratio:2/3;pointer-events:none;filter:none}
#home .colors-statue>img{width:100%;height:100%;object-fit:contain}
.colors-statue-pigment{position:absolute;inset:0;background:linear-gradient(155deg,#bc693c 15%,#935673 48%,#306b65 82%);mask:url('/assets/characters/colors-statue-v3.webp') center/contain no-repeat;-webkit-mask:url('/assets/characters/colors-statue-v3.webp') center/contain no-repeat;mix-blend-mode:multiply;opacity:var(--statue-color)}

#home .colors-statue>img{filter:brightness(.83) sepia(.18) saturate(.65)}
@media(min-width:801px){.home-colors-scene>.colors-statue{right:.5%;}}

.colors-statue-light{position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,#ebc99b12 15%,#573b3548 90%);mask:url(/assets/characters/colors-statue-v3.webp) center/contain no-repeat;-webkit-mask:url(/assets/characters/colors-statue-v3.webp) center/contain no-repeat;mix-blend-mode:multiply}
.colors-statue::before{content:"";position:absolute;left:49%;top:97.6%;width:45%;height:1.8%;border-radius:50%;background:#1d140fe6;filter:blur(1px);z-index:-1}
.colors-statue::after{content:"";position:absolute;left:55%;top:97.4%;width:62%;height:4%;border-radius:50%;transform:rotate(8deg);transform-origin:left center;background:linear-gradient(90deg,#24170d66,transparent);filter:blur(3px);z-index:-2}

/* Retain the floor under the master at every panel aspect ratio. */
#home-materials > img { object-position:center bottom; }
