:root{--white:#fff;--mist:#f5f5f7;--ink:#1d1d1f;--gray:#707075;--line:#dedee2;--blue:#0066cc;--ease:cubic-bezier(.22,1,.36,1);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","PingFang SC","Microsoft Yahei",Arial,sans-serif;color:var(--ink);background:var(--white);font-synthesis:none;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0}body.modal-open{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{color:inherit;cursor:pointer}button{border:0;background:none}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #0071e3;outline-offset:6px}button:disabled{opacity:.3;cursor:default}[hidden]{display:none!important}::selection{background:#eee0c2}h1,h2,h3{font-weight:600;letter-spacing:-.045em}h2{font-size:56px;line-height:1.2}.muted{color:#86868b}.section-shell{width:min(1180px,calc(100% - 96px));margin-inline:auto}.eyebrow,.tiny-index{font-size:11px;letter-spacing:.12em;font-weight:500}.eyebrow{margin-bottom:24px}.tiny-index{color:var(--gray)}.text-link{display:inline-flex;align-items:center;gap:12px;color:var(--blue);font-size:15px;padding:5px 0;line-height:1.5}.text-link span{transition:transform .3s}.text-link:hover span{transform:translate(3px,-3px)}.round-button{height:44px;width:44px;border-radius:50%;background:#e8e8ed;font-size:21px;display:inline-grid;place-items:center;transition:background .2s,transform .2s}.round-button:hover{background:#dedee4;transform:scale(1.04)}.skip-link{position:fixed;z-index:200;left:20px;top:-100px;padding:14px 20px;background:#fff;border:1px solid var(--line);border-radius:10px}.skip-link:focus{top:15px}.site-header{height:72px;position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:0 max(48px,calc((100vw - 1280px)/2));background:rgba(255,255,255,.8);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%);border-bottom:1px solid rgba(0,0,0,.065)}.brand{flex-shrink:0}.brand img{width:146px;height:auto}.desktop-nav{display:flex;gap:38px;margin-left:auto;margin-right:38px}.desktop-nav a{font-size:12px;color:#4e4e52;transition:color .2s}.desktop-nav a:hover,.desktop-nav a[aria-current]{color:#000}.nav-actions{display:flex;align-items:center;gap:18px}.compact-button{font-size:12px;background:var(--ink);border-radius:99px;padding:10px 17px;color:white;white-space:nowrap}.compact-button span{margin-left:12px}.menu-button{display:none}.mobile-nav{position:fixed;inset:72px 0 auto;background:#fafafc;z-index:39;padding:28px}.mobile-nav a{display:block;padding:18px;border-bottom:1px solid var(--line);font-size:22px}.hero{min-height:820px;height:calc(100svh - 72px);max-height:1100px;display:flex;flex-direction:column;align-items:center;position:relative;padding:57px 48px 30px;overflow:hidden}.hero-heading{text-align:center;position:relative;z-index:2}.hero-heading .eyebrow{font-size:12px;margin-bottom:17px;letter-spacing:.2em}.hero h1{font-size:80px;line-height:1.13;letter-spacing:-.055em}.hero-subtitle{font-size:20px;color:#646469;margin-top:20px;letter-spacing:.08em}.hero-stage{position:relative;flex:1;width:min(1110px,100%);min-height:420px;display:grid;place-items:center;perspective:1100px}.hero-art{width:clamp(390px,35vw,520px);height:auto;will-change:transform;transform-style:preserve-3d;position:relative;z-index:1}.hero-art img{width:100%;height:auto;animation:hero-arrive 1.5s var(--ease) both}.hero-note{position:absolute;top:46%;color:var(--gray)}.hero-note p{font-size:13px;line-height:1.9;letter-spacing:.14em;margin-top:14px}.note-left{left:5%}.note-right{right:2%;text-align:right}.hero-note .tiny-index{font-size:9px;color:#939396;letter-spacing:.14em}.note-line{display:block;width:28px;height:1px;background:#c7c7cd;margin-top:18px}.note-right .note-line{margin-left:auto}.hero-bottom{width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;max-width:1280px;margin-top:20px}.hero-bottom>span{font-size:10px;letter-spacing:.045em;color:#909095}.hero-bottom .scroll-label{text-align:right}.scroll-label span{margin-left:18px}.glass-pill{display:inline-flex;align-items:center;justify-content:center;gap:28px;border-radius:99px;border:1px solid rgba(255,255,255,.85);background:rgba(239,239,242,.7);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%);box-shadow:inset 0 0 0 1px rgba(90,90,100,.055),inset 0 2px 3px rgba(255,255,255,.8);padding:8px 9px 8px 24px;font-size:13px;min-height:53px;transition:background .4s,transform .4s var(--ease);position:relative}.glass-pill:hover{background:rgba(230,230,234,.85)}a.glass-pill:hover,button.glass-pill:hover{transform:translateY(-2px)}.circle-icon{width:34px;height:34px;border-radius:50%;background:#fff;display:inline-grid;place-items:center;font-size:18px}.about{padding-top:130px;padding-bottom:90px}.section-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--gray);padding-bottom:32px;border-bottom:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;padding:74px 0 80px}.focus-heading{font-size:65px;line-height:1.35;position:relative;align-self:start;width:max-content}.focus-word{position:relative;transition:filter .55s,opacity .55s}.focus-frame{position:absolute;pointer-events:none;left:-13px;top:-3px;width:calc(100% + 26px);height:1.35em;transition:transform .7s var(--ease),opacity .3s;opacity:0}.focus-frame i{position:absolute;width:10px;height:10px;border-color:#b9a570;border-style:solid}.focus-frame i:nth-child(1){left:0;top:0;border-width:1px 0 0 1px}.focus-frame i:nth-child(2){right:0;top:0;border-width:1px 1px 0 0}.focus-frame i:nth-child(3){left:0;bottom:0;border-width:0 0 1px 1px}.focus-frame i:nth-child(4){right:0;bottom:0;border-width:0 1px 1px 0}.about-copy .lead{font-size:25px;color:var(--ink);line-height:1.6;font-weight:500;margin-bottom:24px}.about-copy p{font-size:16px;line-height:1.85;color:var(--gray);margin-bottom:18px}.about-copy .text-link{margin-top:15px}.about-foot{border-top:1px solid var(--line);padding-top:25px;display:flex;justify-content:space-between;color:#929297;font-size:11px}.featured{background:var(--mist);padding-top:110px}.featured-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:66px}.project-meta{display:flex;flex-direction:column;gap:13px;padding-bottom:6px;font-size:14px}.project-meta .project-name{font-size:30px;font-weight:600;letter-spacing:-.04em}.project-meta .tiny-index{font-size:10px;letter-spacing:0;margin-top:2px}.case-scroll{height:270vh;position:relative}.case-sticky{position:sticky;top:96px;width:min(1320px,calc(100% - 96px));margin:auto;height:calc(100svh - 116px);max-height:940px;min-height:530px}.case-canvas{height:calc(100% - 77px);background:white;border-radius:28px;position:relative;isolation:isolate;overflow:hidden;perspective:1400px}.case-scene{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .75s var(--ease),transform 1s var(--ease),visibility .75s;transform:scale(1.04)}.case-scene.is-active{visibility:visible;opacity:1;transform:scale(1)}.scene-identity{display:flex;align-items:center}.case-scene-copy{position:absolute;left:8%;z-index:1;top:25%}.case-scene-copy h3{font-size:44px;line-height:1.25;margin:23px 0}.case-scene-copy p{font-size:15px;color:var(--gray);line-height:1.8}.uiut-mark{position:absolute;right:18%;height:64%;width:auto;top:10%;object-fit:contain;will-change:transform}.scene-detail{position:absolute;right:12%;bottom:16%;font-size:10px;letter-spacing:.15em;color:#86868b}.scene-products>img,.scene-experience>img{height:100%;width:100%;object-fit:cover}.scene-products>img{object-position:50% 47%}.case-image-caption{position:absolute;top:7%;left:6%}.case-image-caption h3{font-size:35px;margin:16px 0 8px}.case-image-caption p{font-size:13px;color:#58545b}.scene-experience>img{object-position:35% center}.campaign-copy{position:absolute;right:5%;top:10%;text-align:right;color:white}.campaign-copy .tiny-index{color:white}.campaign-copy h3{font-size:clamp(38px,5.1vw,76px);line-height:1;margin:25px 0 20px;letter-spacing:-.045em}.campaign-copy p{font-size:20px;letter-spacing:.1em}.case-controls{position:absolute;z-index:5;bottom:22px;left:50%;transform:translateX(-50%);padding:6px;gap:4px;min-height:48px;white-space:nowrap;background:rgba(247,247,249,.8)}.case-controls:hover{background:rgba(247,247,249,.9)}.case-controls button{border-radius:99px;padding:12px 18px;font-size:12px;transition:background .3s,color .3s;color:#666;display:flex;align-items:center;gap:8px}.case-controls button[aria-current]{background:#fff;color:#1d1d1f}.case-controls button span{font-size:9px;opacity:.5}.case-controls button i{display:none}.case-footer{height:77px;display:flex;align-items:center;justify-content:space-between;font-size:14px;padding:0 12px}.case-footer p{font-weight:600}.case-footer p span{margin-left:26px;font-weight:400;color:var(--gray);font-size:12px}.case-footer .text-link{font-size:13px}.work{padding:120px 0 95px;overflow:hidden;background:var(--mist)}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px}.section-heading>.text-link{margin-bottom:8px}.depth-gallery{height:480px;perspective:1600px;position:relative;margin-top:48px;touch-action:pan-y;cursor:grab;overflow:hidden}.depth-gallery:active{cursor:grabbing}.depth-track{position:absolute;inset:0;transform-style:preserve-3d}.depth-card{position:absolute;left:50%;top:50%;width:540px;height:370px;padding:0;border-radius:28px;overflow:hidden;background:#fff;transform-style:preserve-3d;backface-visibility:hidden;transition:transform .85s var(--ease),filter .85s,opacity .85s;will-change:transform;user-select:none;cursor:inherit}.depth-card img{width:100%;height:100%;object-fit:cover;pointer-events:none}.depth-card[data-case="0"] img{object-fit:contain;background:#ce151a}.depth-card[data-case="1"] img{object-fit:cover;object-position:top}.depth-card[data-case="2"] img{object-position:50% 3%}.depth-card[data-case="3"] img{object-position:center 20%}.depth-card[data-case="4"] img{object-position:50% 85%}.depth-card[data-case="5"] img{object-position:50% 80%}.depth-card::after{content:"";position:absolute;inset:0;background:rgba(245,245,247,var(--fog,0));pointer-events:none}.depth-card .card-view{position:absolute;right:18px;bottom:18px;width:34px;height:34px;background:#fff;border-radius:50%;display:grid;place-items:center;opacity:0;transition:opacity .3s}.depth-card.is-current:hover .card-view{opacity:1}.gallery-foot{display:flex;align-items:center;justify-content:space-between;padding-top:8px;max-width:900px}.gallery-caption{display:grid;grid-template-columns:80px auto;gap:8px 24px;align-items:center}.gallery-caption h3{font-size:29px;letter-spacing:-.03em}.gallery-caption p{grid-column:2;color:var(--gray);font-size:13px}.gallery-actions{display:flex;align-items:center;gap:40px}.gallery-actions .text-link{font-size:13px}.gallery-arrows{display:flex;gap:10px}.gallery-hint{text-align:center;margin-top:35px;color:#929299;font-size:11px;letter-spacing:.06em}.all-work{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-top:65px}.work-tile{text-align:left;padding:0}.work-tile img{aspect-ratio:4/3;width:100%;object-fit:cover;border-radius:20px}.work-tile strong{display:block;margin-top:18px;font-size:19px;font-weight:500}.work-tile span{display:block;color:var(--gray);font-size:12px;margin-top:8px}.universe{padding:120px 0 100px}.section-intro{color:var(--gray);font-size:15px;line-height:1.85;padding-bottom:8px}.ip-showcase{margin-top:54px;background:#fafafa;border-radius:28px;min-height:650px;display:grid;grid-template-columns:1.3fr 1fr;align-items:center;position:relative;padding:48px 75px 115px;gap:70px;overflow:hidden}.ip-visual{height:465px;display:grid;place-items:center;perspective:1000px;position:relative}.ip-visual img{height:100%;width:100%;object-fit:contain;transition:opacity .3s,transform .8s var(--ease);mix-blend-mode:multiply}.ip-showcase[data-ip="2"]{background:#272728;color:#fff}.ip-showcase[data-ip="2"] .ip-visual img{mix-blend-mode:normal;border-radius:20px}.ip-showcase[data-ip="2"] .ip-copy p,.ip-showcase[data-ip="2"] .tiny-index{color:#bfbfc3}.ip-copy h3{font-size:39px;line-height:1.35;margin:25px 0 22px}.ip-copy p{font-size:15px;color:var(--gray);line-height:1.9}.ip-copy .text-link{margin-top:24px;font-size:13px}.ip-selector{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);gap:3px;padding:6px;white-space:nowrap}.ip-selector button{padding:11px 21px;border-radius:99px;font-size:12px;color:#666;transition:background .3s}.ip-selector button[aria-selected="true"]{background:white;color:#1d1d1f}.ip-signature{display:flex;gap:12px;align-items:center;justify-content:center;font-size:13px;letter-spacing:.1em;margin-top:39px}.ip-signature span{font-size:10px;letter-spacing:.01em;color:#888}.ip-signature i{width:1px;height:15px;background:#ddd;margin:0 18px}.approach{padding-top:45px;padding-bottom:125px}.approach-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;padding-top:65px}.approach-heading p{font-size:15px;color:var(--gray);line-height:1.9}.approach-heading .tiny-index{display:block;margin-top:16px;font-size:10px;letter-spacing:.025em}.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:130px;margin-top:65px;align-items:center;min-height:390px}.system-visual{height:400px;position:relative}.system-ring{position:absolute;border:1px solid #d3d3d8;width:245px;height:245px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(245,245,247,.15);transition:border .7s,background .7s,transform .7s,color .7s;color:#999}.system-ring span{font-size:15px;display:flex;flex-direction:column;gap:7px;text-align:center}.system-ring small{font-size:8px;letter-spacing:.15em}.ring-one{left:calc(50% - 122px);top:0;z-index:1;align-items:start;padding-top:59px}.ring-two{left:0;bottom:0;justify-content:start;padding-left:50px}.ring-three{right:0;bottom:0;justify-content:end;padding-right:50px}.system-ring.is-active{border-color:#989084;background:rgba(239,235,225,.48);color:var(--ink);z-index:2}.step{border-bottom:1px solid var(--line)}.step:first-child{border-top:1px solid var(--line)}.step h3 button{display:flex;align-items:center;width:100%;text-align:left;padding:24px 0;font-size:20px;font-weight:500;gap:21px}.step h3 button>span{font-size:10px;color:#96969b;font-weight:400;letter-spacing:0}.step h3 button i{margin-left:auto;font-style:normal;font-weight:400;font-size:19px;color:#888}.step-content{padding:0 0 28px 34px}.step-content p{font-size:14px;line-height:1.85;color:var(--gray)}.step-content .step-question{color:var(--ink);font-size:17px;margin:1px 0 10px}.step-content>span{display:block;margin-top:20px;font-size:11px;color:#888}.contact-section{background:var(--mist);padding:110px 24px 68px;display:flex;align-items:center;flex-direction:column;text-align:center}.contact-section h2{font-size:76px;line-height:1.14}.contact-section>p:not(.eyebrow){font-size:16px;color:var(--gray);margin-top:28px}.contact-section>.glass-pill{margin-top:32px;background:#e8e8ec}.contact-section>img{margin-top:65px;width:47px;height:auto;mix-blend-mode:multiply}.site-footer{padding:25px 48px;display:flex;justify-content:space-between;background:var(--mist);border-top:1px solid #e1e1e6;gap:24px;font-size:10px;color:#86868b}.site-footer>div{display:flex;gap:30px;align-items:center}.site-footer button{font-size:10px;padding:5px}.site-footer a:hover,.site-footer button:hover{color:#333}.reveal{opacity:1}.js-enabled .reveal{opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease),transform 1s var(--ease)}.js-enabled .reveal.is-visible{opacity:1;transform:none}dialog{padding:0;border:none;border-radius:28px;background:white;color:var(--ink);max-height:90svh;overscroll-behavior:contain}dialog::backdrop{background:rgba(20,20,24,.5);backdrop-filter:blur(12px)}dialog[open]{animation:dialog-in .35s var(--ease)}.dialog-close{position:sticky;top:20px;left:calc(100% - 64px);margin:20px 20px -64px auto;z-index:3;background:rgba(236,236,240,.94);font-size:26px}.project-dialog{width:min(980px,calc(100% - 40px))}.dialog-project-heading{padding:65px 65px 45px}.dialog-project-heading h2{font-size:60px;margin-bottom:20px}.dialog-project-heading>p:last-child{font-size:16px;line-height:1.9;color:var(--gray);max-width:670px}#project-dialog-images{display:flex;flex-direction:column;gap:22px;padding:0 32px 32px}#project-dialog-images figure{margin:0;background:var(--mist);border-radius:18px;overflow:hidden}#project-dialog-images img{width:100%;height:auto}#project-dialog-images figcaption{padding:15px 20px;font-size:12px;color:var(--gray)}.contact-dialog{width:min(700px,calc(100% - 32px));padding:68px 48px 26px;text-align:center}.contact-dialog .dialog-close{position:absolute;right:0;left:auto;top:0;margin:18px}.contact-dialog h2{font-size:44px;line-height:1.25}.contact-dialog>p:not(.eyebrow):not(.copy-status){font-size:14px;color:var(--gray);line-height:1.9;margin:25px 0}.contact-dialog>img{width:100%;border-radius:16px}.contact-dialog>.text-link{margin-top:26px}.copy-status{height:25px;font-size:12px;color:var(--gray);padding-top:8px}.film-dialog{width:min(820px,calc(100% - 30px));background:#f5f5f7;text-align:center}.film-dialog video{height:70svh;max-width:100%;width:100%;object-fit:contain}.film-dialog>p{font-size:13px;padding:20px}.reduce-motion *, .reduce-motion *::before,.reduce-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reduce-motion .reveal{opacity:1!important;transform:none!important}.reduce-motion .focus-word{filter:none!important;opacity:1!important}.reduce-motion .focus-frame{display:none}.reduce-motion .hero-art{transform:none!important}.reduce-motion .case-scroll{height:auto}.reduce-motion .case-sticky{position:relative;top:0;height:auto;max-height:none;min-height:0}.reduce-motion .case-canvas{height:auto;background:none;overflow:visible}.reduce-motion .case-scene{position:relative;min-height:570px;visibility:visible;opacity:1;transform:none;border-radius:28px;overflow:hidden;margin-bottom:24px;background:#fff}.reduce-motion .scene-products>img,.reduce-motion .scene-experience>img{position:absolute;inset:0}.reduce-motion .case-controls{display:none}.reduce-motion .uiut-mark{transform:none!important}.reduce-motion .case-footer{min-height:77px}.reduce-motion .depth-card{filter:none!important}
@keyframes hero-arrive{from{opacity:0;transform:translateY(45px) scale(.93)}to{opacity:1;transform:none}}@keyframes dialog-in{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
@media(min-width:1600px){.hero-art{width:550px}.hero{padding-top:65px}.hero-stage{min-height:560px}}
@media(max-width:1100px){.desktop-nav{gap:24px;margin-right:15px}.section-shell{width:calc(100% - 72px)}.hero{padding-inline:36px}.hero h1{font-size:72px}.hero-note .tiny-index{font-size:8px}.note-left{left:0}.note-right{right:0}.hero-art{width:440px}.about-grid{gap:45px;grid-template-columns:1fr 1fr}.focus-heading{font-size:54px}.about-copy .lead{font-size:22px}h2{font-size:48px}.case-sticky{width:calc(100% - 64px)}.case-scene-copy{left:6%}.case-scene-copy h3{font-size:36px}.uiut-mark{right:15%;height:58%;top:15%}.ip-showcase{padding-inline:38px;gap:35px}.ip-copy h3{font-size:34px}.approach-grid{gap:65px}.system-ring{width:215px;height:215px}.system-visual{height:360px}.ring-one{left:calc(50% - 107px)}.ring-two{padding-left:35px}.ring-three{padding-right:35px}.gallery-foot{max-width:780px}.depth-card{width:490px;height:350px}.featured-heading{gap:40px}}
@media(max-width:760px){html{scroll-padding-top:82px}.site-header{height:65px;padding:0 22px;gap:16px}.brand img{width:128px}.desktop-nav{display:none}.nav-actions{gap:16px}.compact-button{font-size:10px;padding:9px 12px}.compact-button span{margin-left:8px}.menu-button{width:25px;height:36px;padding:6px 2px;display:flex;flex-direction:column;justify-content:center;gap:6px}.menu-button span{width:21px;height:1px;background:var(--ink);transition:transform .3s}.menu-button[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-button[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.mobile-nav{top:65px}.section-shell{width:calc(100% - 44px)}.hero{padding:55px 22px 27px;height:calc(100svh - 65px);min-height:720px;max-height:880px}.hero-heading .eyebrow{font-size:9px;letter-spacing:.15em;margin-bottom:17px}.hero h1{font-size:clamp(44px,10.8vw,65px);letter-spacing:-.065em}.hero-subtitle{font-size:16px;margin-top:19px}.hero-stage{min-height:385px;width:100%}.hero-art{width:min(410px,92vw)}.hero-note{display:none}.hero-bottom{display:flex;flex-direction:column;gap:21px;margin-top:0}.hero-bottom>span:first-child{order:2;font-size:9px}.hero-bottom .scroll-label{display:none}.glass-pill{font-size:12px;min-height:49px}.hero-bottom .glass-pill{padding-left:23px;gap:25px}.about{padding-top:80px;padding-bottom:55px}.section-label{padding-bottom:23px;font-size:10px}.section-label .tiny-index{font-size:9px}.about-grid{grid-template-columns:1fr;gap:34px;padding:42px 0 40px}.focus-heading{font-size:43px;line-height:1.4}.about-copy .lead{font-size:22px;line-height:1.55}.about-copy p{font-size:15px;line-height:1.85}.about-copy .text-link{font-size:13px;margin-top:8px}.about-foot{gap:15px;font-size:9px;flex-wrap:wrap;padding-top:20px}.about-foot>span:last-child{display:none}.featured{padding-top:65px}h2{font-size:35px;letter-spacing:-.045em;line-height:1.23}.eyebrow{font-size:9px;margin-bottom:20px}.featured-heading{display:block;margin-bottom:30px}.project-meta{margin-top:28px;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;align-items:center;font-size:12px}.project-meta .project-name{font-size:22px}.project-meta .tiny-index{grid-column:1 / -1;font-size:10px}.case-scroll{height:240svh}.case-sticky{top:84px;width:calc(100% - 32px);height:calc(100svh - 110px);min-height:510px;max-height:780px}.case-canvas{height:calc(100% - 91px);border-radius:28px}.case-scene-copy{left:28px;top:30px}.case-scene-copy h3{font-size:29px;margin:15px 0 12px}.case-scene-copy p{font-size:12px;line-height:1.7}.case-scene-copy .tiny-index{font-size:8px}.uiut-mark{height:43%;top:42%;right:22%}.scene-detail{display:none}.case-controls{bottom:15px;min-height:40px;padding:4px;gap:0}.case-controls button{font-size:10px;padding:10px 11px;gap:5px}.case-controls button span{font-size:8px}.case-footer{height:91px;align-items:start;justify-content:center;flex-direction:column;gap:9px;padding:12px 8px}.case-footer p{font-size:13px}.case-footer p span{font-size:10px;margin-left:12px}.case-footer .text-link{font-size:11px;padding:0}.scene-products>img{object-fit:contain;background:#f2c8dc;object-position:center 57%}.case-image-caption{top:30px;left:25px;right:20px}.case-image-caption .tiny-index{font-size:8px}.case-image-caption h3{font-size:27px;margin-top:16px}.case-image-caption p{font-size:11px}.scene-experience>img{object-position:32% center}.campaign-copy{right:24px;top:26px}.campaign-copy .tiny-index{font-size:8px}.campaign-copy h3{font-size:44px}.campaign-copy p{font-size:14px}.work{padding:70px 0 60px}.section-heading{align-items:start;gap:25px;flex-direction:column}.section-heading>.text-link{font-size:12px;margin:0}.depth-gallery{height:325px;margin-top:24px;perspective:1100px}.depth-card{width:78vw;height:260px;border-radius:24px}.gallery-foot{padding-top:14px;gap:20px;align-items:start}.gallery-caption{display:flex;flex-direction:column;align-items:start;gap:9px}.gallery-caption .tiny-index{font-size:9px}.gallery-caption h3{font-size:23px}.gallery-caption p{font-size:10px;line-height:1.5;max-width:210px}.gallery-actions{flex-direction:column-reverse;gap:15px;align-items:end}.gallery-actions .text-link{font-size:11px}.gallery-arrows{gap:7px}.round-button{width:36px;height:36px;font-size:18px}.gallery-hint{font-size:10px;margin-top:26px}.all-work{grid-template-columns:repeat(2,1fr);gap:30px 16px;padding-top:40px}.work-tile img{border-radius:16px}.work-tile strong{font-size:17px}.work-tile span{font-size:10px;line-height:1.6}.universe{padding:70px 0 55px}.section-intro{font-size:13px;line-height:1.8;padding:0}.ip-showcase{margin-top:30px;display:flex;flex-direction:column;gap:25px;min-height:710px;padding:30px 27px 99px}.ip-visual{height:310px;width:100%}.ip-copy{width:100%;min-height:207px}.ip-copy .tiny-index{font-size:9px}.ip-copy h3{font-size:27px;line-height:1.3;margin:14px 0}.ip-copy p{font-size:13px;line-height:1.8}.ip-copy .text-link{font-size:12px;margin-top:15px}.ip-selector{bottom:22px;min-height:45px;padding:4px;gap:0}.ip-selector button{padding:10px 12px;font-size:10px}.ip-signature{font-size:10px;gap:10px;margin-top:25px;letter-spacing:.04em}.ip-signature span{display:none}.ip-signature i{margin:0 6px}.approach{padding-top:25px;padding-bottom:65px}.approach-heading{flex-direction:column;align-items:start;gap:22px;padding-top:40px}.approach-heading p{font-size:13px;line-height:1.9}.approach-heading .tiny-index{font-size:9px;margin-top:12px}.approach-grid{grid-template-columns:1fr;gap:40px;margin-top:45px}.system-visual{width:330px;max-width:100%;height:305px;margin:auto}.system-ring{width:195px;height:195px}.ring-one{left:calc(50% - 97px);padding-top:39px}.ring-two{padding-left:27px}.ring-three{padding-right:27px}.system-ring span{font-size:12px;gap:7px}.system-ring small{font-size:7px}.step h3 button{font-size:18px;padding:21px 0}.step-content{padding-left:33px}.step-content p{font-size:13px}.step-content .step-question{font-size:16px}.step-content>span{font-size:10px}.contact-section{padding:70px 22px 45px}.contact-section h2{font-size:56px}.contact-section>p:not(.eyebrow){font-size:13px;margin-top:22px}.contact-section>.glass-pill{margin-top:26px}.contact-section>img{margin-top:42px;width:40px}.site-footer{padding:24px 22px;flex-direction:column;gap:22px;font-size:9px}.site-footer>div{justify-content:space-between;gap:12px}.site-footer button{font-size:9px;padding:0}.dialog-close{top:15px;margin:15px 15px -51px auto;left:calc(100% - 51px);font-size:23px}.dialog-project-heading{padding:65px 27px 30px}.dialog-project-heading h2{font-size:42px;margin-bottom:17px}.dialog-project-heading>p:last-child{font-size:13px;line-height:1.9}#project-dialog-images{gap:15px;padding:0 15px 15px}#project-dialog-images figcaption{font-size:10px;padding:13px}.contact-dialog{padding:65px 25px 25px}.contact-dialog h2{font-size:35px}.contact-dialog>p:not(.eyebrow):not(.copy-status){font-size:12px;line-height:1.8;margin:22px 0}.contact-dialog .dialog-close{margin:15px}.contact-dialog>.text-link{font-size:12px}.film-dialog video{height:60svh}.reduce-motion .case-scene{min-height:510px}.reduce-motion .case-footer{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Give the product family a dedicated image field beneath its caption. */
.scene-products{display:grid;grid-template-rows:auto minmax(0,1fr);padding:38px 48px 90px;gap:20px;background:#fff}
.scene-products>.case-image-caption{position:static;grid-row:1}
.scene-products>img{grid-row:2;position:static;width:100%;height:100%;object-fit:contain;border-radius:18px;background:#fff}
.reduce-motion .scene-products{height:700px;display:grid}
.reduce-motion .scene-products>img{position:static}
@media(max-width:760px){.scene-products{padding:30px 20px 78px;gap:22px}.scene-products>img{object-fit:contain;background:#fff}.reduce-motion .scene-products{height:510px}}
/* Constrain intrinsic image and diagram sizes at narrow viewport widths. */
.ip-visual{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0}
.ip-visual img{height:100%;max-height:100%;min-height:0;min-width:0;width:100%;object-fit:contain}
.approach-grid>*{min-width:0}
@media(max-width:760px){.approach-grid{grid-template-columns:minmax(0,1fr)}.system-visual{width:100%;max-width:330px}.case-sticky{height:min(590px,calc(100svh - 110px));max-height:590px}}
@media(max-width:380px){.system-visual{height:280px}.system-ring{width:175px;height:175px}.ring-one{left:calc(50% - 87.5px)}.ring-two{padding-left:20px}.ring-three{padding-right:20px}.ip-selector button{padding:10px 9px}.nav-actions{gap:10px}.site-header{padding-inline:18px}.brand img{width:118px}}

/* Double helix: two counterposed image ribbons in a single continuous 3D field. */
.depth-gallery{height:530px;margin-top:38px;perspective:1100px;isolation:isolate;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.depth-track{transform-style:preserve-3d}
.depth-card{width:230px;height:326px;border-radius:13px;transition:none;box-shadow:0 10px 25px -17px #26263366,1px 0 0 #fff9,-1px 0 0 #b7c6db66;outline-offset:5px}
.depth-card img,.depth-card[data-case="0"] img{object-fit:cover;object-position:center;background:#fff}
.depth-card[data-case="0"] img{object-position:48% center}
.depth-card[data-case="4"] img{object-position:center}
.depth-card::after{background:rgba(245,245,247,var(--fog,0));border:1px solid #ffffff50;border-radius:inherit}
.depth-card .card-view{z-index:2;right:12px;bottom:12px;background:rgba(255,255,255,.45);border:.5px solid rgba(255,255,255,.65);box-shadow:0 2px 7px #1a203012,inset 0 .5px .5px #ffffffb3;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%)}
.depth-card:hover .card-view,.depth-card:focus-visible .card-view{opacity:1}
.depth-gallery.is-dragging,.depth-gallery.is-dragging *{cursor:grabbing}
.gallery-foot{max-width:1000px;padding-top:16px}.gallery-actions{gap:24px}.gallery-hint{margin-top:30px}
#gallery-pause{font-size:16px}.reduce-motion #gallery-pause{display:none}

/* Regular glass: one translucent material with a fine optical edge. */
:root{--glass-blur:28px;--glass-tint:rgba(255,255,255,.38);--glass-ink:#232326;--glass-edge:rgba(255,255,255,.76);--glass-shadow:0 2px 5px rgba(25,30,42,.035),0 8px 22px -12px rgba(25,30,42,.18)}
.liquid-button,.case-controls,.ip-selector{--light-x:34%;--light-y:8%;--light-angle:135deg;--tilt-x:0deg;--tilt-y:0deg;--shift-x:0px;--shift-y:0px;border:0;border-radius:999px;background:var(--glass-tint);color:var(--glass-ink);box-shadow:var(--glass-shadow),inset 0 .5px .5px rgba(255,255,255,.95),inset 0 -.5px .5px rgba(65,70,85,.12);backdrop-filter:blur(var(--glass-blur)) saturate(145%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(145%)}
.liquid-button{position:relative;isolation:isolate;transform:perspective(700px) translate3d(var(--shift-x),var(--shift-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:transform .48s cubic-bezier(.22,1,.36,1),background-color .28s,box-shadow .28s,color .28s;touch-action:manipulation;outline-offset:4px}
.liquid-button::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse 90% 120% at var(--light-x) var(--light-y),rgba(255,255,255,.42),rgba(255,255,255,.08) 48%,transparent 76%);opacity:.55;transition:opacity .3s}
.liquid-button::after,.case-controls::after,.ip-selector::after{content:"";position:absolute;inset:0;pointer-events:none;padding:.65px;border-radius:inherit;background:linear-gradient(var(--light-angle,135deg),rgba(255,255,255,.98),rgba(255,255,255,.12) 32%,rgba(87,98,118,.10) 55%,rgba(255,255,255,.68) 83%,rgba(255,255,255,.82));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.85}
.liquid-button:hover{background-color:rgba(255,255,255,.49);box-shadow:0 3px 7px rgba(25,30,42,.04),0 10px 26px -13px rgba(25,30,42,.19),inset 0 .5px .5px #fff,inset 0 -.5px .5px rgba(65,70,85,.10);transform:perspective(700px) translate3d(var(--shift-x),var(--shift-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) scale(1.012)}
.liquid-button:hover::before{opacity:.85}
.liquid-button:active,.liquid-button.is-pressed{background-color:rgba(255,255,255,.56);transform:scale(.975);box-shadow:0 1px 4px rgba(25,30,42,.05),inset 0 .5px .75px rgba(255,255,255,.85);transition:transform .14s cubic-bezier(.2,.8,.3,1),background-color .14s,box-shadow .14s}
.liquid-button:active::before,.liquid-button.is-pressed::before{opacity:1}
.liquid-button.text-link{padding:11px 19px;font-size:13px;gap:12px;color:#24476b;min-height:44px;font-weight:500}
.liquid-button.compact-button{color:#fff;background:rgba(40,42,47,.80);box-shadow:0 2px 5px rgba(15,18,26,.08),0 7px 18px -12px rgba(15,18,26,.22),inset 0 .5px .5px rgba(255,255,255,.22),inset 0 -.5px .5px rgba(0,0,0,.15)}
.liquid-button.compact-button::before{background:radial-gradient(ellipse at var(--light-x) var(--light-y),rgba(255,255,255,.15),transparent 72%)}
.liquid-button.compact-button::after{background:linear-gradient(var(--light-angle),#ffffff70,#ffffff10 35%,#ffffff06 60%,#ffffff35);opacity:.6}
.liquid-button.compact-button:hover{background:rgba(45,47,52,.86)}
.liquid-button.round-button{min-width:44px;min-height:44px;flex-shrink:0;background-color:rgba(255,255,255,.38)}
.liquid-button.round-button:hover{background-color:rgba(255,255,255,.56)}
.liquid-button .circle-icon{background:none;border:0;box-shadow:none;width:30px;height:30px;font-size:17px}
.liquid-button.glass-pill{padding:9px 14px 9px 25px;gap:20px;min-height:54px;font-weight:500;background:var(--glass-tint)}
.contact-section>.liquid-button{background:rgba(255,255,255,.43)}
.liquid-button.dialog-close{background:rgba(245,245,247,.58);font-weight:300}
.site-footer .liquid-button{padding:8px 12px;background:rgba(255,255,255,.23);box-shadow:0 1px 4px #1a20300a,inset 0 .5px .5px #ffffffb3}
.menu-button.liquid-button{width:44px;height:44px;padding:12px}
.liquid-button:disabled{opacity:.4;transform:none;cursor:not-allowed;box-shadow:none}
.reduce-motion .liquid-button{transform:none!important}
/* The selected segment belongs to the parent material, avoiding glass on glass. */
.case-controls,.ip-selector{position:absolute;isolation:isolate;padding:5px;gap:3px;background:rgba(244,244,247,.60);box-shadow:0 3px 8px #171c2b09,0 12px 30px -18px #171c2b2b,inset 0 .5px .5px #ffffffeb}
.case-controls:hover,.ip-selector:hover{background:rgba(244,244,247,.60)}
.glass-selection{position:absolute;left:0;top:5px;height:calc(100% - 10px);width:var(--selection-width,0px);border-radius:999px;background:rgba(255,255,255,.76);box-shadow:0 1px 4px rgba(25,30,42,.055),inset 0 .5px .5px #fff,inset 0 -.5px .5px #777e8a10;transform:translateX(var(--selection-x,5px));transition:transform .48s cubic-bezier(.22,1,.36,1),width .48s cubic-bezier(.22,1,.36,1),background .35s;pointer-events:none;z-index:0}
.case-controls button.liquid-button,.ip-selector button.liquid-button{position:relative;z-index:1;isolation:auto;background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;color:#636369;font-weight:500;transition:color .25s,transform .35s}
.case-controls button.liquid-button::before,.case-controls button.liquid-button::after,.ip-selector button.liquid-button::before,.ip-selector button.liquid-button::after{content:none}
.case-controls button.liquid-button[aria-current],.ip-selector button.liquid-button[aria-selected="true"]{color:#1d1d1f;background:transparent;box-shadow:none}
.case-controls button.liquid-button:hover,.ip-selector button.liquid-button:hover{background:transparent;color:#1d1d1f;box-shadow:none;transform:none}
.case-controls button.liquid-button:active,.ip-selector button.liquid-button:active{transform:scale(.97)}
.ip-showcase[data-ip="2"] .ip-selector{background:rgba(58,58,64,.56);box-shadow:0 4px 18px #0002,inset 0 .5px .5px #ffffff29}
.ip-showcase[data-ip="2"] .ip-selector::after{opacity:.35}
.ip-showcase[data-ip="2"] .glass-selection{background:rgba(255,255,255,.15);box-shadow:inset 0 .5px .5px #ffffff3d,0 1px 3px #0001}
.ip-showcase[data-ip="2"] .ip-selector button.liquid-button{color:#bcbcc1}
.ip-showcase[data-ip="2"] .ip-selector button.liquid-button[aria-selected="true"],.ip-showcase[data-ip="2"] .ip-selector button.liquid-button:hover{color:#fff}
.ip-showcase[data-ip="2"] #ip-film{color:#fff;background:#ffffff1f}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.liquid-button,.case-controls,.ip-selector{background:#f0f1f4}.liquid-button.compact-button{background:#33353a}.ip-showcase[data-ip="2"] .ip-selector{background:#3b3b40}}
@media(prefers-reduced-transparency:reduce){.liquid-button,.case-controls,.ip-selector{--glass-tint:#f1f2f5;backdrop-filter:none;-webkit-backdrop-filter:none;background:#f1f2f5}.liquid-button.compact-button{background:#34353a}.ip-showcase[data-ip="2"] .ip-selector{background:#3b3b40}}
@media(prefers-contrast:more){.liquid-button,.case-controls,.ip-selector{outline:1px solid currentColor;outline-offset:-1px}.glass-selection{background:#fff;box-shadow:0 0 0 1px #717178}.case-controls button.liquid-button,.ip-selector button.liquid-button{outline:0}}
@media(max-width:760px){.depth-gallery{height:390px;margin-top:18px;perspective:850px;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}.depth-card{width:165px;height:238px;border-radius:10px}.gallery-foot{gap:12px;padding-top:4px}.gallery-actions{gap:12px}.gallery-arrows{gap:6px}.gallery-actions .liquid-button.text-link{font-size:11px;padding:9px 12px;min-height:36px}.gallery-arrows .round-button{min-width:36px;min-height:36px;width:36px;height:36px}.gallery-caption p{max-width:175px}.liquid-button.text-link{font-size:12px;padding:10px 16px}.case-footer .liquid-button.text-link{font-size:10px;padding:7px 11px;min-height:32px}.case-controls,.ip-selector{gap:2px}.case-controls button{padding:9px 10px}.ip-selector button{padding:10px 11px}.site-footer .liquid-button{padding:7px 10px}.contact-section>.liquid-button{font-size:12px}}

.step{padding:8px 0}.step h3 .liquid-button{border-radius:20px;padding:20px 18px;background:rgba(245,245,247,.30);box-shadow:inset 0 .5px .5px #ffffffb3,0 2px 8px #1a203006}.step.is-open h3 .liquid-button{background:rgba(240,241,244,.52);box-shadow:inset 0 .5px .5px #ffffffd9,0 2px 8px #1a203009}.step-content{padding-top:18px}.step h3 .liquid-button:hover{transform:none;background:rgba(240,241,244,.60)}.step h3 .liquid-button:active{transform:scale(.99)}
@media(max-width:760px){.menu-button.liquid-button{width:44px;height:44px}.liquid-button.glass-pill{min-height:50px;padding:8px 12px 8px 23px;gap:18px}.case-controls,.ip-selector{padding:5px;gap:2px}.case-controls button.liquid-button{padding:10px 11px}.ip-selector button.liquid-button{padding:11px 12px}}
@media(max-width:380px){.ip-selector button.liquid-button{padding:11px 9px}.site-header .compact-button{padding:10px 13px}}

/* The hero keeps the original character as the visual focus. */
.hero-stage{min-height:440px;position:relative}


.hero-art{width:clamp(350px,32vw,445px);pointer-events:none}
.hero-note{z-index:2}.hero-note.note-left{left:0}.hero-note.note-right{right:0}
.hero-interaction-hint{display:flex;align-items:center;justify-content:center;gap:10px;color:#99958b;font-size:10px;letter-spacing:.08em;margin:0 0 8px;position:relative;z-index:2}
.hero-interaction-hint i{font-size:13px;font-style:normal;color:#a4977b}.hint-touch{display:none}.hero-bottom{margin-top:12px}
.reduce-motion .hero-interaction-hint{visibility:hidden}
/* Scroll-linked chapters: readable holds connected by continuous motion. */
.case-scroll{height:235vh}.case-canvas{touch-action:pan-y}
.case-scene,.case-scene.is-active{transition:none;will-change:opacity,transform;transform-origin:center}
.identity-aura{position:absolute;right:6%;top:5%;width:48%;height:83%;border-radius:50%;background:radial-gradient(ellipse at 65% 38%,#ffc3fc24,transparent 62%),radial-gradient(ellipse at 30% 75%,#ddf7bc1a,transparent 58%);pointer-events:none;transition:transform .5s var(--ease)}
.uiut-mark{transition:transform .42s var(--ease);transform-origin:50% 55%}
.case-scene-copy,.case-image-caption,.campaign-copy{transform:translateY(calc((1 - var(--scene-reveal,1))*18px));opacity:clamp(0,calc(var(--scene-reveal,1)*1.5),1)}
.scene-products>img{transform:translateY(calc((1 - var(--scene-reveal,1))*16px)) scale(calc(1 + (1 - var(--scene-reveal,1))*.025));transform-origin:50% 60%}
.scene-experience>img{transform:scale(calc(1.025 + (1 - var(--scene-reveal,1))*.035))}
.case-position{position:absolute;right:28px;top:24px;z-index:6;font-size:10px;letter-spacing:.12em;color:#a0a0a5;display:flex;align-items:center;gap:5px;pointer-events:none}
#case-position-current{color:#5c5c64}.case-position i{display:block;width:58px;height:1px;background:#d9d9df;margin-left:12px;position:relative}
.case-position i::after{content:"";position:absolute;inset:0;background:#f459e5;transform:scaleX(var(--case-progress,0));transform-origin:left}
.case-canvas[data-scene="2"] .case-position,.case-canvas[data-scene="2"] #case-position-current{color:#fff}.case-canvas[data-scene="2"] .case-position i{background:#ffffff4d}.case-canvas[data-scene="2"] .case-position i::after{background:#fff}
.case-controls button.liquid-button{position:relative;overflow:hidden}
.case-controls button i{display:block;position:absolute;left:20%;right:20%;bottom:4px;height:1.5px;border-radius:4px;background:#f15add;transform:scaleX(var(--chapter-progress,0));transform-origin:left;opacity:.6}
.case-controls button:not([aria-current]) i{opacity:0}
/* Four standalone original characters on one calm, consistent display surface. */
.ip-showcase,.ip-showcase[data-ip="2"]{background:#fff;color:var(--ink);border:1px solid #ededf0}
.ip-showcase[data-ip="2"] .ip-copy p,.ip-showcase[data-ip="2"] .tiny-index{color:var(--gray)}
.ip-visual{overflow:hidden;height:465px;isolation:isolate}
.ip-visual img,.ip-showcase[data-ip="2"] .ip-visual img{mix-blend-mode:normal;border-radius:0;object-fit:contain;max-width:none;position:relative;z-index:1}
.ip-showcase[data-ip="1"] .ip-visual img,.ip-showcase[data-ip="2"] .ip-visual img{object-fit:cover}
.ip-showcase[data-ip="3"] .ip-visual img{height:96%;width:100%}
.ip-showcase[data-ip="2"] .ip-selector{background:rgba(244,244,247,.60);box-shadow:0 3px 8px #171c2b09,0 12px 30px -18px #171c2b2b,inset 0 .5px .5px #ffffffeb}
.ip-showcase[data-ip="2"] .ip-selector::after{opacity:.85}.ip-showcase[data-ip="2"] .glass-selection{background:rgba(255,255,255,.76);box-shadow:0 1px 4px #191e2a0e,inset 0 .5px .5px #fff}
.ip-showcase[data-ip="2"] .ip-selector button.liquid-button{color:#636369}.ip-showcase[data-ip="2"] .ip-selector button.liquid-button[aria-selected="true"],.ip-showcase[data-ip="2"] .ip-selector button.liquid-button:hover{color:#1d1d1f}
.reduce-motion .case-position{display:none}.reduce-motion .case-scene-copy,.reduce-motion .case-image-caption,.reduce-motion .campaign-copy{opacity:1;transform:none}.reduce-motion .case-scene>img{transform:none!important}
@media(min-width:1600px){.hero-art{width:490px}}
@media(max-width:1100px) and (min-width:761px){.hero-note p{font-size:11px}.hero-art{width:390px}.hero-note .tiny-index{font-size:7px}}
@media(max-width:760px){.hero-stage{min-height:350px}.hero-art{width:min(285px,77vw)}.hero-interaction-hint{font-size:9px;margin-top:3px;margin-bottom:13px}.hint-desktop{display:none}.hint-touch{display:inline}.hero-bottom{margin-top:0}.case-scroll{height:220svh}.case-position{top:17px;right:18px;font-size:8px}.case-position i{width:36px;margin-left:6px}.case-scene-copy{top:52px}.case-image-caption{padding-top:13px}.campaign-copy{top:48px}.identity-aura{right:3%;top:35%;width:80%;height:60%}.ip-visual{height:340px;width:100%}.ip-showcase[data-ip="1"] .ip-visual img,.ip-showcase[data-ip="2"] .ip-visual img{object-fit:cover}.ip-showcase{min-height:740px}.case-controls button i{bottom:3px}}
@media(max-width:380px){.hero-stage{min-height:320px}.hero-art{width:245px}.ip-visual{height:300px}}

/* The original character is the interactive surface. */
.hero-art{position:relative;isolation:isolate}
.hero-ip-canvas{position:absolute;inset:-12%;width:124%;height:124%;opacity:0;pointer-events:none}
.hero-art.is-deformable .hero-ip-canvas{opacity:1}
.hero-art.is-deformable>img{opacity:0;animation:none}
.reduce-motion .hero-art.is-deformable .hero-ip-canvas{opacity:0}
.reduce-motion .hero-art.is-deformable>img{opacity:1}

/* Original brand typography sits beside the content it belongs to. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.brand img{width:158px;mix-blend-mode:multiply}
.brand-wish{align-self:center;max-width:490px}
.brand-wish img{width:100%;height:auto}
.brand-wish>p{font-size:12px;letter-spacing:.18em;color:#88888d;margin-top:30px;padding-left:12px}
.brand-spirit{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:90px;padding:88px 0 10px}
.brand-spirit .eyebrow{font-size:9px;color:#8b8b90;margin-bottom:20px}
.brand-spirit h3{font-size:32px;line-height:1.4}
.brand-spirit p:last-child{font-size:13px;line-height:1.9;color:#808085;margin-top:23px}
.brand-spirit>img{width:100%;height:auto}
.brand-principle{display:flex;justify-content:space-between;align-items:center;gap:70px;border-top:1px solid var(--line);padding:70px 0 0;margin-top:70px}
.brand-principle img{width:min(350px,40%);height:auto}
.brand-principle p{color:#7d7d84;font-size:15px;line-height:1.9}
.contact-section>.contact-slogan{width:min(660px,90%);height:auto;margin:0 auto;display:block}



.site-footer{display:block;background:#000;color:#aaa;padding:65px max(48px,calc((100vw - 1180px)/2)) 24px}
.footer-brand{display:flex;align-items:center;justify-content:space-between;padding-bottom:48px}
.footer-brand>img{width:90px;height:auto}
.footer-brand p{text-align:right;line-height:2;font-size:13px;color:#ccc}
.footer-brand p span{font-size:10px;letter-spacing:.08em;color:#6e6e73}
.site-footer .footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid #ffffff26;padding-top:24px;font-size:10px}
.footer-bottom>div{display:flex;gap:24px;align-items:center}
.site-footer button.liquid-button{color:#ddd;background:rgba(255,255,255,.10);box-shadow:inset 0 .5px .5px #ffffff30}
.project-chapter{display:grid;gap:20px;scroll-margin-top:88px}
.project-chapter h3{display:flex;justify-content:space-between;align-items:center;font-size:25px;padding:28px 12px 8px}
.project-chapter h3 span{font-size:10px;letter-spacing:.12em;color:#939398;font-weight:400}
.project-chapter-nav{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:7px;overflow:auto;white-space:nowrap;padding:10px 12px;background:rgba(250,250,252,.92);border:1px solid #e9e9ed;border-radius:18px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.project-chapter-nav a{font-size:12px;color:#6c6c73;padding:11px 15px;border-radius:11px;transition:background .25s,color .25s}
.project-chapter-nav a:hover{background:#fff;color:#111}
.project-chapter figure{margin:0;border-radius:16px;overflow:hidden;background:#f5f5f7}
.ip-showcase[data-ip="4"] .ip-visual img{height:100%;width:100%;object-fit:contain}
.ip-showcase[data-ip="4"] .ip-visual{background:#f1f1f1;border-radius:22px}
.ip-archive{padding-top:72px}
.ip-archive-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}
.ip-archive-heading .eyebrow{font-size:10px;color:#86868b;margin-bottom:16px}
.ip-archive-heading h3{font-size:31px;line-height:1.3}
.ip-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ip-archive-card{display:block;padding:0;border-radius:24px;overflow:hidden;background:#fff;border:1px solid #ededf1;text-align:left;transition:transform .5s var(--ease),box-shadow .5s}
.ip-archive-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px #1d1d2510}
.ip-archive-card>img{width:100%;height:auto;aspect-ratio:1.6;object-fit:cover}
.archive-card-copy{display:flex;flex-direction:column;gap:13px;padding:27px 25px}
.archive-card-copy small{font-size:8px;letter-spacing:.12em;color:#99999e}
.archive-card-copy strong{font-size:20px;font-weight:600;letter-spacing:-.03em}
.archive-card-copy>span{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#86868b;gap:12px}
.archive-card-copy i{font-size:15px;font-style:normal;color:#555}
@media(max-width:760px){
 .brand img{width:137px}
 .brand-wish{max-width:390px}
 .brand-wish>p{font-size:10px;margin-top:18px}
 .brand-spirit{grid-template-columns:1fr;gap:36px;padding:55px 0 0}
 .brand-spirit h3{font-size:27px}.brand-spirit p:last-child{font-size:12px}
 .brand-principle{align-items:flex-start;flex-direction:column;gap:25px;padding-top:45px;margin-top:45px}
 .brand-principle img{width:240px;max-width:90%}.brand-principle p{font-size:12px}
 .contact-section>.contact-slogan{width:100%}

 .site-footer{padding:42px 22px 22px}.footer-brand>img{width:68px}
 .footer-brand{padding-bottom:30px}.footer-brand p{font-size:10px}.footer-brand p span{font-size:7px}
 .site-footer .footer-bottom{flex-direction:column;align-items:flex-start;gap:16px;font-size:9px}
 .footer-bottom>div{width:100%;justify-content:space-between}
 .project-chapter-nav{gap:0;padding:6px;border-radius:13px}.project-chapter-nav a{font-size:10px;padding:10px 12px}
 .project-chapter{gap:14px}.project-chapter h3{font-size:21px;padding:20px 9px 5px}
 .ip-selector button.liquid-button{font-size:10px;padding:11px 8px}
 .ip-selector{max-width:calc(100% - 18px);gap:1px}
 .ip-archive{padding-top:50px}.ip-archive-heading{align-items:flex-start;flex-direction:column;gap:20px}
 .ip-archive-heading h3{font-size:26px}.ip-archive-heading h3 span{display:block}
 .ip-archive-grid{grid-template-columns:1fr;gap:22px}
 .archive-card-copy{padding:24px}.archive-card-copy strong{font-size:22px}
}

/* UIUT: the website itself leads the case, with its brand system revealed on scroll. */
.featured-heading{margin-bottom:48px}
.featured-heading h2{max-width:850px}
.case-canvas{background:#f9dff5;border:1px solid rgba(23,23,28,.08);box-shadow:0 14px 48px rgba(26,19,35,.06)}
.case-browser-bar{position:absolute;top:0;left:0;right:0;height:50px;z-index:7;display:flex;align-items:center;gap:18px;padding:0 22px;background:rgba(255,255,255,.91);border-bottom:1px solid rgba(22,22,28,.075);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
.case-browser-dots{display:flex;align-items:center;gap:6px}
.case-browser-dots i{display:block;width:7px;height:7px;border-radius:50%;background:#dedee3}
.case-browser-dots i:first-child{background:#f668e6}
.case-browser-dots i:last-child{background:#c9ff46}
.case-browser-title{font-size:10px;font-weight:600;letter-spacing:.16em;color:#5d5b62}
.case-browser-bar a{margin-left:auto;color:#202025;font-size:11px;font-weight:500;white-space:nowrap;transition:color .25s}
.case-browser-bar a:hover{color:#0066cc}
.case-browser-bar a span{margin-left:7px}
.case-scene.scene-website{inset:50px 0 0;background:#fce6f6}
.case-website-preview{position:absolute;inset:0;display:block;overflow:hidden}
.case-website-preview picture,.case-website-preview img{display:block;width:100%;height:100%}
.case-website-preview img{object-fit:cover;object-position:center top;transform:translate3d(var(--case-pointer-x,0px),var(--case-pointer-y,0px),0) scale(1.012);transition:transform .55s var(--ease)}
.case-website-preview:focus-visible{outline:4px solid #0071e3;outline-offset:-5px}
.case-web-note{position:absolute;left:24px;bottom:23px;z-index:3;max-width:calc(100% - 430px);display:flex;flex-direction:column;gap:6px;pointer-events:none;padding:14px 18px;border-radius:15px;color:#1d1d1f;background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.78);box-shadow:0 8px 24px rgba(35,20,40,.10),inset 0 1px 0 #fff;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%)}
.case-web-note span{font-size:9px;letter-spacing:.15em;color:#77717a}
.case-web-note strong{font-size:13px;font-weight:600;letter-spacing:-.01em}
.case-position{display:none}
#case-position-current{color:#26212a}
.case-canvas[data-scene="2"] .case-position,.case-canvas[data-scene="2"] #case-position-current{color:#514757}
.case-canvas[data-scene="2"] .case-position i{background:#7777}
.case-canvas[data-scene="2"] .case-position i::after{background:#f459e5}
.case-footer .text-link{font-weight:600}
.live-browser{width:min(1320px,calc(100% - 96px));height:min(820px,82svh);min-height:620px;margin:auto;position:relative;border:1px solid #e4dce5;border-radius:28px;overflow:hidden;isolation:isolate;background:#fff;box-shadow:0 18px 65px #281b3510}
.live-browser .case-browser-bar{height:56px;padding:0 20px}
.live-indicator{margin-left:auto;display:flex;gap:7px;align-items:center;font-size:9px;color:#838087;white-space:nowrap}
.live-indicator i{width:5px;height:5px;border-radius:50%;background:#6aaf60;box-shadow:0 0 0 3px #6aaf6012}
.live-browser-actions{display:flex;align-items:center;gap:14px;margin-left:10px}
.live-browser-actions .liquid-button{font-size:10px;min-height:32px;padding:7px 12px;white-space:nowrap}
.live-browser-actions #uiut-reload{height:32px;width:32px;min-width:32px;padding:0;font-size:18px}
.live-browser-actions a{font-size:10px}
.live-preview-surface{position:absolute;inset:56px 0 0;overflow:hidden;background:#fce8f8}
.live-preview-surface iframe{display:block;height:100%;width:100%;border:0;background:#fce8f8}
.live-preview-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;color:#777;background:#faf8fb;transition:opacity .4s,visibility .4s;pointer-events:none}
.live-preview-loading>span{width:15px;height:15px;border:1.5px solid #dfd9e1;border-top-color:#5c565f;border-radius:50%;animation:preview-connect 1s linear infinite}
.is-loaded .live-preview-loading{opacity:0;visibility:hidden}
.live-local-launch{position:absolute;inset:0;display:block;overflow:hidden;background:#fce8f8}
.live-local-launch>img{height:100%;width:100%;object-fit:cover;object-position:center top}
.live-local-launch>span{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);padding:16px 22px;border-radius:99px;background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 10px 30px #20132218;font-size:12px;color:#2a3650;white-space:nowrap}
@keyframes preview-connect{to{transform:rotate(360deg)}}
.live-case-footer{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-top:27px;padding-bottom:20px}
.live-case-footer p{font-size:14px}.live-case-footer p span{margin-left:24px;color:#89898e;font-size:12px}
.live-case-footer .text-link{white-space:nowrap}
.live-browser:fullscreen{width:100vw;height:100vh;border-radius:0;min-height:0;border:0;max-height:none}
@media(max-width:760px){
 .live-browser{width:calc(100% - 32px);height:80svh;min-height:590px;border-radius:22px}
 .live-browser .case-browser-bar{height:44px;padding:0 12px;gap:8px}
 .live-browser .case-browser-title{font-size:7px;letter-spacing:.07em}
 .live-preview-surface{inset:44px 0 0}
 .live-indicator{display:none}.live-browser-actions{margin-left:auto;gap:8px}
 .live-browser-actions #uiut-reload{width:28px;min-width:28px;height:28px;min-height:28px;font-size:16px}
 .live-browser-actions #uiut-fullscreen{display:none}.live-browser-actions a{font-size:9px}
 .live-case-footer{align-items:flex-start;flex-direction:column;gap:18px;padding-top:22px}
 .live-case-footer p{font-size:13px}.live-case-footer p span{display:block;margin:9px 0 0;font-size:11px;line-height:1.6}
}
.reduce-motion .case-website-preview img{transform:none!important}
.reduce-motion .case-scene.scene-website{inset:auto;background:#fce6f6}
.reduce-motion .case-browser-bar{display:none}
.reduce-motion .case-web-note{bottom:22px;max-width:calc(100% - 48px)}
@media(max-width:760px){
  .featured-heading{margin-bottom:28px}
  .featured-heading h2{font-size:clamp(34px,9vw,48px)}
  .case-canvas{border-radius:22px}
  .case-browser-bar{height:42px;padding:0 14px;gap:9px}
  .case-browser-title{font-size:8px;letter-spacing:.08em}
  .case-browser-bar a{font-size:9px}
  .case-browser-dots{gap:4px}.case-browser-dots i{width:5px;height:5px}
  .case-scene.scene-website{inset:42px 0 0}
  .case-website-preview img{object-fit:cover;object-position:center 23%}
  .case-web-note{left:12px;bottom:76px;max-width:calc(100% - 24px);padding:9px 12px;border-radius:12px}
  .case-web-note span{font-size:7px}.case-web-note strong{font-size:10px}
  .case-position{top:54px;right:14px}
  .case-controls{bottom:17px}
  .case-controls button.liquid-button{font-size:10px}
  .case-footer{height:auto;min-height:72px;align-items:center;gap:10px}
  .case-footer p span{display:none}
  .case-footer .liquid-button.text-link{font-size:10px}
  .reduce-motion .case-scene.scene-website{inset:auto}
}

/* Company and character form one continuous About chapter. */
.about{padding-bottom:0}.about .universe{padding-top:100px;padding-bottom:105px}.about .universe .section-intro{max-width:380px}.nav-actions a.compact-button{display:inline-flex;align-items:center;justify-content:center}.nav-actions a.compact-button[aria-current]{color:#fff}
/* A considered introduction before entering the UIUT brand world. */
.featured{padding-bottom:0}.uiut-preview-card{display:grid;grid-template-columns:1.08fr 1fr;min-height:560px;isolation:isolate;position:relative;border:1px solid rgba(255,255,255,.95);border-radius:32px;overflow:hidden;background:rgba(255,255,255,.7);box-shadow:0 16px 55px -30px #34334930,inset 0 1px 0 #fff;transition:transform .55s var(--ease),box-shadow .55s var(--ease)}
.uiut-preview-art{position:relative;display:flex;align-items:center;justify-content:center;min-height:560px;background:radial-gradient(ellipse at 22% 24%,#ffd9fb 0,transparent 65%),radial-gradient(ellipse at 86% 86%,#ebf5ce88,transparent 60%),#fcf5fc;border-right:1px solid #ebe5ec}
.uiut-preview-art img{width:auto;height:300px;object-fit:contain;transition:transform .7s var(--ease);filter:drop-shadow(0 14px 24px #ff69e514)}
.uiut-art-index,.uiut-art-caption{position:absolute;left:36px;font-size:10px;letter-spacing:.14em;color:#817584}.uiut-art-index{top:32px}.uiut-art-caption{bottom:31px;left:0;width:100%;text-align:center;font-size:9px;letter-spacing:.22em}
.uiut-preview-copy{align-self:center;padding:55px 15%}.uiut-preview-copy>.tiny-index{font-size:10px;letter-spacing:.13em}.uiut-preview-copy h3{font-size:66px;letter-spacing:-.065em;margin:34px 0 7px;line-height:1}.uiut-preview-name{font-size:19px;letter-spacing:.01em}.uiut-preview-description{font-size:15px;color:var(--gray);line-height:1.95;margin:29px 0 23px}.uiut-preview-tags{display:flex;gap:8px;flex-wrap:wrap}.uiut-preview-tags span{font-size:10px;border:1px solid #e7e4e9;border-radius:50px;padding:6px 10px;color:#79717d}.uiut-preview-action{display:flex;align-items:center;gap:26px;font-size:14px;font-weight:500;margin-top:35px;color:#34303a}.uiut-preview-action i{display:grid;place-items:center;font-size:20px;font-style:normal;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.68);border:1px solid #fff;box-shadow:0 4px 12px -6px #45404c44,inset 0 -1px 1px #d6d2da88;transition:transform .45s var(--ease)}
.uiut-preview-card:hover{transform:translateY(-4px);box-shadow:0 23px 65px -30px #34334938}.uiut-preview-card:hover .uiut-preview-art img{transform:translateY(-5px) scale(1.025)}.uiut-preview-card:hover .uiut-preview-action i{transform:translate(3px,-3px)}.uiut-preview-note{text-align:center;font-size:11px;color:#98929d;margin-top:25px;letter-spacing:.03em}
/* Individual projects: a clear image, its name, and a quietly frosted surface. */
.work{padding:110px 0 120px;overflow:clip}.work .section-heading{margin-bottom:48px}.work .section-intro{max-width:310px;font-size:13px}.case-collection{position:relative;isolation:isolate}.case-collection::before{content:"";position:absolute;z-index:-1;inset:4% -4%;pointer-events:none;background:radial-gradient(ellipse 70% 24% at 0% 10%,#dfe7f358,transparent 80%),radial-gradient(ellipse 60% 24% at 100% 50%,#e7e0d652,transparent 80%),radial-gradient(ellipse 60% 30% at 0% 90%,#dfe7e84a,transparent 80%)}
.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.project-card{position:relative;display:flex;flex-direction:column;min-width:0;text-align:left;padding:10px;border-radius:28px;background:rgba(255,255,255,.56);border:1px solid rgba(255,255,255,.96);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%);box-shadow:0 10px 30px -22px #30343f45,inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff8a;transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .45s;overflow:hidden}
.project-card-visual{position:relative;display:block;aspect-ratio:16/11;border-radius:20px;overflow:hidden;background:#f1f1f3}.project-card-visual img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .75s var(--ease)}.project-card[data-case="0"] .project-card-visual img{object-fit:contain;background:#171717}.project-card[data-case="4"] .project-card-visual img{object-position:center 30%}.project-card[data-case="8"] .project-card-visual img{object-position:center 12%}
.project-card-number{position:absolute;top:15px;left:16px;display:grid;place-items:center;min-width:31px;height:25px;padding:0 8px;background:#ffffffb8;border:1px solid #ffffffc9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:20px;color:#3d3d43;font-size:9px;letter-spacing:.1em}.project-card-copy{display:block;padding:24px 18px 20px}.project-card-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.project-card-heading strong{font-size:25px;font-weight:600;letter-spacing:-.04em}.project-card-arrow{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border:1px solid #ffffffda;border-radius:50%;background:#ffffff6b;box-shadow:0 3px 9px -6px #292e4859,inset 0 -1px 1px #c9ccd94a;font-size:18px;font-weight:400;color:#5e6270;transition:transform .4s var(--ease)}.project-card-category{display:block;color:#777880;font-size:13px;line-height:1.7;margin-top:5px}.project-card-tags{display:flex;flex-wrap:wrap;gap:7px 16px;border-top:1px solid #e1e3e680;margin-top:21px;padding-top:16px}.project-card-tags>span{font-size:10px;line-height:1.6;color:#9898a0;letter-spacing:.02em}
@media(hover:hover){.project-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.7);box-shadow:0 19px 42px -25px #30343f4d,inset 0 1px 0 #fff}.project-card:hover img{transform:scale(1.035)}.project-card:hover .project-card-arrow{transform:translate(2px,-2px)}}
.project-card:active{transform:scale(.992)}.project-card:focus-visible,.uiut-preview-card:focus-visible{outline:3px solid #0071e3;outline-offset:6px}.approach{padding-top:95px}
@media(max-width:1100px){.uiut-preview-card{min-height:510px}.uiut-preview-art{min-height:510px}.uiut-preview-copy{padding:40px 11%}.uiut-preview-copy h3{font-size:58px}.case-grid{gap:26px}.project-card-copy{padding:21px 13px 16px}}
@media(max-width:760px){.about .universe{padding:65px 0 70px}.featured-heading{margin-bottom:28px}.uiut-preview-card{grid-template-columns:1fr;min-height:0;border-radius:25px}.uiut-preview-art{min-height:330px;border-right:0;border-bottom:1px solid #ebe5ec}.uiut-preview-art img{height:215px}.uiut-art-index{left:24px;top:24px;font-size:8px}.uiut-art-caption{font-size:8px;bottom:21px}.uiut-preview-copy{padding:35px 29px 30px}.uiut-preview-copy h3{font-size:48px;margin-top:23px}.uiut-preview-name{font-size:17px}.uiut-preview-description{font-size:13px;margin:21px 0 18px}.uiut-preview-description br:nth-child(2){display:none}.uiut-preview-action{justify-content:space-between;font-size:13px;margin-top:25px}.uiut-preview-note{font-size:10px;line-height:1.7;margin-top:19px}.work{padding:70px 0 75px}.work .section-heading{gap:23px;margin-bottom:30px}.work .section-intro{font-size:12px}.case-grid{grid-template-columns:1fr;gap:25px}.project-card{border-radius:25px;padding:8px}.project-card-visual{border-radius:18px;aspect-ratio:16/11}.project-card-copy{padding:21px 17px 18px}.project-card-heading strong{font-size:24px}.project-card-category{font-size:12px}.project-card-tags{margin-top:18px;padding-top:14px}.approach{padding-top:65px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.project-card{background:#fcfcfd}}
@media(prefers-reduced-transparency:reduce){.project-card{background:#fcfcfd;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* One continuous closing surface, with the original signature inside it. */
.contact-section{background:var(--mist);padding-bottom:44px}
.contact-section>.contact-slogan{mix-blend-mode:multiply}


.site-footer{border-top:0}
@media(max-width:760px){.contact-section{padding-bottom:30px}}

/* The cooperation invitation ends directly at the footer. */
.contact-section{padding-bottom:100px}
@media(max-width:760px){.contact-section{padding-bottom:65px}}

/* Responsive art direction: keep type, character and controls in proportion. */
:root{--header-height:72px}
html{scroll-padding-top:calc(var(--header-height) + 18px)}
.site-header{padding-left:max(24px,env(safe-area-inset-left),calc((100vw - 1280px)/2));padding-right:max(24px,env(safe-area-inset-right),calc((100vw - 1280px)/2))}
.hero{padding-top:clamp(28px,5.5svh,57px)}
.project-card-visual img{height:100%;width:100%}
.ip-showcase{min-width:0}.ip-copy{min-width:0}.ip-selector button{min-height:44px}
@media(min-width:761px) and (max-width:1100px){
 .section-shell{width:calc(100% - 80px)}
 .site-header{gap:22px}.brand img{width:142px}.desktop-nav{gap:24px;margin-right:8px}.nav-actions{gap:12px}
 h2{font-size:clamp(38px,4.7vw,52px)}
 .hero{min-height:740px;height:calc(100svh - var(--header-height));max-height:1000px;padding-inline:40px}
 .hero h1{font-size:clamp(60px,7.4vw,78px)}.hero-stage{min-height:340px}.hero-art{width:clamp(320px,41vw,420px)}
 .hero-note .tiny-index{font-size:7px}.hero-note p{font-size:11px}.hero-bottom{gap:18px}.hero-bottom>span{font-size:9px}
 .about{padding-top:95px}.about-grid{gap:45px;padding:55px 0}.about-copy .lead{font-size:23px}.about-copy p{font-size:15px}
 .section-heading{gap:28px}.section-intro{font-size:13px;max-width:270px}
 .ip-showcase{grid-template-columns:1fr 1fr;min-height:590px;padding:35px 32px 110px;gap:26px}.ip-visual{height:370px}.ip-copy h3{font-size:30px}.ip-copy p{font-size:14px}
 .ip-showcase[data-ip] .ip-visual img{object-fit:contain;border-radius:0}
 .ip-archive-grid{gap:15px}.archive-card-copy{padding:23px 18px}.archive-card-copy strong{font-size:18px}.archive-card-copy>span{font-size:9px}
 .uiut-preview-card,.uiut-preview-art{min-height:480px}.uiut-preview-art img{height:250px}.uiut-preview-copy{padding:38px 10%}.uiut-preview-description{font-size:14px}
 .case-grid{gap:24px}.project-card-heading strong{font-size:24px}.project-card-category{font-size:12px}
 .approach-grid{gap:45px}.system-ring{width:190px;height:190px}.system-visual{height:320px}.ring-one{left:calc(50% - 95px);padding-top:40px}.ring-two{padding-left:25px}.ring-three{padding-right:25px}.system-ring span{font-size:12px}
 .approach-heading p{font-size:13px;max-width:330px}.contact-section{padding-top:90px;padding-bottom:85px}
}
@media(max-width:760px){
 :root{--header-height:65px}
 .site-header{gap:12px;padding-inline:max(18px,env(safe-area-inset-left)) max(18px,env(safe-area-inset-right))}.brand img{width:clamp(112px,34vw,137px)}.nav-actions{gap:10px}
 .site-header .compact-button{min-height:38px;font-size:10px;padding:9px 13px}.menu-button.liquid-button{flex-shrink:0;min-height:44px;min-width:44px}
 .mobile-nav{max-height:calc(100dvh - var(--header-height));overflow-y:auto}
 .hero{height:calc(100svh - var(--header-height));min-height:590px;max-height:960px;padding:clamp(28px,5svh,48px) 22px max(22px,env(safe-area-inset-bottom))}
 .hero-heading .eyebrow{font-size:9px;letter-spacing:.12em}.hero h1{font-size:clamp(40px,10.5vw,62px)}.hero-subtitle{font-size:16px;margin-top:16px}
 .hero-stage{min-height:0;width:100%;padding:16px 0}.hero-art{width:min(76vw,38svh,330px)}
 .hero-interaction-hint{font-size:9px;margin:0 0 12px}.hero-bottom{gap:16px}.hero-bottom>span:first-child{font-size:9px;line-height:1.6}
 .section-shell{width:calc(100% - 40px)}h2{font-size:clamp(32px,8.5vw,43px);line-height:1.25}
 .ip-showcase{padding:28px 24px 105px;min-height:0;gap:22px}.ip-visual{height:clamp(270px,78vw,380px)}.ip-copy{min-height:0;padding-bottom:6px}.ip-copy h3{font-size:clamp(26px,6.8vw,33px)}
 .ip-showcase[data-ip] .ip-visual img{object-fit:contain;border-radius:0}
 .ip-selector{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:calc(100% - 30px);max-width:480px;bottom:22px;gap:0}
 .ip-selector button.liquid-button{font-size:clamp(9px,2.65vw,12px);padding:11px 3px;min-width:0;min-height:44px}
 .uiut-preview-art{min-height:clamp(280px,80vw,390px)}.uiut-preview-art img{height:clamp(185px,52vw,245px)}
 .uiut-preview-copy{padding:32px clamp(24px,7vw,40px)}.uiut-preview-description{line-height:1.9}.uiut-preview-description br:nth-child(2){display:initial}
 .project-card-heading strong{font-size:clamp(22px,6vw,27px)}.project-card-arrow{width:40px;height:40px}.project-card-tags>span{font-size:11px}
 .project-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 24px)}.dialog-project-heading{padding:65px 24px 30px}.dialog-project-heading h2{font-size:clamp(30px,9vw,44px);overflow-wrap:anywhere}.project-chapter-nav a{min-height:44px;display:inline-flex;align-items:center}
 .contact-dialog{max-height:calc(100dvh - 24px)}.contact-dialog>img{height:auto}
 .brand-principle p,.about-copy p,.ip-copy p{line-height:1.9}
 .footer-brand{gap:24px}.footer-brand p{max-width:72%}.footer-bottom>div{gap:14px}.site-footer .liquid-button{min-height:44px}.site-footer a[href="#top"]{padding-block:14px}
}
@media(max-width:360px){.site-header .compact-button{padding-inline:10px}.compact-button span{margin-left:5px}.nav-actions{gap:6px}.site-header{padding-inline:14px}.hero h1{font-size:38px}.hero-heading .eyebrow{font-size:8px}.ip-showcase{padding-inline:20px}}
@media(max-height:600px) and (orientation:landscape){
 .hero{height:auto;min-height:640px;padding-top:30px;padding-bottom:24px}.hero-stage{min-height:300px}.hero-art{width:280px}.hero h1{font-size:54px}.hero-subtitle{font-size:17px}
 .mobile-nav{inset:var(--header-height) 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:0 20px;padding:15px 28px}.mobile-nav a{font-size:18px;padding:15px}
}
@media(hover:none) and (pointer:coarse){.project-card:hover,.uiut-preview-card:hover{transform:none}.project-card:hover img,.uiut-preview-card:hover img{transform:none}}