/* MediaLab gallery: same night-violet world as medialabrybnik.pl; cards are the menu */
:root{--bg:#06060A;--fg:#F3F1FA;--mu:#B4AECA;--vi:#7C3AED;--vl:#A78BFA;--line:rgba(167,139,250,.24);--card:#0f0d18;
--disp:'Space Grotesk',system-ui,sans-serif;--body:'Manrope',system-ui,sans-serif;color-scheme:dark}
@font-face{font-family:'Space Grotesk';src:url(fonts/space-grotesk-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(fonts/space-grotesk-latin-ext-700-normal.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0100-024F}
@font-face{font-family:'Space Grotesk';src:url(fonts/space-grotesk-latin-500-normal.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(fonts/space-grotesk-latin-ext-500-normal.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0100-024F}
@font-face{font-family:'Manrope';src:url(fonts/manrope-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/manrope-latin-ext-400-normal.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-024F}
@font-face{font-family:'Manrope';src:url(fonts/manrope-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/manrope-latin-ext-600-normal.woff2) format('woff2');font-weight:600;font-display:swap;unicode-range:U+0100-024F}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg) radial-gradient(60% 40% at 70% 0%,rgba(124,58,237,.22),transparent 70%) no-repeat;color:var(--fg);font:400 16px/1.6 var(--body);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
a{color:inherit}
#burst{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:50}
.g-nav{max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:20px}
.g-logo{font:700 15px var(--disp);letter-spacing:.16em;text-decoration:none}.g-logo span{color:var(--vl);font-weight:500}
.g-cta{font:600 14px var(--body);text-decoration:none;background:var(--vi);padding:10px 18px;border-radius:99px;white-space:nowrap}
.g-main{max-width:1240px;margin:0 auto;padding-bottom:40px}
.g-intro{padding-block:clamp(40px,7vw,90px) 28px;max-width:820px}
.g-eye{font:500 12px var(--disp);letter-spacing:.3em;text-transform:uppercase;color:var(--vl);margin:0 0 16px}
h1{font:700 clamp(42px,7vw,92px)/.98 var(--disp);letter-spacing:-.045em;margin:0 0 20px;text-wrap:balance}
h1 span{color:var(--vl)}
.g-lead{color:var(--mu);font-size:18px;max-width:60ch;margin:0}
.g-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-block:24px;position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:linear-gradient(var(--bg) 70%,transparent)}
.f{font:600 14px var(--body);color:var(--fg);background:transparent;border:1px solid var(--line);padding:9px 16px;border-radius:99px;cursor:pointer;transition:background .2s,border-color .2s}
.f:hover{border-color:var(--vl)}.f.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.f:focus-visible,.g-card:focus-visible,.g-btn:focus-visible,.g-cta:focus-visible{outline:2px solid var(--vl);outline-offset:3px}
.sep{width:1px;height:22px;background:var(--line);margin:0 6px}
.g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:22px}
.g-card{display:flex;flex-direction:column;gap:10px;text-decoration:none;min-width:0;transition:opacity .6s,transform .8s cubic-bezier(.2,.8,.2,1)}
.js-on .g-card{opacity:0;transform:translateY(24px) scale(.97)}
.js-on .g-card.show{opacity:1;transform:none}
.g-card[hidden]{display:none}
.g-img{position:relative;display:block;aspect-ratio:800/483;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--card)}
.g-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .6s,transform 1.2s cubic-bezier(.2,.8,.2,1)}
.g-img img+img{opacity:0;transform:scale(1.06)}
.g-card:hover .g-img img+img,.g-card:focus-visible .g-img img+img{opacity:1;transform:none}
.g-card:hover .g-img img:first-child{transform:scale(1.04)}
.g-meta{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.g-meta b{font:700 21px var(--disp);letter-spacing:-.02em}.g-meta i{font-style:normal;color:var(--vl);font-size:14px;white-space:nowrap}
.g-fx{color:var(--mu);font-size:14px}
.g-empty{color:var(--mu);text-align:center;padding:40px 0}
.g-end{text-align:center;padding-block:clamp(70px,10vw,130px) 20px;max-width:720px;margin:0 auto}
.g-end h2{font:700 clamp(30px,4.5vw,54px)/1.05 var(--disp);letter-spacing:-.04em;margin:0 0 16px;text-wrap:balance}
.g-end p{color:var(--mu);margin:0 auto 26px;max-width:58ch}
.g-btn{display:inline-block;background:var(--vi);text-decoration:none;font-weight:600;padding:16px 28px;border-radius:99px;box-shadow:0 0 0 6px rgba(124,58,237,.18);transition:transform .2s}
.g-btn:hover{transform:translateY(-3px)}
.g-note{font-size:13px;margin-top:40px!important}
@media (prefers-reduced-motion:reduce){.js-on .g-card{opacity:1;transform:none;transition:none}#burst{display:none}}
