/* SDC · wspólne style (tokeny, nagłówek, menu, przyciski, sekcje, stopka) — z makiety v5 właściciela 06.10.2026.
   Ciemny motyw (decyzja marki), akcent tylko czerwony; nagłówki Unbounded, tekst Onest, notki JetBrains Mono. */
:root{
  color-scheme: dark;
  --bg:#111112; --surface:#19191B; --surface-2:#222225;
  --line:rgba(242,240,236,.12); --line-strong:rgba(242,240,236,.26);
  --text:#F2F0EC; --soft:#CFCBC4; --muted:#9A968F;
  --accent:#E63329; --accent-text:#FF5A4E; --accent-fill:#D02B21; --on-accent:#FFFFFF; --focus:#FF5A4E;
  --warm:#FFD7A3; --dim:#77736C; --stage-bg:#0B0B0C;
  --section:clamp(96px,11vw,160px);
  --f-display:"Unbounded","Arial Black","Helvetica Neue",Arial,sans-serif;
  --f-text:"Onest","Helvetica Neue",Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --gutter:clamp(16px,4vw,56px);
  --hdr:68px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--f-text);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-x:clip}
::selection{background:var(--accent-fill);color:#fff}
a{color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ── header: znak E2 «Linza» + napis CREATIVE PRODUCTION (tymczasowa nazwa na creative-production.pl, DEC 06.10) · menu · PL/EN · CTA · burger ≤900 ── */
.hdr{position:fixed;inset:0 0 auto 0;z-index:40;height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 var(--gutter);background:linear-gradient(180deg,rgba(17,17,18,.82) 0%,rgba(17,17,18,.45) 60%,rgba(17,17,18,0) 100%);
  transition:background-color .3s, box-shadow .3s}
.hdr.solid{background:rgba(17,17,18,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line)}
.logo{display:flex;align-items:center;gap:11px;flex:0 0 auto;padding:8px 0;text-decoration:none;color:var(--text)}
.logo svg{display:block;height:30px;width:auto}
.logo-wm{display:flex;gap:.5em;font:700 14px/1 var(--f-display);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.nav{display:flex;align-items:center;gap:clamp(14px,1.7vw,30px);margin-inline:auto;font-size:14px;color:var(--soft)}
.nav a{padding:8px 0;text-decoration:none;white-space:nowrap;transition:color .15s, box-shadow .2s}
.nav a:hover,.nav a[aria-current="true"]{color:var(--text)}
.nav a[aria-current="true"]{box-shadow:inset 0 -1px 0 var(--accent)}
.hdr-r{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.lang{display:flex;align-items:center;font:500 11px/1 var(--f-mono);letter-spacing:.12em;color:var(--muted)}
.lang button{min-width:30px;min-height:36px;padding:0 4px;border:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer;transition:color .15s}
.lang button:hover,.lang button[aria-pressed="true"]{color:var(--text)}
.hdr .btn .s{display:none}
.burger{display:none;align-items:center;gap:10px;height:40px;padding:0 14px 0 13px;border-radius:999px;border:1px solid var(--line-strong);background:rgba(17,17,18,.35);
  color:var(--text);font:600 13px/1 var(--f-text);cursor:pointer}
.burger i{position:relative;display:block;width:16px;height:10px}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:16px;height:1.6px;border-radius:2px;background:currentColor;transition:transform .3s var(--ease), top .3s var(--ease)}
.burger i::before{top:1px}.burger i::after{top:7.4px}
.burger[aria-expanded="true"] i::before{top:4.2px;transform:rotate(45deg)}
.burger[aria-expanded="true"] i::after{top:4.2px;transform:rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:35;background:var(--bg);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:28px;
  padding:calc(var(--hdr) + 20px) var(--gutter) calc(28px + env(safe-area-inset-bottom))}
.drawer nav{display:grid}
.drawer nav a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);text-decoration:none;
  font:800 clamp(22px,6.4vw,34px)/1.1 var(--f-display);letter-spacing:-.03em;text-transform:uppercase}
.drawer nav a span{font:500 11px/1 var(--f-mono);letter-spacing:.1em;color:var(--muted)}
.drawer-foot{margin-top:auto;display:grid;gap:18px}
.drawer-foot .btn{justify-content:center;min-height:52px}
.drawer-foot .lang{font-size:12px}
.drawer-foot p{margin:0;font:500 10.5px/1.6 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
html.menu-open .hdr{background:var(--bg);box-shadow:0 1px 0 var(--line)}
html.menu-open, html.menu-open body{overflow:hidden}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 22px;border-radius:999px;border:0;cursor:pointer;
  background:var(--accent-fill);color:var(--on-accent);font:600 15px/1 var(--f-text);text-decoration:none;white-space:nowrap;
  transition:background .15s, transform .3s var(--ease)}
.btn:hover{background:var(--accent)}
.btn:active{transform:scale(.98)}
.btn i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 10px rgba(255,255,255,.8)}
.btn-sm{min-height:40px;padding:0 18px;font-size:14px}
.btn-ghost{background:rgba(17,17,18,.35);color:var(--text);box-shadow:inset 0 0 0 1px rgba(242,240,236,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.btn-ghost:hover{background:rgba(242,240,236,.12)}
.hdr .btn{transition:background .15s, opacity .35s var(--ease), visibility .35s}
html.at-hero .hdr .btn{opacity:0;visibility:hidden}


/* toast for stub buttons */
.toast{position:fixed;left:50%;bottom:24px;z-index:40;transform:translate(-50%,20px);opacity:0;padding:12px 18px;border-radius:12px;
  background:var(--surface-2);border:1px solid var(--line-strong);font-size:14px;color:var(--soft);transition:opacity .3s, transform .4s var(--ease);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ════════════════ v5 · home blocks after the flight ════════════════ */
.wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
.sec{position:relative;padding-block:var(--section);scroll-margin-top:calc(var(--hdr) - 1px)}
.sec-line::before{content:"";position:absolute;top:0;left:calc(max(0px,(100% - 1440px) / 2) + var(--gutter));right:calc(max(0px,(100% - 1440px) / 2) + var(--gutter));height:1px;
  background:linear-gradient(90deg,var(--accent) 0 64px,var(--line) 64px)}
.kick{display:flex;align-items:center;gap:12px;margin:0;font:600 12px/1.3 var(--f-text);letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.kick::before{content:"";flex:0 0 auto;width:22px;height:1px;background:var(--accent)}
.h2{margin:20px 0 0;font:800 clamp(30px,5.2vw,84px)/1.04 var(--f-display);letter-spacing:-.035em;text-transform:uppercase;text-wrap:balance}
.h2 em{font-style:normal;color:var(--accent)}
.lead{margin:0;max-width:46ch;color:var(--soft);font-size:clamp(16px,1.35vw,19px);line-height:1.55}
.mono{font:500 10.5px/1.5 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--text);text-decoration:none;font-weight:500;font-size:15px}
.link span{border-bottom:1px solid var(--line-strong);padding-bottom:3px;transition:border-color .2s, color .2s}
.link:hover span{border-color:var(--accent-text);color:var(--accent-text)}
.sec-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:24px clamp(32px,5vw,96px);align-items:end}
.sec-head > *{min-width:0}
.sec-head .lead{justify-self:end}
.sec-foot{margin-top:clamp(24px,3vw,36px)}
.btn-line{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line-strong)}
.btn-line:hover{background:rgba(242,240,236,.08);box-shadow:inset 0 0 0 1px var(--text)}
.ic{display:block;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ic .sig{fill:var(--accent);stroke:none}

/* 9 · footer: lock-up znak E2 + CREATIVE PRODUCTION (dwie linie) */
.ft{border-top:1px solid var(--line);padding-block:clamp(56px,7vw,104px) calc(28px + env(safe-area-inset-bottom));color:var(--muted);font-size:14.5px;line-height:1.55}
.ft-top{display:grid;grid-template-columns:minmax(0,4.4fr) minmax(0,2fr) minmax(0,3.4fr) minmax(0,2.4fr);gap:clamp(28px,3vw,48px)}
.ft-top > *{min-width:0}
.ft-lock{display:inline-flex;align-items:center;gap:clamp(14px,1.3vw,20px);color:var(--text)}
.ft-lock svg{display:block;flex:0 0 auto;width:clamp(56px,4.6vw,72px);height:auto}
.ft-wm{display:flex;flex-direction:column;gap:.2em;font:800 clamp(22px,2vw,30px)/1 var(--f-display);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.ft a.ft-lock:hover{color:var(--text)}
.ft-desc{margin:22px 0 0;color:var(--soft)}
.ft-h{display:block;margin-bottom:12px}
.ft nav{display:grid;gap:4px;align-content:start}
.ft a{color:var(--text);text-decoration:none}
.ft a:hover{color:var(--accent-text)}
.ft nav a{padding:3px 0}
.ft-col p{margin:0}
.ft-col p + p{margin-top:8px}
.ft-story{margin:clamp(64px,8vw,120px) 0 0;font:800 clamp(28px,5.6vw,92px)/.98 var(--f-display);letter-spacing:-.035em;text-transform:uppercase;color:var(--text);text-wrap:balance}
.ft-story em{font-style:normal;color:var(--accent)}
.ft-bottom{margin-top:clamp(28px,3vw,40px);padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;font:500 10.5px/1.6 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}

/* responsive — części wspólne */
@media (max-width:1100px){ .ft-top{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:900px){ .sec-head{grid-template-columns:minmax(0,1fr)} .sec-head .lead{justify-self:start} }
@media (max-width:640px){ .ft-top{grid-template-columns:minmax(0,1fr)} .h2{font-size:clamp(25px,7.4vw,40px)} }
@media (max-width: 1180px){
  .nav{gap:clamp(12px,1.4vw,18px);font-size:13.5px}
  .hdr-r{gap:8px}
}
@media (min-width: 901px) and (max-width: 1040px), (max-width: 560px){
  .hdr .btn .l{display:none}
  .hdr .btn .s{display:inline}
}
@media (max-width: 900px){
  .nav,.hdr-r .lang{display:none}
  .burger{display:inline-flex}
}
@media (max-width: 560px){
  .burger .bl{display:none}
  .burger{width:40px;padding:0;justify-content:center}
}
@media (prefers-reduced-motion: reduce){ .burger i::before,.burger i::after{transition:none} }
@media (max-width: 760px), (max-aspect-ratio: 4/5){ :root{--hdr:58px} .logo svg{height:26px} }
@media (max-width: 640px){ .logo{gap:9px} .logo-wm{flex-direction:column;gap:3px;font-size:11.5px;letter-spacing:.08em} }