/* =========================================================================
   OMUA ARCHITEKTI — vzhled podle návrhu grafika
   Rozměry v jednotkách --u: desktop 1 u = 1 px návrhu 1440 px (web se škáluje
   podle šířky okna, zarovnání vlevo nahoře), mobil 1 u = 1 px návrhu 390 px.
   Mřížka desktop: okraje 48, 12 sloupců po 90, mezera 24.
   ========================================================================= */
:root{
  --u:calc(100vw / 1440);
  --bg:#E5E5E5; --fg:#0F0F0F; --mut:#4A4A4A; --off:#9A9A9A; --grey:#9A9A9A; --dark:#212121; --cy:#9CF7FA; --logo:#494949;
  --m:calc(48 * var(--u)); --col:calc(90 * var(--u)); --gut:calc(24 * var(--u));
  --t:calc(24 * var(--u)); --lh:1.36;
  --ease:cubic-bezier(.7,0,.2,1);
}
@media (max-width:820px){
  :root{--u:calc(100vw / 390); --m:calc(16 * var(--u)); --col:calc(77.5 * var(--u)); --gut:calc(16 * var(--u)); --t:calc(18 * var(--u)); --lh:1.42}
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:var(--t);line-height:var(--lh);-webkit-font-smoothing:antialiased;font-feature-settings:"ss03" 0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
img,video{display:block;max-width:none}
p{margin:0}
h1,h2,h3{margin:0;font-weight:400}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.up{text-transform:uppercase;letter-spacing:.02em}
.ul{text-decoration:underline;text-underline-offset:.14em;text-decoration-thickness:1px}
body.lock{overflow:hidden}

/* ---------- hlavička (stejná pozice na úvodu i podstránkách) ---------- */
.hdr{position:relative;z-index:5;display:flex;justify-content:space-between;align-items:flex-start;padding:calc(40 * var(--u)) var(--m) 0;color:var(--fg)}
.hdr.hfix{position:absolute;inset:0 0 auto 0;z-index:10;pointer-events:none}
.hdr.hfix a,.hdr.hfix button{pointer-events:auto}
.logo{position:relative;display:block;width:calc(452 * var(--u));height:calc(106 * var(--u));color:var(--logo)}
.logo .lm{width:100%;height:auto;filter:brightness(0) invert(.286);transition:filter .5s}
.logo .lw{position:absolute;left:0;top:calc(-6 * var(--u));font-size:calc(69.6 * var(--u));line-height:.95;font-weight:400;letter-spacing:-.005em;white-space:nowrap;opacity:0;transition:color .5s}
/* logo se střídá s nápisem OMUA ARCHITEKTI */
@keyframes lgMark{0%,42%{opacity:1}50%,92%{opacity:0}100%{opacity:1}}
@keyframes lgWord{0%,42%{opacity:0}50%,92%{opacity:1}100%{opacity:0}}
.logo .lm{animation:lgMark 10s ease-in-out infinite}
.logo .lw{animation:lgWord 10s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){ .logo .lm,.logo .lw{animation:none} .logo .lw{display:none} }
.nav{display:flex;gap:calc(48 * var(--u));font-size:calc(25 * var(--u));line-height:1;padding-top:calc(4 * var(--u))}
.nav a{text-transform:uppercase;letter-spacing:.02em;transition:color .3s}
.nav a:hover,.nav a.on{color:var(--off)}
.burger{display:none}
.hdr.light{color:#fff}
.hdr.light .logo{color:#fff}
.hdr.light .logo .lm{filter:brightness(0) invert(1)}
.hdr.light .nav a:hover{color:rgba(255,255,255,.65)}
@media (max-width:820px){
  .hdr{padding:calc(16 * var(--u)) var(--m) 0;align-items:center}
  .logo{width:calc(265 * var(--u));height:calc(62.2 * var(--u))}
  .logo .lw{font-size:calc(40.8 * var(--u));top:calc(-3 * var(--u))}
  .nav{display:none}
  .burger{display:block;width:calc(30 * var(--u));height:calc(22 * var(--u));position:relative}
  .burger i{position:absolute;left:0;right:0;height:2px;background:currentColor}
  .burger i:nth-child(1){top:0}.burger i:nth-child(2){top:50%;margin-top:-1px}.burger i:nth-child(3){bottom:0}
}

/* ---------- úvod ---------- */
#hero{background:#1a1a19;color:#fff}
.hv,.hp{position:absolute;inset:0}
.hv video,.hp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.hv video.on,.hp img.on{opacity:1}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.28),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 75%,rgba(0,0,0,.25));pointer-events:none}
.down{position:absolute;left:50%;bottom:calc(30 * var(--u));transform:translateX(-50%);z-index:3;padding:calc(6 * var(--u)) calc(12 * var(--u));font-size:calc(25 * var(--u));line-height:1.2;font-weight:500}
.down:hover{transform:translateX(-50%) translateY(calc(3 * var(--u)))}
.down{transition:transform .3s var(--ease)}
.hero-cap{position:absolute;right:var(--m);bottom:calc(36 * var(--u));z-index:3;font-size:calc(25 * var(--u));line-height:1.2;font-weight:500;transition:opacity .4s}
.hero-cap.swap{opacity:0}
.hero-cap:hover{opacity:.75}
@media (max-width:820px){
  .down{bottom:calc(22 * var(--u));font-size:calc(20 * var(--u))}
  .hero-cap{bottom:calc(28 * var(--u));font-size:calc(17 * var(--u))}
}

/* ---------- stack úvodní stránky: snímky vyjíždějí zespodu přes celou obrazovku ---------- */
#home{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none}
.slide{position:absolute;inset:0;overflow:hidden;background:var(--bg);transform:translateY(100%);transition:transform 1s var(--ease);will-change:transform}
.slide.in{transform:none}
.slide.past{transform:translateY(-14%)}
#hero.slide{transform:none;z-index:1}
#hero.slide.past{transform:translateY(-14%)}
#claim{z-index:2}#strip{z-index:3}#teaser{z-index:4}
.slide .down{color:var(--fg)}
#hero .down{color:#fff}
@media (prefers-reduced-motion:reduce){ .slide{transition-duration:.01s} }

/* 02 claim */
#claim{padding:calc(255 * var(--u)) var(--m) 0}
.claim{font-size:calc(64.7 * var(--u));line-height:1.12;letter-spacing:-.01em;max-width:calc(960 * var(--u))}
@media (max-width:820px){
  #claim{padding:calc(130 * var(--u)) var(--m) 0}
  .claim{font-size:calc(35 * var(--u));line-height:1.14}
}

/* 03 projekty – vodorovný pás */
#strip{padding-top:calc(232 * var(--u))}
.lbl{display:block;font-size:var(--t);text-transform:uppercase;letter-spacing:.02em;margin:0 var(--m)}
.rail{display:flex;align-items:flex-end;gap:calc(138 * var(--u));margin-top:calc(22 * var(--u));padding:0 var(--m);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.rail.drag{cursor:grabbing}
.rail.drag a{pointer-events:none}
.ri{flex:none;display:block}
.ri .ph{overflow:hidden;background:#d6d6d6}
.ri img{width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform 1.2s var(--ease)}
.ri:hover img{transform:scale(1.025)}
.cap{display:flex;justify-content:space-between;gap:1em;margin-top:calc(8 * var(--u));white-space:nowrap}
.cap b{font-weight:400;overflow:hidden;text-overflow:ellipsis}
.cap span{color:var(--mut)}
.rnext{flex:none;align-self:flex-end;padding-right:var(--m);white-space:nowrap;margin-bottom:calc(-1 * var(--u))}
.rnext:hover,.pnext:hover{color:var(--mut)}
.thumb{position:relative;height:2px;margin-top:calc(4 * var(--u))}
.thumb i{position:absolute;left:0;top:0;height:2px;background:#6a6a6a;width:30%}
@media (max-width:820px){
  #strip{padding-top:calc(130 * var(--u))}
  .rail{gap:calc(32 * var(--u));margin-top:calc(28 * var(--u));cursor:auto}
}

/* 04 studio + kontakt – celé na jednu obrazovku */
#teaser{display:flex;flex-direction:column}
/* fotka Bytu Karlín bez ořezu: horní hrana na úrovni claimu z předchozího snímku (73 u), dolní hrana = spodní hrana textu */
.tz{flex:1;min-height:0;display:grid;grid-template-columns:calc(660 * var(--u)) calc(500 * var(--u));align-content:start;align-items:end;column-gap:calc(24 * var(--u));padding:calc(268 * var(--u)) var(--m) 0}
.tz .ph{display:block;width:min(calc(660 * var(--u)), calc((100vh - 192 * var(--u) - 268 * var(--u) - 56 * var(--u)) * 1.501));aspect-ratio:1.501}
.tz .ph img{display:block;width:100%;height:100%;object-fit:contain;transition:opacity .3s}
.tz .ph:hover img{opacity:.9}
.tz .tx{width:calc(500 * var(--u));margin-bottom:-.45em}
.tz .tx a{display:inline-block;margin-top:calc(32 * var(--u));text-transform:uppercase;letter-spacing:.02em}
.tz .tx a:hover{color:var(--mut)}
@media (max-width:820px){
  .tz{display:flex;flex-direction:column;align-items:stretch;gap:calc(22 * var(--u));padding:calc(120 * var(--u)) var(--m) calc(26 * var(--u))}
  .tz .ph{width:100%;margin-top:auto}
  .tz .tx{width:auto;margin:0;font-size:calc(16 * var(--u))}
  .tz .tx a{margin-top:calc(14 * var(--u))}
  #teaser .cta{padding:calc(20 * var(--u)) var(--m)}
  #teaser .foot{flex-direction:row;flex-wrap:wrap;justify-content:space-between;padding:calc(18 * var(--u)) var(--m);font-size:calc(13 * var(--u))}
  #teaser .foot nav{flex-direction:row;gap:calc(14 * var(--u))}
  #teaser .foot p{margin-top:0}
}
#teaser .cta,#teaser .foot{flex:none}
.cta{display:flex;align-items:center;justify-content:center;height:calc(96 * var(--u));background:var(--cy);color:var(--fg);width:100%;font-size:var(--t)}
.cta i,.rnext i,.hero-cap i{font-style:normal;display:inline-block;transition:transform .3s var(--ease)}
.cta:hover i,.rnext:hover i,.hero-cap:hover i{transform:translateX(calc(4 * var(--u)))}
.pnext svg{width:.72em;height:.62em;margin-left:.25em;vertical-align:-.02em}
.cta:hover svg{transform:translateX(.2em)}
.cta svg{transition:transform .3s}
.foot{display:flex;justify-content:space-between;align-items:center;height:calc(96 * var(--u));padding:0 var(--m);background:var(--dark);color:#fff;font-size:calc(24 * var(--u));font-weight:500;text-transform:uppercase;letter-spacing:.03em}
.foot nav{display:flex;gap:calc(32 * var(--u))}
.foot a:hover{color:var(--off)}
@media (max-width:820px){
  .cta{height:auto;padding:calc(30 * var(--u)) var(--m);text-align:center;line-height:1.4}
  .foot{height:auto;flex-direction:column;justify-content:center;padding:calc(48 * var(--u)) var(--m) calc(40 * var(--u));font-size:var(--t)}
  .foot nav{flex-direction:column;align-items:center;gap:calc(22 * var(--u))}
  .foot p{margin-top:calc(36 * var(--u))}
}

/* ---------- podstránky ---------- */
.page{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
.page>.foot{margin-top:auto}
.pbody{padding:calc(122 * var(--u)) var(--m) calc(150 * var(--u));position:relative}
@media (max-width:820px){ .pbody{padding:calc(56 * var(--u)) var(--m) calc(80 * var(--u))} }

/* projekty – mřížka */
.pgrid{position:relative}
.gi{position:absolute;display:block}
.gi .ph{overflow:hidden;background:#d6d6d6}
.gi img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.gi:hover img{transform:scale(1.025)}
.gi p{margin-top:calc(10 * var(--u));line-height:1.33}
.gi b{display:block;font-weight:400}
.gi span{color:var(--mut)}
.gi span i{display:inline-block;width:calc(24 * var(--u))}
.seznam-m{display:none}
@media (max-width:820px){
  .gi{position:static;margin-bottom:calc(44 * var(--u))}
  .seznam-m{display:block;text-transform:uppercase;letter-spacing:.02em;margin-bottom:calc(36 * var(--u))}
}

/* seznam projektů – vrstva, která vyjede zespodu */
.lov{position:fixed;inset:0;z-index:30;background:var(--bg);overflow-y:auto;transform:translateY(100%);transition:transform .8s var(--ease);overscroll-behavior:contain}
.lov.on{transform:none}
.lbody{position:relative;padding:calc(126 * var(--u)) var(--m) calc(126 * var(--u))}
.lov-x{z-index:31}
@media (max-width:820px){ .lbody{padding:calc(70 * var(--u)) var(--m) calc(60 * var(--u))} }

.tbl{width:calc(1002 * var(--u));border-top:1px solid #6b6b6b}
.row{display:grid;grid-template-columns:calc(456 * var(--u)) calc(228 * var(--u)) 1fr auto;align-items:center;height:calc(73 * var(--u));border-bottom:1px solid #6b6b6b;width:100%;text-align:left;transition:background-color .15s}
.row:hover,.row:focus-visible{background:var(--cy);outline:0}
.prev{position:absolute;left:calc(1074 * var(--u));width:calc(318 * var(--u));overflow:hidden;opacity:0;transition:opacity .25s;pointer-events:none}
.prev.on{opacity:1}
.prev img{width:100%;height:100%;object-fit:cover}
@media (max-width:820px){
  .tbl{width:100%}
  .row{grid-template-columns:1fr 1fr auto;grid-template-areas:"t t t" "p y r";height:auto;padding:calc(14 * var(--u)) 0 calc(14 * var(--u));row-gap:calc(2 * var(--u))}
  .row .c1{grid-area:t}.row .c2{grid-area:p;color:var(--mut)}.row .c3{grid-area:y;color:var(--mut);text-align:center}.row .c4{grid-area:r;color:var(--mut);text-align:right}
  .prev{display:none}
}

/* studio */
.st{display:flex;justify-content:space-between;align-items:flex-start}
.st .tx{width:calc(660 * var(--u))}
.st .tx p+p{margin-top:calc(32 * var(--u))}
.st .ph{width:calc(546 * var(--u));height:calc(519 * var(--u));overflow:hidden}
.st .ph img{width:100%;height:100%;object-fit:cover}
.people{display:flex;gap:calc(116 * var(--u));margin-top:calc(64 * var(--u))}
.people a[href^="mailto"]{text-decoration:underline;text-underline-offset:.14em;text-decoration-thickness:1px}
@media (max-width:820px){
  .st{display:block}
  .st .tx{width:auto}
  .st .tx p+p{margin-top:calc(26 * var(--u))}
  .st .ph{width:calc(271.5 * var(--u));height:calc(339 * var(--u));margin:calc(44 * var(--u)) auto 0}
  .st .ph:empty{display:none}
  .people{flex-direction:column;gap:calc(26 * var(--u));margin-top:calc(48 * var(--u))}
}

/* ---------- karta projektu ---------- */
.card{position:fixed;inset:0;z-index:40;background:var(--bg);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;user-select:none;-webkit-user-select:none;opacity:0;transition:opacity .45s ease;overscroll-behavior:contain}
.card::-webkit-scrollbar{display:none}
.card.on{opacity:1}
.card.drag{cursor:grabbing}
.card-x{position:fixed;z-index:42;top:calc(40 * var(--u));right:calc(40 * var(--u));width:calc(44 * var(--u));height:calc(44 * var(--u));display:flex;align-items:center;justify-content:center;color:var(--cy)}
.card-x svg{width:calc(30 * var(--u));height:calc(30 * var(--u))}
.ctrk{display:flex;align-items:flex-end;gap:var(--gut);height:100%;padding:var(--m) 0 var(--m) var(--m);width:max-content}
.cint{flex:none;width:calc(318 * var(--u));height:100%;display:flex;flex-direction:column;justify-content:space-between;margin-right:calc(24 * var(--u) - var(--gut))}
.cint .ttl{font-size:calc(65 * var(--u));line-height:1.1;letter-spacing:-.01em;margin-top:calc(14 * var(--u))}
.facts{margin:0;border-top:1px solid #6b6b6b;cursor:auto;user-select:text}
.facts div{display:grid;grid-template-columns:calc(144 * var(--u)) 1fr;border-bottom:1px solid #6b6b6b;padding:calc(8 * var(--u)) 0}
.facts dt{color:var(--mut)}
.facts dd{margin:0}
.facts a{text-decoration:underline;text-underline-offset:.14em;text-decoration-thickness:1px}
.cimg{flex:none;overflow:hidden;margin:0}
.cint .lbl{text-align:left}
.cimg img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.cimg.fit img{object-fit:contain;mix-blend-mode:multiply}
.cimg.svg{background:var(--grey)}
.cimg.svg img{mix-blend-mode:normal;padding:calc(20 * var(--u))}
.ctx{flex:none;width:calc(318 * var(--u));font-size:calc(16 * var(--u));line-height:1.5;cursor:auto;user-select:text}
.pnext{flex:none;align-self:flex-end;white-space:nowrap;padding:0 calc(48 * var(--u)) 0 calc(48 * var(--u) - var(--gut));margin-bottom:calc(-4 * var(--u))}
.card .foot{display:none}
@media (max-width:820px){
  .card{overflow-x:hidden;overflow-y:auto;cursor:auto;user-select:auto}
  .card-x{top:calc(14 * var(--u));right:calc(8 * var(--u))}
  .card-x svg{width:calc(26 * var(--u));height:calc(26 * var(--u))}
  .ctrk{display:block;height:auto;width:auto;padding:calc(22 * var(--u)) var(--m) 0}
  .cint{width:auto;height:auto;display:block;margin:0}
  .cint .ttl{font-size:calc(35 * var(--u));margin:calc(46 * var(--u)) 0 calc(26 * var(--u))}
  .facts div{grid-template-columns:calc(112 * var(--u)) 1fr;padding:calc(9 * var(--u)) 0}
  .cimg{margin:0 0 calc(40 * var(--u))}
  .cimg.r{margin-left:auto}
  .cimg.c{margin-left:auto;margin-right:auto}
  .ctx{width:auto;font-size:calc(15 * var(--u));line-height:1.47;margin:0 0 calc(40 * var(--u))}
  .ctx.first{margin-top:calc(44 * var(--u))}
  .pnext{display:block;text-align:right;padding:0 0 calc(60 * var(--u));margin:0}
  .card .foot{display:flex}
}

/* ---------- kontaktní formulář ---------- */
.kov{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--grey);color:var(--fg);transform:translateY(101%);visibility:hidden;transition:transform .7s var(--ease),visibility 0s .7s;max-height:100vh;overflow-y:auto}
.kov.on{transform:none;visibility:visible;transition:transform .7s var(--ease),visibility 0s}
.kscrim{position:fixed;inset:0;z-index:59;background:rgba(0,0,0,.18);opacity:0;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
.kscrim.on{opacity:1;visibility:visible;transition:opacity .5s}
.kx{position:absolute;top:calc(20 * var(--u));right:calc(40 * var(--u));width:calc(44 * var(--u));height:calc(44 * var(--u));display:flex;align-items:center;justify-content:center;color:var(--cy)}
.kx svg{width:calc(28 * var(--u));height:calc(28 * var(--u))}
.kf{display:grid;grid-template-columns:calc(546 * var(--u)) 1fr 1fr;column-gap:calc(24 * var(--u));padding:calc(46 * var(--u)) var(--m) calc(46 * var(--u));font-weight:500;font-size:var(--t);line-height:var(--lh)}
.kf .kl{grid-column:1;grid-row:1 / 5;display:flex;flex-direction:column;justify-content:space-between}
.kf .kl p+p{margin-top:1.36em}
.kf .kad{margin-top:calc(40 * var(--u))}
.kf .kad a{text-decoration:underline;text-underline-offset:.14em;text-decoration-thickness:1px}
.fld{display:flex;flex-direction:column;margin-bottom:calc(28 * var(--u))}
.fld label{display:block}
.fld input,.fld textarea{font:inherit;color:var(--fg);background:none;border:0;border-bottom:1px solid #1a1a1a;border-radius:0;padding:0;width:100%;outline:0}
.fld input{height:calc(38 * var(--u))}
.fld textarea{height:calc(80 * var(--u));resize:none;padding-top:calc(8 * var(--u))}
.fld textarea::placeholder{color:rgba(15,15,15,.38)}
.fld input:focus,.fld textarea:focus{border-bottom-color:#000;border-bottom-width:2px}
.fld small{color:#6b0000;font-size:.7em;min-height:0}
.f-name{grid-column:2 / 4}.f-mail{grid-column:2}.f-tel{grid-column:3}.f-msg{grid-column:2 / 4;margin-bottom:0}
.krow{grid-column:2 / 4;display:flex;align-items:center;gap:1em;margin-top:calc(26 * var(--u))}
.send{background:var(--dark);color:#fff;border-radius:999px;height:calc(48 * var(--u));padding:0 calc(28 * var(--u));font-weight:500}
.send:hover{background:#000}
.kst{font-weight:400}
@media (max-width:820px){
  .kov{top:0;bottom:0;max-height:none;transform:translateY(101%)}
  .kx{position:fixed;top:calc(8 * var(--u));right:calc(4 * var(--u))}
  .kx svg{width:calc(26 * var(--u));height:calc(26 * var(--u))}
  .kf{display:block;padding:calc(38 * var(--u)) var(--m) calc(48 * var(--u))}
  .kf .kl{display:block;padding-right:calc(30 * var(--u))}
  .kf .kad{margin:calc(22 * var(--u)) 0 calc(38 * var(--u))}
  .fld{margin-bottom:calc(20 * var(--u))}
  .fld textarea{height:calc(90 * var(--u));font-size:calc(17 * var(--u));line-height:1.53}
  .krow{margin-top:calc(33 * var(--u))}
  .send{height:calc(44 * var(--u));padding:0 calc(24 * var(--u))}
}

/* ---------- GDPR ---------- */
.gov{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;padding:var(--m)}
.gp{position:relative;background:var(--grey);max-width:calc(760 * var(--u));max-height:100%;overflow-y:auto;padding:calc(40 * var(--u)) calc(48 * var(--u));font-size:calc(18 * var(--u));line-height:1.5}
.gp h2{font-size:calc(26 * var(--u));margin-bottom:.8em}
.gp p+p{margin-top:.7em}
.gp .kx{top:calc(10 * var(--u));right:calc(10 * var(--u))}
@media (max-width:820px){ .gp{max-width:none;font-size:calc(15 * var(--u));padding:calc(28 * var(--u)) calc(20 * var(--u))} .gp h2{font-size:calc(20 * var(--u));padding-right:2em} }

/* ---------- mobilní menu ---------- */
.mnav{position:fixed;inset:0;z-index:70;background:var(--grey);display:flex;flex-direction:column;justify-content:space-between;padding:calc(17 * var(--u)) var(--m) calc(56 * var(--u));opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s .35s}
.mnav.on{opacity:1;visibility:visible;transition:opacity .35s}
.mnav .mw{font-size:calc(43 * var(--u));line-height:.98;font-weight:500;letter-spacing:-.01em}
.mnav nav{display:flex;flex-direction:column;font-size:calc(54 * var(--u));line-height:1.1;font-weight:500;text-transform:uppercase;letter-spacing:-.01em}
.mnav .kx{position:absolute;top:calc(14 * var(--u));right:calc(8 * var(--u))}