@font-face{font-family:Manrope;src:url('./assets/fonts/manrope-variable-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}

:root{--paper:#fff;--type-title:clamp(1.875rem,calc(1.375rem + 1.65vw),3rem);--type-service:clamp(1.625rem,calc(1.25rem + 1.1vw),2.5rem);--type-lead:var(--type-body);--type-body:clamp(1.125rem,calc(1rem + .4vw),1.375rem);--type-menu:clamp(1.5rem,calc(1rem + 1.5vw),2.5rem);--weight-text:400;--weight-nav:500;--leading-title:1.12;--leading-service:1.16;--leading-lead:1.5;--leading-body:1.5;--tracking-title:-.02em;--tracking-lead:normal;--ink:#070b20;--gutter:20px;--ease-out:cubic-bezier(.23,1,.32,1);--intro-cap:216px;--intro-step:calc(12.8vw + 40px);--intro-step-width:calc(50% + 10px);color:var(--ink);background:var(--paper);font:400 16px/1.5 Manrope,Arial,sans-serif;font-synthesis:none}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scrollbar-color:#828694 #fff;scrollbar-width:thin;scroll-padding-top:76px}
body{margin:0}
body:has(dialog[open]){overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
button:disabled{cursor:default}
button{border-radius:0}
img{max-width:100%;display:block}
p,h1,h2,h3,figure{margin:0}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
::selection{color:#fff;background:#303b67}
:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;top:8px;left:70px;background:#fff;padding:12px;transform:translateY(-200%);z-index:100}
.skip-link:focus{transform:none}

.site-header{position:fixed;z-index:30;top:0;left:0;width:100%;height:54px;padding:0 var(--gutter);display:flex;align-items:center;background:transparent;color:#fff;mix-blend-mode:difference}
.menu-toggle{padding:0;border:0;background:none;width:44px;height:44px;display:grid;place-items:center}
.menu-toggle svg{width:36px;height:20px;stroke-width:1}
.header-home{position:absolute;left:99px;top:5px;width:96px;height:44px;display:inline-flex;flex-direction:column;align-items:flex-start;pointer-events:none}
.header-home .kova-name,.header-home .continental-name{visibility:hidden}
.header-home .kova-name{font-size:36px;line-height:.8}
.header-home .continental-name{font-size:7px;margin-top:4px;line-height:1}
.header-links{margin-left:auto;display:flex;gap:clamp(40px,10vw,160px);font-size:11px;font-weight:var(--weight-nav);letter-spacing:.04em;text-transform:uppercase}
.header-links a{display:flex;align-items:center;min-height:44px}
.moving-wordmark{position:fixed;z-index:31;left:var(--gutter);top:var(--intro-cap);display:inline-flex;flex-direction:column;align-items:flex-start;transform-origin:0 0;pointer-events:none;line-height:1;color:#fff;mix-blend-mode:difference}
.kova-name{font-size:12.8vw;font-weight:450;line-height:.82;letter-spacing:.025em;display:block;width:max-content}
.continental-name{font-size:1.65vw;line-height:1.2;display:flex;justify-content:space-between;width:100%;font-weight:450;margin-top:1.7vw}
.continental-name span{display:block}
.moving-wordmark .continental-name span{transform-origin:0 0}

.intro{position:relative;height:465svh;background:var(--ink)}
.intro-stage{position:sticky;top:0;height:100svh;overflow:clip}
.sky{position:absolute;inset:0;pointer-events:none}
.sky-dusk{background:linear-gradient(180deg,#303c5e 0%,#616e87 65%,#aeb0bc 100%)}
.sky-night{opacity:0;background:linear-gradient(180deg,#070b20 0%,#24344c 70%,#5c6e81 100%)}
.building-layer{position:absolute;top:0;left:calc(50% - 46.125svh);width:92.25svh;height:123svh;aspect-ratio:.75;transform:translate3d(0,56svh,0);transform-origin:50% 0;pointer-events:none}
.building-layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.building-night{opacity:0}
.intro-white{position:absolute;top:0;left:0;width:100%;height:calc(var(--intro-cap) + var(--intro-step));background:#fff;transform-origin:0 0;clip-path:polygon(0 0,100% 0,100% var(--intro-cap),var(--intro-step-width) var(--intro-cap),var(--intro-step-width) 100%,0 100%)}
.intro-copy,.intro-second-copy{position:absolute;left:72%;right:var(--gutter);top:calc(var(--intro-cap) + 64px);max-width:330px;line-height:1.4;font-size:clamp(13px,1.3vw,18px);font-weight:400;color:#fff;letter-spacing:.01em;text-transform:uppercase;text-wrap:balance}
.intro-second-copy{top:84px;left:var(--gutter);right:var(--gutter);max-width:none;font-size:clamp(16px,1.6vw,22px);text-align:center;opacity:0;pointer-events:none}

.section-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 20px;padding-inline:var(--gutter)}
.section-grid>h2,.section-grid>p{min-width:0;overflow-wrap:anywhere}
.chapter-step{position:relative;z-index:3}
.architecture{margin-top:-100svh;padding-top:170px;color:#fff;background:linear-gradient(var(--ink),var(--ink)) 0 120px/100% calc(100% - 120px) no-repeat;overflow:clip}
.architecture:before{content:'';position:absolute;left:0;top:0;width:calc(50% + 10px);height:121px;background:var(--ink);z-index:-1}
.architecture-copy{position:relative;z-index:2}
.display-title,.gallery-editorial h2{font-size:var(--type-title);line-height:var(--leading-title);letter-spacing:var(--tracking-title);font-weight:var(--weight-text);text-wrap:balance}
.display-title{grid-column:1/13}
.statement,.service-copy{font-size:var(--type-body);line-height:var(--leading-body);letter-spacing:normal;font-weight:var(--weight-text);text-wrap:pretty}
.statement{grid-column:7/13;margin-top:60px}
.architecture-copy .statement,.gallery-statement{font-size:var(--type-lead);line-height:var(--leading-lead);letter-spacing:var(--tracking-lead);font-weight:var(--weight-text);text-wrap:pretty}
.architecture-copy .statement{grid-column:5/13;text-indent:0;text-transform:none}
.architecture-detail{position:relative;margin:4px 0 0 16.667%;height:clamp(400px,49vw,780px);overflow:clip}
.architecture-detail img{position:absolute;width:185%;max-width:none;height:auto;left:-42.5%;top:-7%;transform-origin:center}
.structural{padding:110px 0 230px;margin-top:-30px;background:var(--ink);color:#fff}
.engineering-copy .display-title{grid-column:1/10}
.engineering-copy .statement{margin-top:60px}
.service-row{margin-top:170px;align-items:start}
.service-title{font-size:var(--type-service);font-weight:var(--weight-text);letter-spacing:var(--tracking-title);line-height:var(--leading-service);text-wrap:balance}
.service-copy{max-width:45ch}
.fabrication .service-title{grid-column:6/13;grid-row:1}
.fabrication .service-copy{grid-column:1/5;grid-row:1;align-self:end}
.assembly .service-title{grid-column:1/9}
.assembly .service-copy{grid-column:9/13;align-self:end}
.civil{padding:170px 0 150px;margin-top:-100px;background:#fff;clip-path:polygon(0 0,50% 0,50% 100px,100% 100px,100% 100%,0 100%)}
.civil .statement{margin-top:70px}
.reveal{opacity:1}
.js-motion .reveal{opacity:0;transform:translate3d(0,38px,0);transition:transform .7s var(--ease-out),opacity .7s var(--ease-out)}
.js-motion .reveal.is-visible{opacity:1;transform:none}

.site-footer{position:relative;padding:130px var(--gutter) 24px;color:white;background:var(--ink);overflow:clip}
.footer-brand{display:inline-flex;flex-direction:column;align-items:flex-start;width:max-content}
.footer-brand .kova-name{font-size:18.36vw}
.footer-brand .continental-name{font-size:2.3256vw;margin-top:1.9584vw}
.footer-bottom{display:flex;justify-content:flex-end;align-items:center;margin-top:130px;font-size:11px;font-weight:var(--weight-nav);letter-spacing:.04em}
.footer-bottom a{display:flex;gap:16px;align-items:center;min-height:44px}
.site-menu{overflow-y:auto;overscroll-behavior:contain;inset:0;margin:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;padding:0 var(--gutter);color:var(--ink);background:#fff}
.site-menu::backdrop{background:var(--ink)}
.menu-top{position:sticky;top:0;z-index:1;background:var(--paper);display:flex;align-items:center;justify-content:space-between;height:70px;font-size:12px;font-weight:var(--weight-nav);letter-spacing:.04em}
.menu-close{width:44px;height:44px;border:0;background:none}
.site-menu nav{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(16px,2.2vh,24px);padding:clamp(24px,6vh,64px) 0 48px}
.site-menu nav a{display:flex;align-items:center;min-height:44px;font-size:var(--type-menu);font-weight:var(--weight-text);letter-spacing:var(--tracking-title);line-height:1.18;text-transform:uppercase;text-wrap:balance;max-width:100%;overflow-wrap:anywhere}

@media(min-width:1920px){:root{--gutter:30px;--intro-cap:270px;--intro-step:270px}
.section-grid{gap:0 30px}
.moving-wordmark .kova-name{font-size:220px}
.moving-wordmark .continental-name{font-size:28px;margin-top:28px}
}

@media(max-width:1000px){:root{--intro-cap:24svh;--intro-step:calc(14vw + 16px)}
.statement{grid-column:7/13}
.architecture-copy .statement{grid-column:4/13}
.fabrication .service-title{grid-column:6/13}
.fabrication .service-copy{grid-column:1/5}
.assembly .service-title{grid-column:1/8}
.assembly .service-copy{grid-column:9/13}
.architecture{padding-top:145px}
.architecture-detail{height:53vw}
}

@media(max-width:700px){:root{--gutter:10px;--intro-cap:max(160px,28.5svh);--intro-step:calc(27.2vw + 20px);--intro-step-width:83.333%}
.site-header{height:48px}
.menu-toggle{width:44px;margin-left:-5px;margin-right:-5px}
.menu-toggle svg{width:28px}
.header-home{left:70px;top:7px;width:82px}
.header-home .kova-name{font-size:31px}
.header-home .continental-name{font-size:7px;margin-top:4px}
.header-links{font-size:11px;gap:22px}
.header-links a:first-child{display:none}
.moving-wordmark{top:var(--intro-cap)}
.moving-wordmark .kova-name{font-size:24vw;line-height:.83}
.moving-wordmark .continental-name{font-size:3.15vw;margin-top:3.2vw}
.intro{height:455svh}
.intro-copy,.intro-second-copy{font-size:13px}
.intro-copy{top:calc(var(--intro-cap) - 76px);left:51%;color:var(--ink);right:14px;max-width:none}
.intro-second-copy{top:76px;font-size:16px}
.building-layer{top:0;left:calc(50% - 40.5svh);width:81svh;height:108svh;transform:translate3d(0,60.5svh,0)}
.section-grid{gap:0 10px}
.architecture{margin-top:-90svh;padding-top:100px;background-position:0 64px;background-size:100% calc(100% - 64px)}
.architecture:before{width:66.667%;height:65px}
.statement{grid-column:3/13;margin-top:42px}
.architecture-copy .statement{grid-column:3/13}
.architecture-detail{height:87vw;margin:16px 0 0;overflow:clip}
.architecture-detail img{width:185%;left:-42.5%;top:-62%}
.structural{padding:70px 0 160px;margin-top:-25px}
.engineering-copy .display-title{grid-column:1/13}
.engineering-copy .statement{margin-top:44px;grid-column:3/13}
.service-row{margin-top:100px}
.fabrication .service-title{grid-column:3/13;grid-row:1}
.fabrication .service-copy{grid-column:3/13;grid-row:2;margin-top:72px}
.assembly .service-title{grid-column:1/13}
.assembly .service-copy{grid-column:3/13;margin-top:32px}
.civil{margin-top:-64px;padding:110px 0 70px;clip-path:polygon(0 0,50% 0,50% 64px,100% 64px,100% 100%,0 100%)}
.civil .statement{margin-top:40px}
.js-motion .reveal{transform:translate3d(0,22px,0)}
.site-footer{padding-top:84px}
.footer-brand .kova-name{font-size:20.808vw}
.footer-brand .continental-name{font-size:2.754vw;margin-top:2.448vw}
.footer-bottom{margin-top:80px;font-size:11px}
.menu-top{font-size:11px}
}

@media(hover:hover) and (pointer:fine){.header-links a:hover,.footer-bottom a:hover,.site-menu nav a:hover{opacity:.65}
}

@media(max-width:700px) and (max-height:450px){
.moving-wordmark .kova-name{font-size:19vw}
.moving-wordmark .continental-name{font-size:2.5vw;margin-top:2.5vw}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.js-motion .reveal{opacity:1;transform:none;transition:none}
.architecture-detail img{transform:none!important}
}

@media(prefers-reduced-motion:reduce){.intro-copy{display:none}
}

/* Static baseline when scripting is disabled or the module fails to initialize. */
.motion-pending .header-home,.motion-pending .menu-toggle{visibility:hidden}
html:not(.motion-pending):not(.js-ready) .menu-toggle,
html:not(.motion-pending):not(.js-ready) .moving-wordmark,
html:not(.motion-pending):not(.js-ready) .intro-white,
html:not(.motion-pending):not(.js-ready) .intro-copy{display:none}
html:not(.motion-pending):not(.js-ready) .site-header{position:absolute}
html:not(.motion-pending):not(.js-ready) .header-home{left:var(--gutter);pointer-events:auto!important}
html:not(.motion-pending):not(.js-ready) .header-home .kova-name,
html:not(.motion-pending):not(.js-ready) .header-home .continental-name{visibility:visible}
html:not(.motion-pending):not(.js-ready) .intro{height:100svh;min-height:480px}
html:not(.motion-pending):not(.js-ready) .intro-stage{position:relative;height:100%}
html:not(.motion-pending):not(.js-ready) .intro-second-copy{opacity:1!important}
html:not(.motion-pending):not(.js-ready) .building-layer{transform:translate3d(0,130px,0)!important}
html:not(.motion-pending):not(.js-ready) .architecture{margin-top:0}
html:not(.motion-pending):not(.js-ready) .reveal{opacity:1;transform:none;transition:none}
html:not(.motion-pending):not(.js-ready) .section-grid{clip-path:none!important}

/* Native controls avoid large blends; the independent logo retains its original difference effect. */
.native-scroll .site-header{mix-blend-mode:normal;background:transparent;color:var(--ink)}
.native-scroll .site-header[data-surface="dark"]{background:var(--ink);color:#fff}
.native-scroll .site-header[data-surface="paper"]{background:var(--paper);color:var(--ink)}
.native-scroll .site-header[data-surface="intro"]{background:transparent}
.native-scroll .section-grid{clip-path:none!important}

/* Two painted rectangles preserve each stepped edge without a polygon mask. */
.native-scroll .intro-white{clip-path:none;background:
  linear-gradient(var(--paper),var(--paper)) 0 0/100% var(--intro-cap) no-repeat,
  linear-gradient(var(--paper),var(--paper)) 0 100%/var(--intro-step-width) calc(var(--intro-step) + 1px) no-repeat}
.native-scroll .civil{--civil-step:100px;clip-path:none;background:
  linear-gradient(var(--paper),var(--paper)) 0 0/50% calc(var(--civil-step) + 1px) no-repeat,
  linear-gradient(var(--paper),var(--paper)) 0 100%/100% calc(100% - var(--civil-step)) no-repeat}
@media(max-width:700px){.native-scroll .civil{--civil-step:64px}}
