/* Układ: kinowe sceny przyklejone do ekranu (position: sticky). Jedna paczka w miękkim świetle smaku, opisy przy krawędziach.
   Wygląd: IN Rama i Smak 1.0 (22.10.2026): czerń i biel jak logo, kolor ze smaków, jedna rodzina Archivo.
   Tokeny (--font, --fs-*, --bg, --surface-*, --text-*, --action, --brand-grad, statusy) są w fonts.css, ładowanym zawsze przed tym plikiem. */
:root{
  color-scheme: dark;
  /* stare nazwy = aliasy nowych tokenów (zostają 2–4 tygodnie dla pages/shoty/konfig/konkurs.css, potem do usunięcia) */
  --night:var(--bg,#000);
  --asphalt:var(--surface-1,#121214);
  --line:var(--line-1,rgba(255,255,255,.08));
  --chalk:var(--text-1,#F5F5F7);
  --fog:var(--text-2,#AEAEB2);
  --in:var(--action,#F5F5F7);
  /* bieżący smak: home.js nadpisuje --fl i --fl-rgb na <html>; przed wyborem smaku start neutralny (--c = text-1) */
  --fl:var(--text-1,#F5F5F7);
  --fl-rgb:245,245,247;
  --svh:1vh;
  --b1:var(--text-1,#F5F5F7); --b2:var(--fl); --b3:var(--surface-3,#242427);
  --red:var(--err,#FF6B6B);
  --display:var(--font);
  --body:var(--font);
  --hud:var(--font);
  --gut:max(16px,4vw);
  --ease:cubic-bezier(.2,.7,.1,1);
}
@supports (height:1svh){:root{--svh:1svh}}
[hidden]{display:none!important}
html{background:var(--bg);scrollbar-gutter:stable;-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--bg);color:var(--text-1);font-family:var(--font);font-size:var(--fs-body);line-height:var(--lh-body);font-synthesis:none;font-kerning:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
main,footer{overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
::selection{background:var(--text-1);color:#000}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em;text-decoration-color:rgba(255,255,255,.4)}
@media (hover:hover){a:hover{text-decoration-color:currentColor}}
img{max-width:100%;height:auto;display:block}
button,input:not([type=checkbox]):not([type=radio]){-webkit-appearance:none;appearance:none;border-radius:0}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0;touch-action:manipulation}
h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul{margin:0}
ul{padding:0;list-style:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* dawny HUD (Mono, wersaliki): teraz etykieta 13 px/600 pisana zdaniem */
.hud{font-family:var(--font);font-stretch:var(--wd-text);font-size:var(--fs-label);font-weight:600;line-height:1.4;letter-spacing:0;text-transform:none;color:var(--text-2);font-variant-numeric:tabular-nums}
/* nadtytuł sekcji (eyebrow): 12 px/600, wersaliki .06em – najwyżej jeden na sekcję */
.fl-head>.hud,.fl-info>.hud,.ze-head>.hud,.wl-copy>.hud,.mf>.hud,.help-copy>.hud,.sk-head>.hud,.ile-copy>.hud,.faq-head>.hud,.ig-head .hud,.sh-copy>.hud,.gate-inner>.hud,.qz-res>.hud,.dt-head .hud{font-size:var(--fs-eyebrow);line-height:1.3;letter-spacing:var(--ls-eyebrow);text-transform:uppercase}
.wrap{padding-inline:var(--gut)}
.h2{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);text-wrap:balance}
.lead{font-size:var(--fs-lead);line-height:1.5;color:var(--text-2);max-width:46ch;text-wrap:pretty}
.lead strong{color:var(--text-1);font-weight:600}

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* Przyciski: Archivo 100%/600, pisane zdaniem, bez cieni. Primary = biała pigułka jak logo. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 24px;border-radius:999px;border:1px solid transparent;font-family:var(--font);font-stretch:var(--wd-text);font-weight:600;font-size:var(--fs-body);line-height:1.2;letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;transition:background-color .16s var(--ease),border-color .16s,color .16s,opacity .25s;will-change:transform}
.btn-in{background:var(--action);color:var(--on-action)}
.btn:active{scale:.98}
.btn{transition:background-color .16s var(--ease),border-color .16s,color .16s,opacity .25s,scale .12s}
@media (hover:hover){.btn-in:hover{background:var(--action-hover)}}
.btn-in:active{background:var(--action-press)}
.btn-fl{background:var(--c,var(--fl));color:#000}
@media (hover:hover){.btn-fl:hover{background:var(--c-hover,var(--c,var(--fl)))}}
.btn-ghost{background:var(--surface-3);border-color:transparent;color:var(--text-1)}
@media (hover:hover){.btn-ghost:hover{background:var(--surface-3-hover)}}
.btn[disabled]{background:var(--surface-3);border-color:transparent;color:var(--text-disabled);cursor:not-allowed;box-shadow:none}
.btn svg{width:20px;height:20px}

/* Latarka (tylko mysz): neutralne, ledwie widoczne światło zamiast koloru smaku */
.torch{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:60;background:radial-gradient(circle,rgba(245,245,247,.05) 0%,transparent 62%);opacity:0;transition:opacity .5s;will-change:transform}
.touch .torch{display:none}
@media (pointer:fine){.torch.on{opacity:1}}

/* ===== BRAMKA 18+ ===== */
.gate{position:fixed;inset:0;z-index:300;display:none;place-items:center;overflow:hidden;background:var(--bg)}
.js .gate{display:grid}
.js .gate.is-gone{display:none}
.gate-wall{position:absolute;inset:0;opacity:.35;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:68px 34px,136px 34px;-webkit-mask-image:radial-gradient(70% 60% at 50% 35%,#000,transparent);mask-image:radial-gradient(70% 60% at 50% 35%,#000,transparent)}
.gate-inner{position:relative;text-align:center;padding:24px var(--gut);display:grid;gap:20px;justify-items:center;max-width:760px}
.neon-wrap{position:relative}
/* dawny neon „WCHODZISZ?”: nagłówek Archivo wąski 800, bez poświaty i migotania; pod nim linia 2 px w gradiencie marki */
.neon{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-display);line-height:1;letter-spacing:var(--ls-tight);color:var(--text-1);white-space:nowrap}
.neon span{display:inline-block;animation:flick .5s var(--ease) both;animation-delay:var(--d,0s)}
.neon .q{animation:flick .5s var(--ease) both;animation-delay:var(--d,0s)}
@keyframes flick{from{opacity:0}}
.neon-refl{display:none}
.neon-wrap::after{content:"";display:block;width:min(240px,50%);height:2px;margin:24px auto 0;border-radius:2px;background:var(--brand-grad)}
.gate-sub{max-width:44ch;color:var(--text-2);font-size:var(--fs-small);margin-top:4px}
.gate-btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.gate-no-msg{color:var(--text-1);font-weight:600}
.gate-flash{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:var(--brand-grad);transform:scaleX(0);opacity:0;pointer-events:none}
.gate-foot{position:absolute;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom,0px));text-align:center;font-weight:500;color:var(--text-3)}

/* ===== NAWIGACJA ===== */
.nav{position:fixed;z-index:100;top:calc(env(safe-area-inset-top,0px) + 12px);left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:8px;width:min(880px,calc(100% - 2*var(--gut)));padding:6px 6px 6px 18px;border-radius:999px;background:rgba(18,18,20,.94);border:1px solid var(--line-1);transition:transform .55s var(--ease),opacity .3s}
@media (hover:hover) and (pointer:fine){.nav{background:var(--glass);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}}
.nav.is-hidden{transform:translate(-50%,-150%)}
.nav-logo img{height:24px;width:auto}
.nav-links{display:flex;gap:2px}
.nav-links a{font-size:14px;font-weight:500;color:var(--text-2);text-decoration:none;padding:9px 13px;border-radius:999px;transition:color .16s,background .16s}
@media (hover:hover){.nav-links a:hover{color:var(--text-1);background:var(--surface-3)}}
.nav-right{display:flex;gap:6px;align-items:center}
.nav-cart{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 8px 0 14px;border-radius:999px;background:var(--action);color:var(--on-action);font-weight:600;font-size:14px}
.nav-cart svg{width:17px;height:17px}
.nav-cart .count{min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:#000;color:var(--text-1);display:grid;place-items:center;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.nav-menu{display:none;width:40px;height:40px;border-radius:999px;place-items:center;background:var(--surface-3)}
.nav-menu svg{width:18px;height:18px}
@media (max-width:860px){.nav-links{display:none}.nav-menu{display:grid}.nav-cart .lbl{display:none}}
.menu{position:fixed;inset:0;z-index:120;background:var(--bg);display:grid;align-content:center;gap:4px;padding:80px var(--gut)}
.menu a{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-menu);line-height:1.1;letter-spacing:var(--ls-snug);text-decoration:none}
@media (hover:hover){.menu a:hover{color:var(--text-2)}}
.menu .x{position:absolute;top:calc(env(safe-area-inset-top,0px) + 18px);right:var(--gut);width:44px;height:44px;border-radius:999px;background:var(--surface-3);font-size:22px}

/* ===== HERO ===== */
.hero-wrap{position:relative}
.fx .hero-wrap{height:calc(var(--svh)*210)}
.hero{position:relative;height:calc(var(--svh)*100);overflow:hidden;isolation:isolate;background:var(--bg)}
.fx .hero{position:sticky;top:0}
/* światło hero przed wyborem smaku: gradient marki (złoto → róż → fiolet) o niskim kryciu, bez rozmycia */
.hero-glow{position:absolute;left:50%;top:62%;width:120vmax;height:70vmax;margin:-35vmax 0 0 -60vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(255,179,71,.22),rgba(255,92,138,.15) 50%,rgba(180,107,255,.08) 75%,transparent);z-index:-1;pointer-events:none}
.hero-letters{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:1.4vw;pointer-events:none;padding-top:calc(var(--svh)*12)}
/* wielkie „IN” to znak marki: zostaje w kroju logo (Bebas), kontur 1,5 px w kolorze smaku, bez cienia */
.hl{position:relative;font-family:var(--font-logo);font-weight:400;font-stretch:normal;font-size:min(calc(var(--svh)*84),72vw);line-height:.78;padding-top:.06em;letter-spacing:0}
.hl .base{display:block;color:transparent;background:linear-gradient(100deg,var(--surface-2) 0%,var(--surface-2) 38%,rgba(var(--fl-rgb),.45) 47%,var(--text-1) 50%,rgba(var(--fl-rgb),.45) 53%,var(--surface-2) 62%,var(--surface-2) 100%);background-size:320% 100%;background-position:32% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1.5px rgba(var(--fl-rgb),.4)}
.hero-live .hl .base{animation:sweep 8s var(--ease) infinite}
.hl.n .base{animation-delay:.35s}
@keyframes sweep{0%{background-position:115% 0}50%,100%{background-position:-15% 0}}
.hl .tube{position:absolute;inset:0;padding-top:.06em;color:transparent;-webkit-text-stroke:1.5px var(--c,var(--fl));opacity:0;transition:opacity .6s;
  -webkit-mask-image:radial-gradient(circle min(30vw,380px) at var(--lx,50%) var(--ly,40%),#000 0%,rgba(0,0,0,.5) 40%,transparent 72%);mask-image:radial-gradient(circle min(30vw,380px) at var(--lx,50%) var(--ly,40%),#000 0%,rgba(0,0,0,.5) 40%,transparent 72%)}
.hl .tube.on{opacity:1}
.touch .hl .tube{display:none}
.hero-kicker{position:absolute;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + max(84px,calc(var(--svh)*10)));text-align:center;z-index:4}
.hero-kicker h1{display:grid;gap:10px;justify-items:center}
.hero-kicker .k1{font-size:var(--fs-eyebrow);font-weight:600;line-height:1.3;letter-spacing:var(--ls-eyebrow);color:var(--text-2);text-transform:uppercase}
.hero-kicker .k2{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-h1);line-height:1.02;letter-spacing:-.015em}
.hero-packs{position:absolute;left:0;right:0;margin-inline:auto;bottom:calc(calc(var(--svh)*14) + env(safe-area-inset-bottom,0px));width:min(900px,92vw,calc(var(--svh)*120));height:min(calc(var(--svh)*50),64vw);z-index:3}
.hero-packs .pack{position:absolute;bottom:0}
.hp-c{width:46%;left:27%;z-index:3}
.hp-l{width:34%;left:0;bottom:5%!important;z-index:2;rotate:-9deg}
.hp-r{width:34%;right:0;bottom:5%!important;z-index:2;rotate:9deg}
.pack{perspective:1100px}
.pf{position:relative}
.pk{position:relative}
.fine .pk{will-change:transform}
.touch .pf{animation:float 3.4s ease-in-out infinite alternate;will-change:transform}
.touch .hp-l .pf,.touch .fl-slide:nth-of-type(2) .pf{animation-delay:-1.2s}
.touch .hp-r .pf,.touch .fl-slide:nth-of-type(3) .pf{animation-delay:-2.3s}
@keyframes float{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-10px,0)}}
.pk>img{width:100%;height:auto;filter:drop-shadow(0 34px 38px rgba(0,0,0,.7))}
.glare{position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.9;
  background:radial-gradient(circle at var(--gx,32%) var(--gy,24%),rgba(255,255,255,.75) 0%,rgba(255,255,255,.14) 20%,transparent 46%),linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 50%,transparent 60%);
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.refl{position:absolute;left:0;top:100%;width:100%;height:auto;transform:scaleY(-1);transform-origin:center;margin-top:1px;opacity:.18;pointer-events:none;
  -webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.85),transparent 30%);mask-image:linear-gradient(to top,rgba(0,0,0,.85),transparent 30%)}
.fl-pack .refl{display:none}
@media (min-width:900px){.fx .fl-pack .refl{display:block}}
img{-webkit-user-drag:none}
.hero-floor{position:absolute;left:0;right:0;bottom:0;height:calc(calc(var(--svh)*14) + env(safe-area-inset-bottom,0px));background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.7) 80%);z-index:2}
.hero-bottom{position:absolute;left:var(--gut);right:var(--gut);bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:5;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:16px}
.hero-bottom .lead{font-size:var(--fs-small);max-width:34ch}
.hero-cta{display:flex;gap:10px}
.hero-hud{justify-self:end;text-align:right;display:grid;gap:6px}
.hero-hud .hud{font-weight:500;color:var(--text-3)}
.scroll-cue{display:inline-flex;align-items:center;gap:10px;justify-content:flex-end}
.scroll-cue i{display:block;width:1px;height:28px;background:linear-gradient(var(--text-2),transparent);transform-origin:top;animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0)}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@media (max-width:860px){
  .hero-letters{padding-top:0;align-items:flex-start;top:calc(max(84px,calc(var(--svh)*10)) + 96px)}
  .hl{font-size:min(80vw,calc(var(--svh)*44))}
  .hero-packs{bottom:calc(150px + env(safe-area-inset-bottom,0px));height:min(calc(var(--svh)*42),88vw);width:100vw}
  .hp-c{width:62%;left:19%}
  .hp-l{width:44%;left:-13%}
  .hp-r{width:44%;right:-13%}
  .hero-floor{height:calc(150px + env(safe-area-inset-bottom,0px))}
  .hero-bottom{grid-template-columns:1fr;justify-items:center;text-align:center;bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  .hero-bottom .lead,.hero-hud{display:none}
  .hero-cta{width:100%;max-width:520px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .hero-cta .btn{padding:0 12px;font-size:var(--fs-small)}
}

@media (min-width:861px){
  /* jak na telefonie: I i N razem, za paczkami; dół liter chowa się za paczkami */
  .hero-letters{justify-content:center;gap:1.2vw;align-items:flex-start;padding-top:calc(max(84px,calc(var(--svh)*10)) + clamp(60px,calc(var(--svh)*8.5),104px))}
  .hl{font-size:min(calc(var(--svh)*50),36vw)}
  .hero-packs{width:min(820px,50vw,calc(var(--svh)*92));bottom:calc(var(--svh)*11)}
  .hero-live .hl .base{animation:none}
}
@media (max-width:860px) and (max-height:740px){
  .hero-letters{top:calc(max(84px,calc(var(--svh)*10)) + 80px)}
  .hl{font-size:min(80vw,calc(var(--svh)*38))}
  .hero-packs{height:min(calc(var(--svh)*36),88vw)}
}

/* ===== MANIFEST ===== */
.mf{position:relative;padding-block:clamp(110px,16vw,220px)}
.mf .hud{margin-bottom:28px}
.mf-text{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);max-width:34ch;text-wrap:pretty}
.mf-text em{font-style:normal;color:var(--c)}
.mf-text .w{display:inline}
.hero-wrap+.mf{padding-top:clamp(60px,10vw,140px)}

/* ===== SMAKI ===== */
.fl{position:relative}
.fl-head{padding-block:0 40px}
.fx .fl-head{display:none}
.fl-stage{position:relative;overflow:hidden}
.fl-slide{--c:var(--fl);position:relative;isolation:isolate;display:grid;gap:28px;padding:48px var(--gut);border-top:1px solid var(--line-1)}
.fl-sbg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.fl-sbg i{position:absolute;display:block}
/* jedno miękkie światło smaku za paczką (bez stożka i plamy na podłodze, bez rozmycia) */
.fl-sbg .glow{inset:0;background:radial-gradient(50% 42% at 50% 54%,rgba(var(--c-rgb,var(--fl-rgb)),.22),transparent 72%)}
.fl-sbg .beam,.fl-sbg .pool{display:none}
@media (min-width:900px){.fl-slide{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,1fr);align-items:center}}
.fl-info{display:grid;gap:14px;align-content:center;min-width:0}
.fl-name{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-display);line-height:1;letter-spacing:var(--ls-tight);color:var(--c)}
.fl-tag{font-size:var(--fs-h3);font-weight:700;line-height:1.25;letter-spacing:var(--ls-snug)}
.fl-desc{color:var(--text-2);max-width:34ch}
.fl-notes{display:flex;flex-wrap:wrap;gap:6px}
.fl-notes li{font-size:var(--fs-meta);font-weight:600;line-height:1.4;padding:6px 12px;border-radius:999px;border:1px solid transparent;background:var(--c-tint,rgba(var(--c-rgb,var(--fl-rgb)),.16));color:var(--c)}
.fl-pack{display:flex;justify-content:center;align-items:center;min-height:0}
.fl-pack .pf{width:min(500px,36vw,calc(var(--svh)*56))}
@media (max-width:899px){.fl-pack .pf{width:min(440px,72vw)}}
.fl-buy{display:grid;gap:14px;align-content:center;justify-items:stretch;max-width:380px;width:100%;justify-self:end;min-width:0}
.sizes{display:grid;gap:8px}
.size{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;text-align:left;padding:12px 16px;border-radius:16px;border:1px solid var(--line-2);background:var(--surface-1);transition:border-color .16s,background .16s;position:relative}
@media (hover:hover){.size:hover:not([disabled]){border-color:rgba(245,245,247,.32)}}
.size:active:not([disabled]),.sw:active,.seg button:active,.fl-nav button:active,.fl-arrow:active{scale:.96}
.size,.sw,.seg button,.fl-nav button,.fl-arrow{transition:border-color .16s,background .16s,color .16s,scale .12s}
.size[aria-checked="true"]{border-color:var(--c);background:var(--c-deep,rgba(var(--c-rgb,var(--fl-rgb)),.2));box-shadow:inset 0 0 0 1px var(--c)}
.size .g{font-weight:700;font-size:var(--fs-body);line-height:1;letter-spacing:var(--ls-snug);white-space:nowrap;font-variant-numeric:tabular-nums}
.size .n{color:var(--text-2);font-size:var(--fs-meta)}
.size .p{font-weight:600;font-variant-numeric:tabular-nums}
/* wyprzedany kafel: przygaszona treść, ale pigułka „wyprzedane” w pełnym kontraście (statusy AA) */
.size[disabled]{cursor:not-allowed}
.size[disabled]>:not(em){opacity:.55}
.size[disabled] .p{text-decoration:line-through;color:var(--text-2)}
.size em{position:absolute;top:-10px;left:12px;font-style:normal;font-size:12px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;background:var(--warn-bg);color:var(--warn);padding:2px 8px;border-radius:999px;border:0}
.buy-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:4px}
.price b{display:block;font-size:var(--fs-price);font-weight:700;letter-spacing:var(--ls-snug);font-variant-numeric:tabular-nums;line-height:1.1}
.price small{color:var(--text-2);font-size:var(--fs-meta);font-variant-numeric:tabular-nums}
.fl-nav,.fl-progress{display:none}
.fx .fl{height:calc(var(--svh)*320)}
.fx .fl-stage{position:sticky;top:0;height:calc(var(--svh)*100);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;touch-action:pan-y}
.fl-slides{position:relative}
.fx .fl-slides{min-height:0}
.fl-stage.dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}
.fx .fl-slide{position:absolute;inset:0;border:0;padding:96px var(--gut) 12px;visibility:hidden}
.fx .fl-slide.on{visibility:visible}
.fl-bar{display:none}
.fx .fl-bar{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px var(--gut) calc(22px + env(safe-area-inset-bottom,0px));z-index:6}
.fx .fl-nav{display:flex;gap:4px;padding:5px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line-1);min-width:0}
.fl-arrow{display:none;flex:none;width:44px;height:44px;border-radius:999px;place-items:center;background:var(--surface-2);border:1px solid var(--line-1);color:var(--text-1)}
.fl-arrow svg{width:18px;height:18px}
.fl-arrow[disabled]{opacity:.3;cursor:default}
@media (hover:hover){.fl-arrow:hover:not([disabled]){background:var(--surface-3)}}
@media (min-width:520px){.fx .fl-arrow{display:grid}}
.fl-nav button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:999px;font-size:var(--fs-meta);font-weight:600;color:var(--text-2);white-space:nowrap;transition:background .16s,color .16s}
.fl-nav button i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.fl-nav button[aria-current="true"]{background:var(--surface-4);color:var(--text-1)}
.fx .fl-progress{display:block;position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--line-1)}
.fl-progress i{display:block;height:100%;background:var(--fl);transform-origin:left;transform:scaleX(0);will-change:transform}
@media (min-width:900px){.fx .fl-slide{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) minmax(0,1fr)}}
@media (max-width:899px){
  .fx .fl-slide{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;gap:10px;padding:max(80px,calc(var(--svh)*10.5)) var(--gut) 6px;align-items:stretch}
  .fx .fl-bar{padding-top:8px;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));gap:6px}
  .fl-arrow{width:40px;height:40px}
  .fl-sbg .glow{background:radial-gradient(70% 40% at 50% 50%,rgba(var(--c-rgb,var(--fl-rgb)),.22),transparent 72%)}
  .fx .fl-info{gap:6px;text-align:center;justify-items:center}
  .fx .fl-desc,.fx .fl-notes{display:none}
  .fx .fl-name{font-size:var(--fs-display)}
  .fx .fl-tag{font-size:var(--fs-body)}
  .fx .fl-pack{height:100%}
  .fx .fl-name br{display:none}
  .fx .fl-pack{height:100%;min-height:0}
  .fx .fl-pack .pf{height:100%;max-height:calc(var(--svh)*46);width:auto;max-width:100%;aspect-ratio:1000/961}
  .fx .fl-pack .pk{height:100%}
  .fx .fl-pack .pk>img:first-child{width:100%;height:100%;object-fit:contain}
    .fx .fl-buy{max-width:none;justify-self:stretch;gap:10px}
  .fx .fl-buy>.hud,.fx .ship{display:none}
  .fx .sizes{grid-template-columns:repeat(3,1fr);gap:6px}
  .fx .size{grid-template-columns:1fr;gap:0;padding:9px 8px;text-align:center;border-radius:14px}
  .fx .size .g{font-size:var(--fs-body)}.fx .size .n{font-size:12px}.fx .size .p{font-size:var(--fs-meta)}
  .fx .size em{left:50%;transform:translateX(-50%);white-space:nowrap;top:-10px;font-size:12px;line-height:1.3;padding:1px 6px}
  .fx .price b{font-size:22px}
  .fl-nav button{padding:0 10px;font-size:12px;gap:6px}
  .fl-nav{min-width:0}
}
@media (max-width:899px) and (max-height:700px){.fx .fl-tag{display:none}.fx .size .n{display:none}}
@media (max-width:380px){.fl-nav button span{max-width:none}.fx .fl-nav button{padding:0 8px;font-size:12px}.fl-arrow{width:36px;height:36px}}

/* ===== SKŁAD ===== */
.sk{position:relative}
.sk-stage{position:relative;padding-block:clamp(96px,10vw,140px);display:grid;align-content:center;gap:clamp(24px,4vw,48px);min-height:calc(var(--svh)*100)}
.sk-head{display:grid;gap:14px;justify-items:center;text-align:center}
.sk-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr) minmax(0,1fr);align-items:center;gap:clamp(16px,3vw,48px)}
.sk-col{display:grid;gap:clamp(28px,calc(var(--svh)*5),64px)}
.sk-col.l{text-align:right}
.sk-call{display:grid;gap:2px;position:relative}
/* liczby zawsze w szerokości 100%, cyfry tabelaryczne */
.sk-call b{font-family:var(--font);font-stretch:var(--wd-text);font-weight:700;font-size:var(--fs-num-xl);line-height:1;letter-spacing:var(--ls-tight);font-variant-numeric:tabular-nums;color:var(--text-1)}
.sk-call span{font-weight:600;font-size:var(--fs-body)}
.sk-call small{color:var(--text-2);font-size:var(--fs-small)}
.sk-call .ln{position:absolute;top:calc(var(--fs-num-xl) / 2);height:1px;width:clamp(30px,5vw,90px);background:linear-gradient(90deg,transparent,var(--fl));transform-origin:left}
.sk-col.l .ln{right:calc(-1 * clamp(40px,6vw,110px));transform-origin:right;background:linear-gradient(90deg,var(--fl),transparent)}
.sk-col.r .ln{left:calc(-1 * clamp(40px,6vw,110px))}
.sk-col.l .ln{background:linear-gradient(270deg,transparent,var(--fl))}
.bear-wrap{position:relative;display:grid;place-items:center}
.bear-wrap::before{content:"";position:absolute;inset:0 -10%;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--fl-rgb),.2),transparent)}
.bear{position:relative;width:min(340px,62vw,calc(var(--svh)*48));aspect-ratio:220/270;will-change:transform}
.bear img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .5s ease}
.bear img.on{opacity:1}
.swatches{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
/* chip smaku: tło tinta, kropka i tekst w kolorze smaku; wybrany: obrys 2 px i tło deep */
.sw{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 12px;border-radius:999px;border:1px solid transparent;background:var(--c-tint,rgba(var(--c-rgb,var(--fl-rgb)),.16));font-size:14px;font-weight:600;color:var(--c);transition:border-color .16s,color .16s,background .16s}
.sw i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.sw[aria-pressed="true"]{border-color:var(--c);background:var(--c-deep,rgba(var(--c-rgb,var(--fl-rgb)),.24));box-shadow:inset 0 0 0 1px var(--c)}
.sk-legal{color:var(--text-3);font-size:var(--fs-meta);text-align:center;max-width:70ch;justify-self:center}
@media (max-width:899px){
  .sk-grid{grid-template-columns:1fr 1fr;grid-template-areas:"bear bear" "l r"}
  .bear-wrap{grid-area:bear}
  .sk-col.l{grid-area:l;text-align:left}
  .sk-col.r{grid-area:r}
  .sk-call .ln{display:none}
}

/* ===== ILE ===== */
.ile{padding-block:clamp(96px,12vw,180px)}
.ile-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:center}
.ile-copy{display:grid;gap:22px;align-content:center;min-width:0}
/* przełącznik segmentowy jak w iOS: tor s2, aktywny segment s4 */
.seg{display:inline-grid;grid-template-columns:repeat(3,auto);gap:4px;padding:5px;border-radius:15px;border:1px solid var(--line-1);background:var(--surface-2);justify-self:start}
.seg button{height:42px;padding:0 20px;border-radius:10px;font-weight:600;font-size:var(--fs-small);color:var(--text-2);font-variant-numeric:tabular-nums;transition:background .16s,color .16s}
.seg button[aria-checked="true"]{background:var(--surface-4);color:var(--text-1)}
.ile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-top:1px solid var(--line-1);padding-top:22px}
.ile-stats div{display:grid;gap:4px}
.ile-stats b{font-family:var(--font);font-stretch:var(--wd-text);font-weight:700;font-size:var(--fs-num-xl);line-height:1;letter-spacing:var(--ls-tight);font-variant-numeric:tabular-nums}
.ile-stats span{color:var(--text-2);font-size:var(--fs-meta);line-height:1.35}
.ile-note{font-size:var(--fs-small)}
.ile-note b{color:var(--text-1);font-weight:700;font-variant-numeric:tabular-nums}
.ile-box{position:relative;display:grid;gap:18px;align-content:start;padding:clamp(18px,3vw,30px);border-radius:28px;
  background:var(--surface-1);
  border:1px solid var(--line-1)}
.ile-top{display:flex;justify-content:space-between;gap:12px;min-width:0}
.ile-top .hud{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ile-top .ile-cnt{flex:none}
.ile-cnt{color:var(--text-1)}
.ile-bears{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(4px,1.2vw,14px);align-content:start;min-height:0}
.ile-bears img{width:100%;height:auto;aspect-ratio:220/270;transition:opacity .3s ease,transform .45s cubic-bezier(.3,1.5,.5,1);transition-delay:calc(var(--i,0) * 16ms)}
.ile-bears img.off{opacity:0;transform:scale(.4) translateY(12px);transition-delay:0s}
@media (max-width:899px){.ile-grid{grid-template-columns:1fr}.seg{justify-self:stretch;grid-template-columns:repeat(3,1fr)}}

/* ===== ZESTAWY ===== */
.ze{padding-block:clamp(96px,12vw,170px);position:relative;overflow:hidden}
.ze-head{display:grid;gap:14px;justify-items:center;text-align:center}
.zf-in{position:relative;isolation:isolate;width:calc(var(--s) * 100%);aspect-ratio:16/9}
/* wachlarz trzech paczek w każdym kafelku zestawu; scena ma stałą wysokość, więc 50 < 100 < 140 widać od razu */
.card-fan{display:grid;justify-items:center;align-items:end;aspect-ratio:16/9;margin:4px -6px 6px}
.card.off .zf-in img{filter:grayscale(.75) brightness(.5) drop-shadow(0 16px 20px rgba(0,0,0,.65))}
.zf-in img{position:absolute;bottom:0;height:auto;filter:drop-shadow(0 16px 20px rgba(0,0,0,.65))}
.zf-in .c{width:50%;left:25%;z-index:2}
.zf-in .l{width:40%;left:3%;bottom:5%;rotate:-11deg}
.zf-in .r{width:40%;right:3%;bottom:5%;rotate:11deg}
.zf-in::after{content:"";position:absolute;left:4%;right:4%;bottom:-10px;height:26px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.7),transparent);z-index:-1}
.ze-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:clamp(32px,4vw,56px);align-items:stretch}
/* karta neutralna: s1, promień 20; polecana (najtaniej za żelkę) wyróżniona jaśniejszym obrysem i białą pigułką */
.card{position:relative;display:grid;gap:10px;align-content:start;padding:28px 24px 24px;border-radius:20px;border:1px solid var(--line-1);background:var(--surface-1)}
.card.hot{border-color:rgba(245,245,247,.32);background:var(--surface-1)}
.card h3{font-family:var(--font);font-stretch:var(--wd-text);font-weight:700;font-size:var(--fs-num-xl);line-height:1.05;letter-spacing:var(--ls-tight);font-variant-numeric:tabular-nums}
.card .sub{color:var(--text-2);font-size:var(--fs-small)}
.card .was{color:var(--text-2);font-size:var(--fs-small);margin-top:8px;font-variant-numeric:tabular-nums}
.card .was s{color:var(--text-2)}
.card .now{font-size:var(--fs-price);font-weight:700;letter-spacing:var(--ls-snug);line-height:1;font-variant-numeric:tabular-nums}
.badge{justify-self:start;font-size:12px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;padding:5px 10px;border-radius:999px;background:var(--surface-3);color:var(--text-2);border:1px solid transparent;font-variant-numeric:tabular-nums}
.card.hot .badge{background:var(--text-1);color:#000}
.badge.off{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.card .btn{margin-top:8px}
.card .per{font-size:var(--fs-meta);color:var(--text-2);font-variant-numeric:tabular-nums}
@media (max-width:899px){.card-fan{aspect-ratio:2/1;margin:0 0 2px}.card-fan .zf-in{width:calc(var(--s) * 80%)}.ze-cards{grid-template-columns:1fr}.card{grid-template-columns:1fr auto;column-gap:16px}.card>*{grid-column:1/-1}}

/* ===== NOWOŚCI ===== */
.nw{position:relative;background:var(--bg)}
.nw-stage{position:relative;min-height:calc(var(--svh)*100);display:grid;align-content:center;justify-items:center;gap:clamp(18px,calc(var(--svh)*3),36px);padding:110px var(--gut) 80px;overflow:hidden;text-align:center}
.fx .nw-pin{height:calc(var(--svh)*220)}
.fx .nw-stage{position:sticky;top:0;height:calc(var(--svh)*100);min-height:0}
.nw-title{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);text-wrap:balance}
.nw-title .glitch{position:relative;display:inline-block}
.nw-packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,36px);width:min(1100px,100%);align-items:end}
.nw-packs figure{display:grid;gap:14px;justify-items:center;will-change:transform}
.nw-img{position:relative;width:100%}
.nw-img::before{content:"";position:absolute;inset:6% 0 -4%;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--c-rgb,var(--fl-rgb)),.22),transparent)}
.nw-img img{position:relative;width:100%}
.nw-img .shade{position:absolute;inset:-12% -8%;background:var(--bg);opacity:0;pointer-events:none;will-change:opacity}
.fx .nw-img .shade{opacity:1}
.nw-packs figcaption{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);letter-spacing:var(--ls-snug);color:var(--c);line-height:1.06;white-space:nowrap}
/* pigułka marki (Nowość / Limit / Przedsprzedaż): gradient zachodu, czarny tekst, jedyna pigułka w wersalikach */
.pill{display:inline-flex;align-items:center;gap:8px;height:24px;padding:0 10px;border-radius:999px;font-family:var(--font);font-stretch:var(--wd-text);font-size:var(--fs-eyebrow);font-weight:700;line-height:1;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:#000;background:var(--brand-grad)}
.shots{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,80px);padding-block:clamp(60px,8vw,120px)}
.shots-img{position:relative}
.shots-img::before{content:"";position:absolute;inset:4%;border-radius:50%;background:radial-gradient(closest-side,rgba(245,245,247,.08),transparent)}
@keyframes pulse{50%{opacity:.5;transform:scale(.92)}}
.shots-img img{position:relative;width:min(560px,100%);margin-inline:auto}
.shots-copy{display:grid;gap:18px;justify-items:start}
.specs{display:grid;grid-template-columns:repeat(4,auto);gap:0;border:1px solid var(--line-1);border-radius:16px;overflow:hidden}
.specs div{padding:14px 18px;border-right:1px solid var(--line-1)}
.specs div:last-child{border-right:0}
.specs dt{font-weight:700;font-size:var(--fs-h3);white-space:nowrap;font-variant-numeric:tabular-nums}
.specs dd{color:var(--text-2);font-size:var(--fs-meta)}
.notify{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center;padding-block:40px 120px}
.notify h3{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug)}
.notify p{color:var(--text-2);margin-top:8px;max-width:44ch}
.notify-row{display:flex;gap:8px;padding:6px;border-radius:999px;border:1px solid var(--line-control);background:var(--surface-1)}
.notify-row input{flex:1;min-width:0;height:48px;border:0;background:transparent;color:var(--text-1);font:inherit;font-size:var(--fs-body);padding:0 16px;outline:none}
.notify-row input::placeholder{color:var(--text-3)}
.notify-row:focus-within{border-color:var(--text-1);outline:2px solid var(--focus);outline-offset:2px}
.notify-ok{grid-column:1/-1;color:var(--ok);font-weight:600}
.notify .notify-rodo{font-size:var(--fs-meta);line-height:1.5;margin-top:12px;max-width:none}.notify .notify-rodo a{color:var(--text-1);text-decoration:underline}
@media (max-width:899px){.nw-packs{gap:0;width:100%}.nw-img{width:132%;margin-inline:-16%}.nw-packs figure:nth-child(2){z-index:2}.nw-packs figure:nth-child(2) .nw-img{width:150%;margin-inline:-25%}.nw-packs figcaption{font-size:var(--fs-small);font-stretch:var(--wd-text);white-space:normal;text-wrap:balance;position:relative;z-index:3}.shots,.notify{grid-template-columns:minmax(0,1fr)}.specs{grid-template-columns:repeat(2,1fr)}.specs div:nth-child(2){border-right:0}.specs div:nth-child(-n+2){border-bottom:1px solid var(--line-1)}}

/* ===== DOWÓD ===== */
.dw{padding-block:clamp(96px,12vw,170px);display:grid;gap:clamp(56px,8vw,110px)}
.dw-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-1)}
.dw-stats div{display:grid;gap:10px;padding:26px 20px 0 0;align-content:start}
.dw-stats b{font-family:var(--font);font-stretch:var(--wd-text);font-weight:700;font-size:var(--fs-num-xl);line-height:1;letter-spacing:var(--ls-tight);font-variant-numeric:tabular-nums;white-space:nowrap}
.dw-stats span{color:var(--text-2);font-size:var(--fs-small);max-width:24ch}
.dw-quotes{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px)}
.dw-quotes blockquote{font-stretch:var(--wd-cond);font-size:var(--fs-h2);font-weight:700;letter-spacing:var(--ls-snug);line-height:1.1;text-wrap:balance}
.dw-quotes figcaption{margin-top:16px}
.stars{color:var(--text-1);letter-spacing:.2em;font-size:14px;margin-bottom:14px}
@media (max-width:899px){.dw-stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}.dw-quotes{grid-template-columns:1fr}}
.mq{overflow:hidden;border-block:1px solid var(--line-1);padding-block:20px;white-space:nowrap}
.mq a{text-decoration:none;display:block}
.mq-track{display:inline-flex;gap:48px;animation:mq 26s linear infinite;will-change:transform}
.mq-track span{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-display);line-height:1;letter-spacing:var(--ls-tight)}
.mq-track span:nth-child(even){color:transparent;-webkit-text-stroke:1.5px var(--text-2)}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-skew{display:block;will-change:transform}

/* ===== SKLEPY ===== */
.sh{padding-block:clamp(96px,12vw,170px)}
.sh-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.sh-copy{display:grid;gap:22px;justify-items:start}
.sh-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.sh-points{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line-1);border:1px solid var(--line-1);border-radius:20px;overflow:hidden}
.sh-points li{background:var(--bg);padding:24px;display:grid;gap:8px;align-content:start}
.sh-points b{font-size:var(--fs-body);font-weight:600}
.sh-points p{color:var(--text-2);font-size:var(--fs-small)}
.sh-points svg{width:22px;height:22px;color:var(--text-1)}
.shelf{position:relative;margin-top:clamp(48px,6vw,90px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,3vw,40px);align-items:end;padding-inline:clamp(0px,6vw,90px)}
.shelf::after{content:"";position:absolute;left:0;right:0;bottom:-14px;height:14px;border-radius:4px;background:linear-gradient(180deg,var(--surface-3),var(--surface-1));box-shadow:0 0 0 1px var(--line-1)}
.shelf figure{display:grid;gap:10px;justify-items:center}
.shelf img{width:100%;filter:drop-shadow(0 20px 24px rgba(0,0,0,.6))}
.shelf figcaption{font-size:12px;font-weight:600;line-height:1.3;color:var(--text-2);background:var(--surface-2);border:1px solid var(--line-1);padding:4px 8px;border-radius:6px;position:relative;top:24px;z-index:2;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:899px){.sh-grid{grid-template-columns:1fr}.sh-points{grid-template-columns:1fr}.shelf figcaption{display:none}}

/* ===== STOPKA ===== */
.ft{position:relative;padding-top:clamp(40px,6vw,80px);border-top:1px solid var(--line-1)}
/* wordmark w stopce: krój logo (Bebas) do czasu logo w SVG */
.ft-giant{font-family:var(--font-logo);font-weight:400;font-stretch:normal;font-size:19.6vw;line-height:.8;white-space:nowrap;text-align:center;color:transparent;-webkit-text-stroke:1px rgba(245,245,247,.16);background:linear-gradient(180deg,rgba(245,245,247,.08),transparent 80%);-webkit-background-clip:text;background-clip:text;padding-top:.05em;user-select:none}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:28px;padding-block:48px 28px}
.ft-grid h4{font-size:var(--fs-label);font-weight:600;line-height:1.4;color:var(--text-2);margin-bottom:12px}
.ft-grid ul{display:grid;gap:8px}
.ft-grid a{text-decoration:none;font-weight:500;color:var(--text-2);transition:color .16s}
@media (hover:hover){.ft-grid a:hover{color:var(--text-1)}}
.ft-brand img{height:34px;width:auto;margin-bottom:14px}
.ft-brand p{color:var(--text-2);font-size:var(--fs-small);max-width:32ch}
.copy-row{display:flex;align-items:center;gap:8px}
.copy-row button{font-size:12px;font-weight:600;line-height:1.4;color:var(--text-2);border:1px solid var(--line-2);border-radius:999px;padding:3px 8px}
.ft-legal{color:var(--text-3);font-size:var(--fs-meta);max-width:110ch;padding-block:20px;border-top:1px solid var(--line-1)}
.ft-proto{padding-block:0 calc(40px + env(safe-area-inset-bottom,0px))}
.ft-proto .hud{font-weight:500;color:var(--text-3)}
.ft-grid>div{min-width:0}
.copy-row{flex-wrap:wrap}
.copy-row span{overflow-wrap:anywhere}
@media (max-width:899px){.ft-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ft-brand,.ft-grid>div:last-child{grid-column:1/-1}}

/* ===== KOSZYK (szuflada: warstwa s2, obrys line-2, jedyny cień nakładek) ===== */
.cart{position:fixed;inset:0;z-index:250;visibility:hidden;pointer-events:none;overflow:hidden}
.cart.open{visibility:visible;pointer-events:auto}
.cart-scrim{position:absolute;inset:0;background:var(--scrim);opacity:0;transition:opacity .35s}
.cart.open .cart-scrim{opacity:1}
.cart-panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--surface-2);border-left:1px solid var(--line-2);box-shadow:var(--shadow-overlay);display:grid;grid-template-rows:auto auto 1fr auto;transform:translateX(102%);transition:transform .5s var(--ease);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.cart.open .cart-panel{transform:none}
.cart-top{display:flex;justify-content:space-between;align-items:center;padding:20px 22px}
.cart-top h2{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug)}
.icon-btn{width:40px;height:40px;border-radius:999px;background:var(--surface-3);color:var(--text-1);font-size:20px;display:grid;place-items:center}
.ship-bar{padding:0 22px 18px;display:grid;gap:10px;border-bottom:1px solid var(--line-1)}
.ship-bar p{font-size:var(--fs-small);font-weight:600;font-variant-numeric:tabular-nums}
.bar{height:6px;border-radius:999px;background:var(--surface-3);overflow:hidden}
/* pasek darmowej dostawy: gradient marki (jedno z dozwolonych miejsc) */
.bar i{display:block;height:100%;width:0;background:var(--brand-grad);border-radius:999px;transition:width .6s var(--ease)}
.cart-list{overflow:auto;padding:8px 22px;display:grid;align-content:start}
.ci{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line-1)}
.ci img{width:64px;height:64px;object-fit:contain}
.ci .t{font-weight:600;font-size:var(--fs-small);line-height:1.25}
.ci .s{color:var(--text-2);font-size:var(--fs-meta)}
.qty{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--line-2);border-radius:999px;margin-top:6px}
.qty button{width:40px;height:36px;font-size:18px;color:var(--text-2)}
.qty span{min-width:22px;text-align:center;font-size:var(--fs-small);font-weight:600;font-variant-numeric:tabular-nums}
.ci .v{font-weight:600;font-variant-numeric:tabular-nums}
.cart-empty{padding:30px 22px;color:var(--text-2)}
.cart-foot{padding:18px 22px 22px;display:grid;gap:12px;border-top:1px solid var(--line-1)}
.sum{display:flex;justify-content:space-between;align-items:baseline;font-size:var(--fs-small)}
.sum b{font-size:20px;font-weight:700;letter-spacing:var(--ls-snug);font-variant-numeric:tabular-nums}
.checkout-note{font-size:var(--fs-meta);color:var(--text-2)}
.checkout-note a{color:var(--text-1)}
.fly{position:fixed;z-index:260;pointer-events:none;will-change:transform}
.bump{animation:bump .45s var(--ease)}
@keyframes bump{40%{transform:scale(1.18)}}

/* toast: ciemna warstwa s2, tekst text-1, biały przycisk */
.toast{position:fixed;z-index:258;left:var(--gut);right:var(--gut);margin-inline:auto;width:max-content;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateY(160%);visibility:hidden;opacity:0;display:flex;align-items:center;gap:14px;padding:10px 10px 10px 18px;border-radius:999px;background:var(--surface-2);color:var(--text-1);border:1px solid var(--line-2);font-weight:600;font-size:var(--fs-small);box-shadow:var(--shadow-overlay);transition:transform .5s var(--ease),opacity .3s,visibility 0s .5s;max-width:calc(100% - 2*var(--gut));box-sizing:border-box}
.toast.show{transform:none;visibility:visible;opacity:1;transition:transform .5s var(--ease),opacity .3s}
.toast button{height:34px;padding:0 14px;border-radius:999px;background:var(--action);color:var(--on-action);font-weight:600;font-size:var(--fs-meta);white-space:nowrap}
.toast span{min-width:0}
.toast span b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal}
.toast span small{display:block;white-space:normal;overflow:visible;line-height:1.3}
.sk-head .h2{font-size:var(--fs-h2)}
@media (min-width:900px){.fx .sk{height:calc(var(--svh)*190)}.fx .sk-stage{position:sticky;top:0;height:calc(var(--svh)*100);min-height:0;padding-block:84px 24px;gap:clamp(14px,calc(var(--svh)*2.4),30px)}.fx .bear{width:min(290px,calc(var(--svh)*32))}.fx .sk-col{gap:clamp(18px,calc(var(--svh)*4),56px)}}
.nw-packs{width:min(980px,100%,calc(var(--svh)*106))}
.fx .nw-stage{padding-block:max(88px,calc(var(--svh)*11)) 40px}

/* Nowe komponenty liczą szerokość razem z obramowaniem i paddingiem */
.sheet,.sheet *,.b2b,.b2b *,.trust,.trust *,.faq-list,.faq-list *,.help-in,.help-in *,.cart-tip,.cart-tip *,.cart-quick,.cart-quick *,.totop,.menu-quiz,.fl-more{box-sizing:border-box}

/* ===== POMOC W WYBORZE ===== */
.help{padding-block:clamp(56px,8vw,110px) 0}
.help-in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:clamp(20px,3vw,40px);padding:clamp(24px,4vw,48px);border-radius:28px;border:1px solid var(--line-1);background:var(--surface-1);overflow:hidden}
.help-h{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);margin-top:10px;text-wrap:balance}
.help-bears{display:flex;align-items:flex-end}
.help-bears img{width:clamp(44px,5vw,66px);margin-left:-10px;filter:drop-shadow(0 10px 14px rgba(0,0,0,.5))}
.help-bears img:first-child{margin-left:0}
.fx .help-bears img{animation:hbob 3.2s ease-in-out infinite;animation-delay:calc(var(--i) * -1.05s);animation-play-state:paused}
.fx .help.live .help-bears img{animation-play-state:running}
@keyframes hbob{50%{transform:translateY(-8px) rotate(var(--r,4deg))}}
.help-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
@media (max-width:899px){.help-in{grid-template-columns:minmax(0,1fr) auto}.help-btns{grid-column:1/-1;justify-content:stretch}.help-btns .btn{flex:1 1 220px}}
@media (max-width:480px){.help-in{grid-template-columns:1fr}.help-bears{grid-row:1;justify-content:flex-start}.help-bears img{width:42px}}

/* Przycisk szczegółów smaku: drugorzędny (s3) z kropką „i” w kolorze smaku */
.fl-more{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 6px;border-radius:999px;border:1px solid transparent;background:var(--surface-3);font-size:var(--fs-meta);font-weight:600;color:var(--text-1);justify-self:start;transition:background .16s,border-color .16s,scale .12s}
.fl-more i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#000;font-family:var(--font);font-style:normal;font-size:12px;font-weight:700}
@media (hover:hover){.fl-more:hover{background:var(--surface-3-hover)}}
.fl-more:active{scale:.96}
@media (max-width:899px){.fx .fl-more{justify-self:center;height:30px;font-size:12px;padding:0 12px 0 4px}.fx .fl-more i{width:20px;height:20px;font-size:12px}}

/* ===== PASEK ZAUFANIA ===== */
.trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:clamp(28px,4vw,48px);border:1px solid var(--line-1);border-radius:20px;overflow:hidden;background:var(--line-1)}
.trust li{background:var(--bg);display:flex;gap:12px;align-items:center;padding:16px 18px;font-size:var(--fs-meta);color:var(--text-2);line-height:1.35;min-width:0}
.trust b{display:block;color:var(--text-1);font-size:var(--fs-small);font-weight:600}
.trust svg{flex:none;width:24px;height:24px;color:var(--text-1)}
@media (max-width:899px){.trust{grid-template-columns:repeat(2,minmax(0,1fr))}.trust li{padding:14px;flex-direction:column;align-items:flex-start;gap:8px;font-size:var(--fs-meta)}.trust b{font-size:var(--fs-small)}}

/* ===== PYTANIA ===== */
.faq{padding-block:clamp(24px,4vw,60px) clamp(96px,12vw,170px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,80px);align-items:start}
.faq-head{display:grid;gap:18px;align-content:start}
.faq-head .lead a{color:var(--text-1)}
.faq-list{border-top:1px solid var(--line-1)}
.qa{border-bottom:1px solid var(--line-1)}
.qa h3{font:inherit}
.qa-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;text-align:left;font-size:var(--fs-h3);font-weight:600;letter-spacing:var(--ls-snug);line-height:1.3;transition:color .16s}
@media (hover:hover){.qa-q:hover{color:var(--text-2)}}
.qa-q i{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line-2);position:relative;transition:background .3s,border-color .3s}
.qa-q i::before,.qa-q i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:currentColor;border-radius:2px;transition:transform .35s var(--ease)}
.qa-q i::after{transform:rotate(90deg)}
.qa-q[aria-expanded="true"] i{background:var(--action);border-color:var(--action);color:var(--on-action)}
.qa-q[aria-expanded="true"] i::after{transform:rotate(0)}
.qa-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s var(--ease)}
.qa-a>div{overflow:hidden;min-height:0;visibility:hidden;transition:visibility 0s .42s}
.qa.open .qa-a{grid-template-rows:1fr}
.qa.open .qa-a>div{visibility:visible;transition:none}
.qa-a p{padding:0 48px 24px 0;color:var(--text-2);max-width:62ch}
.qa-a a{color:var(--text-1)}
@media (max-width:899px){.faq{grid-template-columns:minmax(0,1fr)}.qa-a p{padding-right:0}}

/* ===== FORMULARZ DLA SKLEPÓW ===== */
.b2b{display:grid;gap:12px;width:100%;max-width:540px;padding:20px;border-radius:20px;border:1px solid var(--line-1);background:var(--surface-1)}
.b2b-h{font-weight:600;font-size:var(--fs-body)}
.b2b-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.fld{display:grid;gap:6px;min-width:0}
.fld label{font-size:var(--fs-label);font-weight:600;line-height:1.4;color:var(--text-2)}
.fld input{width:100%;height:48px;border-radius:12px;border:1px solid var(--line-control);background:var(--bg);color:var(--text-1);font:inherit;font-size:var(--fs-body);font-variant-numeric:tabular-nums;padding:0 14px;outline:none;transition:border-color .16s}
.fld input::placeholder{color:var(--text-3)}
.fld input:focus{border-color:var(--text-1);outline:2px solid var(--focus);outline-offset:2px}
.fld.ok input{border-color:var(--line-control)}
.fld.bad input{border-color:var(--err)}
.fld small{font-size:var(--fs-meta);color:var(--text-2);min-height:1.3em;line-height:1.3}
.fld.ok small{color:var(--ok)}
.fld.bad small{color:var(--err)}
.b2b .btn{width:100%}
.b2b-ok{color:var(--ok);font-weight:600;font-size:var(--fs-small)}
@media (max-width:420px){.b2b-row{grid-template-columns:1fr}.b2b{padding:16px}}

/* ===== STOPKA: na górę ===== */
.ft-proto{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}
.totop{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;border:1px solid transparent;background:var(--surface-3);font-size:var(--fs-small);font-weight:600;color:var(--text-1)}
.totop svg{width:16px;height:16px}
@media (hover:hover){.totop:hover{background:var(--surface-3-hover)}}

/* ===== MENU: quiz ===== */
.menu-quiz{display:inline-flex;align-items:center;gap:12px;justify-self:start;margin-top:22px;height:50px;padding:0 20px 0 14px;border-radius:999px;border:1px solid transparent;background:var(--surface-3);font-weight:600;font-size:var(--fs-small);text-align:left}
.menu-quiz i{width:8px;height:8px;border-radius:50%;background:var(--text-1)}

/* ===== KOSZYK: podpowiedzi ===== */
.btn-light{background:var(--action);color:var(--on-action)}
.cart-tip{--c:var(--text-1);display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;margin:16px 0 8px;padding:14px;border-radius:16px;border:1px solid var(--line-1);background:var(--surface-3)}
.cart-tip img{width:52px;height:52px;object-fit:contain}
.cart-tip .h{font-size:var(--fs-eyebrow);font-weight:600;line-height:1.3;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-2)}
.cart-tip p{font-size:var(--fs-small);line-height:1.4;margin-top:2px}
.cart-tip button{grid-column:1/-1;height:42px;border-radius:999px;background:var(--action);color:var(--on-action);font-weight:600;font-size:var(--fs-small)}
.cart-quick{display:grid;gap:8px;padding:6px 0 10px}
.cart-quick>p{color:var(--text-2);font-size:var(--fs-small);padding:18px 0 6px}
.cq{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 10px 8px 8px;border-radius:16px;border:1px solid var(--line-2);text-align:left}
.cq img{width:44px;height:44px;object-fit:contain}
.cq b{display:block;font-size:var(--fs-small);font-weight:600}
.cq small{display:block;font-size:var(--fs-meta);color:var(--text-2)}
.ci.new{animation:cinew 1.4s var(--ease)}
@keyframes cinew{0%{background:rgba(245,245,247,.1)}100%{background:rgba(245,245,247,0)}}
.cq em{font-style:normal;font-weight:600;font-size:var(--fs-meta);padding:7px 12px;border-radius:999px;background:var(--surface-3);font-variant-numeric:tabular-nums}
.cq:active{scale:.98}
@media (hover:hover){.cq:hover{border-color:rgba(245,245,247,.32)}}
.cart-quick .linkish{justify-self:start;font-weight:600;font-size:var(--fs-small);color:var(--text-1);padding:8px 0;text-decoration:underline;text-underline-offset:4px}
.pay{text-align:center;font-size:var(--fs-meta);font-weight:500;color:var(--text-3)}
.toast span{display:grid;gap:1px;line-height:1.25}
.toast span small{font-size:var(--fs-meta);font-weight:500;color:var(--text-2)}
.toast span b{overflow:hidden;text-overflow:ellipsis}
.toast{border-radius:16px}

/* ===== ARKUSZ (quiz, szczegóły): nakładka s2, obrys line-2, cień nakładek ===== */
html.lock,html.lock body{overflow:hidden}
.sheet{position:fixed;inset:0;z-index:255;visibility:hidden;pointer-events:none}
.sheet.open{visibility:visible;pointer-events:auto}
.sheet-scrim{position:absolute;inset:0;background:var(--scrim);opacity:0;transition:opacity .35s}
.sheet.open .sheet-scrim{opacity:1}
.sheet-panel{--c:var(--text-1);--c-rgb:245,245,247;position:absolute;left:50%;top:50%;width:min(620px,calc(100% - 40px));max-height:min(calc(var(--svh)*88),860px);display:flex;flex-direction:column;background:var(--surface-2);border:1px solid var(--line-2);border-radius:28px;box-shadow:var(--shadow-overlay);transform:translate(-50%,-46%) scale(.97);opacity:0;transition:transform .45s var(--ease),opacity .3s;overflow:hidden;isolation:isolate}
.sheet.open .sheet-panel{transform:translate(-50%,-50%);opacity:1}
/* miękkie światło smaku nad paczką (szczegóły smaku = strona produktu w okienku) */
.sheet-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:320px;background:radial-gradient(60% 100% at 50% 0%,rgba(var(--c-rgb),.16),transparent 72%);z-index:-1;pointer-events:none;transition:background .4s}
.sheet-grab{display:none}
.sheet-x{position:absolute;top:14px;right:14px;z-index:3}
.sheet-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:30px 30px 28px}
.sheet-panel.dragging{transition:none}
@media (max-width:640px){
  .sheet-panel{left:0;right:0;top:auto;bottom:0;width:auto;max-height:calc(var(--svh)*92);border-radius:28px 28px 0 0;border-bottom:0;transform:translateY(102%);opacity:1;padding-bottom:env(safe-area-inset-bottom,0px)}
  .sheet.open .sheet-panel{transform:none}
  .sheet-grab{display:grid;place-items:center;flex:none;height:30px;touch-action:none;cursor:grab}
  .sheet-grab i{width:42px;height:5px;border-radius:9px;background:rgba(245,245,247,.25)}
  .sheet-body{padding:4px 20px 22px}
  .sheet-x{top:12px;right:12px;width:36px;height:36px}
}

/* Quiz */
.qz{display:grid;gap:18px}
.qz-top{display:flex;align-items:center;gap:14px;padding-right:48px}
.qz-prog{flex:1;height:4px;border-radius:9px;background:var(--surface-3);overflow:hidden}
.qz-prog i{display:block;height:100%;background:var(--c);border-radius:9px;transition:width .45s var(--ease)}
.qz-q{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);text-wrap:balance}
.qz-opts{display:grid;gap:10px}
.qz-o{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;align-items:center;text-align:left;padding:16px 18px;border-radius:16px;border:1px solid transparent;background:var(--surface-3);transition:border-color .16s,background .16s,scale .12s}
.qz-o i{grid-row:span 2;width:10px;height:10px;border-radius:50%;background:var(--oc,var(--text-1))}
.qz-o b{font-size:var(--fs-body);font-weight:600;line-height:1.25}
.qz-o span{font-size:var(--fs-small);color:var(--text-2)}
@media (hover:hover){.qz-o:hover{background:var(--surface-3-hover)}}
.qz-o:active{scale:.98}
.qz-o.pick{border-color:var(--oc,var(--text-1));background:var(--surface-3-hover)}
.qz-back{justify-self:start;font-size:var(--fs-small);font-weight:600;color:var(--text-2);padding:6px 0}
.qz-anim{animation:qzin .45s var(--ease) both}
@keyframes qzin{from{opacity:0;transform:translateY(14px)}}
.qz-res{display:grid;gap:14px;justify-items:center;text-align:center}
.qz-pack{width:min(260px,62vw,calc(var(--svh)*30));filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.fx .qz-pack{animation:qzpack .8s var(--ease) both}
@keyframes qzpack{from{opacity:0;transform:translateY(40px) rotate(-6deg) scale(.9)}}
.qz-name{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-h1);line-height:1;letter-spacing:var(--ls-tight);color:var(--c)}
.qz-why{color:var(--text-2);max-width:44ch}
.qz-pick{font-size:14px;font-weight:600;line-height:1.3;padding:8px 14px;border-radius:999px;border:1px solid transparent;background:var(--c-tint,rgba(var(--c-rgb),.16));color:var(--c);font-variant-numeric:tabular-nums}
.qz-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:4px}
.qz-btns .btn{width:100%;padding:0 14px}
.qz-alt{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:center}
.qz-alt button{font-size:var(--fs-small);font-weight:600;color:var(--text-2);padding:6px 0;text-decoration:underline;text-underline-offset:4px}
@media (max-width:420px){.qz-btns{grid-template-columns:1fr}}

/* Szczegóły smaku */
.dt{display:grid;gap:22px}
.dt-head{display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:center;padding-right:44px}
.dt-head img{width:120px;filter:drop-shadow(0 18px 24px rgba(0,0,0,.6))}
.dt-name{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:800;font-size:var(--fs-h1);line-height:1;letter-spacing:var(--ls-tight);color:var(--c);margin-top:6px}
.dt-tag{font-weight:600;margin-top:4px}
.dt-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line-1);border:1px solid var(--line-1);border-radius:16px;overflow:hidden}
.dt-facts div{background:var(--surface-3);padding:14px 12px;display:grid;gap:4px;align-content:start}
.dt-facts b{font-weight:700;font-size:24px;letter-spacing:var(--ls-tight);line-height:1;color:var(--text-1);font-variant-numeric:tabular-nums}
.dt-facts span{font-size:12px;color:var(--text-2);line-height:1.3}
.dt-list{display:grid}
.dt-list div{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;padding:13px 0;border-top:1px solid var(--line-1)}
.dt-list dt{font-size:var(--fs-label);font-weight:600;line-height:1.4;color:var(--text-2);padding-top:1px}
.dt-list dd{font-size:var(--fs-small);line-height:1.5}
.dt-foot{font-size:12px;font-weight:500;letter-spacing:0;line-height:1.6;color:var(--text-3)}
.dt-buy{display:grid;gap:12px;position:sticky;bottom:0;z-index:2;margin:0 -30px -28px;padding:26px 30px 24px;background:linear-gradient(180deg,rgba(28,28,31,0),var(--surface-2) 18px)}
.dt-buy .sizes{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.dt-buy .size{grid-template-columns:1fr;gap:0;padding:10px 8px;text-align:center}
.dt-buy .size .g{font-size:var(--fs-body)}.dt-buy .size .n{font-size:12px}.dt-buy .size .p{font-size:var(--fs-meta)}
.dt-buy .size em{left:50%;transform:translateX(-50%);white-space:nowrap;top:-10px;font-size:12px;line-height:1.3;padding:1px 6px}
.dt-row{display:flex;gap:10px}
.dt-row .btn-fl{flex:1}
.dt-share{flex:none;width:52px;height:52px;border-radius:999px;border:1px solid transparent;display:grid;place-items:center;background:var(--surface-3)}
.dt-share svg{width:20px;height:20px}
@media (max-width:640px){
  .dt-head{grid-template-columns:92px minmax(0,1fr);gap:14px}.dt-head img{width:92px}
  .dt-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dt-list div{grid-template-columns:1fr;gap:4px}
  .dt-buy{margin:0 -20px -22px;padding:24px 20px 20px}
}

.sheet [tabindex="-1"]:focus{outline:none}

/* ===== PASEK Z KROPKAMI ===== */
.dots{--step:15px;position:fixed;z-index:90;right:max(3px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);display:flex;flex-direction:column;padding:7px 0;width:16px;border-radius:999px;background:rgba(18,18,20,.6);border:1px solid var(--line-1);touch-action:none;-webkit-user-select:none;user-select:none;opacity:0;visibility:hidden;transition:opacity .4s,visibility 0s .4s}
.dots.on{opacity:1;visibility:visible;transition:opacity .4s}
.dot{position:relative;width:16px;height:var(--step);display:grid;place-items:center;cursor:pointer}
.dot::before{content:"";width:4px;height:4px;border-radius:50%;background:rgba(245,245,247,.28);transition:background .3s,opacity .3s}
.dot.past::before{background:rgba(245,245,247,.6)}
.dot.dfl::before{background:var(--c);opacity:.55}
.dot.dfl.past::before{opacity:.9}
.dots-ind{position:absolute;left:50%;top:calc(7px + (var(--step) - 13px) / 2);width:5px;height:13px;margin-left:-2.5px;border-radius:5px;background:var(--fl);transform:translateY(calc(var(--di,0) * var(--step)));transition:transform .45s cubic-bezier(.2,.7,.1,1),background .3s;pointer-events:none;z-index:1}
.dot span{position:absolute;right:24px;top:50%;transform:translateY(-50%);white-space:nowrap;font-size:12px;font-weight:600;color:var(--text-1);padding:5px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line-1);opacity:0;pointer-events:none;transition:opacity .2s}
@media (hover:hover){.dot:hover span{opacity:1}}
.dots.drag .dot span{opacity:0}
.dots.drag .dot.tip span{opacity:1}
@media (max-width:899px){.dots{--step:14px;width:14px;right:2px}.dot{width:14px}.dot span{right:22px}}

/* Telefon poziomo (niski ekran): układ w poziomie, wszystko mieści się w wysokości */
@media (orientation:landscape) and (max-height:520px){
  .gate-inner{gap:10px}
  .neon{font-size:min(15vw,calc(var(--svh)*30))}
  .neon-wrap::after{margin-top:12px}
  .gate-sub{margin-top:0}
  .gate-foot{display:none}
  .hero-kicker{top:calc(env(safe-area-inset-top,0px) + 60px)}
  .hero-kicker .k1{display:none}
  .hero-letters{top:0;padding-top:calc(var(--svh)*14);align-items:center;justify-content:space-between;padding-inline:4vw}
  .hl{font-size:calc(var(--svh)*78)}
  .hero-packs{bottom:calc(64px + env(safe-area-inset-bottom,0px));height:calc(var(--svh)*50);width:min(92vw,calc(var(--svh)*120))}
  .hp-c{width:46%;left:27%}
  .hp-l{width:34%;left:0}
  .hp-r{width:34%;right:0}
  .hero-floor{height:calc(64px + env(safe-area-inset-bottom,0px))}
  .hero-bottom{bottom:calc(10px + env(safe-area-inset-bottom,0px))}
  .hero-cta .btn{height:44px}
  .fx .fl-slide{grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:16px;padding:58px var(--gut) 4px;align-items:center}
  .fx .fl-info{text-align:left;justify-items:start;gap:4px}
  .fx .fl-name{font-size:calc(var(--svh)*13)}
  .fx .fl-name br{display:inline}
  .fx .fl-tag{display:block;font-size:var(--fs-small)}
  .fx .fl-pack{height:100%}
  .fx .fl-pack .pf{height:auto;width:min(100%,calc(var(--svh)*58));max-height:none;aspect-ratio:auto}
  .fx .fl-pack .pk>img:first-child{height:auto}
  .fx .fl-buy{gap:8px}
  .fx .size .n{display:none}
  .fx .size{padding:7px 6px}
  .fx .fl-bar{padding-top:4px;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
  .fl-nav button{height:32px}
  .fx .fl-arrow{display:none}
  .nw-packs{width:min(100%,calc(var(--svh)*110))}
  .fx .nw-stage{padding-block:56px 16px;gap:10px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ===== WordPress: konto, podgląd, pułapki na boty ===== */
.nav-acc{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:var(--surface-3);color:var(--text-1);flex:none}
.nav-acc svg{width:18px;height:18px}
@media (hover:hover){.nav-acc:hover{background:var(--surface-3-hover)}}
.hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.in-preview{position:fixed;z-index:400;left:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:8px;padding:4px 4px 4px 10px;border-radius:999px;background:var(--warn);color:#000;font:600 12px/1.3 var(--font);box-shadow:var(--shadow-overlay);max-width:calc(100% - 16px)}
.in-preview button{width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.12);font-size:13px;line-height:1;color:#000}
.in-preview a{color:#000;text-decoration:underline;text-decoration-color:currentColor}
.cart-full{justify-self:center;font-size:var(--fs-meta);font-weight:600;color:var(--text-2);text-decoration:underline;text-underline-offset:4px}
.b2b-err{color:var(--err);font-weight:600;font-size:var(--fs-small)}
.copy-row a{text-decoration:none;font-weight:500}
.cart-load{opacity:.55;pointer-events:none;transition:opacity .2s}
.cart-err{margin:12px 0;padding:12px 14px;border-radius:12px;border:0;border-left:3px solid var(--err);background:var(--err-bg);color:var(--text-1);font-size:var(--fs-small)}
.ci .t small{display:block;font-weight:500;font-size:var(--fs-meta);color:var(--text-2);margin-top:2px}
.ci-fan{position:relative;width:64px;height:64px;display:block}
.ci .ci-fan img{position:absolute;bottom:10px;height:auto;filter:drop-shadow(0 6px 8px rgba(0,0,0,.6))}
.ci .ci-fan .c{width:46px;left:9px;z-index:2}
.ci .ci-fan .l{width:34px;left:-3px;bottom:13px;rotate:-12deg}
.ci .ci-fan .r{width:34px;right:-3px;bottom:13px;rotate:12deg}
/* prezent od sklepu: neutralny kafelek (s3) zamiast zdjęcia z jasnym tłem */
.ci-ico{width:64px;height:64px;border-radius:12px;display:grid;place-items:center;color:var(--text-1);border:1px solid var(--line-1);background:var(--surface-3)}
.ci-ico svg{width:30px;height:30px}
.ci .v.gift{color:var(--text-1);font-weight:600;font-size:var(--fs-small);letter-spacing:0;text-transform:none}
.btn.busy{opacity:.7;pointer-events:none}
.btn.is-empty{opacity:.45}
.in-preview{animation:inprev 7s forwards}
@keyframes inprev{0%,80%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
/* stara bramka 18+ (snippet 29): na nowej stronie jej rolę pełni bramka in-home, stan obu jest zsynchronizowany */
body.in-home-bramka #in-wiek{display:none!important}
/* stara bramka blokuje przewijanie klasą body.in-wiek-lock (na iPhonie overflow:hidden na body = brak przewijania).
   Na nowej stronie przewijanie blokuje wyłącznie nasza bramka/koszyk/arkusz (html.lock). */
html:not(.lock) body.in-home-bramka.in-wiek-lock{overflow:visible!important;overflow-x:clip!important;position:static!important;touch-action:auto!important}
@supports not (overflow:clip){html:not(.lock) body.in-home-bramka.in-wiek-lock{overflow-x:hidden!important}}

/* ===================== 1.0.5 ===================== */
/* Wydajność: warstwy GPU tylko tam, gdzie coś się rusza; pętle animacji stoją poza ekranem */
.btn{will-change:auto}
.fine .mag{will-change:transform}
.touch .glare{display:none}
.idle,.idle *{animation-play-state:paused!important}
.fl-slide:not(.on) .pf{animation:none!important}

/* B2B w nagłówku: kółko jak konto, w środku sklep i napis B2B */
.nav-b2b{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;align-content:center;gap:1px;background:var(--surface-3);border:1px solid transparent;color:var(--text-1);flex:none;text-decoration:none;line-height:1}
.nav-b2b svg{width:15px;height:15px}
.nav-b2b b{font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.02em}
@media (hover:hover){.nav-b2b:hover{background:var(--surface-3-hover)}}
/* konto firmowe: kółko B2B zamiast ikony konta, wypełnione (biała pigułka), żeby było widać, że to „moje” */
.nav-b2b.is-firma{background:var(--action);border-color:var(--action);color:var(--on-action)}
@media (hover:hover){.nav-b2b.is-firma:hover{background:var(--action-hover)}}
/* sekcja dla sklepów u zalogowanego konta firmowego: zamiast formularza „oddzwonimy” */
.sh-firma{display:grid;gap:8px;padding:20px 22px;border-radius:20px;border:1px solid var(--line-1);background:var(--surface-1)}
.sh-firma p{margin:0;color:var(--text-2)}
.sh-firma .b2b-h{color:var(--text-1);font-weight:600}
/* pole „Kto Ci o nas powiedział?” z wtyczki panelu B2B: wpisywane ręcznie pokazuje się dopiero po wybraniu „Ktoś inny” */
.in-pan-polecil input[hidden]{display:none!important}


/* TELEFON: zwykłe przewijanie, bez przypinanych scen i doskakiwania */
.fx.mob .hero-wrap{height:auto}
.fx.mob .hero{position:relative}
.fx.mob .fl{height:auto}
.fx.mob .fl-stage{position:relative;height:calc(var(--svh)*100)}
.fx.mob .fl-progress{display:none}
.fx.mob .nw-pin{height:auto}
.fx.mob .nw-stage{position:relative;height:auto;min-height:0;padding-block:96px 56px}
.mob .dots{display:none}

/* podpowiedź gestu przy smakach (znika po pierwszej zmianie smaku) */
.fl-hint{display:none}
.fx.mob .fl-hint{display:flex;align-items:center;gap:10px;position:absolute;z-index:7;left:50%;top:calc(var(--svh)*46);transform:translateX(-50%);padding:8px 14px;border-radius:999px;background:rgba(28,28,31,.88);border:1px solid var(--line-1);font-size:var(--fs-meta);font-weight:600;color:var(--text-1);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .5s}
.fx.mob .fl-stage.seen .fl-hint{opacity:1}
.fx.mob .fl-stage.hinted .fl-hint{opacity:0;transition-duration:.25s}
.fl-hint i{width:18px;height:2px;border-radius:2px;background:var(--text-1);position:relative;animation:hintx 1.4s ease-in-out infinite}
.fl-hint i::before{content:"";position:absolute;top:-3px;width:7px;height:7px;border:solid var(--text-1);border-width:0 0 2px 2px}
.fl-hint i.l::before{left:0;transform:rotate(45deg)}
.fl-hint i.r::before{right:0;transform:rotate(-135deg)}
.fl-hint i.r{animation-direction:reverse}
@keyframes hintx{50%{transform:translateX(-4px)}}

/* dolny pasek pod kciukiem (tylko telefon); chowa się na starcie, przy smakach i pod koszykiem/menu */
.mbar{display:none}
.mob .mbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:center;gap:2px;position:fixed;z-index:95;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:6px;border-radius:24px;background:rgba(18,18,20,.94);border:1px solid var(--line-1);transform:translateY(calc(100% + 40px));transition:transform .45s var(--ease)}
.mob .mbar.on{transform:none}
.mob.lock .mbar{transform:translateY(calc(100% + 40px))}
.mb-i{display:grid;justify-items:center;gap:3px;padding:6px 2px;border-radius:16px;color:var(--text-2);font-size:12px;font-weight:600;line-height:1.2;text-decoration:none;font-family:inherit}
.mb-i svg{width:24px;height:24px}
.mb-i:active{background:var(--surface-3);color:var(--text-1)}
.mb-cart{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 7px 0 13px;border-radius:18px;background:var(--action);color:var(--on-action);font-weight:600;font-size:14px;font-variant-numeric:tabular-nums;transition:background .3s}
.mb-cart.full{background:var(--action)}
.mb-cart svg{width:18px;height:18px}
.mb-cart .count{min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:#000;color:var(--text-1);display:grid;place-items:center;font-size:12px;font-weight:600}
.mob .toast.up{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.mob .ft{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}

/* koszyk: dodanie widać od razu, potwierdzenie ze sklepu dochodzi w tle */
.ci.pending .v{opacity:.55}
.nav-cart.sync .count,.mb-cart.sync .count{animation:syncp 1s ease-in-out infinite}
@keyframes syncp{50%{opacity:.45}}
.ci[data-key^="tmp"] .qty,.ci[data-keys^="tmp"] .qty,.ci[data-keys*=",tmp"] .qty{opacity:.45;pointer-events:none}

/* 1.1.0: menu na pozostałych stronach (linki pomocnicze w jednym rzędzie) */
.menu-small{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}
.menu .menu-small a{font-family:var(--font);font-stretch:var(--wd-text);font-size:var(--fs-small);font-weight:500;letter-spacing:0;text-transform:none;color:var(--text-2);line-height:1.6}
a.menu-quiz{text-decoration:none}
/* na stronach sklepu „Dobierz smak” w menu jest linkiem: ma wyglądać jak przycisk, nie jak wielka pozycja menu */
.menu a.menu-quiz{font-family:var(--font);font-stretch:var(--wd-text);font-weight:600;letter-spacing:0;font-size:var(--fs-small);line-height:1.25;height:auto;min-height:50px;padding:10px 20px 10px 14px}
.menu{overflow-y:auto;overscroll-behavior:contain}
.in18 .gate{display:none!important}

/* ===== 1.2.2: posty z Instagrama (Smash Balloon Instagram Feed) w wyglądzie strony ===== */
.ig{padding-block:clamp(48px,7vw,96px) clamp(56px,8vw,110px)}
.ig-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 28px;margin-bottom:clamp(20px,3vw,34px)}
.ig-title{font-family:var(--font);font-stretch:var(--wd-cond);font-weight:700;font-size:var(--fs-h2);line-height:1.06;letter-spacing:var(--ls-snug);margin-top:10px}
.ig #sb_instagram{width:100%!important;max-width:none!important;padding:0!important;margin:0!important;background:none!important}
.ig #sb_instagram .sb_instagram_header,.ig #sb_instagram #sbi_load,.ig #sb_instagram .sbi_load_btn,.ig #sb_instagram .sbi_follow_btn,.ig #sb_instagram #sbi_mod_error,.ig #sb_instagram .sbi_header_outside{display:none!important}
.ig #sb_instagram #sbi_images{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px!important;padding:0!important;width:100%!important;float:none!important}
.ig #sb_instagram #sbi_images .sbi_item{width:auto!important;max-width:none!important;padding:0!important;margin:0!important;float:none!important;display:block!important;opacity:1!important;height:auto!important}
.ig #sb_instagram #sbi_images .sbi_item:nth-child(n+9){display:none!important}
.ig #sb_instagram .sbi_photo_wrap{position:relative;overflow:hidden;border-radius:20px;border:1px solid var(--line-1);background:var(--surface-1);aspect-ratio:1/1}
.ig #sb_instagram .sbi_photo{display:block!important;width:100%!important;height:100%!important;opacity:1!important;background-size:cover;background-position:center}
.ig #sb_instagram .sbi_photo img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;opacity:1;transition:transform .6s var(--ease),filter .4s}
.ig #sb_instagram .sbi_photo img[src*="placeholder"]{opacity:0}
.ig #sb_instagram .sbi_photo_wrap::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(245,245,247,.06);background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.35))}
.ig #sb_instagram svg.sbi_playbtn,.ig #sb_instagram svg.sbi_carousel_icon,.ig #sb_instagram .fa-clone{position:absolute!important;top:12px!important;right:12px!important;left:auto!important;bottom:auto!important;margin:0!important;width:18px!important;height:18px!important;color:#fff!important;opacity:.9;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6));z-index:2;transform:none!important}
.ig #sb_instagram .sbi-screenreader{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (hover:hover){.ig #sb_instagram .sbi_photo:hover img{transform:scale(1.04)}}
@media (max-width:899px){
  .ig #sb_instagram #sbi_images{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important}
  .ig #sb_instagram #sbi_images .sbi_item:nth-child(n+7){display:none!important}
  .ig #sb_instagram .sbi_photo_wrap{border-radius:16px}
}
@media (max-width:560px){
  .ig #sb_instagram #sbi_images{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ig-head .btn{width:100%}
}

/* ===== 1.3: nowe smaki w sprzedaży: „Kup” pod paczką w sekcji Nowości (mały biały przycisk – bez tęczy przycisków w siatce smaków) ===== */
.nw figcaption .nw-buy{display:flex;width:max-content;align-items:center;margin:10px auto 0;padding:4px 12px;border-radius:999px;background:var(--action);color:var(--on-action);font-family:var(--font);font-stretch:var(--wd-text);font-weight:600;font-size:var(--fs-meta);line-height:1.4;letter-spacing:0;text-transform:none;text-decoration:none;vertical-align:middle;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (hover:hover){.nw figcaption .nw-buy:hover{background:var(--action-hover)}}
/* ===== WŁASNY ZESTAW (1.6.0): wejście do konfiguratora /zestaw/ ===== */
.wl{padding-block:clamp(32px,5vw,72px)}
.wl-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(22px,4vw,48px);border-radius:28px;border:1px solid var(--line-1);background:var(--surface-1)}
.wl-copy{display:grid;gap:18px;justify-items:start}
.wl .h2 em{font-style:normal;color:inherit}
.wl .lead b{color:var(--text-1)}
.wl-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;margin:0;padding:0}
.wl-tiers li{display:grid;gap:4px;padding:14px;border-radius:16px;border:1px solid var(--line-1);background:var(--surface-2)}
/* progi w 3 wąskich kolumnach: „−22%” w fs-num-xl nie mieści się (telefon i okna 900–1050 px), więc progi w fs-h3, a duża liczba tylko w pełnej szerokości „do −30%” */
.wl-tiers b{font-family:var(--font);font-stretch:var(--wd-text);font-weight:700;font-size:var(--fs-h3);line-height:1;letter-spacing:var(--ls-snug);font-variant-numeric:tabular-nums}
.wl-tiers .wl-max b{font-size:var(--fs-num-xl);letter-spacing:var(--ls-tight)}
@media (max-width:380px){.wl-tiers li{padding:12px 8px}}
.wl-tiers span{font-size:var(--fs-label);font-weight:600;line-height:1.4;color:var(--text-2);font-variant-numeric:tabular-nums}
.wl-tiers .wl-max{grid-column:1/-1;border-color:rgba(245,245,247,.32);background:var(--surface-3)}
.wl-tiers .wl-max b{color:var(--text-1)}
@media (max-width:899px){.wl-card{grid-template-columns:minmax(0,1fr)}.wl-tiers{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* dolny pasek z linkiem do konfiguratora (1.6.0): 4 pozycje + koszyk */
.mbar.mbar-4{grid-template-columns:repeat(4,minmax(0,1fr)) auto}