:root{--paper:#f4f3ee;--ink:#19231f;--green:#254733}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:6px}header{height:108px;position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;color:#f4f3ee}header.dark{position:fixed;color:var(--ink);background:rgba(244,243,238,.94);height:86px;backdrop-filter:blur(12px)}.wordmark{font-size:38px;letter-spacing:-3px;line-height:1}.wordmark span{display:block;letter-spacing:1.7px;font-size:7px;margin-top:7px}nav{display:flex;gap:36px;font-size:13px;align-items:center}nav sup{font-size:8px}button{border:0;background:none;padding:0}.edition{font-size:9px;letter-spacing:1.2px}#entry{height:330vh}.entry-sticky{position:sticky;top:0;height:100svh;overflow:hidden;background:#071d29}#tunnel{width:100%;height:100%;display:block}.entry-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:white;pointer-events:none}.entry-title>span{font-size:9px;letter-spacing:2px;margin-top:30px}.entry-title h1{font-weight:400;font-size:clamp(76px,10vw,160px);letter-spacing:-.075em;line-height:.85;text-align:center;margin:32px 0}.entry-title button{pointer-events:auto;display:flex;align-items:center;gap:30px;font-size:12px;margin-top:10px}.entry-title button span{font-size:22px}.entry-foot{position:absolute;bottom:30px;left:4vw;right:4vw;display:flex;justify-content:space-between;color:white;font-size:9px;letter-spacing:1.2px}.entry-foot button{font-size:10px}.work-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:120px 4vw 85px;gap:40px}.work-heading h2{font-size:clamp(46px,6.5vw,100px);line-height:.97;letter-spacing:-.065em;font-weight:400;margin:0}.intro-copy{font-size:17px;line-height:1.5;width:240px}.intro-copy span{display:block;font-size:8px;letter-spacing:1.2px;margin-top:35px}.gallery{display:grid;grid-template-columns:1.12fr .88fr;gap:110px 7vw;padding:0 4vw}.project.second{padding-top:190px}.project.third{grid-column:1 / -1;width:58%;margin:0 auto}.portal{width:100%;display:block;aspect-ratio:.88;position:relative;overflow:hidden;border-radius:50% 50% 0 0 / 44% 44% 0 0;text-align:left;isolation:isolate}.portal img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1);object-position:50% 42%}.portal:hover img,.portal:focus-visible img{transform:scale(1.045)}.reeco{background:#cfe5cc}.portal-info{position:absolute;inset:45% 0 0;padding:0 32px 32px;background:linear-gradient(transparent,rgba(7,24,17,.85));color:white;display:flex;flex-direction:column;justify-content:end;opacity:0;transform:translateY(10px);transition:.4s}.portal:hover .portal-info,.portal:focus-visible .portal-info{opacity:1;transform:none}.portal-info>span{font-size:28px;letter-spacing:-1px}.portal-info small{font-size:12px;line-height:1.6;margin-top:12px}.portal-info b{font-size:10px;font-weight:400;margin-top:24px}.portal-cursor{position:absolute;bottom:25px;right:26px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--paper);font-size:22px;transition:transform .4s}.portal:hover .portal-cursor{transform:rotate(45deg)}.caption{display:flex;align-items:center;gap:18px;padding-top:20px;font-size:11px}.caption h3{font-size:17px;letter-spacing:-.5px;font-weight:400;margin:0}.caption>span:nth-child(2){color:#687169}.caption>span:last-child{margin-left:auto;font-size:9px}.titan{background:#bbbebd;color:#1d2422;aspect-ratio:.82}.steel{position:absolute;inset:0;display:flex;transform:rotate(-22deg) scale(1.5);transition:transform 1.4s}.steel i{width:14%;height:100%;background:linear-gradient(90deg,#424b4a,#d3d7d4 45%,#faf9f4 50%,#88918f 52%,#b6bdb9);box-shadow:10px 0 20px #0002}.titan:hover .steel{transform:rotate(-14deg) scale(1.5)}.project-name{position:absolute;top:48%;left:0;right:0;text-align:center;font-size:clamp(40px,7vw,105px);letter-spacing:-.055em;font-weight:500}.study-label{position:absolute;top:29%;width:100%;text-align:center;font-size:8px;letter-spacing:2px;opacity:.7}.sarva{background:#763cde;color:#e9ef81;aspect-ratio:1.1}.sound-lines{position:absolute;inset:-60%;background:repeating-radial-gradient(ellipse at center,transparent 0 18px,#d9eb7940 19px 20px,transparent 21px 42px);transform:scaleX(.6) rotate(-35deg);transition:transform 1.2s}.sarva:hover .sound-lines{transform:scaleX(.8) rotate(-20deg)}.sarva .project-name{line-height:.85;top:42%}.project-name em{font:italic .62em Georgia,serif;letter-spacing:-.05em}.work-end{margin:85px 4vw 140px;display:flex;justify-content:space-between;font-size:12px;border-top:1px solid #19231f44;padding-top:25px}#studio{padding:90px 4vw 25px;background:#dce2d6}.label{font-size:9px;letter-spacing:2px}#studio h2{font-weight:400;font-size:clamp(65px,12vw,185px);letter-spacing:-.075em;line-height:.9;margin:60px 0 80px}.studio-bottom{display:flex;justify-content:space-between;max-width:850px;margin-left:auto;gap:70px}.studio-bottom p{max-width:470px;font-size:21px;line-height:1.4;margin:0}.studio-bottom>div{font-size:12px;line-height:1.8;min-width:130px}footer{display:flex;justify-content:space-between;margin-top:120px;font-size:8px;letter-spacing:1px}#case{position:fixed;inset:0;width:100%;max-width:none;height:100svh;max-height:none;border:0;padding:0;margin:0;overflow:auto;color:var(--ink);background:#d0e5cc}#case::backdrop{background:var(--paper)}.case-close{position:fixed;top:25px;left:4vw;z-index:4;background:var(--paper);border-radius:50px;padding:14px 22px;font-size:12px;box-shadow:0 1px 10px #0001}.case-hero{height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:8vw 6vw 4vw;overflow:hidden}.case-hero h1{font-size:clamp(70px,10vw,150px);letter-spacing:-.075em;line-height:.9;font-weight:400;margin:26px 0}.case-hero p{font-size:18px;line-height:1.4;max-width:320px}.case-hero img{width:100%;height:78svh;object-fit:contain;mix-blend-mode:multiply;will-change:transform}.case-meta{font-size:10px;letter-spacing:2px}.case-story{padding:100px 6vw;background:var(--paper);display:grid;grid-template-columns:1fr 1fr;gap:60px}.case-story h2{font-size:clamp(40px,5vw,80px);font-weight:400;letter-spacing:-.06em;line-height:1;margin:0}.case-story p{font-size:20px;line-height:1.5;margin:0;max-width:500px}.detail-section{background:#244a35;color:#e4edd4;padding:70px 6vw 95px}.detail-heading{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:50px}.detail-heading button{border:1px solid #d0e5cc66;padding:10px 20px;border-radius:30px;margin-left:8px}.detail-heading button.active{background:#d0e5cc;color:#244a35}.detail-art{max-width:900px;height:650px;margin:auto;overflow:hidden;border-radius:50% 50% 0 0 / 50% 50% 0 0;background:#d0e5cc}.detail-art img{width:100%;height:100%;object-fit:cover;transition:transform 1s,object-position 1s;transform-origin:50% 48%}.case-end{padding:100px 6vw;background:var(--paper)}.case-end button{font-size:clamp(35px,6vw,90px);letter-spacing:-.06em}.prototype-note{font-size:12px;line-height:1.6;max-width:440px;opacity:.7}.case-study-visual{height:65vh;position:relative;overflow:hidden;margin:50px 6vw;border-radius:50% 50% 0 0 / 60% 60% 0 0}#transition{display:none;position:fixed;z-index:50;pointer-events:none;overflow:hidden;transform-origin:center}#transition .portal{height:100%;aspect-ratio:auto;border-radius:inherit}#transition .portal-info,#transition .portal-cursor{display:none}.case-titan{background:#b6beba!important}.case-sarva{background:#763cde!important;color:#f0f3ab!important}.case-sarva .case-story,.case-sarva .case-end{color:var(--ink)}@media(max-width:700px){header{height:90px;padding:0 6vw}.edition{display:none}.wordmark{font-size:32px}nav{gap:20px;font-size:12px}nav #replay{display:none}.entry-title>span{font-size:7px;letter-spacing:1px}.entry-title h1{font-size:90px}.entry-foot{left:6vw;right:6vw;font-size:7px}.work-heading{padding:80px 6vw 50px;display:block}.work-heading h2{font-size:51px}.intro-copy{font-size:14px;margin-top:25px;width:auto}.intro-copy span{margin-top:20px}.gallery{display:block;padding:0 6vw}.project{margin-bottom:65px}.project.second{padding-top:0;margin-left:15%}.project.third{width:100%;margin:0}.caption{gap:10px}.caption>span:nth-child(2){font-size:10px}.portal-info{padding:20px;opacity:1;transform:none;inset:60% 0 0}.portal-info>span,.portal-info small{display:none}.portal-info b{margin:0}.portal-cursor{width:36px;height:36px;bottom:15px;right:15px}.study-label{font-size:7px}.project-name{font-size:65px}.work-end{margin:65px 6vw 85px;font-size:10px}#studio{padding:70px 6vw 25px}#studio h2{font-size:65px;margin:40px 0}.studio-bottom{display:block}.studio-bottom p{font-size:18px}.studio-bottom>div{margin-top:30px}footer{flex-wrap:wrap;gap:25px;margin-top:75px;font-size:7px}.case-hero{grid-template-columns:1fr;height:auto;min-height:100svh;padding:100px 6vw 30px}.case-hero h1{font-size:75px;margin:18px 0}.case-hero p{font-size:16px}.case-hero img{height:50svh}.case-story{grid-template-columns:1fr;padding:65px 6vw;gap:30px}.case-story p{font-size:17px}.detail-section{padding:45px 6vw}.detail-heading{display:block}.detail-heading>div{margin-top:20px}.detail-heading button{margin-left:0;margin-right:5px;padding:8px 14px;font-size:11px}.detail-art{height:430px}.case-meta{font-size:8px}.case-end{padding:70px 6vw}.case-close{top:16px;font-size:11px}.case-study-visual{height:40vh}.entry-title{justify-content:center}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.entry-title{mix-blend-mode:difference}
.case-reecobit,.reeco,.detail-art{background:#cce7cc!important}.case-hero img{mix-blend-mode:normal}
.entry-title{mix-blend-mode:normal;justify-content:flex-end;padding-bottom:100px}.entry-title h1,.entry-title>span{display:none}.entry-title button{background:#071d29;color:white;padding:14px 22px;border-radius:40px}

/* Original vector artwork: no aspect-ratio distortion or invented geometry. */
#entry{height:460vh}.entry-sticky{background:#404041}#tunnel{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}#entry-wash{position:absolute;inset:0;background:var(--paper);opacity:0;pointer-events:none}header.entering{opacity:0;pointer-events:none}header.entering a,header.entering button{pointer-events:none}.entry-title{padding-bottom:42px}.entry-title button{background:#242424b8;font-size:10px;padding:10px 18px}.entry-foot{bottom:18px}.source-shape{transform-box:view-box}@media(max-width:700px){.entry-title{padding-bottom:70px}.entry-sticky{background:#404041}}

/* Project field: original final entry aperture, uniformly scaled. */
:root{--paper:#fff;--ink:#181818}
header.dark{height:70px;background:#fffffff2;padding:0 24px;backdrop-filter:blur(10px)}
#work{padding-top:85px;background:#fff}
.gallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px 22px;padding:0 24px;align-items:start;position:relative}
.gallery .project{grid-column:var(--col);grid-row:var(--row);width:auto;margin:0;padding:0;min-width:0}
.gallery .portal{aspect-ratio:1;border-radius:0;clip-path:url(#project-tunnel);-webkit-clip-path:url(#project-tunnel)}
.grid-title{grid-column:2 / 6;grid-row:3;align-self:center;justify-self:center;text-align:center;padding:12px 0}
.grid-title h2{font-size:clamp(32px,4.6vw,80px);font-weight:400;letter-spacing:-.065em;line-height:1;margin:0 0 18px}
.grid-title>span{font-size:8px;letter-spacing:2px}
.caption{padding-top:9px;gap:6px}.caption h3{font-size:11px;letter-spacing:0}.caption>span{display:none}
.gallery .project-name{font-size:clamp(22px,3.2vw,55px)}.gallery .study-label{font-size:5px;letter-spacing:1px;top:33%}
.gallery .portal-info{inset:35% 0 0;padding:14px 12px;transform:none}.gallery .portal-info>span{font-size:16px;letter-spacing:-.3px}.gallery .portal-info small{font-size:9px;line-height:1.4;margin-top:5px}.gallery .portal-info b{font-size:8px;margin-top:10px}
.gallery .portal-cursor{display:none}.gallery .tile-3 img{transform:scale(1.6);transform-origin:50% 43%}.gallery .tile-5 img{transform:scale(1.2);transform-origin:50% 70%}.tile-4 .sound-lines{transform:scaleX(1.1) rotate(40deg)}.tile-7 .steel{transform:rotate(25deg) scale(1.5)}.tile-8 .steel{transform:rotate(80deg) scale(1.5)}
#transition .portal{clip-path:inherit;-webkit-clip-path:inherit}.work-end{margin:50px 24px 80px}
@media(min-width:1600px){.gallery{grid-template-columns:repeat(7,minmax(0,1fr))}.gallery .tile-2,.gallery .tile-3,.gallery .tile-8{grid-column:7}.gallery .tile-7{grid-column:6}.grid-title{grid-column:2 / 7}}
@media(max-width:700px){header.dark{padding:0 18px}.gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 12px;padding:0 18px}.gallery .project{grid-column:auto;grid-row:auto}.grid-title{grid-column:1 / -1;grid-row:2;padding:28px 0}.grid-title h2{font-size:44px}.gallery .project-name{font-size:28px}.gallery .portal-info{opacity:0}.gallery .portal:focus-visible .portal-info,.gallery .portal:hover .portal-info{opacity:1}.gallery .portal-info small,.gallery .portal-info b{display:none}.caption h3{font-size:9px}.gallery .study-label{font-size:4px;letter-spacing:.4px}.work-end{margin:40px 18px 60px}}

/* Shared camera plane keeps original vector objects and tunnel together. */
.entry-sticky{perspective:1200px;perspective-origin:50% 50%;isolation:isolate}
#tunnel{transform-origin:50% 50%;will-change:transform;backface-visibility:hidden}
.entry-edge-blur{position:absolute;inset:0;pointer-events:none;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);mask-image:radial-gradient(ellipse at center,transparent 36%,#0003 57%,#000b 82%,#000 100%);-webkit-mask-image:radial-gradient(ellipse at center,transparent 36%,#0003 57%,#000b 82%,#000 100%)}
@media(prefers-reduced-motion:reduce){#tunnel{transform:none!important;will-change:auto}}

/* Fixed camera frame, independent depth planes, stronger peripheral defocus. */
.entry-sticky{perspective:none}
#tunnel{transform:none!important;will-change:auto}
.entry-edge-blur{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);mask-image:radial-gradient(ellipse at center,transparent 29%,#0002 44%,#0008 67%,#000 94%);-webkit-mask-image:radial-gradient(ellipse at center,transparent 29%,#0002 44%,#0008 67%,#000 94%)}
.entry-edge-blur{background:radial-gradient(ellipse at 50% 50%,transparent 25%,rgba(3,5,10,.08) 49%,rgba(3,5,10,.32) 77%,rgba(3,5,10,.62) 100%)}
.source-shape path:not(.shape-hit){pointer-events:none}
.shape-hit{pointer-events:stroke;cursor:grab;touch-action:none}
@media(any-pointer:coarse){.shape-hit{stroke-width:44px}}
#entry.is-dragging,#entry.is-dragging .shape-hit{cursor:grabbing}
#entry.is-dragging{user-select:none}

/* The entrance camera and Home share one viewport until the handoff commits. */
#entry{height:460svh;overflow-anchor:none}
body.home-page:not(.intro-complete){overflow-anchor:none}
body.home-page:not(.intro-complete) .entry-sticky{position:fixed;inset:0;height:100svh;z-index:20}
body.home-page:not(.intro-complete) #main .home-field{position:fixed;inset:0;visibility:hidden;pointer-events:none}
body.intro-complete #entry{display:none}
