/* A freestanding 3D object, presented directly in the page. */
.window-evolution{--evolution-top:108px;--evolution-frame:#ae7d46;--evolution-ratio:.881;--evolution-angle:0deg;margin:34px 3%;position:relative;min-width:0;scroll-margin-top:110px}
.window-evolution.is-scroll{height:330svh}
.evolution-stage{position:relative;height:calc(100svh - var(--evolution-top) - 16px);min-height:400px;max-height:950px;isolation:isolate}
.window-evolution.is-scroll .evolution-stage{position:sticky;top:var(--evolution-top)}
.evolution-copy{position:absolute;left:3%;top:17%;width:32%;z-index:2}
.evolution-kicker{color:#966519;font-size:10px;font-weight:700;letter-spacing:1.6px;line-height:1.7;margin:0 0 22px}
.evolution-copy h2{font-size:clamp(40px,4.9vw,76px);letter-spacing:-3px;line-height:1.02;margin:0 0 22px;color:#343434}
.evolution-copy h2 em{color:#a47424}
.evolution-description{color:#66615a;font-size:15px;line-height:1.7;max-width:300px;margin:0 0 24px}
.evolution-instruction{max-width:250px;font-size:12px;line-height:1.6;color:#777068;margin:0}
.evolution-visual{position:absolute;left:34%;right:0;top:0;bottom:82px;isolation:isolate;min-width:0}
.evolution-visual:before{content:'';position:absolute;inset:6% 2% 8%;border-radius:50%;background:radial-gradient(ellipse,#f7d58b70, #f4e4c830 49%,transparent 73%);z-index:-1;pointer-events:none}
.evolution-visual:after{content:'';position:absolute;bottom:5%;left:25%;right:18%;height:4%;border-radius:50%;background:#55493428;filter:blur(13px);z-index:-1;pointer-events:none}
.evolution-object,.evolution-object.webgl-ready{position:absolute;inset:0;min-width:0;width:100%;height:100%;background:transparent;border:0;box-shadow:none;cursor:grab;touch-action:pan-y}
.evolution-object.is-dragging{cursor:grabbing}.evolution-object:focus-visible{outline:2px solid #b58228;outline-offset:-3px;border-radius:30px}
.evolution-gesture{position:absolute;left:50%;bottom:0;transform:translateX(-50%);white-space:nowrap;color:#827867;font-size:10px;letter-spacing:.4px;pointer-events:none}
.evolution-controls{position:absolute;bottom:8px;left:3%;right:3%;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:2}
.evolution-materials{display:flex;flex-wrap:wrap;gap:10px}
.evolution-materials button,.evolution-toggle{min-height:44px;border:1px solid #ded8ce;border-radius:30px;padding:12px 20px;background:#fff9f0;color:#343434;font:inherit;font-size:12px;cursor:pointer;line-height:1.4}
.evolution-materials button{display:flex;align-items:center;gap:9px}.evolution-materials button i{width:11px;height:11px;border-radius:50%;background:#ad7c44;border:1px solid #34343420;flex-shrink:0}
.evolution-materials button:nth-child(2) i{background:#fff}.evolution-materials button:nth-child(3) i{background:#343434}
.evolution-materials button[aria-pressed=true]{border-color:#efb13e;background:#efb13e;color:#343434}
.evolution-toggle{background:#343434;color:#fff9f0;border-color:#343434}.evolution-toggle:hover{background:#514a3e}
.evolution-materials button:focus-visible,.evolution-toggle:focus-visible{outline:3px solid #b58228;outline-offset:4px}
/* CSS geometry remains usable when a 3D context is unavailable. */
.evolution-fallback{position:absolute;left:50%;top:48%;width:min(57%,370px);aspect-ratio:var(--evolution-ratio);border:9px solid var(--evolution-frame);background:transparent;box-shadow:3px 3px 0 #8d867b,inset 0 0 0 2px #777;transform:translate(-50%,-50%) perspective(1000px) rotateY(var(--evolution-fallback-yaw,-22deg));transform-style:preserve-3d}
.evolution-fallback:after{content:'';position:absolute;left:-7%;right:-7%;bottom:-16px;height:9px;background:var(--evolution-frame);box-shadow:0 4px 0 #80786c}
.evolution-sash{position:absolute;top:0;bottom:0;width:50%;border:6px solid var(--evolution-frame);background:linear-gradient(120deg,#b7d7de60,#ffffff90 42%,#b7d7de40 43%);transform-style:preserve-3d;backface-visibility:visible}
.evolution-sash:first-child{left:0;transform-origin:left;transform:rotateY(calc(-1 * var(--evolution-angle)))}
.evolution-sash:last-child{right:0;transform-origin:right;transform:rotateY(var(--evolution-angle))}
.evolution-sash i{position:absolute;top:49%;width:4px;height:25px;border-radius:3px;background:linear-gradient(90deg,#ddd,#8f918b)}
.evolution-sash:first-child i{right:3px}.evolution-sash:last-child i{left:3px}
.window-evolution[data-material=wood] .evolution-sash:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,var(--evolution-frame) 48% 52%,transparent 52%),linear-gradient(transparent 31%,var(--evolution-frame) 31% 34%,transparent 34% 65%,var(--evolution-frame) 65% 68%,transparent 68%)}
@media(max-width:850px){
 .window-evolution{--evolution-top:104px;margin:25px 3%}.window-evolution.is-scroll{height:290svh}
 .evolution-stage{min-height:0}.evolution-copy{left:4%;right:4%;top:14px;width:auto}
 .evolution-kicker{font-size:9px;letter-spacing:1.2px;margin-bottom:11px}.evolution-copy h2{font-size:clamp(30px,6.5vw,48px);letter-spacing:-1.4px;line-height:1.08;margin:0 0 10px}
 .evolution-copy h2 br{display:none}.evolution-description{font-size:13px;line-height:1.5;max-width:none;margin-bottom:8px}.evolution-instruction{max-width:none;font-size:11px;line-height:1.5}
 .evolution-visual{left:0;right:0;top:155px;bottom:122px}.evolution-visual:after{bottom:7%}.evolution-gesture{font-size:9px}
 .evolution-controls{left:4%;right:4%;bottom:8px;align-items:start;flex-direction:column;gap:10px}
 .evolution-materials{gap:8px}.evolution-materials button{font-size:11px;padding:10px 15px}.evolution-toggle{font-size:11px;padding:10px 17px}
 .evolution-fallback{width:min(56%,260px)}
}
@media(max-height:600px){
 .window-evolution{--evolution-top:12px}.evolution-stage{height:calc(100svh - 24px);min-height:0}
 .evolution-copy{left:3%;top:12%;width:32%;right:auto}.evolution-kicker{font-size:8px;margin-bottom:10px}.evolution-copy h2{font-size:clamp(24px,3.3vw,38px);letter-spacing:-1px;margin-bottom:10px}
 .evolution-description{font-size:11px;line-height:1.5;margin-bottom:8px}.evolution-instruction{font-size:10px}
 .evolution-visual{left:34%;top:0;bottom:64px}.evolution-controls{left:3%;right:3%;flex-direction:row;align-items:center;bottom:2px;gap:10px}
 .evolution-materials{gap:6px}.evolution-materials button,.evolution-toggle{padding:9px 13px;font-size:10px}.evolution-gesture{font-size:8px}.evolution-fallback{width:min(48%,230px)}
}
@media(max-width:500px) and (max-height:600px){
 .evolution-copy{width:auto;right:4%;left:4%;top:9px}.evolution-copy h2{font-size:25px}.evolution-kicker{margin-bottom:6px}.evolution-description{margin:0}.evolution-instruction{display:none}
 .evolution-visual{left:0;right:0;top:112px;bottom:100px}.evolution-controls{flex-direction:column;align-items:start;gap:6px}.evolution-gesture{display:none}
}
@media(prefers-reduced-motion:reduce){.window-evolution.is-scroll{height:auto}.window-evolution.is-scroll .evolution-stage{position:relative;top:0}}
