/* The actual Daniel floor plan becomes a traced facade, then the project render. */
.process .scene-visual{width:100%;background:#f8f6f2;aspect-ratio:16/10;perspective:1000px;isolation:isolate}
.process{height:320svh}
.daniel-plan{position:absolute;inset:0;width:100%;height:100%;padding:6%;z-index:1;transform:translateY(calc(var(--plan-lift,0)*29%)) rotateX(calc(var(--plan-lift,0)*66deg)) scale(calc(1 + var(--plan-lift,0)*.08));opacity:var(--plan-opacity,1);transform-origin:center;will-change:transform,opacity}
.daniel-building{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible}
.daniel-model{opacity:calc(1 - var(--materials,0));}
.daniel-ground{opacity:var(--back-rise,0)}
.daniel-mass{transform-box:view-box;transform-origin:960px 914px;will-change:transform}
.daniel-mass-back{transform:scaleY(var(--back-rise,0));opacity:var(--back-rise,0)}
.daniel-mass-front{transform:scaleY(var(--front-rise,0));opacity:var(--front-rise,0)}
.daniel-roof{transform:translateY(calc((1 - var(--roof-fit,0))*-100px));opacity:var(--roof-fit,0);will-change:transform,opacity}
.daniel-openings{opacity:var(--openings,0)}
.daniel-materials{opacity:var(--materials,0);mask-image:linear-gradient(to top,#000 calc(var(--material-edge,0%) - 25%),transparent var(--material-edge,0%))}
.daniel-edges{opacity:calc(var(--elevation,0)*(1 - var(--materials,0)));}
.daniel-edges path{stroke-dasharray:1000;stroke-dashoffset:calc(1000*(1 - var(--elevation,0)))}
.process .daniel-photo{z-index:0;object-fit:cover;clip-path:inset(0);opacity:var(--reveal,0);transform:none;will-change:opacity}
.process .scan-line{display:none}
.process .drawing-meta,.process .scene-caption{font-size:11px;letter-spacing:.04em}
.process .process-progress span{width:calc(var(--scene)*100%)}
.journey-controls:empty{display:none}
.style-bottom{justify-content:center}
.is-pinned .style-controls{margin:0 auto}
@media(max-width:899px){
 .is-pinned .style-intro{text-align:center}
 .is-pinned .style-intro h2{font-size:clamp(38px,10.8vw,60px)}
 .is-pinned .style-photo{height:auto;aspect-ratio:3/4}
 .is-pinned .style-frame figcaption{font-size:15px}
 .sections-animated .portfolio-sticky{position:sticky;top:0;height:100svh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:22px 0}
 .sections-animated .portfolio-window{min-height:0}
 .sections-animated .portfolio-track{height:100%;overflow:visible;scroll-snap-type:none;will-change:transform;width:max-content;padding-bottom:0;padding-right:0}
 .sections-animated .portfolio-track .project{flex:none;width:86vw;height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto}
 .sections-animated .portfolio-track .project-image{height:100%;min-height:0;max-height:none}
 .sections-animated .portfolio-track .project-image img{left:-6%;width:112%;translate:var(--image-drift,0px) 0;will-change:translate}
}
@media(max-width:767px){
 .process{height:340svh}
 .process .process-sticky{position:sticky;top:0;height:100svh;min-height:0;max-height:none;overflow:hidden;padding:24px 6%;justify-content:center}
 .process .process-heading{margin-bottom:18px}
 .process .process-heading h2{font-size:clamp(30px,7.8vw,42px);margin-top:12px}
 .process .process-intro{display:none}
 .process .scene-visual{max-height:29svh}
 .process .process-grid{gap:16px}
 .process .process-steps{height:175px;position:relative}
 .process .step{position:absolute;opacity:0;visibility:hidden;inset:0;padding:12px 0}
 .process .step.active{opacity:1;visibility:visible}
 .process .step h3{font-size:21px}
 .process .step p{font-size:15px;line-height:1.5}
 .process .drawing-meta,.process .scene-caption{font-size:9px;padding:9px 10px}
 .process .process-progress{display:block;margin-top:14px}
}