/* Feature chapters use the site's existing jade palette, type and glass. */
.feature-jump{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 32px}
.feature-jump a{display:inline-flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--line);border-radius:9999px;background:#18181880;color:#b1c4a6;font-size:14px;line-height:20px;transition:background .7s var(--ease),border-color .7s var(--ease)}
.feature-jump a span{font-size:12px;line-height:16px;color:#6d8663;font-variant-numeric:tabular-nums}
.feature-jump a:hover{background:#272727c0;border-color:#b5d99870}
.flagship{grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);min-height:640px;isolation:isolate}
.flagship .feature-copy{padding:40px;justify-content:center}
.flagship .feature-label{margin-bottom:24px;color:#a4be91;letter-spacing:.12em}
.flagship h3{font-size:48px;line-height:1;letter-spacing:-.045em;margin-bottom:24px}
.flagship h3>span{color:#a8c694}
.flagship .feature-copy>p{max-width:400px;font-size:16px;line-height:24px;color:#a6b19e}
.feature-facts{display:grid;gap:16px;width:100%;margin-top:24px}
.feature-facts>div{display:grid;gap:4px}
.feature-facts>div>span{color:#d2deca;font-size:14px;line-height:20px}
.feature-facts p{font-size:12px;line-height:16px;color:#8d9b84}
.demo-desk{width:100%;margin-top:32px;padding:16px;border:1px solid #d6edc71c;border-radius:16px;background:#00000028;box-shadow:inset 0 1px 0 #ffffff05}
.desk-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;line-height:16px;color:#bcccb1;margin-bottom:12px}
.desk-hint{color:#73886a;font-size:12px;white-space:nowrap}
.scene-segments{display:flex;padding:4px;gap:4px;width:100%;border:1px solid #e2efdc13;border-radius:12px;background:#00000030}
.scene-segments button{flex:1;min-width:0;min-height:44px;padding:8px 4px;font-size:12px;line-height:16px;white-space:nowrap;color:#8d9e83;background:transparent;border:1px solid transparent;border-radius:8px;transition:color .7s var(--ease),background .7s var(--ease),box-shadow .7s var(--ease),transform .7s var(--ease)}
.scene-segments button:hover{color:#d1e4bf;background:#ffffff08}
.scene-segments button:active{transform:scale(.97)}
.scene-segments button.selected{background:#b5d99819;color:#d4e8c2;border-color:#b5d99839;box-shadow:inset 0 1px 0 #d8f6c116,0 4px 12px #0002}
.scene-range{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;margin-top:16px;font-size:12px;line-height:16px;color:#9caf8f}
.scene-range output{font-size:14px;line-height:20px;color:#d0dfc1;font-variant-numeric:tabular-nums}
.scene-range input{grid-column:1/-1;width:100%;min-width:0;height:32px;margin:0;accent-color:#a7cd8c;cursor:ew-resize}
.scene-instruction{font-size:12px;line-height:16px;color:#778e6a;min-height:32px;margin-top:8px}
.hollow-stage,.render-stage{position:relative;min-height:640px;background:transparent;isolation:isolate}
#hollow-canvas,#studio-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;z-index:2;pointer-events:none;transition:opacity 1s var(--ease)}
#hollow-canvas[data-hollow-scene=ready],#studio-canvas[data-studio-scene=ready]{opacity:1}
.stage-heading{position:absolute;z-index:4;top:24px;left:24px;right:24px;display:flex;align-items:center;gap:8px;font-size:12px;line-height:16px;color:#a3b398;pointer-events:none}
.stage-dot{width:4px;height:4px;flex:none;border-radius:50%;background:#bbd7a2;box-shadow:0 0 16px #b9db8a80}
.stage-index{margin-left:auto;color:#6c7a63;letter-spacing:.12em}
.stage-foot{position:absolute;z-index:4;left:24px;right:24px;bottom:24px;display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:12px;line-height:16px;pointer-events:none;color:#819574}
.stage-foot>span:first-child{color:#b2c3a6;letter-spacing:.06em}
.hollow-visual,.studio-fallback{display:block;width:100%;max-width:100%;height:100%;position:absolute;inset:0;pointer-events:none;transition:opacity .8s var(--ease),visibility .8s var(--ease)}
.hollow-stage.hollow-ready .hollow-visual,.render-stage.studio-ready .studio-fallback{opacity:0;visibility:hidden}
.hollow-stage[data-mode=solid] .fallback-fragment{transform:translate(-125px,-50px)}
.hollow-stage[data-mode=cutaway] .fallback-fragment{opacity:0}
.fallback-fragment{transition:transform .8s var(--ease),opacity .8s var(--ease)}
.shell-label{position:absolute;left:0;top:0;z-index:3;transform:translate(var(--point-x,0px),var(--point-y,0px));display:flex;align-items:center;pointer-events:none;opacity:0;transition:opacity .8s var(--ease);font-size:12px;line-height:16px;white-space:nowrap}
.hollow-ready:not([data-mode=solid]) .shell-label{opacity:1}
.shell-label span{display:block;padding:4px 8px;background:#181818b3;border:1px solid #d1e6bd28;border-radius:4px;color:#bdcfb0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.shell-label i{display:block;width:32px;height:1px;background:#c9daba55;position:relative}
.shell-label i:after{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:#c4d9ac;right:0;top:-1px}
.shell-label-outer{margin-left:-104px;margin-top:-24px}
.shell-label-inner{margin-left:-40px;margin-top:16px}
.shell-label-wall{margin-left:0;margin-top:0}
.shell-label-wall i:after{right:auto;left:0}
.feature-render{grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr)}
.studio-light-signature{position:absolute;left:24px;bottom:64px;display:flex;gap:4px;z-index:3;opacity:.6}
.studio-light-signature span{height:4px;width:16px;border-radius:9999px;background:#9cb49a;transition:background .8s var(--ease),width .8s var(--ease)}
.render-stage[data-look=studio] .studio-light-signature span:first-child,.render-stage[data-look=rim] .studio-light-signature span:nth-child(2),.render-stage[data-look=warm] .studio-light-signature span:nth-child(3){width:40px;background:#d1e4bf}
.render-stage[data-look=rim] .studio-fallback{filter:brightness(.8) saturate(.85)}
.render-stage[data-look=warm] .studio-fallback{filter:sepia(.35)}
.editing-section{padding-top:64px;scroll-margin-top:32px}
.editing-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:16px;margin-bottom:32px}
.editing-heading .feature-label{grid-column:1/-1;margin:0}
.editing-heading h3{font-size:36px;line-height:40px;letter-spacing:-.03em}
.editing-heading>p{color:#92a288;font-size:14px;line-height:20px}
.editing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.editing-card{overflow:hidden;padding:0 24px 32px;background:#1818186b;border:1px solid var(--line);border-radius:24px;box-shadow:inset 0 1px 0 #ffffff06;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.editing-art{height:200px;display:grid;place-items:center;overflow:hidden;margin-bottom:8px}
.editing-art svg{width:100%;height:100%;max-width:320px}
.editing-number{display:block;font-size:12px;line-height:16px;color:#84a274;letter-spacing:.08em;margin-bottom:12px}
.editing-card h4{font-size:18px;line-height:28px;font-weight:500;color:#d7e2cf;margin:0 0 12px;text-wrap:balance}
.editing-card p{font-size:14px;line-height:20px;color:#8f9f85}
.editing-art .opening-guide{animation:opening-lift 7s cubic-bezier(.65,0,.35,1) infinite}
.editing-art .bend-tube{transform-origin:160px 100px;animation:bend-breathe 8s cubic-bezier(.65,0,.35,1) infinite}
.editing-art .mask-band{animation:mask-reveal 8s cubic-bezier(.65,0,.35,1) infinite}
.editing-card:not(.on-screen) .editing-art *,.motion-paused .editing-art *{animation-play-state:paused}
@keyframes opening-lift{0%,20%,100%{transform:translateY(0);opacity:.5}50%,70%{transform:translateY(-16px);opacity:.2}}
@keyframes bend-breathe{0%,20%,100%{transform:scaleY(1)}50%,70%{transform:scaleY(.8)}}
@keyframes mask-reveal{0%,20%,100%{opacity:.8}50%,70%{opacity:.25}}
@media(min-width:1400px){.flagship .feature-copy{padding:48px}.flagship{min-height:680px}.hollow-stage,.render-stage{min-height:680px}}
@media(max-width:1100px) and (min-width:900px){.flagship .feature-copy{padding:24px}.flagship{grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr)}.feature-render{grid-template-columns:minmax(0,1.25fr) minmax(0,.95fr)}.flagship h3{font-size:36px;line-height:40px}.feature-facts{gap:12px}.demo-desk{margin-top:24px;padding:12px}.scene-segments{border-radius:12px}.scene-segments button{border-radius:8px}}
@media(max-width:899px){.flagship,.feature-render{grid-template-columns:1fr;min-height:0}.flagship .feature-copy{padding:32px}.flagship .feature-copy>p{max-width:100%}.flagship h3{font-size:36px;line-height:40px}.flagship h3 br{display:none}.feature-facts{grid-template-columns:1fr 1fr;gap:16px}.demo-desk{margin-top:24px}.feature-render .feature-copy{order:0}.feature-render .render-stage{order:1}.hollow-stage,.render-stage{min-height:480px}.feature-hollow .hollow-stage{border-radius:0 0 24px 24px}.editing-grid{grid-template-columns:1fr;gap:16px}.editing-card{display:grid;grid-template-columns:160px 1fr;align-items:start;column-gap:24px;padding:24px}.editing-art{grid-column:1;grid-row:1/4;width:160px;height:160px;margin:0;align-self:center}.editing-number,.editing-card h4,.editing-card p{grid-column:2}.editing-heading>p{display:none}.editing-card h4{margin-bottom:8px}.scene-instruction{min-height:0}}
@media(max-width:599px){.feature-jump{gap:8px}.feature-jump a{flex:1 1 calc(50% - 8px);padding:12px;font-size:12px;line-height:16px}.flagship .feature-copy{padding:24px}.flagship h3{font-size:30px;line-height:36px}.flagship .feature-copy>p{font-size:14px;line-height:20px}.flagship .feature-label{margin-bottom:16px}.feature-facts{gap:12px}.feature-facts p{font-size:12px;line-height:16px}.feature-facts>div>span{font-size:12px;line-height:16px}.demo-desk{padding:12px}.hollow-stage,.render-stage{min-height:400px}.stage-heading{left:16px;right:16px;top:16px}.stage-foot{left:16px;right:16px;bottom:16px;flex-wrap:wrap}.stage-foot>span{font-size:12px;line-height:16px}.shell-label-outer{margin-left:-80px}.shell-label i{width:16px}.shell-label span{padding:4px}.shell-label-inner{margin-left:-24px}.editing-heading h3{font-size:30px;line-height:36px}.editing-card{grid-template-columns:96px 1fr;column-gap:16px;padding:16px}.editing-art{width:96px;height:144px}.editing-card h4{font-size:16px;line-height:24px}.editing-card p{font-size:12px;line-height:16px}.studio-light-signature{left:16px}}
@media(prefers-reduced-motion:reduce){.editing-art *{animation:none!important}.scene-segments button,.feature-jump a,#hollow-canvas,#studio-canvas{transition:none!important}}
.stage-replay{pointer-events:auto;min-height:44px;border:0;border-radius:8px;background:none;color:#a3bb93;font-size:12px;line-height:16px;padding:8px;margin-left:4px;transition:background .7s var(--ease),color .7s var(--ease)}.stage-replay:hover{background:#b5d99813;color:#def0d1}.stage-heading:has(.stage-replay){top:12px}
#hollow,#rendering,#dimensions{scroll-margin-top:32px}
.fallback-whole{opacity:0;transition:opacity .8s var(--ease)}.hollow-stage[data-mode=solid] .fallback-whole{opacity:1}.hollow-stage[data-mode=solid] .fallback-shell,.hollow-stage[data-mode=solid] .fallback-fragment{opacity:0}
/* Static camera, computed light transport, and a shared before / after view. */
.render-stage{--comparison:50%;--render-progress:0}
#studio-canvas{top:64px;bottom:96px;height:calc(100% - 160px);mask-image:linear-gradient(to bottom,transparent,#000 7%,#000 92%,transparent);border-radius:24px}
.studio-compare-line{position:absolute;left:var(--comparison);top:80px;bottom:112px;z-index:3;display:none;align-items:flex-start;pointer-events:none;transform:translateX(-50%);font-size:12px;line-height:16px;white-space:nowrap}
.render-stage[data-mode=compare] .studio-compare-line{display:flex}
.studio-compare-line i{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(233,242,222,.7)}
.studio-compare-line span{padding:4px 8px;background:rgba(10,21,15,.8);backdrop-filter:blur(8px)}
.studio-compare-line span:first-child{border-radius:8px 0 0 8px}.studio-compare-line span:last-child{border-radius:0 8px 8px 0}
.studio-render-status{position:absolute;z-index:3;left:24px;right:24px;bottom:64px;display:flex;justify-content:space-between;gap:8px;font-size:12px;line-height:16px;color:#c0cebb}
.studio-render-status>i{position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:9999px;background:rgba(187,207,169,.12);overflow:hidden}
.studio-render-status>i::after{content:"";display:block;width:100%;height:100%;background:#b5c89b;transform-origin:left;transform:scaleX(var(--render-progress))}
.render-desk [hidden]{display:none!important}.render-desk .scene-instruction{margin-bottom:0}
@media(max-width:599px){.studio-render-status{left:16px;right:16px}.render-stage .stage-index{display:none}.render-stage .stage-heading{gap:8px}.render-stage .stage-foot{gap:8px}.render-stage .stage-foot span:last-child{font-size:12px}.studio-compare-line span{padding:4px}.render-desk .scene-segments{gap:2px}.render-desk .scene-segments button{padding:8px 4px}}

.render-stage .studio-fallback{top:64px;bottom:96px;height:calc(100% - 160px);object-fit:contain;border-radius:24px}
.render-desk .scene-segments button{min-width:0;white-space:normal;text-wrap:balance;line-height:16px}