@font-face{font-family:"Fixel";src:url("/fixel-latin.woff2") format("woff2");font-weight:100 900;font-stretch:75% 100%;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0100-017F,U+2010-2027,U+2190-2199,U+20AC} @font-face{font-family:"Fixel";src:url("/fixel-cyrillic.woff2") format("woff2");font-weight:100 900;font-stretch:75% 100%;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}:root{--pencil:#415d43;--highlight:#f0cd96;--active:#415d43;color-scheme:light;--bg:#eef1ec;--surface:#dce6da;--ink:#111d13;--plate-base:linear-gradient(154deg,#fbf6e8 0%,#fbf6e9 8.3%,#f8f5ea 16.7%,#f4f4eb 25%,#f1f2ec 33.3%,#eff1ec 41.7%,#edf0eb 50%,#eaeee9 58.3%,#e6eae5 66.7%,#dee3de 75%,#d4dbd5 83.3%,#cad3cc 91.7%,#c4cdc6 100%);--grain:.05;--plate-top:#f6f7f1;--sticky-plate-end:var(--plate-top);--menu-plate:var(--plate-top);--accent:var(--pencil);--divider:color-mix(in srgb,#111d13 40%,transparent);--hairline:color-mix(in srgb,#111d13 16%,transparent);--mute:color-mix(in srgb,#111d13 65%,transparent);--font:"Fixel",system-ui,-apple-system,sans-serif;--text-stretch:75%;--display-stretch:100%;--pad:clamp(16px,3.2vw,48px);--chrome-pad:8px;--meta-pad:clamp(4px,.8vh,10px);--footer-rule-gap:var(--meta-pad);--meta-pad-top:clamp(16px,3vw,24px);--meta-pad-bottom:clamp(12px,3.75vw,18px);--rule:1px;--pen:2px;--media-shadow:0 20px 34px -18px color-mix(in srgb,#000 18%,transparent);--fs-chrome:12px;--fs-label:13px;--number-size:var(--fs-label);--fs-text:clamp(16px,1.25vw,19px);--fs-link:clamp(19px,1.95vw,28px);--fs-title:clamp(24px,3.1vw,40px);--fs-name:clamp(42px,6.9vw,104px);--ls-tiny:.06em;--rule-gap:clamp(22px,2.6vw,32px);--heading-after-gap:var(--rule-gap);--mobile-number-nudge:6px;--heading-copy-gap:12px;--header-gap:clamp(12px,1.8vw,26px);--footer-gap-mobile:clamp(12px,1.8vw,26px);--contact-row-gap:clamp(10px,1.8vw,16px);--cats-pad-top:clamp(48px,9vh,112px);--cats-pad-bottom:clamp(30px,6vh,72px);--cats-pad-bottom-narrow:clamp(24px,6vw,32px);--foot-pad:clamp(22px,3.85vh,52px);--foot-pad-narrow:clamp(18px,5vw,24px);--foot-bar-pad-narrow:clamp(18px,4.5vw,24px);--maxw:1440px;--ease:cubic-bezier(.16,1,.3,1);--grain-img:url("/img/grain.webp");--plate-mottle:url("/img/mottle.png");--mottle-size:1280px;--colgap:clamp(20px,2.6vw,40px);--gridw:calc(min(100vw,var(--maxw)) - 2 * var(--pad));--label-w:120px;--col1:max(var(--label-w),calc((var(--gridw) - 11 * var(--colgap)) / 12));--col2:calc(var(--col1) + var(--colgap));--col3:calc(2 * var(--col1) + 2 * var(--colgap))} @supports (width:round(1px,1px)){:root{--meta-pad:round(clamp(4px,.8vh,10px),1px);--meta-pad-top:round(clamp(16px,3vw,24px),1px);--meta-pad-bottom:round(clamp(12px,3.75vw,18px),1px);--rule-gap:round(clamp(22px,2.6vw,32px),1px);--cats-pad-top:round(clamp(48px,9vh,112px),1px);--cats-pad-bottom:round(clamp(30px,6vh,72px),1px);--cats-pad-bottom-narrow:round(clamp(24px,6vw,32px),1px);--foot-pad:round(clamp(22px,3.85vh,52px),1px);--foot-pad-narrow:round(clamp(18px,5vw,24px),1px);--foot-bar-pad-narrow:round(clamp(18px,4.5vw,24px),1px)}}:root[data-theme="light"]{color-scheme:light;--bg:#e8ebe6;--plate-top:var(--bg);--surface:#e4e7e2;--plate-base:linear-gradient(var(--bg),var(--bg))}:root[data-theme="green"]{color-scheme:dark;--pencil:#f0cd96;--active:#f0cd96;--bg:#2b3e2d;--surface:#3a5340;--ink:#eaf1e7;--plate-top:#42563f;--sticky-plate-end:#304234;--menu-plate:#47564b;--plate-base:linear-gradient(154deg,#4f5f49 0%,#4b5b47 8.3%,#445542 16.7%,#3b4d3d 25%,#344738 33.3%,#2f4234 41.7%,#2b3e31 50%,#283a2e 58.3%,#24352a 66.7%,#1f2f25 75%,#1a2a21 83.3%,#15241d 91.7%,#13211a 100%);--grain:.18;--divider:color-mix(in srgb,#eaf1e7 34%,transparent);--hairline:color-mix(in srgb,#eaf1e7 14%,transparent);--mute:color-mix(in srgb,#eaf1e7 80%,transparent)}:root[data-theme="night"]{color-scheme:dark;--pencil:#d9a05e;--active:#d9a05e;--bg:#161616;--surface:#1e1e1e;--ink:#f0f0f0;--plate-base:linear-gradient(154deg,#1d1d1d 0%,#1c1c1c 8.3%,#1b1b1b 16.7%,#1a1a1a 25%,#181818 33.3%,#171717 41.7%,#161616 50%,#151515 58.3%,#141414 66.7%,#131313 75%,#121212 83.3%,#111111 91.7%,#101010 100%);--grain:.14;--plate-top:#1b1b1b;--sticky-plate-end:#161616;--divider:color-mix(in srgb,#f0f0f0 34%,transparent);--hairline:color-mix(in srgb,#f0f0f0 14%,transparent);--mute:color-mix(in srgb,#f0f0f0 55%,transparent)} *,*::before,*::after{box-sizing:border-box} html{background:var(--bg)} body::before,body::after{content:"";position:fixed;inset:-60vh 0;z-index:-1;pointer-events:none} body::before{background-color:var(--bg);background-image:var(--plate-mottle),var(--plate-base);background-repeat:repeat,no-repeat;background-size:var(--mottle-size) var(--mottle-size),auto;background-blend-mode:overlay,normal} body::after{background-image:var(--grain-img);background-size:160px 160px;opacity:var(--grain);mix-blend-mode:overlay} @media (min-resolution:1.5dppx){body::after{background-size:80px 80px}} @media (min-resolution:2.5dppx){body::after{background-size:53.334px 53.334px}} @media (prefers-contrast:more){body::after{opacity:0}} @media print{body::before,body::after{display:none}} body::before,body::after{transform:translate3d(0,var(--plate-shift,0px),0);filter:brightness(var(--plate-brightness,1.15));will-change:transform,filter} @keyframes plate-scroll{from{transform:translate3d(0,0,0);filter:brightness(1.15)} to{transform:translate3d(0,-64px,0);filter:brightness(.95)}} @keyframes plate-scroll-flat{from{transform:translate3d(0,0,0);filter:none} to{transform:translate3d(0,-64px,0);filter:none}} @media (prefers-reduced-motion:no-preference){@supports (animation-timeline:scroll()){body::before,body::after{animation:plate-scroll linear both;animation-timeline:scroll();animation-range:0 900px}:root[data-theme="light"] body::before,:root[data-theme="light"] body::after{animation-name:plate-scroll-flat}}}:root[data-theme="light"] body::before,:root[data-theme="light"] body::after{filter:none} body.no-plate-darkening::before,body.no-plate-darkening::after{filter:none} html{-webkit-text-size-adjust:100%} body{margin:0;background:transparent;color:var(--ink);font-family:var(--font);font-stretch:var(--text-stretch);font-size:var(--fs-text);line-height:1.55;overflow-x:hidden;overflow-x:clip} img{display:block;max-width:100%} a{color:inherit;text-decoration:none} h1,h2{margin:0;font-family:var(--font);font-stretch:var(--display-stretch);font-weight:700;letter-spacing:-.03em;line-height:1}::selection{background:color-mix(in srgb,var(--accent) 30%,transparent)}:focus{outline:none}:focus-visible{outline:2px solid var(--accent);outline-offset:3px} .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} .wrap{width:100%;padding-inline:var(--pad);max-width:var(--maxw);margin-inline:auto} .content-grid{display:grid;grid-template-columns:1fr} @media (min-width:640px){.content-grid{grid-template-columns:repeat(12,minmax(0,1fr))}} .rule{height:var(--rule);background:var(--divider);border:0;width:calc(min(100%,var(--maxw)) - 2 * var(--pad));margin:0 auto} .tiny{font-size:var(--fs-chrome);font-stretch:var(--text-stretch);letter-spacing:var(--ls-tiny);text-transform:uppercase;font-weight:600;color:var(--mute)} .contact-link{display:inline-block;transform-origin:center;transition:color 220ms var(--ease),transform 220ms var(--ease),-webkit-text-stroke 220ms var(--ease)} .meta .contact-link{font-size:var(--fs-label)} @media (hover:hover){.contact-link:hover{color:var(--ink);transform:scaleX(1.025);-webkit-text-stroke:.18px currentColor}} .contact-link[aria-current="page"]{color:var(--active);font-weight:700;font-variation-settings:"wght" 700;-webkit-text-stroke:.12px currentColor} @media (max-width:760px){.meta{padding-top:var(--meta-pad-top)}:root{--footer-rule-gap:calc(var(--meta-pad) + 8px)}} @media (max-width:960px){:root{--col1:20px}} .site-foot .lines>a{padding-block:3px;margin-block:-3px} .tgl button{appearance:none;background:transparent;border:0;cursor:pointer;color:var(--mute);font:inherit;font-size:var(--fs-chrome);font-weight:600;letter-spacing:var(--ls-tiny);text-transform:uppercase;padding:16px 8px;min-height:44px;line-height:1;transform-origin:center;transition:color 220ms var(--ease),transform 220ms var(--ease),-webkit-text-stroke 220ms var(--ease)} @media (pointer:fine){.tgl button{padding:9px 8px;min-height:30px}} @media (hover:hover){.tgl button:hover{color:var(--ink);transform:scaleX(1.025);-webkit-text-stroke:.18px currentColor}} .tgl button[aria-pressed="true"]{color:var(--active);font-weight:700;font-variation-settings:"wght" 700;-webkit-text-stroke:.12px currentColor} .switches{--switch-control-pad:var(--chrome-pad);display:flex;align-items:center;gap:var(--header-gap)} .switches>.mobile-contact-link{margin-left:var(--switch-control-pad)} @media (min-width:641px) and (max-width:760px){.meta{--mobile-meta-row:24px;padding-bottom:calc(var(--meta-pad) + 8px)} .meta .switches>.tgl button{padding-block:16px;min-height:44px;margin-block:-10px}} @media (max-width:640px){.cat .num,.spec .no,.step .no{transform:translateX(var(--mobile-number-nudge))}} @media (max-width:640px){.meta .switches>.tgl button{padding-block:16px;min-height:44px;margin-block:-10px}} @media (max-width:640px) and (pointer:fine){.meta .switches>.tgl button{padding-block:9px;min-height:30px;margin-block:-3px}} .header-menu-toggle,.header-menu-panel{display:none} .meta.header-menu-mode>.parts::-webkit-scrollbar{display:none} .header-menu-toggle span,.header-menu-toggle span::before,.header-menu-toggle span::after{display:block;width:22px;height:1px;background:currentColor;transition:transform 240ms var(--ease),opacity 180ms var(--ease)} .header-menu-toggle span{position:relative} .header-menu-toggle span::before,.header-menu-toggle span::after{content:"";position:absolute;left:0} .header-menu-toggle span::before{top:-6px} .header-menu-toggle span::after{top:6px} .header-menu-open .header-menu-toggle span{background:transparent} .header-menu-open .header-menu-toggle span::before{top:0;transform:rotate(45deg)} .header-menu-open .header-menu-toggle span::after{top:0;transform:rotate(-45deg)} .meta.header-menu-mode>.header-menu-panel{position:absolute;top:calc(100% + 12px);right:var(--pad);z-index:40;display:grid;width:max-content;min-width:220px;max-width:calc(100vw - 2 * var(--pad));padding:10px 18px 14px;background:color-mix(in srgb,var(--menu-plate) 62%,transparent);-webkit-backdrop-filter:blur(17.5px) saturate(1.4);backdrop-filter:blur(17.5px) saturate(1.4);border:1px solid var(--hairline);border-radius:12px;box-shadow:0 18px 42px color-mix(in srgb,#000 16%,transparent);visibility:hidden;opacity:0;pointer-events:none;transform-origin:top right;transform:translate3d(0,-6px,0) scale(.95,.98);transition:opacity 260ms var(--ease),transform 340ms var(--ease),visibility 0s linear 340ms} .meta.header-menu-mode.header-menu-open>.header-menu-panel{visibility:visible;opacity:1;pointer-events:auto;transform:translate3d(0,0,0) scale(1);transition:opacity 260ms var(--ease),transform 340ms var(--ease),visibility 0s} .meta.header-menu-mode .header-menu-panel .switches{position:static;display:grid;grid-template-columns:1fr;grid-column:auto;grid-row:auto;justify-self:stretch;width:100%;height:auto;margin:0;padding:0;gap:0;overflow:visible} .meta.header-menu-mode .header-menu-panel .switches>.mobile-contact-link{display:flex;margin:0} .meta.header-menu-mode .header-menu-panel .switches>.tgl::before{font-size:var(--fs-label);font-weight:600;letter-spacing:var(--ls-tiny);text-transform:uppercase;color:var(--mute)} .meta.header-menu-mode .header-menu-panel .switches>.tgl button{font-size:var(--fs-label);font-stretch:var(--text-stretch);font-weight:600;letter-spacing:var(--ls-tiny);line-height:1;text-transform:uppercase} .meta.header-menu-mode .header-menu-panel #lang::before{content:"Language"}:root[lang="uk"] .meta.header-menu-mode .header-menu-panel #lang::before{content:"Мова"} .rev [data-rev]{opacity:0;translate:0 16px} .rev [data-rev].is-in{opacity:1;translate:none;transition:opacity 260ms var(--ease),translate 300ms var(--ease);transition-delay:var(--d,0ms)} @view-transition{navigation:auto} html.theme-shift .topbar::before{-webkit-backdrop-filter:none;backdrop-filter:none;background-color:var(--plate-top)!important}::view-transition-group(root),::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal} html.theme-shift::view-transition-old(root){animation:fade-out 520ms cubic-bezier(.4,0,.2,1) both} @keyframes fade-in{from{opacity:0} to{opacity:1}} @keyframes fade-out{from{opacity:1} to{opacity:0}} html.pt-js body{animation:none} html.pt-leave body{animation:fade-out 220ms var(--ease) both} @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important} .rev [data-rev]{opacity:1!important;translate:none!important}::view-transition-old(root),::view-transition-new(root){animation:none} html.pt-js body,html.pt-leave body{animation:none}} @media (max-width:640px){.rev [data-rev]{translate:0 10px} .rev [data-rev].is-in{transition-duration:200ms,240ms}} .site-foot{color:var(--ink);--uline:2px} @media (min-width:700px){.site-foot{--uline:3px}} .foot-in{position:relative;padding-block:var(--foot-pad);display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--colgap);row-gap:var(--rule-gap);align-items:start} .foot-in .say{grid-column:1/-1;margin-left:var(--col2);min-width:0} .foot-in .say,.foot-in .k,.foot-bar>.cols{min-width:0} .foot-in .k{grid-column:1/-1;position:relative;margin:0;max-width:none;font-size:var(--fs-label);letter-spacing:var(--ls-tiny);text-transform:uppercase;font-weight:600;line-height:1;color:var(--mute);display:flex;justify-content:flex-end;align-items:flex-start;text-align:right;padding-right:calc(100% - var(--col1));height:0} .foot-in .k::after{content:"";position:absolute;left:var(--col2);right:0;top:0;height:var(--rule);background:var(--divider)} @media (min-width:961px){.foot-in{grid-template-columns:repeat(12,minmax(0,1fr))} .foot-in .say{grid-column:3/8;margin-left:0} .foot-in .k{grid-column:1/-1;padding-right:calc(100% - (16.6666667% - 5 * var(--colgap) / 6))} .foot-in .k::after{left:calc(16.6666667% - var(--colgap) / 3)}} @media (min-width:641px) and (max-width:960px),(max-width:640px){.foot-in .say{margin-left:calc(var(--col2) + var(--chrome-pad))}} .site-foot a{color:inherit;text-decoration:none} .site-foot .lines{min-width:0;margin-top:clamp(12px,1.8vh,20px);display:flex;align-items:baseline;flex-wrap:wrap;column-gap:clamp(7px,1.1vw,14px);row-gap:var(--contact-row-gap)} .site-foot .lines>a{display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone;font-family:var(--font);font-stretch:var(--text-stretch);font-size:var(--fs-link);font-weight:600;text-transform:none;letter-spacing:-.02em;line-height:1.02;position:relative;color:color-mix(in srgb,var(--ink) 60%,transparent);transition:color 260ms var(--ease)} .site-foot .lines>a::before{content:none;position:absolute;left:0;right:0;bottom:-.02em;height:var(--uline);background:var(--pencil);transform:scaleX(0);transform-origin:left;transition:transform 420ms var(--ease);will-change:transform} .site-foot .lines>a::after{content:"↗";display:inline-block;margin-left:.12em;font-size:.34em;vertical-align:.9em;color:var(--ink);opacity:0;transform:translate(-.25em,.25em);transition:opacity 320ms var(--ease),transform 320ms var(--ease)} @media (hover:hover){.site-foot .lines>a:hover,.site-foot .lines>a:focus-visible{color:var(--accent)} .site-foot .lines>a:hover::before,.site-foot .lines>a:focus-visible::before{transform:scaleX(1)} .site-foot .lines>a:hover::after,.site-foot .lines>a:focus-visible::after{opacity:1;transform:none}} @media (hover:none){.site-foot .lines>a::after{opacity:.72;transform:none}} .site-foot .lines>a:active{color:var(--accent)} .site-foot .lines>a:active::before{transform:scaleX(1)} .site-foot .lines>a:active::after{opacity:1;transform:none} @media (hover:none){.text-page-body a[target="_blank"]::after,.text-page-body a[href^="mailto:"]::after,.cat[target] .lab::after,.cat[href^="mailto:"] .lab::after,.work .spec.under .sect>span:first-child::after,.work .spec.under .sect>span:last-child::after,.spec a.it[target]::after,.site-foot .lines>a::after{opacity:.72!important;transform:none!important}} .site-foot .sub{margin:0;max-width:34ch;text-wrap:pretty;color:var(--mute)} .foot-bar{position:relative;padding-top:var(--footer-rule-gap);padding-bottom:clamp(22px,3.4vh,40px);display:grid;grid-template-columns:1fr auto;gap:8px 24px} .foot-bar::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);height:var(--rule);background:var(--divider)} .foot-bar>.footer-left{grid-column:2;grid-row:1;display:flex;align-items:baseline;gap:var(--header-gap);padding-left:0;padding-right:var(--chrome-pad);min-width:0} .foot-bar>.cols{grid-column:1;grid-row:1;justify-self:start;display:flex;gap:clamp(14px,3vw,48px);flex-wrap:wrap;padding-left:var(--chrome-pad);padding-right:0} .foot-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:baseline;gap:var(--header-gap);padding-left:var(--chrome-pad);padding-right:var(--chrome-pad);color:var(--mute)} .foot-bar>.footer-left>.foot-meta{justify-content:flex-start;padding-left:0;padding-right:0} .foot-meta .tiny{white-space:nowrap} .foot-bar .footer-privacy{color:var(--mute);text-decoration:none;white-space:nowrap;transition:color 240ms var(--ease)} .foot-bar .footer-privacy:hover,.foot-bar .footer-privacy:focus-visible{color:var(--accent)} @media (max-width:560px){.foot-bar{--footer-row-gap:var(--footer-gap-mobile);display:flex;flex-wrap:wrap;align-items:baseline;column-gap:calc(var(--footer-row-gap) - var(--chrome-pad));row-gap:var(--footer-row-gap)} .foot-bar>.footer-left{display:contents} .foot-bar>.cols{order:1;justify-self:start;width:auto;padding:0 0 0 var(--chrome-pad)} .foot-bar .footer-privacy{display:block;margin:0;order:2;padding:0 0 0 var(--chrome-pad)} .foot-bar>.footer-left>.foot-meta{order:3;flex:0 0 100%;padding:0 0 0 var(--chrome-pad)} .foot-meta{grid-column:auto;width:100%;flex-direction:row;flex-wrap:nowrap;align-items:baseline;justify-content:flex-start;gap:var(--footer-row-gap);padding:0;min-width:0;text-align:left;white-space:nowrap} .foot-meta .tiny{white-space:nowrap;min-width:0}} @media (max-width:640px){.foot-in{grid-template-columns:1fr} .site-foot{--foot-pad:var(--foot-pad-narrow)} .foot-bar{--footer-row-gap:var(--footer-gap-mobile);padding-bottom:var(--foot-bar-pad-narrow)} .foot-bar .cols{margin-left:0;padding:0 0 0 var(--chrome-pad)} .foot-meta{gap:var(--footer-row-gap);padding:0}} @media (max-width:960px){.foot-in .k::after{content:none} .foot-in::before{content:"";position:absolute;top:var(--foot-pad);left:calc(var(--pad) + var(--col2));right:var(--pad);height:var(--rule);background:var(--divider)} .foot-in .k{justify-content:flex-start;padding-right:0;transform-origin:.5em .5em;rotate:90deg;width:max-content}}:root{--home-flow-gap:74px;--home-list-correction:16px;--home-logo-correction:16px} @media (max-width:960px){:root{--home-flow-gap:clamp(52px,7.2vw,68px);--home-list-correction:16px;--home-logo-correction:16px}} @media (max-width:640px){:root{--home-flow-gap:clamp(40px,12vw,52px);--home-list-correction:10px;--home-logo-correction:12px}} h1,h2,h3{margin:0;font-stretch:var(--display-stretch);font-weight:700;letter-spacing:-.03em;line-height:1} .meta + .rule{margin-bottom:2px} .meta{display:grid;grid-template-columns:1fr auto;gap:var(--pad) 24px;padding-block:var(--meta-pad);align-items:center} .meta .cols{display:flex;gap:clamp(16px,4vw,64px);flex-wrap:wrap;align-items:center} @media (min-width:761px){.meta .cols>.tiny:first-child{padding-left:var(--chrome-pad)}} .home-meta .contact-link{font-size:var(--fs-label)} #clock{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1} .meta .tiny{white-space:nowrap} .meta .local-time{display:inline} .tiny b{font-weight:700;color:var(--ink);letter-spacing:var(--ls-tiny)} .tgl{display:flex;gap:0;align-items:center} .switches>.tgl:first-child button:first-child{padding-left:0}:root[data-theme="green"] .tgl button[aria-pressed="true"],:root[data-theme="night"] .tgl button[aria-pressed="true"]{font-weight:700;font-variation-settings:"wght" 700} .switches .contact-link{white-space:nowrap} @media (min-width:1000px){.meta{grid-template-columns:1fr auto;column-gap:clamp(24px,3vw,48px)} .meta>.cols:first-child{grid-column:auto} .meta .switches{grid-column:auto;justify-content:flex-end;flex-wrap:nowrap}} @media (max-width:560px){.meta{grid-template-columns:minmax(0,1fr) auto;column-gap:var(--header-gap);row-gap:0} .meta .cols{gap:14px} .meta .switches{grid-column:2;grid-row:1;justify-content:flex-end}} @media (max-width:760px){.meta{padding-bottom:var(--meta-pad)}} @media (min-width:641px) and (max-width:760px){.meta .switches{height:var(--mobile-meta-row);padding-bottom:0}} @media (max-width:640px){.meta{--mobile-meta-row:24px;grid-template-columns:1fr;padding-bottom:calc(var(--meta-pad) + 8px)} .meta .cols{display:none} .meta .switches>.tgl{display:flex} .meta .switches{grid-column:1;grid-row:1;justify-content:flex-end;height:var(--mobile-meta-row);padding:0 var(--chrome-pad) 0 0}} @media (max-width:640px){.meta .switches>.tgl#lang button{padding:0;min-height:24px;margin-block:0;line-height:24px}} @media (min-width:761px){.home-meta{grid-template-columns:auto minmax(0,1fr) auto;column-gap:var(--header-gap)} .home-meta>.order-cta{grid-column:1;grid-row:1;display:inline-block;padding:16px 0 16px var(--chrome-pad);font-size:var(--fs-label);letter-spacing:var(--ls-tiny);text-transform:uppercase;font-weight:600;line-height:1;color:var(--pencil);white-space:nowrap;transform-origin:center;transition:color 220ms var(--ease),transform 220ms var(--ease),-webkit-text-stroke 220ms var(--ease)} .home-meta .parts{grid-column:2;grid-row:1;padding-left:0} .home-meta .switches{justify-self:end;margin-left:calc(clamp(18px,3vw,48px) - var(--header-gap))} .home-meta .mobile-contact-link{display:none}} @media (pointer:fine) and (min-width:761px){.home-meta>.order-cta{padding-block:9px}} @media (hover:hover) and (min-width:761px){.home-meta>.order-cta:hover{color:var(--pencil);transform:scaleX(1.025);-webkit-text-stroke:.18px currentColor}} .home-meta{position:relative;grid-template-columns:auto minmax(0,1fr) auto;column-gap:clamp(18px,3vw,48px)} @media (min-width:761px){.home-meta{column-gap:var(--header-gap)}} .home-meta .parts{display:flex;align-items:center;gap:var(--header-gap);justify-self:start;min-width:0} .home-meta .part{font-size:var(--fs-label);letter-spacing:var(--ls-tiny);text-transform:uppercase;font-weight:600;color:var(--mute);white-space:nowrap;padding-block:16px;line-height:1;display:inline-block;transform-origin:center;transition:color 220ms var(--ease),transform 220ms var(--ease),-webkit-text-stroke 220ms var(--ease)} @media (pointer:fine){.home-meta .part{padding-block:9px}} @media (hover:hover){.home-meta .part:hover{color:var(--ink);transform:scaleX(1.025);-webkit-text-stroke:.18px currentColor}} .home-meta.header-menu-mode{position:relative;grid-template-columns:minmax(0,1fr) auto} .home-meta.header-menu-mode>.parts{grid-column:1;grid-row:1;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none} .home-meta.header-menu-mode>.header-menu-toggle{grid-column:2;grid-row:1;justify-self:end;display:grid;place-items:center;appearance:none;width:44px;height:44px;margin:-10px -8px -10px 0;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer} .home-meta.header-menu-mode .header-menu-panel .contact-link{display:flex;align-items:center;width:100%;min-height:40px;padding:10px 0;text-align:left;white-space:normal} .home-meta.header-menu-mode .header-menu-panel .switches>.tgl{display:grid;grid-template-columns:auto auto;gap:var(--header-gap);align-items:center;width:100%;min-height:40px} .home-meta.header-menu-mode .header-menu-panel .tgl button{width:auto;min-height:40px;margin:0;padding:10px 0 10px 16px} @media (max-width:760px){.home-meta.header-menu-mode{--mobile-meta-row:24px;grid-template-rows:var(--mobile-meta-row);padding-top:var(--meta-pad-top);padding-bottom:var(--meta-pad-bottom);align-items:center} .home-meta.header-menu-mode>.parts{align-self:center;align-items:center;height:var(--mobile-meta-row);padding:0 0 0 var(--chrome-pad)} .home-meta.header-menu-mode>.parts>.part{line-height:1} .home-meta.header-menu-mode>.header-menu-toggle{align-self:center;width:44px;height:44px;margin:-10px -2px -10px -10px} .home-meta.header-menu-mode:not(.header-menu-open)>.header-menu-panel{transform:translate3d(0,-6px,0) scale(.95,.98)}} .home-meta.header-menu-mode .header-menu-panel .parts{position:static;display:grid;grid-template-columns:1fr;grid-column:auto;grid-row:auto;justify-self:stretch;width:100%;height:auto;margin:0;padding:0;gap:0;overflow:visible} .home-meta.header-menu-mode .header-menu-panel .part{display:flex;align-items:center;width:100%;min-height:40px;padding:10px 0;line-height:1;white-space:normal} .home-meta.header-menu-mode .header-menu-panel .parts + .switches{margin-top:10px;padding-top:10px;border-top:var(--rule) solid var(--divider)} @media (max-width:760px){.home-meta .switches .mobile-contact-link{display:none} .home-meta.header-menu-mode .header-menu-panel .mobile-contact-link{display:none}} .order-cta{display:none} @media (max-width:760px){.home-meta.header-menu-mode>.order-cta{grid-column:1;grid-row:1;align-self:center;justify-self:start;display:inline-flex;align-items:center;position:relative;height:calc(var(--mobile-meta-row) + 20px);margin-left:var(--chrome-pad);padding-block:10px;margin-block:-10px;font-size:var(--fs-label);letter-spacing:var(--ls-tiny);text-transform:uppercase;font-weight:700;font-variation-settings:"wght" 700;line-height:1;color:var(--pencil);white-space:nowrap;transform-origin:left center;transition:transform 220ms var(--ease)} @media (hover:hover){.home-meta.header-menu-mode>.order-cta:hover{transform:scaleX(1.025)}}} .hero{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:auto 1fr;column-gap:var(--colgap);row-gap:clamp(20px,2.6vh,32px);padding-block:clamp(10px,2vh,28px) var(--home-flow-gap)} .name{grid-column:1/span 7;grid-row:1;font-family:var(--font);font-stretch:var(--display-stretch);font-size:var(--fs-name);font-weight:600;letter-spacing:-.045em;line-height:.94} .name span{display:block;white-space:nowrap} .hero-copy{grid-column:1/span 7;grid-row:2;padding-left:var(--col2);display:flex;flex-direction:column;justify-content:flex-end;min-width:0} .lede{margin:0;max-width:50ch;font-size:var(--fs-text);line-height:1.5;text-wrap:pretty} @supports (width:round(1px,1px)){:root{--meta-pad:round(clamp(4px,.8vh,10px),1px);--meta-pad-top:round(clamp(16px,3vw,24px),1px);--meta-pad-bottom:round(clamp(12px,3.75vw,18px),1px)}} .work{padding-block:0 calc(var(--home-flow-gap) - var(--rule-gap) + var(--home-list-correction))} .work h2,.clients h2{font-size:var(--fs-label);line-height:1;height:0;display:flex;justify-content:flex-end;align-items:flex-start;text-align:right;padding-right:calc(100% - var(--col1));position:relative;z-index:1} .specs{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--colgap);list-style:none;padding:0;margin:0} .spec{display:grid;grid-template-columns:subgrid;grid-column:1/-1;align-items:baseline;padding-block:var(--rule-gap);min-height:64px;position:relative} .spec .no{grid-column:1;margin-left:var(--col2);text-align:right} .spec h3{grid-column:3/7} .spec ul{grid-column:8/span 4} .spec::before{content:"";position:absolute;left:var(--col2);right:0;top:0;height:var(--rule);background:var(--divider)} .spec::after{content:"";position:absolute;left:var(--col2);right:0;top:0;height:var(--pen);background:var(--pencil);transform:scaleX(0);transform-origin:left;transition:transform 620ms var(--ease);will-change:transform} .spec .no{font-size:var(--number-size);letter-spacing:-.02em;font-weight:600;color:var(--mute);min-width:3ch;line-height:round(1.55em,1px)} .spec h3{margin:0;font-family:var(--font);font-stretch:var(--display-stretch);font-size:var(--fs-title);font-weight:600;letter-spacing:-.035em;line-height:1.02;color:var(--ink);text-align:right} .spec .sect{position:relative;display:inline-block;transition:transform 380ms var(--ease),color 260ms var(--ease);transform-origin:left} .spec.design-spec .sect{width:10ch;max-width:100%} .spec.under .sect{text-align:left} .spec.under .sect>span{display:block} @media (min-width:641px){.spec.under .sect{text-align:right}} .spec .sect::after{content:"↘";display:inline-block;margin-left:.16em;font-size:.36em;vertical-align:.95em;line-height:1;color:var(--ink);opacity:0;transform:translate(-.3em,-.3em);transition:opacity 300ms var(--ease),transform 300ms var(--ease)} .spec .sect[target]::after{content:"↗";transform:translate(-.3em,.3em)} .spec.under .sect::after{content:none} .spec.under .sect>span:last-child{position:relative;width:max-content;max-width:100%} .spec.under .sect>span:last-child::after{content:"↗";position:absolute;left:100%;top:.35em;margin-left:.16em;font-size:.36em;line-height:1;color:var(--ink);opacity:0;transform:translate(-.3em,.3em);transition:opacity 300ms var(--ease),transform 300ms var(--ease)} @media (min-width:641px){.spec.under .sect{width:100%} .spec.under .sect>span:first-child,.spec.under .sect>span:last-child{width:100%;max-width:none;text-align:right} .spec.under .sect>span:first-child{position:relative} .spec.under .sect>span:first-child::after{content:"↗";position:absolute;left:100%;top:.35em;margin-left:.16em;font-size:.36em;line-height:1;color:var(--ink);opacity:0;transform:translate(-.3em,.3em);transition:opacity 300ms var(--ease),transform 300ms var(--ease)} .spec.under .sect>span:last-child::after{content:none}} .work .spec:not(.under) .sect::after{content:none} .spec ul{list-style:none;padding:0;align-self:start;font-size:var(--fs-text);line-height:1.4;margin:calc(var(--fs-title) * .55 + 2.8em) 0 0;display:grid;gap:6px;justify-items:start} .spec li{font-size:inherit;line-height:inherit;color:var(--ink);letter-spacing:.01em;text-wrap:pretty} .spec.under li{color:var(--mute)} .spec .it{color:inherit;text-decoration:none;display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding-block:4px;background-image:linear-gradient(var(--pencil),var(--pencil));background-repeat:no-repeat;background-position:0 calc(100% - 4px);background-size:0% var(--pen);transition:background-size 380ms var(--ease),color 240ms var(--ease)} .spec a.it[target]::after{content:"↗";display:inline-block;margin-left:.16em;font-size:.36em;vertical-align:.95em;line-height:1;color:var(--ink);opacity:0;transform:translate(-.3em,.3em);transition:opacity 300ms var(--ease),transform 300ms var(--ease)} @media (hover:hover){.spec:hover .sect{color:var(--pencil);transform:translateX(clamp(8px,1.4vw,22px))} .spec:hover::after{transform:scaleX(1)} .work .spec.under .sect:hover>span:last-child::after{opacity:1;transform:none} .work .spec.under .sect:hover>span:first-child::after{opacity:1;transform:none} .spec .it:hover{color:var(--accent)} .spec a.it[target]:hover::after{opacity:1;transform:none}} .spec:active .sect{color:var(--pencil);transform:translateX(10px)} .spec:active::after{transform:scaleX(1)} .spec .it:active{color:var(--accent)} .spec a.it:focus-visible{outline:2px solid var(--accent);outline-offset:3px} .spec.under ul{grid-column:3/7;grid-row:2;margin:calc(var(--fs-title) * .55) 0 0;justify-items:end;text-align:right} @media (max-width:960px){.work h2,.clients h2{justify-content:flex-start;padding-right:0;transform-origin:.5em .5em;rotate:90deg;width:max-content}} @media (min-width:641px){.spec{align-items:baseline} .spec .no{font-size:var(--number-size);font-weight:600;letter-spacing:-.02em;line-height:round(1.55em,1px);color:var(--mute)} .spec.design-spec ul{margin-top:calc(var(--fs-title) * .55 + 2.8em + var(--fs-title) * 1.02)}} @media (min-width:641px) and (max-width:960px){.spec .no{grid-column:2;margin-left:0;text-align:right} .spec.design-spec .no,.spec.under .no{transform:translateY(calc(-1.02 * var(--fs-title)))}} @media (max-width:640px){.name{font-size:clamp(48px,11vw,72px);font-weight:700} .specs{display:block;margin-left:var(--col2)} .spec::before,.spec::after{left:0} .spec{display:grid;grid-template-columns:minmax(3ch,auto) minmax(0,1fr);column-gap:clamp(14px,2.4vw,36px);row-gap:24px;align-items:baseline} .spec.under{align-items:start} .spec.under .no{margin-top:.45em} .spec .no{grid-column:1;grid-row:1;margin-left:0;text-align:left} .spec h3,.spec ul{min-width:0} .spec h3{grid-column:2;grid-row:1;margin-right:0;text-align:left} .spec ul{grid-column:2;grid-row:2;margin:0;align-self:auto;justify-items:start;text-align:left} .spec.under ul{grid-column:2;grid-row:2;margin:0;justify-items:start;text-align:left} .spec.design-spec ul{row-gap:6px} .spec.design-spec li{max-width:24ch;text-wrap:balance} .spec.under{align-items:baseline} .spec.design-spec .no,.spec.under .no{margin-top:0;transform:translate(var(--mobile-number-nudge),calc(-1.02 * clamp(23.2px,6.16vw,32px)))} .spec h3{font-size:clamp(23.2px,6.16vw,32px);font-weight:700}} @media (max-width:360px){.name{font-size:clamp(40px,10.5vw,52px)} .spec h3{font-size:clamp(20px,5.44vw,25.6px)}} .figwrap{grid-column:9/span 4;grid-row:1/span 2;align-self:start} .figwrap figure{width:100%} .figwrap .shot picture{width:100%;height:auto} @media (min-width:961px){.name{position:relative;left:-8px}} figure{margin:0;position:relative;z-index:1} .shot{position:relative;display:flex;background:var(--surface);box-shadow:0 20px 34px -18px color-mix(in srgb,#000 18%,transparent)} .shot picture{display:block;position:relative;flex:1 1 auto;aspect-ratio:4/5;overflow:hidden} .shot img{width:100%;height:100%;object-fit:cover} @media (max-width:1100px){.name{grid-column:1/span 7} .hero-copy{grid-column:1/span 7} .figwrap{grid-column:9/span 4}} @media (max-width:960px){.hero{grid-template-rows:none;row-gap:clamp(22px,3.4vh,34px)} .name,.hero-copy,.figwrap{grid-column:1/-1;grid-row:auto} .hero-copy{padding-left:0} .name{order:1} .hero-copy{order:2} .figwrap{order:3;width:min(100%,420px);max-width:none;justify-self:center} .figwrap figure{width:100%} .figwrap .shot picture{height:auto;width:100%} .shot picture{aspect-ratio:5/4} .lede{max-width:38ch}} @media (max-width:640px){.figwrap{width:100%;justify-self:stretch} .shot img{object-position:50% 45%}} @media (min-width:641px) and (max-width:960px){.hero{grid-template-rows:auto 1fr} .name{grid-column:1/span 7;grid-row:1} .hero-copy{grid-column:1/span 7;grid-row:2;padding-left:var(--col2)} .figwrap{grid-column:8/span 5;grid-row:1/span 2;width:auto;max-width:none;justify-self:stretch;align-self:stretch;display:flex;align-items:center} .figwrap figure,.figwrap .shot,.figwrap .shot picture{width:100%;height:100%} .figwrap figure{height:calc(100% - clamp(12px,1.8vw,20px))} .figwrap .shot picture{aspect-ratio:auto}} .clients{--logo-tail:clamp(7px,calc(var(--lg) * .5),12px);--home-footer-pad:var(--foot-pad);padding-block:0 max(0px,calc(var(--home-flow-gap) - var(--home-footer-pad) - var(--logo-tail) + var(--home-logo-correction)));--lg:clamp(18px,2.1vw,25px)} .logos{position:relative;list-style:none;margin:0 0 0 var(--col2);padding:var(--rule-gap) 0 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;column-gap:clamp(26px,3.6vw,54px);row-gap:clamp(24px,4vw,40px)} .logos::before{content:"";position:absolute;left:0;right:0;top:0;height:var(--rule);background:var(--divider)} .logos a{display:block;color:inherit} @media (hover:hover){.logos a:hover .lg{color:var(--ink)}} .logos a:active .lg{color:var(--ink)} .logos a:focus-visible{outline:2px solid var(--accent);outline-offset:6px} .lg{display:block;position:relative;background:currentColor;color:color-mix(in srgb,var(--ink) 70%,transparent);transition:color 280ms var(--ease);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-image:var(--src);mask-image:var(--src)} .lg.kmbs{--src:url(/img/clients/kmbs.svg);height:var(--lg);width:calc(var(--lg) * 3.09)} .lg.naukma{--src:url(/img/clients/naukma.webp);height:calc(var(--lg) * 1.38);width:calc(var(--lg) * 1.46)} .lg.defenders{--src:url(/img/clients/defenders-ukma.webp);height:calc(var(--lg) * 1.64);width:calc(var(--lg) * 4.79)} .lg.kooperativ{--src:url(/img/clients/kooperativ.svg);height:calc(var(--lg) * .91);width:calc(var(--lg) * 4.93)} .lg.yd{--src:url(/img/clients/yd.svg);height:calc(var(--lg) * 1.2642);width:calc(var(--lg) * 1.9012)} .lg.tsyronian{--src:url(/img/clients/tsyronian.svg);height:calc(var(--lg) * 1.1);width:calc(var(--lg) * 3.8)} .lg.shylero{--src:url(/img/clients/shylero.webp);height:calc(var(--lg) * 1.29);width:calc(var(--lg) * 4.98)} @media (max-width:640px){.logos{justify-content:flex-start}} @media (max-width:480px){.clients{--lg:clamp(18px,5.6vw,24px)} .logos{column-gap:clamp(12px,4vw,20px);row-gap:clamp(18px,5vw,26px)} .logos li:has(.lg.naukma){order:0} .logos li:has(.lg.defenders),.logos li:has(.lg.tsyronian){order:1} .logos li:has(.lg.shylero){order:2} .logos{align-items:center} .logos>li{height:calc(var(--lg) * 1.64);display:flex;align-items:center}} .logos li>a{padding-block:3px;margin-block:-3px;display:inline-block} .site-foot .lines>a::after{vertical-align:.95em} .site-foot .foot-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:baseline;gap:var(--header-gap);padding-left:var(--chrome-pad);padding-right:var(--chrome-pad);color:var(--mute)} @media (max-width:640px){.work{padding-bottom:calc(var(--home-flow-gap) - var(--rule-gap) + var(--home-list-correction))} .clients{--home-footer-pad:var(--foot-pad-narrow);padding-block:0 max(0px,calc(var(--home-flow-gap) - var(--home-footer-pad) - var(--logo-tail) + var(--home-logo-correction)))} .foot-bar{grid-template-columns:1fr} .site-foot .foot-meta{width:100%;flex-direction:row;flex-wrap:nowrap;align-items:baseline;justify-content:flex-start;gap:var(--footer-row-gap);padding:0;min-width:0;text-align:left;white-space:nowrap} .site-foot .foot-meta .tiny{white-space:nowrap;min-width:0}} @media (min-width:961px){.hero-copy{grid-column:3/8;padding-left:0} .specs{grid-template-columns:repeat(12,minmax(0,1fr))} .spec .no{grid-column:3;grid-row:1;align-self:baseline;margin-left:0;text-align:right} .spec.design-spec .no,.spec.under .no{transform:translateY(calc(-1.02 * var(--fs-title)))} .spec h3{grid-column:4/7;grid-row:1} .spec ul{grid-column:8/span 4} .spec.under ul{grid-column:3/7;grid-row:2;margin:calc(var(--fs-title) * .55) 0 0;justify-items:end;text-align:right} .spec::before,.spec::after{left:calc(16.6666667% - var(--colgap) / 3)} .logos::before{left:calc(-1 * var(--colgap) / 2)} .work{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--colgap)} .work .specs{grid-column:1/-1} .work h2,.clients h2{grid-column:1/3;padding-right:0;justify-content:flex-end} .clients{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--colgap)} .logos{grid-column:3/-1;margin-left:0}} @media (min-width:641px) and (max-width:960px){.logos::before{left:calc(-1 * var(--chrome-pad))} .clients .logos{margin-left:calc(var(--col2) + var(--chrome-pad))}} @media (max-width:640px){.logos::before{left:calc(-1 * var(--chrome-pad))} .clients .logos{margin-left:calc(var(--col2) + var(--chrome-pad))}}