/* Morcio landing — UI language after vitra.com (measured Nov 3, 2026). Own code; font is Jost (OFL), the closest free match to Vitra's Futura. */
@font-face{font-family:"Jost";src:url(../fonts/jost-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost-500.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--ink:#101010;--txt:#333;--mute:#767676;--line:#e6e6e6;--s:#f7f7f7;--g:24px;--font:"Jost",Futura,"Century Gothic",Arial,sans-serif;--ease:cubic-bezier(.25,.1,.25,1)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--font);color:var(--txt);background:#fff;font-size:17px;font-weight:500;line-height:1.9;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
.L{height:100vh;height:100dvh;overflow:hidden;padding:0 var(--g) var(--g);display:grid;column-gap:var(--g);grid-template-columns:minmax(320px,34%) 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"top top" "txt pan" "bot pan"}
.c{padding:0}
.top{grid-area:top;display:flex;align-items:center;justify-content:space-between;height:64px;border-bottom:1px solid var(--line);margin:0 calc(-1*var(--g)) var(--g);padding:0 var(--g)}
.top .logo{height:22px;width:auto;display:block}
.top .clk{display:flex;gap:16px;font-size:15px;line-height:1.6;color:var(--mute);font-variant-numeric:tabular-nums}
.txt{grid-area:txt;min-height:0;border-top:1px solid var(--line)}
.sc{height:100%;overflow:auto;padding:20px 0 24px;color:var(--mute);font-size:15px;font-weight:400;line-height:1.6;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.sc section+section{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.sc h2{font-size:22px;line-height:1.2;font-weight:400;color:var(--ink);margin:0 0 12px}
.sc p+p{margin-top:8px}.sc p.gap{margin-bottom:12px}.sc p b{font-weight:500;color:var(--txt)}
.bot{grid-area:bot;border-top:1px solid var(--line);padding-top:20px}
.tag{font-size:40px;line-height:1.1;font-weight:400;color:var(--ink);margin-bottom:16px}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:15px;line-height:1.6;color:var(--txt)}
.row small{font-size:13px;color:var(--mute)}
.pan{grid-area:pan;position:relative;overflow:hidden;background:#000;min-height:0;cursor:pointer}
.pan video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;transition:transform .6s var(--ease)}
.pan:hover video{transform:scale(1.02)}
.pan video.loop2{position:absolute;inset:0}
.pan-cue{position:absolute;left:0;bottom:0;background:#fff;color:var(--ink);font-size:15px;line-height:1.6;padding:8px 16px;border-top:1px solid var(--line);border-right:1px solid var(--line);transition:background .2s var(--ease),color .2s var(--ease)}
.pan:hover .pan-cue,.pan:focus-visible .pan-cue{background:var(--txt);color:#fff}
.pan:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
.lb{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;max-height:none;border:0;background:#000;padding:0;display:none}
.lb[open]{display:flex;align-items:center;justify-content:center}
.lb::backdrop{background:#000}
.lb-v{width:100%;max-width:min(100vw,177.78vh);height:auto;max-height:100vh;display:block;background:#000}
.lb-v.lb-v2{position:absolute;visibility:hidden;pointer-events:none}
.lb-x{position:absolute;top:16px;right:16px;z-index:2;font:500 15px/1.6 var(--font);color:var(--ink);background:#fff;border:1px solid #fff;padding:6px 20px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease)}
.lb-x:hover,.lb-x:focus-visible{background:var(--txt);color:#fff;border-color:var(--txt)}
.lb-v{cursor:pointer}
.lb-p{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;font:500 15px/1.6 var(--font);color:#fff;background:transparent;border:1px solid #fff;padding:6px 20px;cursor:pointer;display:none}
.lb-p:hover{background:#fff;color:var(--ink)}.lb-p:focus-visible{outline:1px solid #fff;outline-offset:3px}
.lb-bar{position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.25);display:none;z-index:2}.lb-bar i{display:block;height:1px;background:#fff;width:0}
.lb.paused .lb-p,.lb.paused .lb-bar{display:block}
html.lb-on{overflow:hidden}html.lb-on body{overflow:hidden}
@media (prefers-reduced-motion:reduce){*{transition:none!important}.pan:hover video{transform:none}}
@media (min-width:1600px){:root{--g:32px}.sc{font-size:17px;line-height:1.75}.tag{font-size:50px}}
@media (max-width:1023px) and (min-width:768px){.L{grid-template-columns:1fr 1fr}.tag{font-size:32px}}
@media (max-width:767px){
 :root{--g:16px}
 .L{height:auto;overflow:visible;grid-template-columns:1fr;grid-template-rows:auto;grid-template-areas:"top" "pan" "txt" "bot"}
 .top{height:56px;margin-bottom:var(--g)}.top .clk{font-size:13px;gap:10px}
 .pan{aspect-ratio:16/9;margin-bottom:var(--g)}
 .sc{height:auto;overflow:visible}
 .tag{font-size:32px}.row{flex-wrap:wrap}
}
@media (prefers-reduced-motion:no-preference){html.js .pan,html.js .c,html.js .sc h2,html.js .sc p{opacity:0}}
.sc b[data-thumb]{cursor:default}
.fx-dot,.fx-thumb,.fx-water{position:fixed;top:0;left:0;pointer-events:none}
.fx-water{width:100vw;height:100vh;z-index:50}
.fx-thumb{z-index:60;width:240px;height:176px;will-change:transform}
.fx-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;opacity:0;transform:translate(-50%,-50%);transition:opacity .3s var(--ease)}
.fx-thumb.on img{opacity:1}
.fx-thumb{display:none!important}
.fx-dot{z-index:70;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#101010;opacity:0;transition:opacity .2s var(--ease),transform 0s}
.fx-dot.on{opacity:1}
html.fx-cur,html.fx-cur *{cursor:none!important}
@media (hover:none),(pointer:coarse){.fx-dot,.fx-thumb,.fx-water{display:none!important}}
::selection{background:var(--txt);color:#fff}
.txt{border-top:0}.top .clk p{white-space:nowrap}
@media (max-width:767px){.top .clk p[data-day]{display:none}.txt{border-top:1px solid var(--line)}}

/* Impact panel */
.hr{display:flex;align-items:center;gap:24px}
.imp-t{font:400 15px/1.6 var(--font);color:var(--ink);background:#fff;border:1px solid var(--txt);border-radius:0;padding:4px 16px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease)}
.imp-t:hover,.imp-t[aria-expanded="true"]{background:var(--txt);color:#fff}
.imp{grid-area:1/1/-1/2;grid-row:2/4;z-index:5;background:#fff;border-right:1px solid var(--line);border-top:1px solid var(--line);margin-left:calc(-1*var(--g));padding:0 var(--g);min-height:0;overflow:hidden;transform:translateX(-100%);opacity:0;transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .35s cubic-bezier(.22,1,.36,1),visibility 0s linear .35s;visibility:hidden}
.imp[hidden]{display:block}
.imp.on{transform:none;opacity:1;visibility:visible;transition-delay:0s}
.top .logo{cursor:pointer}
.imp-sc{height:100%;overflow:auto;padding:20px 0 24px;font-size:15px;font-weight:400;line-height:1.6;color:var(--mute);scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.imp h2{font-size:40px;line-height:1.1;font-weight:400;color:var(--ink);margin:0 0 16px}
.imp h3{font-size:22px;line-height:1.2;font-weight:400;color:var(--ink);margin:0 0 12px}
.imp section{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.imp p+p{margin-top:8px}.imp p b{font-weight:500;color:var(--txt)}
.imp-cta{margin-top:20px;padding-top:20px;border-top:1px solid var(--line);color:var(--txt)}
.imp-cta a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media (prefers-reduced-motion:reduce){.imp{transition:none}}
@media (max-width:767px){.hr{gap:12px}.imp-t{font-size:13px;padding:2px 12px}
 .imp{position:fixed;left:0;right:0;top:56px;bottom:0;margin:0;border-right:0;z-index:40}
 html.imp-on,html.imp-on body{overflow:hidden}}
html.imp-boot .imp,html.imp-boot .imp *{transition:none!important}
