/* Visual refinement v2: retain semantic colors and reading scale. */
:root{--hero-size:clamp(3rem,5.8vw,5rem);--stage-blue:#eaf0fa;--stage-radius:1.5rem;--motion-enter:650ms;--motion-hover:240ms;--motion-ease:cubic-bezier(.2,.7,.2,1)}
header{border-bottom:0}.brand{font-size:1.125rem}.header-inner{padding-bottom:var(--s2)}.nav-link:last-child{color:var(--link)}
.hero{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s8);padding-top:var(--s12);padding-bottom:0;align-items:center}.hero .eyebrow{font-size:var(--size-caption);letter-spacing:.04em;margin:0 0 var(--s6)}.hero .display{font-size:var(--hero-size);line-height:1.2;letter-spacing:0;max-width:10em;font-weight:600}.hero .display span{color:var(--link)}.hero p.hero-description{margin-top:var(--s6);line-height:1.8;max-width:28em}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s6);margin-top:var(--s8)}.hero-actions .button{gap:var(--s6);padding:var(--s3) var(--s6)}
.hero-stage{position:relative;min-height:33rem;background:var(--stage-blue);border-radius:var(--stage-radius);isolation:isolate;margin:var(--s4) 0 var(--s4) var(--s6)}.scene{position:absolute;display:block;overflow:hidden;border-radius:var(--radius-cover);background:white;box-shadow:0 12px 28px #18223018;text-decoration:none}.scene img{width:100%;height:auto}.scene-label{display:block;padding:var(--s2) var(--s3);font-size:var(--size-caption);background:white;color:var(--text)}.scene-main{left:-6%;top:10%;width:87%;transform:rotate(-6deg);z-index:1;background:#000}.scene-main .scene-label{color:white;background:#182230}.scene-app{right:-3%;top:42%;width:51%;transform:rotate(8deg);z-index:3}.scene-web{left:7%;bottom:4%;width:47%;transform:rotate(-3deg);z-index:2}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;border-bottom:1px solid var(--border-subtle);padding-block:var(--s8);margin-top:var(--s8);font-size:var(--size-caption);color:var(--text-secondary)}.hero-bottom a{text-decoration:none}
#work>.section-label{margin-bottom:28px}
.projects{display:flex;flex-direction:column;gap:0;isolation:isolate;padding-inline:8px}
.project-folder{position:relative;isolation:isolate;z-index:1;--folder-panel:#f5f8f8;--folder-angle:-1.2deg;--folder-image-height:400px;scroll-margin-top:32px}
.folder-sheet{position:relative;isolation:isolate;padding:88px 40px 68px;rotate:0deg;scale:1;transition:rotate 300ms ease-out,scale 300ms ease-out}
.project-folder:nth-child(2){z-index:2;--folder-panel:#e8f8f9;--folder-angle:1deg}
.project-folder:nth-child(3){z-index:3;--folder-panel:#d5f2f3;--folder-angle:-.9deg}
.project-folder+.project-folder{margin-top:-20px}
.project-folder[data-folder-ready] .folder-sheet{padding-block:80px 48px;rotate:var(--folder-angle)}.project-folder[data-folder-ready]:is(.is-open,:hover,:focus-within) .folder-sheet{rotate:0deg;scale:1.012}
.folder-surface{position:absolute;inset:0;z-index:-1;filter:drop-shadow(0 -1px 2px #0000000b);pointer-events:none}
.folder-surface::after{content:"";position:absolute;inset:72px 0 0;background:var(--folder-panel);border-radius:0 0 24px 24px}
.folder-surface svg{position:absolute;inset:0 0 auto;width:100%;height:72px;fill:var(--folder-panel)}
.folder-shape--mobile{display:none}
.folder-tab{position:absolute;top:10px;left:32px;max-width:calc(100% - 100px);font-size:14px;font-weight:500;line-height:24px;color:#313131;white-space:nowrap}
.project-entry{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center;gap:40px;color:var(--text)}
.project-entry>*{min-width:0}
.project-folder .project-image{display:block;position:relative;overflow:visible;border:0;border-radius:0;background:transparent;padding:0;margin:0;text-decoration:none}
.folder-media{display:flex;align-items:center;justify-content:center}
.folder-media img{display:block;width:100%;height:auto;object-fit:contain}
.folder-media--ecogo img{max-width:400px}.folder-media--herday img{border-radius:14px}
[data-folder-ready] .folder-media{height:var(--folder-image-height);transition:none}
[data-folder-ready] .folder-media img{width:auto;height:auto;object-fit:contain;max-width:100%;max-height:100%}
.project-copy{align-self:start;padding-top:28px}.project-copy .heading{font-size:clamp(28px,2.6vw,36px);font-weight:600;line-height:1.35;margin:0}
.project-copy p{font-size:18px;line-height:1.8;margin:16px 0 0}
.folder-mobile-role{display:none}
.folder-more{display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows 240ms ease-out,opacity 160ms ease-out}
.folder-more-inner{overflow:hidden;min-height:0}
[data-folder-ready]:not(.is-open) .folder-more{grid-template-rows:0fr;opacity:0;visibility:hidden}
.project-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:16px}
.project-copy .entry-cta{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:8px 4px;margin:0;color:#181818;font-size:16px;font-weight:600;text-decoration:none;border-radius:4px}
.entry-cta::before{content:"";position:absolute;inset:auto 0 11px;height:13px;background:#A7F6F8;transform:scaleX(0);transform-origin:left;transition:transform 180ms ease;z-index:-1}
.entry-arrow{display:inline-block;transition:transform 180ms ease}
.entry-cta:is(:hover,:focus-visible)::before{transform:scaleX(1)}
.entry-cta:is(:hover,:focus-visible) .entry-arrow{transform:translate(3px,-3px)}
.entry-cta:focus-visible,.project-image:focus-visible,.folder-toggle:focus-visible{outline:2px solid var(--focus);outline-offset:5px}
.project-copy .entry-cta:hover{color:#181818}
.folder-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 4px;border:0;border-radius:4px;background:transparent;color:#515151;font:inherit;font-size:14px;cursor:pointer}
.folder-toggle[hidden]{display:none}@media(min-width:48rem) and (hover:hover) and (pointer:fine){.folder-toggle{display:none}}.folder-toggle:hover{color:#008f96}
.folder-toggle span{font-size:18px;width:16px;text-align:center}
.section-label .caption{letter-spacing:.04em}.about{background:var(--surface);border-top:0}.about .reading{position:relative}.about .title{color:var(--link)}#contact{padding-block:var(--s16)}#contact h2{font-size:var(--size-title)}.case-head{border-bottom:1px solid var(--border-subtle);margin-bottom:var(--s8)}.case-head .title{color:var(--link)}.case-section:target h2{color:var(--link)}.case-section .figures{background:var(--surface);padding:var(--s6);border-radius:var(--radius-cover)}
@keyframes opening{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){.hero-copy{animation:opening var(--motion-enter) both}.hero-stage{animation:opening var(--motion-enter) 100ms both}.project-image{transition:transform var(--motion-hover) var(--motion-ease)}}
@media(max-width:63.99rem){.hero{grid-template-columns:1fr}.hero .display{max-width:none}.hero-stage{width:min(100%,38rem);margin:var(--s12) auto 0;min-height:31rem}.project-entry{gap:var(--s8)}.hero-bottom{margin-top:var(--s6)}}
@media(max-width:47.99rem){:root{--hero-size:2.75rem;--stage-radius:1rem}.hero{padding-top:var(--s8)}.hero .eyebrow{font-size:var(--size-caption)}.hero .display{font-size:var(--hero-size)}.hero-actions{gap:var(--s4)}.hero-stage{min-height:23rem;margin-top:var(--s8);width:calc(100% - var(--s4))}.scene-main{left:-2%;top:8%;width:86%}.scene-app{right:-2%;top:41%;width:53%}.scene-web{left:4%;bottom:5%;width:49%}.scene-label{font-size:.75rem}.hero-bottom{font-size:var(--size-caption);gap:var(--s3)}.section-label{align-items:flex-start;flex-direction:column;gap:var(--s3)}.project-entry{grid-template-columns:1fr;gap:24px}.projects{padding-inline:0}.folder-sheet,.project-folder[data-folder-ready] .folder-sheet,.project-folder[data-folder-ready].is-open .folder-sheet{padding:80px 20px 48px;rotate:0deg;scale:1!important}.project-folder+.project-folder{margin-top:-12px}.folder-tab{font-size:13px;left:20px}.folder-tab-role{display:none}.folder-mobile-role{display:block;font-size:15px!important;color:var(--text-secondary)}.project-actions{gap:12px}.project-copy{padding-top:0}.folder-shape--desktop{display:none}.folder-shape--mobile{display:block}.project-copy p{font-size:16px}.project-copy .caption{font-size:15px}.project-copy .heading{margin-top:0}.project-copy .caption{margin-block:var(--s4)}.case-section .figures{padding:var(--s3)}}
@media(prefers-reduced-motion:reduce){.scene,.project-image,.project-image .cover{transition:none}.entry-cta::before,.entry-arrow,.folder-sheet,[data-folder-ready] .folder-media,.folder-more{transition:none}.project-folder[data-folder-ready] .folder-sheet{rotate:0deg;scale:1!important}.entry-cta:is(:hover,:focus-visible) .entry-arrow{transform:none}}