/* Citron / ink. Depth is reserved for pictures; text stays on a flat readable plane. */
.motion-portfolio{--motion-ink:#1b1b1f;--motion-lime:#c8ff2e}
.motion-hero-sticky,.motion-hero-frame{height:100%;position:relative}.motion-hero-caption,.motion-scroll-note{display:none}
.motion-projects{position:relative}.motion-chapters{display:flex;gap:.5rem;border-block:1px solid #1b1b1f25;padding:.8rem 0;margin-top:2rem;background:var(--bot-paper);z-index:8}
.motion-chapters button{appearance:none;background:transparent;border:0;color:#55504b;padding:.85rem 1rem;position:relative;font:500 .875rem var(--font-body);cursor:pointer;display:flex;gap:.75rem;align-items:center;min-height:44px}.motion-chapters button span{font-family:var(--font-mono);font-size:.75rem}.motion-chapters button i{position:absolute;bottom:0;inset-inline:1rem;height:3px;background:#c8ff2e;transform:scaleX(0);transform-origin:left;transition:transform .4s}.motion-chapters [aria-current]{color:#1b1b1f}.motion-chapters [aria-current] i{transform:scaleX(1)}
.motion-stack{position:relative;isolation:isolate;padding-block:2rem}
.motion-project{display:grid;grid-template-columns:1.15fr 1fr;min-height:480px;margin-bottom:3rem;background:#1b1b1f;color:#fbf8f4;border:1px solid #45454a;transform-origin:50% 0;overflow:clip;box-shadow:0 12px 36px #1b1b1f0a;scroll-margin-top:150px}
.motion-project-visual{position:relative;min-height:480px;isolation:isolate;background:#c8ff2e;overflow:hidden;perspective:1200px}.motion-project-plane{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1.5rem;padding:2rem;background:#c8ff2e;color:#1b1b1f;transform:translate3d(var(--image-x,0px),var(--image-y,0px),0)}
.motion-project-plane>span{font:.75rem var(--font-mono);letter-spacing:.12em}.motion-project-plane strong{font:400 clamp(2.2rem,4vw,4.8rem)/.98 var(--font-display);letter-spacing:-.035em;max-width:10ch}.motion-project-plane i{font:400 1rem/1.5 var(--font-body);max-width:24ch}
.motion-doors{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}.motion-door{position:absolute;top:0;bottom:0;width:50%;overflow:hidden;backface-visibility:hidden;will-change:auto}.motion-door img{position:absolute;top:0;height:100%;width:200%;max-width:none;object-fit:cover}.motion-door-left{left:0;transform-origin:left center;transform:translateX(calc(var(--door-open,0)*-76%)) rotateY(calc(var(--door-open,0)*-32deg))}.motion-door-right{right:0;transform-origin:right center;transform:translateX(calc(var(--door-open,0)*76%)) rotateY(calc(var(--door-open,0)*32deg))}.motion-door-left img{left:0}.motion-door-right img{right:0}.motion-visual-index{position:absolute;left:1rem;bottom:1rem;font:500 .75rem var(--font-mono);color:#1b1b1f;background:#fbf8f4;padding:.6rem .8rem}
.motion-project-copy{padding:clamp(1.5rem,3.8vw,4rem);align-self:center}.motion-project-copy .folio-overline{font-size:.8125rem;line-height:1.6;color:#c8ff2e}.motion-project-copy h3{color:#fbf8f4;font:400 clamp(2rem,3.8vw,4.3rem)/1.04 var(--font-display);letter-spacing:-.035em;margin:1.5rem 0}.motion-project-copy>p{font-size:1rem;line-height:1.75;color:#e0dcd6;max-width:46ch}.motion-project-copy .motion-project-status{font-size:.8125rem;color:#c5bfb7;margin-top:1.5rem}.motion-project-copy a{color:#c8ff2e!important;border-color:#87965e;margin-top:2rem;font-size:.9375rem}
.motion-badge{perspective:1200px;min-width:0;position:relative}.motion-badge-body{display:grid;transform-style:preserve-3d;transform:rotateX(var(--badge-rx,0deg)) rotateY(var(--badge-ry,0deg));transition:transform .3s cubic-bezier(.2,.7,.2,1)}.motion-badge.is-flipped .motion-badge-body{transform:rotateX(var(--badge-rx,0deg)) rotateY(calc(180deg + var(--badge-ry,0deg)))}.motion-badge-face,.motion-badge-back{grid-area:1/1;backface-visibility:hidden;min-width:0}.motion-badge-face figure{margin:0;width:100%}.motion-badge-face figure img{width:100%;aspect-ratio:4/5;object-fit:cover}.motion-badge-back{transform:rotateY(180deg);background:#c8ff2e;padding:clamp(1.5rem,3vw,3rem);color:#1b1b1f;display:flex;flex-direction:column;justify-content:center}.motion-badge-back>span{font:.8125rem var(--font-mono);letter-spacing:.1em}.motion-badge-back h3{font:400 clamp(2rem,3vw,3.3rem)/1.05 var(--font-display);margin:1.5rem 0}.motion-badge-back ol{list-style:none;margin:0;padding:0}.motion-badge-back li{border-top:1px solid #1b1b1f3a;padding:1rem 0}.motion-badge-back li>span{font:.75rem var(--font-mono);margin-inline-end:1rem}.motion-badge-back strong{font-size:1rem;font-weight:500}.motion-badge-back p{font-size:.9375rem;line-height:1.6;margin-top:.5rem}
.motion-flip{background:#1b1b1f;color:#fff;border:0;padding:.85rem 1.2rem;font:500 .875rem var(--font-body);cursor:pointer;display:block;width:100%;min-height:44px;margin-top:1rem}
.folio-index .motion-pause{font:500 .8125rem var(--font-body);color:#1b1b1f;background:#c8ff2e;border:0;padding:.75rem 1rem;min-height:44px;cursor:pointer;grid-column:1/-1;justify-self:end;position:relative}.motion-pause[aria-pressed=true]{background:#1b1b1f;color:#fff}
.motion-active .motion-enter{opacity:0;transform:translateY(22px);transition:opacity .75s ease,transform .85s cubic-bezier(.2,.65,.2,1)}.motion-active .motion-enter.motion-seen{opacity:1;transform:none}.motion-active .folio-services>a:nth-child(2),.motion-active .premium-process li:nth-child(2){transition-delay:.09s}.motion-active .folio-services>a:nth-child(3),.motion-active .premium-process li:nth-child(3){transition-delay:.18s}
.motion-active .folio-services>a{transition:background .3s,opacity .75s,transform .85s;border-top:2px solid #1b1b1f}.motion-active .folio-services>a:hover{background:#c8ff2e}.motion-active .premium-process li{border-top:2px solid #c8ff2e;padding-top:.9rem}
@media(min-width:901px) and (min-height:760px){
.motion-cinema .motion-hero{height:185svh;min-height:0;overflow:visible;background:#1b1b1f;z-index:1}
.motion-cinema .motion-hero-sticky{position:sticky;top:0;height:100svh;overflow:clip;perspective:1600px}
.motion-cinema .motion-hero-frame{transform:scale(var(--hero-shrink,1));border-radius:var(--hero-round,0px);overflow:hidden;height:100%;transform-origin:50% 40%}
.motion-cinema .motion-hero-frame iframe{transform:scale(var(--hero-zoom,1));transform-origin:50% 35%}
.motion-cinema .motion-hero-caption{display:block;position:absolute;inset-inline:24%;bottom:12%;z-index:4;padding:1.8rem 2.4rem;background:#fbf8f4ef;backdrop-filter:blur(15px);border:1px solid #1b1b1f20;border-inline-start:4px solid #c8ff2e;opacity:var(--hero-caption,0);transform:translateY(calc((1 - var(--hero-caption,0))*80px)) rotateX(calc((1 - var(--hero-caption,0))*12deg));pointer-events:none;text-align:center}
.motion-hero-caption>span{font:500 .8125rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.motion-hero-caption>p{font:400 clamp(2rem,3.5vw,4rem)/1.06 var(--font-display);color:#1b1b1f;letter-spacing:-.04em;margin-top:.7rem}
.motion-cinema .motion-scroll-note{display:flex;position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);font:.75rem var(--font-body);background:#fff;color:#1b1b1f;padding:.5rem .7rem;align-items:center;gap:.8rem;opacity:calc(1 - var(--hero-caption,0));pointer-events:none}.motion-scroll-note i{display:block;width:34px;height:2px;background:#c8ff2e;transform:scaleX(calc(.2 + var(--hero-progress,0)*.8));transform-origin:left}
.motion-cinema .motion-chapters{position:sticky;top:var(--motion-index-height,78px)}
.motion-cinema .motion-stack{padding-bottom:1rem}
.motion-cinema .motion-project{position:sticky;top:calc(var(--motion-card-top,160px) + var(--card-index)*12px);min-height:calc(100svh - var(--motion-card-top,160px) - 64px);margin-bottom:65svh;transform:translateY(var(--card-lift,0px)) scale(var(--card-scale,1));z-index:calc(2 + var(--card-index))}
.motion-cinema .motion-project:last-child{margin-bottom:0}
.motion-cinema .motion-project-visual{min-height:calc(100svh - var(--motion-card-top,160px) - 64px)}
.motion-cinema .motion-project-copy h3{font-size:clamp(2rem,3.8vw,4rem)}
}
@media(max-width:900px){.motion-project{grid-template-columns:1fr;min-height:0}.motion-project-visual{min-height:0;aspect-ratio:1.5}.motion-chapters{overflow-x:auto;gap:0}.motion-chapters button{white-space:nowrap;padding:.75rem .6rem;font-size:.8125rem}.motion-project-copy{padding:1.6rem}.motion-project-copy h3{font-size:2.5rem}.motion-badge-back{padding:1.5rem}.motion-badge-back p{font-size:.875rem}.motion-badge-back li{padding:.7rem 0}}
@media(prefers-reduced-motion:reduce){.motion-enter{opacity:1!important;transform:none!important;transition:none!important}.motion-badge-body,.motion-chapters button i{transition:none}.motion-badge.is-flipped .motion-badge-body{transform:none}.motion-badge.is-flipped .motion-badge-back{transform:none}.motion-badge.is-flipped .motion-badge-face{visibility:hidden}.motion-door{transform:none!important}.motion-project-plane{transform:none}}
@media print{.motion-hero,.motion-chapters,.motion-pause,.motion-flip{display:none!important}.motion-project{position:static!important;transform:none!important;break-inside:avoid;margin-bottom:2rem!important}.motion-enter{opacity:1!important;transform:none!important}.motion-portfolio{display:block!important}}

.motion-card-anchor{height:0;scroll-margin-top:var(--motion-card-top,160px);pointer-events:none}

@media(min-width:901px){.motion-portfolio .folio-index>.bot-container{grid-template-columns:repeat(5,minmax(0,1fr)) minmax(120px,auto)}.motion-portfolio .folio-index .motion-pause{grid-column:auto;justify-self:stretch;font-size:.75rem}}
.motion-active .motion-enter:focus-within{opacity:1;transform:none}.motion-portfolio section[id]{scroll-margin-top:calc(var(--motion-index-height,110px) + 24px)}

.portfolio-motion-paused .motion-badge-body,.portfolio-motion-paused .motion-chapters button i{transition:none}
