:root{--bg:#fff;--ink:#2b2b2b;--mute:#6b6e7e;--tint:#e5e7f2;--tint2:#f4f4fa;--line:#d4d6e2;--accent:#2a3b9e;color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#14151c;--ink:#ececf2;--mute:#a0a3b8;--tint:#232538;--tint2:#1b1d2a;--line:#33364b;--accent:#9aa8ff;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#14151c;--ink:#ececf2;--mute:#a0a3b8;--tint:#232538;--tint2:#1b1d2a;--line:#33364b;--accent:#9aa8ff;color-scheme:dark}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.55 Inter,system-ui,sans-serif}
.serif{font-family:Marcellus,Georgia,serif;font-weight:400;letter-spacing:-.02em;line-height:1.05;margin:0}
a{color:inherit}.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
nav{display:flex;justify-content:space-between;align-items:center;padding:36px 0}
nav .logo{font-size:22px;text-decoration:none}nav div a{margin-left:36px;text-decoration:none;color:var(--mute);font-size:15px;padding-bottom:4px}
nav div a.on{color:var(--ink);border-bottom:1px solid var(--ink)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.eb{margin-bottom:20px}.label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:end;padding:120px 0 90px;border-bottom:1px solid var(--line)}
.hero h1{font-size:clamp(64px,10vw,132px)}.hero p{font-size:clamp(22px,2.6vw,32px);margin:0 0 20px}
h2.sec{font-size:clamp(36px,4vw,52px);margin:70px 0 40px}
.proj{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center;margin-bottom:110px}
.proj:nth-child(even) .vis{order:2}.proj:nth-child(even){grid-template-columns:1fr 1.25fr}
.vis{background:var(--tint);border-radius:28px;aspect-ratio:1.4;display:grid;place-items:center;padding:36px}
.mock{width:78%;height:78%;background:var(--bg);border-radius:12px;padding:16px;display:grid;gap:10px;align-content:start;box-shadow:0 1px 0 var(--line)}
.mock i{display:block;height:9px;border-radius:5px;background:var(--line)}.mock i:first-child{width:50%;background:var(--accent);opacity:.6}
.mock b{display:block;height:46%;border-radius:8px;background:var(--tint2)}
.proj h3{font-size:clamp(38px,4.4vw,58px);margin-bottom:20px}.tags span{display:inline-block;border:1px solid var(--mute);border-radius:99px;padding:3px 14px;font-size:13px;margin:0 8px 8px 0}
.proj p{max-width:380px;color:var(--ink)}.link{display:inline-block;margin-top:14px;text-decoration:none;font-size:15px}.link:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.note{background:var(--tint);border-radius:16px;padding:16px 22px;margin-bottom:56px;font-size:14px}.note b{font-weight:500}
.cs-head{display:grid;grid-template-columns:1.3fr 1fr;gap:56px}.cs-head h1{font-size:clamp(44px,6vw,80px)}
.cs-head p{color:var(--mute);margin:0 0 18px;font-size:15px}
.meta{display:flex;gap:64px;flex-wrap:wrap;margin:44px 0}.meta div span{display:block;font-size:12px;color:var(--accent);margin-bottom:4px}
.stats{background:var(--tint);border-radius:28px;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:44px 0}
.stats div{text-align:center;padding:0 24px;border-left:1px solid var(--line)}.stats div:first-child{border:0}
.stats .serif{font-size:clamp(44px,6vw,76px)}.stats small{color:var(--mute);font-size:14px;display:block;margin-top:8px}
.row{display:grid;grid-template-columns:1fr 2fr;gap:56px;padding:72px 0 0}.row h2{font-size:clamp(34px,4.4vw,58px)}.row p{color:var(--mute);max-width:640px}
.steps{list-style:none;padding:0;margin:48px 0 0;grid-column:1/-1}.steps li{display:grid;grid-template-columns:1fr 2fr;gap:56px;border-top:1px solid var(--line);padding:22px 0;color:var(--mute)}
.steps li::before{content:attr(data-n);color:var(--accent);font-size:13px}
.quote{background:var(--tint);border-radius:28px;padding:44px;margin-top:80px}.quote p{font-family:Marcellus,Georgia,serif;font-weight:400;font-size:clamp(28px,3.4vw,44px);line-height:1.15;margin:0 0 12px;max-width:900px}
.refl{background:var(--tint2);border-radius:28px;padding:20px 44px 44px;margin-top:80px}
.pair{display:grid;grid-template-columns:1fr 2fr;gap:56px;border-top:1px solid var(--line);padding:24px 0}.pair b{font-weight:500}.pair p{margin:0;color:var(--mute)}
.about{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-top:0}
.photo{aspect-ratio:1.22;border-radius:28px;background:linear-gradient(160deg,#0c0d14,#2a3b9e);display:grid;place-items:center;color:#cfd3ff;font-size:14px}
.about h1{font-size:clamp(52px,7vw,92px);margin-bottom:28px}.about p{font-size:18px;line-height:1.5;margin:0 0 24px;color:var(--mute)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:56px}.cols h4{font-weight:400;color:var(--accent);margin:0 0 20px}
.item{border-left:2px solid var(--line);padding:2px 0 2px 22px;margin-bottom:22px}.item b{font-weight:500;display:block}.item span{color:var(--mute);font-size:14px}
footer{background:var(--tint);border-radius:28px;padding:56px 52px 36px;margin:110px 0 28px}
footer .top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}footer h2{font-size:clamp(44px,6vw,76px)}
footer a{margin-left:24px;text-decoration:none;font-weight:400;font-size:18px}.row p b{color:var(--ink);font-weight:500}.gal{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:44px;align-items:start}.mx{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-top:80px}figure{margin:0}.next{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line);padding:32px 0 0;margin-top:80px;text-decoration:none}.next .serif{font-size:clamp(28px,3.2vw,40px);margin-top:20px}.next:hover .serif{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}.next .arr{font-size:26px}figcaption{font-size:13px;color:var(--mute);margin-top:10px}@media(max-width:820px){.gal,.mx{grid-template-columns:1fr;gap:28px}}footer hr{border:0;border-top:1px solid var(--line);margin:64px 0 20px}footer small{color:var(--mute);font-size:12px}
@media(max-width:820px){.hero,.proj,.proj:nth-child(even),.cs-head,.row,.steps li,.pair,.about,.cols{grid-template-columns:1fr;gap:28px}.proj:nth-child(even) .vis{order:0}.stats{grid-auto-flow:row;gap:28px}.stats div{border:0}.hero{padding:70px 0 50px}footer{padding:36px 24px 24px}nav div a{margin-left:22px}}
.vis.ph{padding:40px 36px;aspect-ratio:auto}.vis.ph .iph{height:clamp(260px,23vw,300px)}.iph{position:relative;height:100%;aspect-ratio:.468;background:#101014;border-radius:16%/7.4%;padding:1.4%;box-shadow:inset 0 0 0 1.5px #52525a,0 28px 50px rgba(30,40,120,.22)}
.scr{position:relative;width:100%;height:100%;background:#fff;border-radius:15%/6.9%;overflow:hidden}.scr img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.isl{position:absolute;z-index:2;top:2.2%;left:50%;width:31%;height:3.6%;transform:translateX(-50%);background:#000;border-radius:99px}
.bt{position:absolute;width:3px;background:#3c3c44;border-radius:2px}.b1{left:-3px;top:15%;height:3.2%}.b2{left:-3px;top:21%;height:6%}.b3{left:-3px;top:29%;height:6%}.b4{right:-3px;top:24%;height:9.5%}
.vis.im{padding:0;overflow:hidden;aspect-ratio:auto;background:transparent}.vis.gi img{max-height:100%;max-width:100%;object-fit:contain;display:block;border-radius:16px}.vis.im img{width:100%;display:block}
.vis.tpl{display:flex;gap:clamp(16px,4vw,56px);padding:56px 24px;justify-content:center;align-items:center}.tpl img{height:clamp(300px,52vw,640px);width:auto;display:block;border-radius:18px;box-shadow:0 12px 32px rgba(30,40,120,.14)}
@media(max-width:820px){.vis.ph{aspect-ratio:auto}}
img.photo{width:100%;display:block;object-fit:cover;object-position:50% 78%}
#n-res:hover,footer a:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}