/* HORECA NP2 (07.10.2026) - nowy układ w stylu nieprzelewki.pl: biel, Inter Tight, czerń + czerwień.
   Sekcja KOMPONENTY na końcu = karty AI, ceny w lokalach, lightbox (renderuje je app.js). */
:root{
  --bg:#fff; --bg-2:#F5F4F1; --bg-3:#ECEAE5; --bg-4:#E2E0DA;
  --ink:#111; --ink-dim:#55504A; --ink-faint:#8F897F;
  --accent:#D6281C; --accent-2:#A81E14; --red:#D6281C; --green:#111;
  --line:rgba(17,17,17,.14); --line-2:rgba(17,17,17,.32);
  --sans:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(16px,4vw,64px); --hd:76px; --ease:cubic-bezier(.2,.7,.2,1);
  --t-h1:clamp(2.7rem,1.3rem + 5.4vw,7rem); --t-h2:clamp(2.1rem,1.3rem + 3vw,4.4rem); --t-h3:clamp(1.5rem,1.2rem + 1vw,2.1rem);
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hd) + 8px)}
body{font:400 1.0625rem/1.5 var(--sans);background:#fff;color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:#111;color:#fff;padding:10px 14px;z-index:200}
.skip:focus{left:8px}
.wrap{max-width:1600px;margin:0 auto;padding:0 var(--gut)}

/* typografia */
.meta{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
.h1{font-weight:400;font-size:var(--t-h1);line-height:.98;letter-spacing:-.05em;text-transform:uppercase;text-wrap:balance}
.h1 em,.h2 em{font-style:italic;font-weight:300;letter-spacing:-.04em}
.h2{font-weight:400;font-size:var(--t-h2);line-height:1;letter-spacing:-.04em;text-transform:uppercase;text-wrap:balance}
.h3{font-weight:400;font-size:var(--t-h3);line-height:1.1;letter-spacing:-.03em}
.lede{font-size:clamp(1.15rem,1.05rem + .4vw,1.45rem);line-height:1.4;letter-spacing:-.01em;max-width:34em;color:var(--ink)}
.p{font-size:1.0625rem;line-height:1.55;color:var(--ink-dim);max-width:38em}
.dot{display:inline-block;width:.42em;height:.42em;border-radius:50%;border:1.3px solid currentColor;margin-inline:.1em}

/* przyciski i linki */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 28px;background:#111;color:#fff;border:1px solid #111;font:500 .95rem/1 var(--sans);letter-spacing:-.005em;text-decoration:none;transition:background .2s,border-color .2s}
.btn:hover{background:var(--red);border-color:var(--red)}
.btn:disabled{opacity:.55;cursor:wait}
.btn--block{display:flex;width:100%;margin-top:20px}
.btn--big{min-height:60px;padding:0 40px;font-size:1.02rem}
.btn .btn-arrow{transition:transform .25s var(--ease)}
.btn:hover .btn-arrow{transform:translateX(4px)}
.tlink{position:relative;background:none;border:0;padding:.3em 0;font:400 1rem/1 var(--sans);letter-spacing:-.01em;text-decoration:none;color:var(--ink)}
.tlink::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:left;transition:transform .3s var(--ease)}
.tlink:hover::after{transform:scaleX(.35)}
.tlink--red{color:var(--red)}

/* HEADER */
.hd{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid transparent;transition:border-color .2s}
.hd.is-scrolled{border-bottom-color:var(--line-2)}
.hd__in{max-width:1600px;margin:0 auto;padding:0 var(--gut);height:var(--hd);display:flex;align-items:center;gap:clamp(16px,2.4vw,40px)}
.hd__logo{display:inline-flex;align-items:center;gap:.5em;font:500 .95rem/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.hd__tag{font:500 .7rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--red);padding:6px 8px;margin-left:-8px}
.hd__nav{display:flex;gap:clamp(18px,2.4vw,44px);margin-left:clamp(12px,3vw,64px);flex:1}
.hd__nav a{position:relative;font:400 1.04rem/1 var(--sans);letter-spacing:-.02em;text-decoration:none;padding:.4em 0;white-space:nowrap}
.hd__nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:currentColor;transition:right .3s var(--ease)}
.hd__nav a:hover::after,.hd__nav a.is-on::after{right:0}
.hd__act{display:flex;align-items:center;gap:clamp(14px,2vw,32px);margin-left:auto}
.np-lang{display:flex;align-items:center;gap:6px;font:400 .85rem/1 var(--sans);color:var(--ink-faint)}
.np-lang-btn{background:none;border:0;padding:6px 2px;color:var(--ink-faint);letter-spacing:.04em}
.np-lang-btn.active,.np-lang-btn:hover{color:var(--ink)}
.hd__cta{display:inline-flex;align-items:center;height:42px;padding:0 18px;background:#111;color:#fff;text-decoration:none;font:500 .92rem/1 var(--sans);white-space:nowrap;transition:background .2s}
.hd__cta:hover{background:var(--red)}
.hd__navcta{display:none}
.hd__burger{display:none;background:none;border:0;font:400 1.04rem/1 var(--sans);padding:.4em 0;letter-spacing:-.02em}

/* HERO */
.hero{padding:clamp(40px,6vw,96px) 0 0}
.hero__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,72px);align-items:end}
.hero__t .meta{margin-bottom:clamp(18px,2vw,28px)}
.hero__t .lede{margin-top:clamp(22px,2.4vw,36px)}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:20px 32px;margin-top:clamp(28px,3vw,44px)}
.hero__shelf{position:relative;display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:end;gap:0;padding-top:72px;min-height:100%}
.hero__b{display:flex;justify-content:center}
.hero__b img{width:auto;height:clamp(240px,30vw,460px);object-fit:contain}
.hero__b--l img,.hero__b--r img{height:clamp(200px,25vw,390px)}
.hero__b--l{transform:translateX(18%)}
.hero__b--r{transform:translateX(-18%)}
.hero__b--c{position:relative;z-index:2}
.hero__sign{position:absolute;top:0;right:0;width:auto;height:clamp(40px,3.6vw,56px)}
.hero__claim{grid-column:1/-1;margin-top:18px;text-align:center;font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #111;border-bottom:1px solid var(--line);margin-top:clamp(40px,5vw,80px)}
.facts li{padding:22px 20px 22px 0;display:flex;flex-direction:column;gap:6px}
.facts li+li{padding-left:20px;border-left:1px solid var(--line)}
.facts b{font-weight:400;font-size:clamp(1.6rem,1.2rem + 1.4vw,2.6rem);letter-spacing:-.04em;line-height:1}
.facts small{font-size:.5em;letter-spacing:0}
.facts span{font-size:.92rem;color:var(--ink-dim)}

/* PARTNERZY */
.partners{padding:clamp(48px,5vw,80px) 0 0}
.partners__head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.marquee{display:flex;overflow:hidden;margin-top:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);user-select:none}
.marquee__track{display:flex;align-items:center;flex:0 0 auto;min-width:100%;justify-content:space-around;animation:mq 60s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track li{flex:0 0 auto;height:108px;padding:0 clamp(22px,3vw,44px);display:grid;place-items:center}
.marquee__track img{max-height:54px;max-width:140px;width:auto;height:auto;object-fit:contain;filter:grayscale(1) contrast(1.05);mix-blend-mode:multiply;opacity:.8;transition:opacity .25s,filter .25s}
.marquee__track img:hover{opacity:1;filter:none}
@keyframes mq{to{transform:translateX(-100%)}}

/* SEKCJE */
.sec{padding:clamp(72px,9vw,150px) 0}
.sec--grey{background:var(--bg-2)}
.sec--black{background:#111;color:#fff}
.sec--black .meta,.sec--black .field__h{color:rgba(255,255,255,.62)}
.head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,4vw,72px);align-items:end;margin-bottom:clamp(36px,4.4vw,72px)}
.head__t .meta{margin-bottom:18px}
.legend{display:flex;gap:18px;margin-top:18px;font:500 .72rem/1 var(--sans);letter-spacing:.14em}
.legend span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#111;margin-right:8px;vertical-align:1px}
.legend span:nth-child(2)::before{background:transparent;border:1.5px solid #111}
.legend .is-red{color:var(--red)}
.legend .is-red::before{background:var(--red)}

/* KALKULATOR */
.seg{display:inline-flex;border:1px solid #111;margin-bottom:clamp(24px,3vw,40px)}
.seg__btn{background:#fff;border:0;padding:14px 26px;font:500 .95rem/1 var(--sans);letter-spacing:-.005em}
.seg__btn+.seg__btn{border-left:1px solid #111}
.seg__btn[aria-selected="true"]{background:#111;color:#fff}
.calc{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-top:1px solid #111}
.calc[hidden]{display:none}
.calc__in{padding:clamp(24px,3vw,44px) clamp(20px,3vw,48px) clamp(24px,3vw,44px) 0;display:flex;flex-direction:column;gap:30px;border-right:1px solid var(--line)}
.calc__out{padding:clamp(24px,3vw,44px) 0 clamp(24px,3vw,44px) clamp(20px,3vw,56px)}
.field{display:flex;flex-direction:column;gap:12px}
.field__l{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
.field__l i{font-style:normal;letter-spacing:.04em;text-transform:none;color:var(--ink-faint)}
.field__l b{font:400 1.6rem/1 var(--sans);letter-spacing:-.03em;text-transform:none;color:var(--ink)}
.sec--black .field__l{color:rgba(255,255,255,.62)}
.sec--black .field__l b{color:#fff}
.field__h{font-size:.88rem;color:var(--ink-faint);line-height:1.5}
.field__h a{color:var(--red)}
.kalk-tabs{display:flex;border:1px solid var(--line-2)}
.kalk-tab{flex:1;background:#fff;border:0;padding:13px 8px;font:500 .78rem/1 var(--sans);letter-spacing:.12em}
.kalk-tab+.kalk-tab{border-left:1px solid var(--line-2)}
.kalk-tab.active{background:#111;color:#fff}
.money{display:flex;align-items:baseline;gap:8px;border-bottom:1px solid #111;padding-bottom:6px}
.money input{flex:1;min-width:0;border:0;background:transparent;font:400 2.4rem/1 var(--sans);letter-spacing:-.04em;color:var(--ink);-moz-appearance:textfield}
.money input::-webkit-outer-spin-button,.money input::-webkit-inner-spin-button{-webkit-appearance:none}
.money input:focus{outline:none}
.money:focus-within{border-color:var(--red)}
.money span{font-size:1.1rem;color:var(--ink-dim)}
.pricing-unlocked .lock-hint{display:none}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:2px;background:#111}
input[type=range]::-moz-range-track{height:2px;background:#111}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #111;margin-top:-10px}
input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid #111}
input[type=range]:active::-webkit-slider-thumb{background:var(--red);border-color:var(--red)}
.sec--black input[type=range]::-webkit-slider-runnable-track{background:#fff}
.sec--black input[type=range]::-moz-range-track{background:#fff}
.sec--black input[type=range]::-webkit-slider-thumb{background:#111;border-color:#fff}
.scale{display:flex;justify-content:space-between;font-size:.8rem;color:var(--ink-faint)}
.sec--black .scale{color:rgba(255,255,255,.5)}
.ranges{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.ranges li{display:flex;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.ranges li:nth-child(odd){padding-right:14px;border-right:1px solid var(--line)}
.ranges li:nth-child(even){padding-left:14px}
.ranges span{color:var(--ink-dim)}
.ranges b{font-weight:500}
.big{font-weight:400;font-size:clamp(5rem,3rem + 8vw,11rem);line-height:.9;letter-spacing:-.06em;color:var(--red);margin-top:10px}
.big .metric-unit{font-size:.42em;letter-spacing:-.02em;margin-left:.06em}
.big.warn{color:#B86E00}
.big.danger{color:#111}
.bar{height:2px;background:var(--bg-3);margin:22px 0 28px}
.marza-bar-fill{height:100%;background:var(--red)!important;transition:width .4s var(--ease)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #111}
.kpis>div{padding:16px 16px 16px 0}
.kpis>div+div{padding-left:16px;border-left:1px solid var(--line)}
.kpis dt{font:500 .7rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
.kpis dd{font-size:clamp(1.5rem,1.2rem + 1vw,2.2rem);letter-spacing:-.04em;line-height:1.1;margin-top:8px}
.kpis .metric-unit{font-size:.55em;color:var(--ink-dim)}
.kpis .is-red dd{color:var(--red)}
.comp,.roi{margin-top:clamp(28px,3vw,44px)}
.comp .meta,.roi .meta{margin-bottom:12px}
.comp-row{display:grid;grid-template-columns:minmax(120px,1.1fr) 2fr 52px;align-items:center;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.comp-row span{color:var(--ink-dim)}
.comp-bar{height:6px;background:var(--bg-3);position:relative;overflow:hidden}
.comp-bar>*{position:absolute;inset:0 auto 0 0;background:#111!important}
.comp-val{text-align:right;font-weight:500}
.comp-row.is-np span,.comp-row.is-np .comp-val{color:var(--red)}
.comp-row.is-np .comp-bar>*{background:var(--red)!important}

/* ROCZNIE */
.year{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,96px);align-items:end}
.year__t .meta{margin-bottom:18px}
.year__t .field{margin-top:clamp(28px,3vw,44px)}
.year__t .field__h{margin-top:14px}
.year__out{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.4)}
.year__out>div{padding:22px 0 26px;border-bottom:1px solid rgba(255,255,255,.18)}
.year__out>div:nth-child(even){padding-left:24px;border-left:1px solid rgba(255,255,255,.18)}
.year__out dt{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.year__out dd{font-size:clamp(2rem,1.4rem + 2.4vw,4rem);letter-spacing:-.05em;line-height:1;margin-top:10px}
.year__out .is-red dd{color:#FF4A3D}

/* SMAKI */
.menu{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(20px,3vw,48px);align-items:start}
.flavour-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #111;border-left:1px solid var(--line)}
.flavour-card{display:flex;flex-direction:column;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;transition:background .2s}
.flavour-img-wrap{display:flex;justify-content:center;align-items:flex-end;height:clamp(220px,20vw,300px);padding:28px 0 4px}
.flavour-img{height:100%;width:auto;object-fit:contain;transition:transform .5s var(--ease)}
.flavour-card:hover .flavour-img{transform:translateY(-6px)}
.flavour-body{display:flex;flex-direction:column;gap:10px;padding:18px clamp(16px,1.6vw,24px) 22px;flex:1}
.flavour-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.flavour-name{font-weight:400;font-size:clamp(1.3rem,1.1rem + .6vw,1.7rem);letter-spacing:-.035em;line-height:1.05;text-transform:uppercase}
.flavour-cat{font:500 .66rem/1 var(--sans);letter-spacing:.14em;color:var(--ink-dim);white-space:nowrap}
.flavour-card[data-cat="EXCLUSIVE"] .flavour-cat{color:var(--red)}
.flavour-note{font-size:.93rem;line-height:1.5;color:var(--ink-dim)}
.flavour-uses{font-size:.85rem;color:var(--ink)}
.flavour-uses span{font:500 .66rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-right:4px}
.flavour-price{font-size:.95rem;font-weight:500}
.flavour-add{margin-top:auto;align-self:stretch;min-height:44px;background:#fff;border:1px solid #111;font:500 .88rem/1 var(--sans);transition:background .2s,color .2s}
.flavour-add:hover{background:#111;color:#fff}
.flavour-card.selected{background:var(--bg-2)}
.flavour-card.selected .flavour-add{background:var(--red);border-color:var(--red);color:#fff}
.menu__side{position:sticky;top:calc(var(--hd) + 20px)}
.cart-panel,.cart-empty{border-top:1px solid #111;padding-top:18px}
.cart-panel:not([hidden])+.cart-empty{display:none}
.cart-empty .p{margin-top:12px;font-size:.95rem}
.cart-head{display:flex;justify-content:space-between;align-items:baseline}
.cart-title{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase}
#cart-count{display:inline-grid;place-items:center;min-width:22px;height:22px;margin-left:6px;background:var(--red);color:#fff;border-radius:11px;font-size:.72rem;letter-spacing:0;padding:0 6px}
.cart-items{margin-top:14px;border-top:1px solid var(--line)}
.cart-item{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);font-size:1rem}
.cart-item .x{cursor:pointer;color:var(--ink-faint);font-size:1.2rem;line-height:1;padding:0 4px}
.cart-item .x:hover{color:var(--red)}
.cart-summary{margin-top:16px;font-size:.9rem;line-height:1.55;color:var(--ink-dim)}
.cart-summary strong{color:var(--ink);font-weight:500}
.cart-summary .accent{color:var(--red)}

/* Porterówka: szeroka karta zamyka siatkę (13 = 12 + 1) */
.flavour-card--wide{grid-column:1/-1;flex-direction:row;align-items:stretch}
.flavour-card--wide .flavour-img-wrap{flex:0 0 clamp(160px,22%,280px);height:auto;min-height:260px;padding:24px 0;align-items:center}
.flavour-card--wide .flavour-img{height:clamp(200px,18vw,260px)}
.flavour-card--wide .flavour-body{justify-content:center;max-width:620px;min-width:0;padding-left:0}
.flavour-card--wide .flavour-add{margin-top:10px;align-self:flex-start;padding:0 28px}
.flavour-card--wide .flavour-name{font-size:clamp(1.8rem,1.3rem + 1.4vw,2.6rem)}

/* CAŁY ROK - claim typograficzny */
.claim{display:flex;flex-direction:column;margin-top:clamp(20px,2.4vw,36px);font-weight:400;font-size:clamp(3rem,1rem + 9vw,11.5rem);line-height:.9;letter-spacing:-.06em;text-transform:uppercase}
.claim span:nth-child(2){padding-left:clamp(0px,12vw,240px)}
.claim em{font-style:italic;font-weight:300;letter-spacing:-.05em;color:var(--red);align-self:flex-end}
.claim__foot{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,4vw,72px);align-items:end;margin-top:clamp(36px,4vw,64px);padding-top:22px;border-top:1px solid #111}
.claim__foot .tlink{justify-self:end}
@media (max-width:1060px){.claim__foot{grid-template-columns:1fr}.claim__foot .tlink{justify-self:start}.claim em{align-self:flex-start}.claim span:nth-child(2){padding-left:0}}

/* SEZONY */
.quarters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #111}
.q{padding:22px clamp(14px,1.6vw,24px) 26px 0}
.q+.q{padding-left:clamp(14px,1.6vw,24px);border-left:1px solid var(--line-2)}
.q__n{font-size:clamp(2.4rem,1.6rem + 2.4vw,4.2rem);letter-spacing:-.05em;line-height:1}
.q__l{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:10px 0 18px}
.sezon-flavors{display:flex;flex-direction:column}
.sezon-item{display:flex;align-items:center;gap:12px;padding:4px 0;border-top:1px solid var(--line);font-size:.98rem}
.sezon-item img{width:18px;height:40px;object-fit:contain}

/* KOKTAJLE */
.sig{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #111}
.sig__i{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"n n p" "name name name" "rec rec rec" "note note note";gap:10px 16px;padding:24px clamp(16px,2vw,32px) 30px 0}
.sig__i+.sig__i{padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
.sig__n{grid-area:n;font:500 .72rem/1 var(--sans);letter-spacing:.14em;color:var(--ink-faint)}
.sig__p{grid-area:p;font-size:1.05rem;font-weight:500}
.sig__name{grid-area:name;font-weight:400;font-size:clamp(1.8rem,1.3rem + 1.6vw,3rem);letter-spacing:-.04em;line-height:1;text-transform:uppercase;margin-top:clamp(20px,3vw,48px)}
.sig__rec{grid-area:rec;font-size:.98rem;color:var(--ink-dim);line-height:1.6}
.sig__rec b{font-weight:500;color:var(--red)}
.sig__note{grid-area:note;font-size:.85rem;color:var(--ink-faint);font-style:italic}
.gen{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,72px);margin-top:clamp(64px,7vw,120px);padding-top:clamp(28px,3vw,44px);border-top:1px solid #111}
.gen__t .meta{margin-bottom:14px;color:var(--red)}
.gen__t .p{margin-top:16px}
.ai-form{display:flex;flex-direction:column;gap:26px}
.ai-field{display:flex;flex-direction:column;gap:12px}
.ai-chips{display:flex;flex-wrap:wrap;gap:8px}
.ai-chip{background:#fff;border:1px solid var(--line-2);padding:10px 14px;font:400 .92rem/1 var(--sans);letter-spacing:-.005em;transition:border-color .2s,background .2s,color .2s}
.ai-chip:hover{border-color:#111}
.ai-chip.active{background:#111;border-color:#111;color:#fff}
.ai-base-selected{font-size:.9rem;color:var(--ink-dim)}
.ai-base-selected strong{color:var(--red);font-weight:500}
.line-input{border:0;border-bottom:1px solid #111;background:transparent;padding:10px 0;font:400 1.1rem/1.2 var(--sans);color:var(--ink)}
.line-input:focus{outline:none;border-color:var(--red)}
#ai-submit{align-self:flex-start}

/* BENCHMARK */
.benchmark-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;background:var(--line);border:1px solid var(--line)}

/* DLACZEGO */
.why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #111}
.why li{padding:24px clamp(16px,2vw,32px) 36px 0;border-bottom:1px solid var(--line)}
.why li:not(:nth-child(3n+1)){padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
.why__n{font:500 .72rem/1 var(--sans);letter-spacing:.14em;color:var(--red)}
.why__h{font-weight:400;font-size:clamp(1.4rem,1.15rem + .8vw,1.9rem);letter-spacing:-.035em;line-height:1.1;margin:clamp(18px,2.4vw,40px) 0 12px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(48px,5vw,88px);border-top:1px solid #111}
.stats li{display:flex;flex-direction:column;gap:8px;padding:22px 18px 0 0}
.stats li+li{padding-left:18px;border-left:1px solid var(--line)}
.stats b{font-weight:400;font-size:clamp(2rem,1.4rem + 2vw,3.6rem);letter-spacing:-.05em;line-height:1}
.stats span{font-size:.95rem;color:var(--ink)}
.stats i{font-style:normal;font:500 .66rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}

/* PRÓBKI */
.order{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,96px);align-items:start}
.order__t{position:sticky;top:calc(var(--hd) + 24px)}
.order__t .meta{margin-bottom:18px}
.order__h{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:clamp(28px,3vw,44px) 0 10px}
.list li{padding:11px 0;border-bottom:1px solid var(--line);font-size:1rem}
.list li:first-child{border-top:1px solid #111}
.order__c{margin-top:28px;font-size:1rem;line-height:1.8}
.order__c a{text-decoration:none;border-bottom:1px solid currentColor}
.lead-form{background:#fff;padding:clamp(22px,3vw,48px);border:1px solid var(--line)}
.lead-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 28px;margin-bottom:30px}
.lead-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.lead-field-span2{grid-column:1/-1}
.lead-field label{font:500 .72rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim)}
.lead-field input,.lead-field textarea{width:100%;border:0;border-bottom:1px solid #111;background:transparent;padding:10px 0;font:400 1.05rem/1.3 var(--sans);color:var(--ink);border-radius:0}
.lead-field textarea{border:1px solid var(--line-2);padding:12px;resize:vertical}
.lead-field input:focus,.lead-field textarea:focus{outline:none;border-color:var(--red)}
.lead-field input.error,.lead-field textarea.error{border-color:var(--red)}
.lead-sep{font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#111;padding-top:18px;border-top:1px solid #111}
.lead-hint{font-size:.78rem;color:var(--ink-faint)}
.lead-consents{display:flex;flex-direction:column;gap:14px;margin-bottom:28px;padding:20px;background:var(--bg-2)}
.lead-checkbox{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font-size:.84rem;line-height:1.55;color:var(--ink-dim)}
.lead-checkbox input{width:18px;height:18px;margin-top:2px;accent-color:#111;flex-shrink:0}
.lead-message{margin-top:22px;padding:18px;border:1px solid;font-size:.95rem;line-height:1.6}
.lead-message.success{border-color:#111;color:#111;background:var(--bg-2)}
.lead-message.error{border-color:var(--red);color:var(--red);background:rgba(214,40,28,.05)}
.btn-spinner{width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}

/* MOBILNY PRZYCISK */
.mcta{display:none}

/* STOPKA */
.ft{border-top:1px solid #111;padding:clamp(48px,6vw,96px) 0 28px}
.ft__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:clamp(24px,4vw,64px)}
.ft__grid .meta{margin-bottom:12px}
.ft__grid p{line-height:1.7}
.ft__grid a{text-decoration:none}
.ft__grid a:hover{color:var(--red)}
.ft__links{display:flex;gap:24px;margin-top:18px}
.ft__word{margin:clamp(56px,8vw,128px) 0 20px;display:flex;align-items:center;gap:.25em;font:500 clamp(1.4rem,6.4vw,8rem)/1 var(--sans);letter-spacing:.3em;white-space:nowrap;overflow:hidden}
.ft__word .dot{width:.32em;height:.32em;border-width:.06em}
.ft__warn{font-size:.82rem;margin-bottom:14px}
.ft__bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px;font-size:.78rem;color:var(--ink-faint)}

/* RESPONSYWNOŚĆ */
@media (max-width:1240px){
  .hd__nav{gap:22px;margin-left:12px}
  .hd__nav a{font-size:.96rem}
  .menu{grid-template-columns:1fr}
  .menu__side{position:static;max-width:560px}
}
@media (max-width:1060px){
  :root{--hd:64px}
  .hd__burger{display:block}
  .hd__nav{position:fixed;inset:var(--hd) 0 auto 0;flex-direction:column;gap:0;margin:0;padding:8px var(--gut) 24px;background:#fff;border-bottom:1px solid #111;transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .2s,transform .2s,visibility .2s}
  .nav-open .hd__nav{opacity:1;visibility:visible;transform:none}
  .hd__nav a{font-size:1.6rem;letter-spacing:-.035em;padding:14px 0;border-bottom:1px solid var(--line)}
  .hd__nav a::after{display:none}
  .hd__nav .hd__navcta{display:block;color:var(--red);border-bottom:0}
  .hero__grid,.head,.calc,.year,.gen,.order{grid-template-columns:1fr}
  .hero__shelf{max-width:520px;margin:0 auto;width:100%}
  .calc__in{border-right:0;padding-right:0;border-bottom:1px solid var(--line)}
  .calc__out{padding-left:0}
  .order__t{position:static}
  .flavour-grid,.sig,.why,.benchmark-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sig__i:nth-child(3){grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid var(--line)}
  .why li:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .why li:nth-child(even){padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
  .quarters,.stats,.facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .q:nth-child(3){padding-left:0;border-left:0}
  .q:nth-child(n+3){border-top:1px solid var(--line-2)}
  .stats li:nth-child(3),.facts li:nth-child(3){padding-left:0;border-left:0}
  .stats li:nth-child(n+3){padding-top:22px;border-top:1px solid var(--line);margin-top:22px}
  .facts li:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:640px){
  .hd__logo{font-size:.78rem;letter-spacing:.22em}
  .hd__tag{font-size:.6rem;padding:5px 6px;margin-left:-4px}
  .hd__cta{display:none}
  .np-lang{font-size:.8rem}
  .hero__b img{height:min(62vw,300px)}
  .hero__b--l img,.hero__b--r img{height:min(52vw,250px)}
  .hero__cta .btn{flex:1}
  .hero__grid{gap:8px}
  .hero__shelf{padding-top:28px}
  .hero__sign{height:34px}
  .facts li{padding:16px 12px 16px 0}
  .facts li:nth-child(even){padding-left:12px}
  .partners__head{flex-direction:column;gap:8px}
  .marquee__track li{height:84px;padding:0 20px}
  .marquee__track img{max-height:40px;max-width:110px}
  .seg{display:flex}
  .seg__btn{flex:1;padding:14px 10px}
  .kpis dd{font-size:1.35rem}
  .kpis>div{padding-right:10px}
  .kpis>div+div{padding-left:10px}
  .comp-row{grid-template-columns:1fr 70px 44px;gap:10px;font-size:.88rem}
  .ranges{grid-template-columns:1fr}
  .ranges li:nth-child(odd){border-right:0;padding-right:0}
  .ranges li:nth-child(even){padding-left:0}
  .year__out dd{font-size:1.9rem}
  .year__out>div:nth-child(even){padding-left:14px}
  .flavour-img-wrap{height:200px;padding-top:18px}
  .flavour-body{padding:14px 12px 16px}
  .flavour-name{font-size:1.15rem}
  .flavour-note{font-size:.84rem}
  .flavour-uses{display:none}
  .flavour-card--wide{flex-direction:column}
  .flavour-card--wide .flavour-img-wrap{flex:none;min-height:0;height:220px;padding:18px 0 4px;align-items:flex-end}
  .flavour-card--wide .flavour-img{height:100%}
  .flavour-card--wide .flavour-body{padding:14px 12px 16px}
  .flavour-card--wide .flavour-add{align-self:stretch}
  .sig,.why,.benchmark-grid{grid-template-columns:1fr}
  .sig__i+.sig__i,.sig__i:nth-child(3){padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .why li:nth-child(even){padding-left:0;border-left:0}
  .lead-grid{grid-template-columns:1fr}
  .btn--big{width:100%}
  .ft__grid{grid-template-columns:1fr}
  .mcta{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:55;height:52px;align-items:center;justify-content:center;background:#111;color:#fff;text-decoration:none;font:500 .98rem/1 var(--sans);transition:transform .25s,opacity .25s}
  .mcta.is-hidden,.nav-open .mcta{transform:translateY(80px);opacity:0;pointer-events:none}
  .ft{padding-bottom:84px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee{overflow-x:auto}
  .marquee__track{animation:none}
  .marquee__track[aria-hidden]{display:none}
}

/* ================= KOMPONENTY renderowane przez app.js ================= */
.ai-result { margin-top: 48px; display: grid; gap: 24px; }
.ai-result-1 { grid-template-columns: minmax(0, 900px); }
.ai-result-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ai-result-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) {
  .ai-result-2, .ai-result-3 { grid-template-columns: 1fr; }
}

.ai-card {
  background: var(--bg-2);
  border: 1px solid var(--accent);
  padding: 36px;
  animation: slideIn 0.5s ease;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Thumbnail w rogu karty - kompaktowy kwadrat, klikalny */
.ai-card-thumb-row {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.ai-card-image {
  position: relative;
  flex: 0 0 200px;
  width: 200px;
  height: 200px;
  aspect-ratio: 1 / 1;
  background: var(--bg-3);
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  border: 1px solid var(--line);
}
.ai-card-image:hover { transform: scale(1.03); border-color: var(--accent); }
.ai-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.4s ease;
  opacity: 0;
}
.ai-card-image img[src] { opacity: 1; }
.ai-card-image::after {
  content: '⤢';
  position: absolute;
  bottom: 6px; right: 8px;
  font-size: 14px;
  color: var(--ink);
  background: rgba(10,10,10,0.75);
  padding: 2px 6px;
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
.ai-card-image:hover::after { opacity: 1; }

.ai-card-image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--bg-2) 0%, var(--bg-3) 50%, var(--bg-2) 100%);
  background-size: 200% 200%;
  animation: shimmer 2s ease-in-out infinite;
  cursor: default;
}
.ai-card-image-placeholder span {
  font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif;
  font-style: italic;
  color: var(--ink-faint);
  font-size: 10px;
  letter-spacing: 0.5px;
  text-align: center;
  padding: 0 8px;
}
.ai-card-image-placeholder::after { display: none; }
@keyframes shimmer {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

.ai-card-head { flex: 1; min-width: 0; }

@media (max-width: 700px) {
  .ai-card { padding: 24px; gap: 20px; }
  .ai-card-thumb-row { gap: 16px; flex-wrap: wrap; }
  .ai-card-image { flex: 0 0 140px; width: 140px; height: 140px; }
}

/* Lightbox - full screen overlay */
.image-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(10, 10, 10, 0.95);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  cursor: zoom-out;
}
.image-lightbox.open {
  opacity: 1;
  pointer-events: auto;
}
.image-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  animation: lightboxIn 0.35s ease;
}
@keyframes lightboxIn {
  from { transform: scale(0.92); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
.image-lightbox-close {
  position: absolute;
  top: 24px; right: 28px;
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--ink-dim);
  width: 44px;
  height: 44px;
  font-size: 22px;
  font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif;
  cursor: pointer;
  transition: all 0.25s ease;
}
.image-lightbox-close:hover { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.image-lightbox-caption {
  position: absolute;
  bottom: 24px; left: 50%;
  transform: translateX(-50%);
  color: var(--ink-dim);
  font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif;
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0.5px;
}
@keyframes slideIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

.ai-card-kicker { font-size: 11px; letter-spacing: 4px; text-transform: uppercase; color: var(--accent); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; margin-bottom: 14px; }
.ai-card h3 { font-size: clamp(32px, 4vw, 56px); letter-spacing: -0.025em; margin-bottom: 10px; }
.ai-subtitle { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-style: italic; font-size: 20px; color: var(--ink-dim); margin-bottom: 32px; padding-bottom: 32px; border-bottom: 1px solid var(--line); }

.ai-subhead { font-size: 11px; letter-spacing: 3px; text-transform: uppercase; color: var(--accent); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-weight: 500; margin-bottom: 12px; }

.ai-recipe { margin-bottom: 32px; }
.ai-recipe ul { list-style: none; }
.ai-recipe li {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  color: var(--ink);
}
.ai-recipe li:last-child { border-bottom: none; }

.ai-specs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 32px; padding: 24px; background: var(--bg-3); border: 1px solid var(--line); }
@media (max-width: 700px) { .ai-specs { grid-template-columns: 1fr; } }
.ai-spec { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13px; }
.ai-spec span { color: var(--ink-dim); text-transform: uppercase; letter-spacing: 1.5px; font-size: 11px; font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; }
.ai-spec b { color: var(--ink); font-weight: 500; text-align: right; }

.ai-finance { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--line); border: 1px solid var(--line); margin-bottom: 32px; }
@media (max-width: 700px) { .ai-finance { grid-template-columns: 1fr; } }
.ai-fin-metric { background: var(--bg-3); padding: 20px; }
.ai-fin-metric span { display: block; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--ink-dim); margin-bottom: 8px; font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; }
.ai-fin-metric b { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-size: 28px; font-weight: 700; color: var(--ink); }
.ai-fin-metric.big b { color: var(--accent); font-size: 40px; }

.ai-serving p { font-size: 16px; line-height: 1.75; color: var(--ink); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-style: italic; }

/* =============== BENCHMARK =============== */
.bench-card {
  background: var(--bg-3);
  border: 1px solid var(--line);
  padding: 32px;
  perspective: 1000px;
  position: relative;
  cursor: pointer;
  transition: border-color 0.25s ease;
  min-height: 380px;
}
.bench-card:hover { border-color: var(--accent); }

.bench-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.7s ease;
  transform-style: preserve-3d;
}
.bench-card.flipped .bench-card-inner { transform: rotateY(180deg); }
.bench-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; display: flex; flex-direction: column; gap: 16px; }
.bench-face-back { transform: rotateY(180deg); }

.bench-miasto { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--accent); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; }
.bench-nazwa { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-size: 28px; font-weight: 700; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1; }
.bench-segment { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-style: italic; font-size: 15px; color: var(--ink-dim); line-height: 1.5; }
.bench-prices { margin-top: auto; border-top: 1px solid var(--line); padding-top: 20px; }
.bench-price-row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 13px; }
.bench-price-row span { color: var(--ink-dim); }
.bench-price-row b { color: var(--ink); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-weight: 700; }
.bench-flip-hint { margin-top: 16px; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--ink-faint); text-align: right; font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; }
.bench-relacja { display: inline-block; padding: 4px 10px; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--bg); background: var(--green); font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-weight: 700; margin-top: 8px; }
.bench-relacja-prospect { background: var(--line-2); color: var(--ink-dim); }

.bench-face-back .bench-drink { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-size: 22px; font-weight: 700; color: var(--accent); text-transform: uppercase; margin-bottom: 8px; }
.bench-face-back .bench-drink-uzasadnienie { font-size: 14px; color: var(--ink-dim); line-height: 1.6; }
.bench-face-back .bench-finance { margin-top: 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.bench-face-back .bench-fin-metric { background: var(--bg-2); padding: 12px; text-align: center; }
.bench-face-back .bench-fin-metric span { display: block; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--ink-dim); margin-bottom: 4px; font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; }
.bench-face-back .bench-fin-metric b { font-family: 'Inter Tight', 'Helvetica Neue', Arial, sans-serif; font-size: 18px; color: var(--accent); }

/* korekty komponentów pod nowy układ */
.ai-card{background:#fff;border:1px solid #111;border-radius:0;letter-spacing:0;font-size:.95rem}
.ai-card h3{font-weight:400;letter-spacing:-.04em;text-transform:uppercase}
.ai-subtitle{font-size:1.1rem}
.ai-card-kicker,.ai-subhead{letter-spacing:.14em;color:var(--red)}
.ai-specs,.ai-fin-metric{background:var(--bg-2)}
.ai-fin-metric b{font-weight:400;letter-spacing:-.03em}
.ai-fin-metric.big b{color:var(--red)}
.image-lightbox-close{color:#fff;border-color:rgba(255,255,255,.5)}
.image-lightbox-caption{color:rgba(255,255,255,.75)}
.bench-card{background:#fff;border:0;min-height:400px;padding:clamp(22px,2.4vw,36px)}
.bench-card:hover{border-color:transparent;background:#fff}
.bench-miasto{letter-spacing:.14em;color:var(--ink-dim)}
.bench-nazwa{font-weight:400;font-size:clamp(1.6rem,1.2rem + 1vw,2.2rem);letter-spacing:-.04em}
.bench-segment{font-style:normal;font-size:.95rem}
.bench-price-row{font-size:.95rem;padding:9px 0;border-bottom:1px solid var(--line)}
.bench-price-row b{font-weight:500}
.bench-relacja{background:#111;letter-spacing:.14em;font-weight:500;align-self:flex-start}
.bench-flip-hint{letter-spacing:.14em;color:var(--red)}
.bench-face-back .bench-drink{font-weight:400;letter-spacing:-.03em;color:var(--red)}
.bench-face-back .bench-fin-metric{background:var(--bg-2)}
.bench-face-back .bench-fin-metric b{color:var(--ink);font-weight:500}
@media (max-width:640px){.bench-card{min-height:420px}}