:root{color-scheme:dark;--bg:#11111c;--gold:#d4bc83;--muted:#b7ad97;--red:#8f0d21;--panel:#070819}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:36px}body{margin:0;background:var(--bg);color:var(--gold);font-family:Manrope,Arial,sans-serif;font-size:16px;font-weight:400}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,a:focus-visible{outline:2px solid #f9dda1;outline-offset:6px}p,h1,h2,h3,figure{margin:0}h1,h2,h3{font-weight:400}h1,h2{letter-spacing:-.065em;line-height:.98}h1{font-size:clamp(48px,6.95vw,100px)}h2{font-size:clamp(48px,6.95vw,100px)}.wrap{width:calc(100% - 120px);max-width:1320px;margin-inline:auto}.intro{padding:80px 20px 100px;display:grid;grid-template-columns:1.08fr 1fr;gap:40px}.intro-copy{display:flex;flex-direction:column;justify-content:space-between;padding:6px 0 0}.intro-copy .name{font-size:28px}.intro-copy p:last-child{font-size:16px;line-height:1.25;max-width:560px;color:var(--muted)}.hero-art{width:100%;overflow:hidden}.hero-art img{width:100%;height:auto;display:block}.cases{padding-top:92px;padding-bottom:92px}.section-head{display:flex;justify-content:space-between;gap:36px;align-items:center;margin-bottom:74px}.filters{max-width:430px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.filters button{border:0;background:#fff6df;color:#433a2b;border-radius:40px;padding:12px 20px;font-size:14px;min-height:44px}.filters button.active{background:var(--red);color:#f4dcb2;min-width:160px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 20px}.project{width:100%;padding:0;background:none;border:0;text-align:left;color:inherit}.project-image{aspect-ratio:650/434;position:relative;overflow:hidden;border-radius:30px;background:#050505}.project-image>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.project:hover img{transform:scale(1.035)}.tags{position:absolute;left:22px;bottom:22px;display:flex;gap:5px;flex-wrap:wrap}.tags span{background:#252326;color:#eee4d2;border-radius:30px;padding:10px 14px;font-size:14px}.project h3{font-size:clamp(18px,2.7vw,38px);letter-spacing:-.055em;text-transform:uppercase;margin-top:16px;line-height:1.1}.manifesto{background:var(--red);border-radius:30px;padding:82px max(60px,calc((100% - 1280px)/2));margin-bottom:94px}.manifesto p{font-size:clamp(24px,3.05vw,44px);line-height:1.1;letter-spacing:-.035em}.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:92px}.cap-grid h3{font-size:18px;text-transform:uppercase;margin-bottom:25px}.cap-grid ul{list-style:none;padding:0;margin:0;color:var(--muted);font-size:16px;line-height:2}.about{padding:160px 20px 80px}.about-heading{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}.about-heading p{font-size:16px;color:var(--muted);line-height:1.4}.about-heading .lead{font-size:21px;color:var(--gold);line-height:1.25;margin-bottom:30px}.portrait{position:relative;margin-top:75px;border-radius:25px;overflow:hidden;height:434px}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}.portrait figcaption{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);background:#242226;color:#eee4d2;font-size:14px;border-radius:30px;padding:12px 18px}.experience{padding:120px 0 80px;border-radius:30px;background:var(--panel)}.jobs{margin-top:100px;display:grid;gap:75px}.jobs article{display:grid;grid-template-columns:1fr .7fr;gap:16%;}.jobs h3,.date{font-size:36px;letter-spacing:-.04em}.jobs .role{font-size:19px;margin-top:20px;color:var(--gold)}.jobs p:not(.role){font-size:16px;line-height:1.3;color:var(--muted);max-width:555px;margin-top:15px}.date small{display:block;font-size:18px;letter-spacing:0;margin-top:22px;color:var(--muted)}.background{padding:125px 20px 150px}.background-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:65px;align-items:start}.background-grid article{background:#454138;border-radius:28px;padding:36px;min-height:230px}.background-grid .eyebrow{font-size:13px;text-transform:uppercase;margin-bottom:18px;color:var(--muted)}.background-grid h3{font-size:28px;letter-spacing:-.035em;margin-bottom:14px}.background-grid p{font-size:16px;line-height:1.35}.background-grid .stack{background:var(--red)}.stack ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}.stack li{background:var(--bg);color:var(--muted);padding:10px 15px;border-radius:25px;font-size:14px}.contact-heading{display:flex;justify-content:space-between;align-items:center;gap:24px}.contact-button{background:var(--red);color:#ead9b7;font-size:16px;padding:22px 28px;border-radius:40px}.contact-details{display:flex;justify-content:center;gap:45px;padding:28px 0 85px;color:var(--muted);font-size:18px}.signature{width:100%;height:auto;display:block}footer{padding-bottom:90px}.dock{position:fixed;z-index:10;bottom:26px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;background:#77766ae8;backdrop-filter:blur(16px);border:1px solid #a39b8340;padding:9px 12px;border-radius:45px;box-shadow:0 8px 32px #0004;white-space:nowrap;color:#ffefd0}.dock a{font-size:14px;padding:10px 0}.dock .home{font-size:32px;padding:0;line-height:1}.dock button{border:0;border-radius:50%;width:46px;height:46px;background:var(--bg);color:var(--gold);font-size:14px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip{position:fixed;top:-100px;z-index:20;background:var(--gold);color:var(--bg);padding:20px}.skip:focus{top:0}[hidden]{display:none!important}dialog{background:var(--bg);color:var(--gold);border:1px solid #6b6250;border-radius:22px;width:min(1080px,94vw);max-height:92dvh;padding:24px}dialog::backdrop{background:#000c;backdrop-filter:blur(8px)}.dialog-top{display:flex;gap:20px;align-items:center;justify-content:space-between;margin-bottom:20px}.dialog-top h2{font-size:30px;letter-spacing:-.04em}.close-dialog{width:44px;height:44px;flex-shrink:0;border-radius:50%;border:0;background:var(--gold);color:var(--bg);font-size:28px}#dialog-image{width:100%;max-height:75dvh;object-fit:contain;display:block;border-radius:12px}
@media(min-width:1600px){.hero-art,.signature{max-width:1600px;margin-inline:auto}}
@media(max-width:900px){.wrap{width:calc(100% - 56px)}.intro{padding:48px 0 64px;gap:32px}.intro-copy .name{font-size:20px}.intro-copy p:last-child{font-size:14px}.cases{padding-top:60px}.section-head{margin-bottom:40px}.filters{max-width:320px;gap:6px}.filters button{padding:10px 13px}.filters button.active{min-width:100px}.tags{left:12px;bottom:12px}.tags span{font-size:12px;padding:8px 10px}.project-image{border-radius:20px}.manifesto{padding:50px 28px}.cap-grid{gap:22px;margin-top:50px;grid-template-columns:repeat(2,1fr)}.about{padding:100px 0 60px}.about-heading{gap:35px}.portrait{height:320px;margin-top:45px}.experience{padding:70px 0}.jobs{gap:50px;margin-top:60px}.jobs article{gap:8%}.jobs h3,.date{font-size:28px}.background{padding:85px 0}.background-grid{gap:14px}.background-grid article{padding:22px}.background-grid h3{font-size:23px}.contact-details{font-size:16px;gap:24px}.dock{gap:12px}.dock a{font-size:12px}}
@media(max-width:600px){.wrap{width:calc(100% - 36px)}.intro{grid-template-columns:1fr;gap:28px;padding:36px 0 40px}.intro h1{font-size:clamp(43px,10.5vw,64px)}.intro-copy{gap:20px}.intro-copy p:last-child{max-width:350px;font-size:16px}.hero-art img{width:150%;max-width:none;margin-left:-25%}.cases{padding:40px 0 54px}.section-head{display:block;margin-bottom:30px}.filters{max-width:none;justify-content:flex-start;margin-top:25px}.project-grid{grid-template-columns:1fr;gap:30px}.project h3{font-size:25px}.project-image{border-radius:22px}.tags span{font-size:13px}.manifesto{padding:36px 22px;border-radius:22px;margin-bottom:54px}.manifesto p{font-size:25px;line-height:1.2}.cap-grid{gap:34px 16px;margin-top:36px}.cap-grid h3{font-size:14px;margin-bottom:15px}.cap-grid li{font-size:14px;line-height:1.8}.about{padding-top:72px}.about-heading{grid-template-columns:1fr;gap:30px}.about-heading .lead{font-size:20px}.portrait{height:290px;margin-top:30px}.experience{padding:54px 0;border-radius:22px}.jobs{margin-top:45px;gap:42px}.jobs article{grid-template-columns:1fr;gap:16px}.date{font-size:20px}.date small{display:inline;margin-left:15px;font-size:14px}.jobs .role{font-size:17px;margin-top:10px}.background{padding:65px 0}.background-grid{grid-template-columns:1fr;gap:15px;margin-top:35px}.background-grid article{min-height:0;padding:27px}.contact-heading{align-items:flex-start;flex-direction:column;gap:25px}.contact-button{padding:16px 23px}.contact-details{flex-direction:column;gap:14px;padding:25px 0 45px;font-size:15px}.dock{width:calc(100% - 24px);max-width:470px;gap:0;justify-content:space-around;bottom:12px;padding:7px}.dock a{font-size:11px;padding:12px 4px}.dock .home{font-size:25px}.dock a[href="#background"],.dock a[href="#capabilities"]{display:none}.dock button{width:36px;height:36px;font-size:12px}footer{padding-bottom:76px}.dialog-top h2{font-size:23px}dialog{padding:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
@media print{body{background:white;color:#222;font-size:12px}.hero-art,.cases,.manifesto,.portrait,.signature,.dock,.contact-button,.skip,dialog{display:none!important}.wrap{width:100%;max-width:none}.intro{padding:0 0 28px}.intro h1{font-size:40px}.intro-copy .name{font-size:22px}h2{font-size:32px}.capabilities,.about,.experience,.background{padding:20px 0;background:none}.cap-grid{margin-top:20px}.about-heading{grid-template-columns:1fr 2fr}.jobs{margin-top:24px;gap:22px}.jobs article{break-inside:avoid;gap:10%}.jobs h3,.date{font-size:22px}.jobs p:not(.role),.about-heading p,.intro-copy p:last-child,.cap-grid ul,.contact-details{color:#333}.jobs .role,.about-heading .lead{color:#222}.background-grid{margin-top:25px}.background-grid article,.background-grid .stack{background:#eee;min-height:0;padding:15px}.stack li{background:#ddd;color:#222}.contact-details{padding:15px 0;justify-content:flex-start}footer{padding:20px 0}.eyebrow{color:#444!important}}
/* Original portrait, clipped to the exact shape extracted from the design. */
.hero-canvas{position:relative;width:100%}.hero-canvas>img{width:100%;height:auto;display:block}.hero-portrait{position:absolute;left:30.72093%;top:11.52358%;width:22.72481%;height:55.665%;mask:url('assets/portrait-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/portrait-mask.svg') center/100% 100% no-repeat}.hero-portrait img{display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:fill;transform:translate3d(var(--portrait-x,0px),var(--portrait-y,0px),0) scale(var(--portrait-scale,1));transform-origin:center;transition:transform .65s cubic-bezier(.2,.75,.25,1),filter .65s ease;will-change:transform}.hero-portrait.is-hovered img{filter:saturate(1.08) brightness(1.06)}
.reveal{opacity:0;transform:translate3d(0,28px,0);transition:opacity .8s ease var(--reveal-delay,0ms),transform .9s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}.reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
@media(max-width:600px){.hero-canvas{width:150%;margin-left:-25%}.hero-art .hero-canvas>img{width:100%;margin-left:0}.hero-art .hero-portrait img{width:100%;height:100%;margin:0}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero-portrait img{transform:none;filter:none!important;transition:none;will-change:auto}}
@media print{.reveal{opacity:1!important;transform:none!important}}
/* Static logo artwork with the original portrait interaction. */
.hero-canvas{aspect-ratio:1440/765;isolation:isolate}.logo-letter{position:absolute;inset:0;pointer-events:none}.hero-art .logo-letter>img{display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:contain;pointer-events:none}.logo-k{z-index:4}.logo-e{z-index:3}.logo-r{z-index:2}.logo-s{z-index:1}.logo-letter .hero-portrait{pointer-events:auto}
.title-block{position:relative;font-size:clamp(48px,6.95vw,100px)}.language-switch{display:flex;position:static;width:max-content;max-width:100%;margin-top:24px;align-items:center;gap:0;font-size:16px;letter-spacing:0}.language-switch button{border:0;min-height:44px;border-radius:40px;padding:13px 22px;background:#fff4dc;color:#231b1b;transition:background .2s,color .2s}.language-switch button[aria-pressed="true"]{background:var(--red);color:#fff4dc;padding-inline:27px}.language-switch button:hover{filter:brightness(1.1)}
html[lang="ru"] .intro{align-items:start}html[lang="ru"] .intro-copy{gap:40px}html[lang="ru"] .dock{gap:13px}html[lang="ru"] .dock button{width:auto;min-width:46px;border-radius:30px;padding:0 12px}html[lang="ru"] .filters{max-width:470px}html[lang="ru"] .cap-grid h3{line-height:1.35}
@media(min-width:601px) and (max-width:1100px){.language-switch{position:static;margin-top:20px;width:max-content}html[lang="ru"] .intro-copy{gap:24px}}
@media(max-width:600px){.title-block{font-size:clamp(43px,10.5vw,64px)}.language-switch{position:static;margin-top:22px;width:max-content;font-size:16px}.language-switch button{padding:12px 23px}html[lang="ru"] .intro-copy{gap:20px}html[lang="ru"] .dock{gap:0}html[lang="ru"] .dock a{font-size:11px;padding:12px 3px}html[lang="ru"] .dock button{font-size:11px;padding:0 9px}}
@media print{.language-switch{display:none!important}}

a.project{display:block}a.project:hover{text-decoration:none}
.editor-entry{position:fixed;right:18px;bottom:18px;z-index:100;background:#22212e;color:#d4bc83;border:1px solid #d4bc8355;border-radius:30px;padding:11px 17px;font:14px/1.3 Manrope,sans-serif;text-decoration:none;box-shadow:0 4px 20px #0004}@media(max-width:900px){.editor-entry{bottom:85px;font-size:12px}}

/* Original supplied KERS silhouette, using the header palette. */
.kers-brand-mark{display:block;width:112px;aspect-ratio:280/90;background:var(--gold);mask:url(/assets/kers-original.png) center/contain no-repeat;-webkit-mask:url(/assets/kers-original.png) center/contain no-repeat}.oh-wordmark,.case-wordmark{display:block;flex-shrink:0}.oh-wordmark:hover,.case-wordmark:hover{text-decoration:none}@media(max-width:760px){.kers-brand-mark{width:88px}}

/* Bottom navigation matched to the supplied design. */
.dock,html[lang="ru"] .dock{width:max-content;max-width:calc(100% - 40px);gap:clamp(12px,1.8vw,26px);padding:14px;border:0;border-radius:100px;background:rgba(254,242,219,.5);color:#dedddd;box-shadow:none;backdrop-filter:none;bottom:26px}
.dock a,html[lang="ru"] .dock a{font-size:clamp(14px,1.55vw,22px);font-weight:400;padding:12px 0;line-height:1.2;transition:color .2s}
.dock a:hover{color:#534b40;text-decoration:none}.dock a:focus-visible,.dock button:focus-visible{outline:2px solid #8f0d21;outline-offset:3px}
.dock .home,html[lang="ru"] .dock .home{display:flex;align-items:center;justify-content:center;width:70px;height:74px;flex-shrink:0;padding:0;line-height:1}
.dock-home-art{display:block;flex-shrink:0;width:64px;height:70px}.dock-home-art svg{display:block;width:100%;height:100%}
.dock button,html[lang="ru"] .dock button{width:86px;min-width:86px;height:74px;padding:0 12px;flex-shrink:0;border-radius:60px;background:#11111c;color:#e0c48e;font-size:22px;font-weight:400}
@media(min-width:601px) and (max-width:1000px){.dock,html[lang="ru"] .dock{gap:14px;padding:10px}.dock .home,html[lang="ru"] .dock .home{width:48px;height:52px}.dock-home-art{width:42px;height:46px}.dock button,html[lang="ru"] .dock button{width:66px;min-width:66px;height:56px;font-size:17px}.dock a,html[lang="ru"] .dock a{font-size:14px}}
@media(max-width:600px){.dock,html[lang="ru"] .dock{width:calc(100% - 24px);max-width:470px;gap:0;justify-content:space-between;padding:8px;bottom:max(12px,env(safe-area-inset-bottom))}.dock a,html[lang="ru"] .dock a{font-size:11px;padding:12px 3px}.dock .home,html[lang="ru"] .dock .home{width:34px;height:44px;overflow:hidden}.dock-home-art{width:30px;height:33px}.dock button,html[lang="ru"] .dock button{width:auto;min-width:48px;height:44px;font-size:12px;padding:0 10px}}

/* Cursor spotlight uses the supplied gradient beneath the experience copy. */
.experience{position:relative;isolation:isolate;overflow:hidden}.experience>.wrap{position:relative;z-index:1}
.experience::before{content:"";position:absolute;z-index:0;pointer-events:none;width:240px;height:240px;left:var(--glow-x,50%);top:var(--glow-y,50%);transform:translate(-50%,-50%);background:url('/assets/experience-glow.png') center/contain no-repeat;mask-image:radial-gradient(circle,#000 12%,#0009 40%,transparent 69%);-webkit-mask-image:radial-gradient(circle,#000 12%,#0009 40%,transparent 69%);filter:blur(12px);opacity:0;transition:opacity .2s ease}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.experience.has-cursor-glow::before{opacity:.85}}
@media print{.experience::before{display:none}}

/* Shared Latin and Cyrillic type, with matching sizes in both languages. */
@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-400.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-700.ttf') format('truetype');font-style:normal;font-weight:700 800;font-display:swap}
body,button,input,textarea,select{font-family:Manrope,Arial,sans-serif}
.intro{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);align-items:start}
.title-block{min-width:0}.intro h1{font-size:clamp(48px,6.3vw,90px);line-height:1.06;letter-spacing:-.06em;hyphens:auto;overflow-wrap:anywhere}
.intro-copy{gap:40px}.contact-heading{flex-wrap:wrap}
.portfolio-button,.contact-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;max-width:100%;padding:24px 38px;min-height:80px;border:0;border-radius:100px;color:#e0c48e;font-size:clamp(20px,2.4vw,34px);font-weight:400;line-height:1.25;text-align:center;transition:background .2s,transform .2s}
.portfolio-button-projects{background:#11111c}.portfolio-button-contact,.contact-button{background:#8f0d21}
.portfolio-button:hover,.contact-button:hover{text-decoration:none;transform:translateY(-2px);background:#282433}.portfolio-button-contact:hover,.contact-button:hover{background:#a0162b}
.portfolio-arrow{display:inline-block;flex:0 0 auto;width:1.5em;height:1.5em;background:url('/assets/arrow-original.png') center/contain no-repeat;vertical-align:middle}
.arrow-right{transform:rotate(45deg)}.arrow-left{transform:rotate(225deg)}
.case-header .portfolio-button{padding:16px 24px;min-height:60px;font-size:20px}.case-footer{flex-wrap:wrap}
@media(max-width:1000px){.intro{grid-template-columns:1fr}.intro-copy{display:grid;grid-template-columns:1fr 1fr;gap:32px}.intro h1{font-size:clamp(48px,8vw,80px)}}
@media(max-width:600px){.intro-copy{display:flex;gap:20px}.intro h1{font-size:clamp(42px,10.5vw,64px)}.portfolio-button,.contact-button{font-size:20px;padding:20px 26px;min-height:68px;gap:16px}.case-header{flex-wrap:wrap}.case-header .portfolio-button{font-size:16px;padding:12px 18px;min-height:48px}}

.inline-arrow{width:1em;height:1em}.arrow-down{transform:rotate(135deg)}

/* Keep the supplied arrow close to its button label at every width. */
.portfolio-button{gap:8px}

/* Case titles follow the supplied Manrope specimen in both languages. */
@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-500.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
.project h3,html[lang="ru"] .project h3{font-family:Manrope,sans-serif;font-size:clamp(20px,2.2vw,28px);font-weight:500;line-height:1.1;letter-spacing:0;text-align:left;overflow-wrap:anywhere}
.portfolio-button-contact .portfolio-arrow{display:none}

@media(max-width:600px){.project h3,html[lang="ru"] .project h3{font-size:26px;line-height:1.1}}

/* Let the resume pill fit the full localized label. */
.dock button,html[lang="ru"] .dock button{width:auto;min-width:86px;padding-inline:22px;display:flex;align-items:center;justify-content:center;white-space:nowrap}
@media(min-width:601px) and (max-width:1000px){.dock button,html[lang="ru"] .dock button{min-width:66px;padding-inline:18px}}
@media(max-width:600px){.dock button,html[lang="ru"] .dock button{min-width:48px;padding-inline:14px}}

.project-nda{display:block;cursor:default}.project-nda .project-image{position:relative}.project-nda .project-image>img{filter:brightness(.48);transform:none!important}.nda-overlay{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:clamp(36px,5vw,68px);font-weight:600;letter-spacing:.08em;pointer-events:none}.project-nda .tags{z-index:1}
.project[href="/projects/concentration/"] .project-image{background:var(--bg)}
.project[href="/projects/concentration/"] .project-image>img{object-fit:contain}
