/* Ja sam(a)! – wygląd strony sklepu (wersja 1.3.0, zgodna z projektem „Miękko”) */
:root{--kreda:#F4F2ED;--biel:#FFFFFF;--kamien:#E9E6DF;--ink:#1C2042;--ink2:#55596E;--bl:#C0DBFF;--mg:#E5EFFD;--pe:#FFE8C0;--pr:#FDE3DB;--cy:#FFFBA7;--rose:#C23D5A;--blink:#2F5BC2;--studio:#EDEEF0;
--m:max(16px, env(safe-area-inset-left));--mr:max(16px, env(safe-area-inset-right));--g:14px;--r:32px;
--disp:'Funnel Display',sans-serif;--text:'Onest',system-ui,sans-serif;--hand:'Shantell Sans',cursive;
--s-small:.9375rem;--s-body:clamp(1.0313rem,1rem + .15vw,1.125rem);--s-lead:clamp(1.2rem,1.05rem + .6vw,1.55rem);--s-head:clamp(2rem,1.3rem + 2.8vw,4rem);--s-display:clamp(2.3rem,1.4rem + 3.6vw,5rem);
--ease:cubic-bezier(0.22,1,0.36,1);--spring:cubic-bezier(0.34,1.4,0.64,1)}
@media (min-width:900px){:root{--m:max(24px, env(safe-area-inset-left));--mr:max(24px, env(safe-area-inset-right));--g:16px}}
*{box-sizing:border-box;margin:0}
body{background:var(--kreda);color:var(--ink);font:400 var(--s-body)/1.55 var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--disp);font-weight:700;letter-spacing:-0.035em;line-height:.96}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.wrap{padding:0 var(--mr) 0 var(--m)}
.mk{font-family:var(--hand);font-weight:800;letter-spacing:-0.01em;color:var(--rose);position:relative;display:inline-block;isolation:isolate;white-space:nowrap}
.mk::before{content:"";position:absolute;left:-.1em;right:-.12em;bottom:.06em;height:.42em;background:var(--pr);z-index:-1;border-radius:.3em .5em .25em .6em;transform:rotate(-2deg)}
.mk.b{color:var(--blink)}.mk.b::before{background:var(--bl)}
.ic{width:30px;height:30px;flex:none}
.btn{display:inline-flex;align-items:center;gap:.6em;border:0;border-radius:999px;padding:1em 1.6em;min-height:52px;font:600 var(--s-body)/1 var(--text);cursor:pointer;text-decoration:none;transition:transform 180ms var(--spring),background-color 200ms ease}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:scale(.96)}
.btn-ink{background:var(--ink);color:#fff}.btn-ink:hover{background:#2C3160}
.btn-soft{background:var(--biel);color:var(--ink)}
.btn svg{width:1.1em;height:1.1em}
.logo{display:inline-flex;align-items:flex-end;text-decoration:none}
.logo b{font:800 28px/.74 var(--disp);letter-spacing:-0.045em}
.logo i,.biglogo i{font:800 .78em/.7 var(--hand);font-style:normal;color:var(--rose);margin-left:.04em;transform:rotate(-6deg) translateY(-.04em);display:inline-block}
.logo i{font-size:23px}
.logo svg{width:10px;height:25px;margin-left:3px;--lg:#1C2042}

nav.top{position:sticky;top:12px;z-index:20;margin:12px var(--mr) 0 var(--m);background:var(--biel);border-radius:999px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 10px 10px 26px}
nav.top ul{display:flex;gap:6px;list-style:none;padding:0}
nav.top ul a{display:block;padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:500;transition:background-color 200ms ease}
nav.top ul a:hover{background:var(--kreda)}
nav.top .btn{min-height:44px;padding:.7em 1.2em}
@media (max-width:899px){nav.top ul{display:none}}

.hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:minmax(0,1fr) auto;gap:var(--g);margin-top:var(--g);min-height:calc(100svh - 96px)}
.card{border-radius:var(--r);overflow:hidden;position:relative}
.hb-logo{grid-column:1 / span 7;grid-row:1;background:var(--kamien);padding:clamp(24px,3.6vw,56px);display:flex;flex-direction:column;justify-content:space-between;gap:32px;min-height:440px}
.hb-logo .meta{display:flex;justify-content:space-between;gap:16px;font-weight:500;font-size:var(--s-small);flex-wrap:wrap}
.biglogo{display:flex;align-items:flex-end}
.biglogo b{font:800 clamp(5.2rem,1.5rem + 12vw,15rem)/.78 var(--disp);letter-spacing:-0.055em}
.biglogo i{font-size:clamp(4rem,1.2rem + 9vw,11.5rem)}
.biglogo svg{width:clamp(28px,4vw,62px);height:clamp(76px,11vw,170px);margin-left:clamp(10px,2vw,36px);--lg:#1C2042;flex:none}
.hb-photo{grid-column:8 / span 5;grid-row:1;background:var(--studio);min-height:440px}
.hb-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sticker{position:absolute;left:clamp(18px,2.4vw,32px);top:clamp(18px,2.4vw,32px);background:var(--cy);padding:8px 18px 12px;border-radius:16px;font:800 clamp(1.4rem,1rem + 1.2vw,2.2rem)/1 var(--hand);transform:rotate(-4deg);transition:transform 400ms var(--spring)}
.hb-photo:hover .sticker{transform:rotate(-1deg) scale(1.04)}
.hb-title{grid-column:1 / span 5;grid-row:2;background:var(--mg);padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;justify-content:flex-end;gap:16px}
.hb-title h1{font-size:clamp(2.2rem,1.4rem + 2.2vw,3.6rem)}
.hb-title p{font-size:var(--s-body);max-width:36ch}
.hb-buy{grid-column:6 / span 3;grid-row:2;background:var(--pe);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:24px}
.hb-buy .ics{display:flex;gap:28px;padding-top:12px}
.hb-buy .ics svg{width:72px;height:72px;color:var(--ink)}
.hb-buy .pr{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}
.hb-buy .price{font:700 2rem/1 var(--disp);letter-spacing:-0.02em}
.hb-buy .btn{width:100%;justify-content:center}
.hb-facts{grid-column:9 / span 4;grid-row:2;background:var(--cy);padding:clamp(24px,3vw,44px);display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.hb-facts p{font-weight:500;line-height:1.5;max-width:30ch}
.dots{display:flex;gap:10px;flex:none}.dots i{width:34px;height:34px;border-radius:50%}
@media (max-width:1099px){.hb-title{grid-column:1 / span 6}.hb-buy{grid-column:7 / span 6}.hb-facts{grid-column:1 / -1;grid-row:3}}
@media (max-width:899px){.hero{grid-template-rows:auto;min-height:0}.hb-logo,.hb-photo,.hb-title,.hb-buy,.hb-facts{grid-column:1 / -1;grid-row:auto}.hb-logo{min-height:0}.hb-photo{aspect-ratio:1;min-height:0}.hb-buy{flex-direction:row;align-items:center}.hb-buy .ics svg{width:48px;height:48px}.hb-buy .ics{gap:14px;padding:0}.hb-buy .pr{width:auto;align-items:flex-end}.dots i{width:26px;height:26px}}
@media (max-width:899px){.h-main,.h-photo{grid-column:1 / -1}.h-main{min-height:0}.h-photo{aspect-ratio:1;min-height:0}}

.sec{margin-top:clamp(96px,10vw,160px)}
.sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,3vw,44px)}
.sec-h h2{font-size:var(--s-head);max-width:20ch}
.sec-h p{max-width:34ch;color:var(--ink2);font-size:var(--s-lead);line-height:1.4}

.gain-h{display:flex;flex-direction:column;gap:14px;margin-bottom:clamp(28px,3vw,44px)}
.gain-h .note{font:800 clamp(1.3rem,1.1rem + .6vw,1.7rem)/1 var(--hand);color:var(--rose);transform:rotate(-2deg);transform-origin:left;margin-bottom:6px}
.gain-h h2{font-size:var(--s-head);max-width:24ch}
.gain-h .lead{font-size:var(--s-lead);color:var(--ink2);line-height:1.4}
.gains{list-style:none;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g)}
.gains li{padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;justify-content:flex-start;gap:22px;min-height:0;transition:transform 400ms var(--spring)}
.gains li:hover{transform:translateY(-6px)}
.gains .g1{grid-column:1 / span 6}.gains .g2{grid-column:7 / span 6}.gains .g3{grid-column:1 / span 4}.gains .g4{grid-column:5 / span 4}.gains .g5{grid-column:9 / span 4}
.gi{width:84px;height:84px;border-radius:50%;background:var(--biel);display:grid;place-items:center;flex:none;transition:transform 500ms var(--spring)}
.gains li:hover .gi{transform:rotate(-8deg) scale(1.06)}
.gi svg{width:46px;height:46px;color:var(--ink)}
.gains h3{font-size:clamp(1.7rem,1.2rem + 1.4vw,2.6rem);line-height:1}
.gh{display:flex;align-items:center;gap:16px}
.gh .gi{width:64px;height:64px}.gh .gi svg{width:36px;height:36px}
.gains p{margin-top:0;font-size:var(--s-body);line-height:1.5;color:var(--ink);max-width:44ch}
.gains p b{font-weight:600}
.gain-end{margin-top:var(--g);background:var(--biel);padding:clamp(22px,2.6vw,36px);display:flex;align-items:center;gap:24px;font:500 var(--s-lead)/1.35 var(--disp);letter-spacing:-0.01em}
.gain-end .gi{background:var(--kreda);width:72px;height:72px}
.gain-end .gi svg{width:38px;height:38px}
.gain-end b{font-weight:700}
@media (max-width:899px){.gains li{grid-column:1 / -1!important;min-height:0;gap:28px}.gi{width:68px;height:68px}.gi svg{width:38px;height:38px}.gain-end{align-items:flex-start}}

.steps-nav{display:flex;gap:8px}
.steps-nav button{width:52px;height:52px;border-radius:50%;border:0;background:var(--biel);cursor:pointer;display:grid;place-items:center;transition:transform 180ms var(--spring)}
.steps-nav button:active{transform:scale(.92)}
.steps-nav svg{width:22px;height:22px}
.steps-nav .prev svg{transform:scaleX(-1)}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw,420px);gap:var(--g);overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--mr) 8px var(--m);margin:0 calc(-1 * var(--mr)) 0 calc(-1 * var(--m));scrollbar-width:none;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{display:none}
.st{scroll-snap-align:start;background:var(--biel);padding:14px;display:flex;flex-direction:column;gap:16px}
.st .ph{border-radius:22px;overflow:hidden;aspect-ratio:1}
.st .ph img{width:100%;height:100%;object-fit:cover}
.st .t{padding:4px 10px 12px;display:flex;flex-direction:column;gap:8px}
.st .n{font:800 1rem/1 var(--disp);width:36px;height:36px;border-radius:50%;display:grid;place-items:center}
.st h3{font-size:1.75rem}
.st p{color:var(--ink2)}

.box{background:var(--biel);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g);padding:var(--g)}
.box .ph{grid-column:1 / span 6;border-radius:24px;overflow:hidden;background:var(--studio)}
.box .ph img{width:100%;height:100%;object-fit:cover}
.box .t{grid-column:7 / span 6;padding:clamp(20px,3.5vw,52px);display:flex;flex-direction:column;gap:28px}
.box h2{font-size:var(--s-head)}
.box ul{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.box li{display:flex;gap:12px;align-items:center;font-weight:500;line-height:1.3}
@media (max-width:899px){.box .ph,.box .t{grid-column:1 / -1}.box ul{grid-template-columns:1fr}}

.proud{background:var(--pr);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g);padding:clamp(28px,4vw,64px);align-items:center}
.proud .q{grid-column:1 / span 7;display:flex;flex-direction:column;gap:6px}
.proud .q span{font:800 clamp(2.6rem,1.2rem + 4.4vw,6rem)/1.05 var(--hand);letter-spacing:-0.015em}
.proud .q span:nth-child(1){color:var(--blink)}
.proud .q span:nth-child(2){color:var(--rose);padding-left:clamp(20px,6vw,120px)}
.proud .q p{margin-top:18px;max-width:40ch;font-size:var(--s-lead);line-height:1.4}
.proud .ph{grid-column:9 / span 4;border-radius:14px;overflow:hidden;transform:rotate(2.5deg);background:var(--kreda);transition:transform 500ms var(--spring)}
.proud .ph:hover{transform:rotate(0deg) scale(1.02)}
.proud .ph img{width:100%}
@media (max-width:899px){.proud .q,.proud .ph{grid-column:1 / -1}}

.gift{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g)}
.gift .ph{grid-column:1 / span 7;min-height:480px;background:#d9c09a}
.gift .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gift .t{grid-column:8 / span 5;background:var(--pe);padding:clamp(28px,3.5vw,52px);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.gift h2{font-size:clamp(2rem,1.3rem + 2.2vw,3.4rem)}
.gift p{font-size:var(--s-lead);line-height:1.4}
@media (max-width:899px){.gift .ph,.gift .t{grid-column:1 / -1}.gift .ph{min-height:0;aspect-ratio:4/3}}

.faq{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g)}
.faq h2{grid-column:1 / span 4;font-size:var(--s-head)}
.faq .list{grid-column:5 / span 8;display:grid;gap:10px}
.faq details{background:var(--biel);border-radius:24px}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:22px 26px;font:700 1.2rem/1.25 var(--disp);letter-spacing:-0.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:22px;height:22px;flex:none;transition:transform 300ms var(--spring)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq details p{padding:0 26px 24px;color:var(--ink);max-width:62ch}
.faq details p + p{margin-top:-12px}
@media (max-width:899px){.faq h2,.faq .list{grid-column:1 / -1}}

:root{--navy:#1C2042;--on:#FFFFFF;--on2:#BCC0D8;--rose-l:#F59CB1}
.flogo{display:flex;align-items:flex-end;color:var(--on);font-size:var(--fs,18vw);line-height:1;white-space:nowrap;text-decoration:none;width:max-content}
.flogo b{font:800 1em/1 var(--disp);letter-spacing:-0.055em}
.flogo i{font:800 .78em/1 var(--hand);font-style:normal;color:var(--rose-l);display:inline-block;margin-left:.04em;transform:rotate(-6deg) translateY(-.04em);transition:transform 500ms var(--spring)}
.flogo svg{width:.17em;height:.47em;margin-left:.12em;flex:none;--lg:#FFFFFF;overflow:visible}
.flogo:hover i{transform:rotate(4deg) translateY(-.08em) scale(1.06)}
.fit{display:block}
.btn-cy{background:var(--cy);color:var(--ink)}.btn-cy:hover{background:#FFF27A}
.leg2{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;font-size:var(--s-small);color:var(--on2)}
.leg2 a{color:var(--on2);text-decoration:none}.leg2 a:hover{color:var(--on)}
.leg2 nav{display:flex;gap:20px;flex-wrap:wrap}



/* F3 */
.f3{margin:clamp(120px,12vw,200px) var(--mr) 16px var(--m);background:var(--navy);color:var(--on);border-radius:var(--r);padding:clamp(28px,4vw,64px) clamp(24px,4vw,64px) clamp(22px,2.6vw,36px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(32px,4vw,56px);overflow:hidden}
.f3 .pills{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.f3 .pills a{background:var(--f);color:var(--ink);text-decoration:none;border-radius:999px;padding:11px 18px;font-weight:500;transition:transform 220ms var(--spring)}
.f3 .pills a:hover{transform:translateY(-3px) rotate(-2deg)}
.f3 .big{display:flex;justify-content:center;width:100%}
.f3 .flogo i{opacity:0;transform:rotate(-30deg) translateY(.3em) scale(.4);transition:opacity 400ms var(--ease) 500ms,transform 700ms var(--spring) 500ms}
.f3.in .flogo i,.no-js .f3 .flogo i{opacity:1;transform:rotate(-6deg) translateY(-.04em)}
.f3 .flogo svg path{transform-box:fill-box;transform-origin:center}
.f3.in .flogo svg path{animation:beat 900ms var(--ease) 1100ms 2}
.f3 .flogo:hover svg path{animation:beat 700ms var(--ease) infinite}
@keyframes beat{0%,100%{scale:1}30%{scale:1.25}55%{scale:.95}}
.f3 .hand{font:800 clamp(1.4rem,1.1rem + 1vw,2.1rem)/1.2 var(--hand);color:var(--cy);transform:rotate(-2deg)}
.f3 .row{display:flex;align-items:center;justify-content:center;gap:16px 28px;flex-wrap:wrap}
.f3 .mail{color:var(--on);font-weight:600;text-decoration:none}.f3 .mail:hover{color:var(--cy)}
.f3 .leg2{width:100%}
@media (prefers-reduced-motion:reduce){.f3 .flogo i{opacity:1;transform:rotate(-6deg) translateY(-.04em);transition:none}.f3.in .flogo svg path,.f3 .flogo:hover svg path{animation:none}.flogo i,.f3 .pills a{transition:none}}


/* P2 wielkie słowa */
.o2{background:var(--cy);padding:clamp(32px,5vw,80px);display:flex;flex-direction:column;gap:clamp(28px,3.4vw,48px)}
.o2 .hd{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap}
.o2 h2{font-size:var(--s-head)}
.o2 .hand{font:800 clamp(1.3rem,1.1rem + .7vw,1.8rem)/1.2 var(--hand);color:var(--blink);transform:rotate(-2deg)}
.o2 .words{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px 30px;font:700 clamp(1.7rem,1rem + 2.4vw,3.3rem)/1.15 var(--disp);letter-spacing:-0.035em}.o2 .words li{display:flex;align-items:center;gap:.28em}
.o2 .words span{white-space:nowrap;transition:color 200ms ease}
.o2 .words span:hover{color:var(--rose)}
.o2 .words svg{width:.46em;height:.46em;flex:none;color:#E23B32;transition:transform 400ms var(--spring)}.o2 .words li:hover svg{transform:scale(1.3) rotate(-10deg)}
.o2 .end{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;background:var(--biel);border-radius:999px;padding:12px 12px 12px clamp(22px,3vw,36px)}
.o2 .end p{font:600 var(--s-lead)/1.3 var(--disp);letter-spacing:-0.015em}
@media (max-width:899px){.o2 .end{border-radius:24px;padding:20px}.o2 .words{font-size:clamp(1.5rem,1rem + 3vw,2.2rem);gap:4px 20px}}
/* oryginalne hero „Miękko” (do porównania) */
.ohero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g);margin-top:var(--g)}
.o-main{grid-column:1 / span 7;background:var(--biel);padding:clamp(22px,4vw,60px);display:flex;flex-direction:column;justify-content:space-between;gap:32px;min-height:min(78dvh,760px)}
.o-main h2{font-size:var(--s-display)}
.o-main p{font-size:var(--s-lead);color:var(--ink2);max-width:28ch;line-height:1.4}
.o-namer{display:flex;flex-direction:column;gap:10px}
.o-namer label{font-weight:600}
.o-namer .row{display:flex;gap:10px;flex-wrap:wrap}
.o-namer input{flex:1 1 200px;min-width:0;min-height:56px;border:0;border-radius:999px;background:var(--kreda);padding:0 24px;font:700 1.25rem/1 var(--hand);outline-offset:3px}
.o-namer input::placeholder{color:#8A8C99}
.o-facts{display:flex;gap:22px;flex-wrap:wrap;color:var(--ink2);font-size:var(--s-small)}
.o-facts span{display:flex;align-items:center;gap:8px}
.o-facts .ic{width:24px;height:24px;color:var(--ink)}
.o-photo{grid-column:8 / span 5;background:var(--studio);min-height:420px}
.o-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.o-tag{position:absolute;right:28px;top:28px;background:var(--biel);border-radius:22px;padding:16px 22px 18px;transform:rotate(3deg);transition:transform 380ms var(--spring)}
.o-tag b{font:700 1.5rem/1.15 var(--hand);color:var(--ink);max-width:14ch;overflow-wrap:anywhere;display:block}
.o-tag em{font-style:normal;font-weight:800;color:var(--rose)}
.o-tag.pop{transform:rotate(-2deg) scale(1.06)}
.o-tag::before{content:"";position:absolute;left:50%;top:-10px;width:12px;height:12px;border-radius:50%;background:var(--kreda);transform:translateX(-50%)}
@media (max-width:899px){.o-main,.o-photo{grid-column:1 / -1}.o-main{min-height:0}.o-photo{aspect-ratio:1;min-height:0}}
/* hero A4 */
.hx{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g);margin-top:var(--g)}
.hx-tx{grid-column:1 / span 6;background:var(--kamien);padding:clamp(26px,3.6vw,56px);display:flex;flex-direction:column;justify-content:center;gap:20px}
.hx h1{font-size:clamp(2.2rem,1.2rem + 3vw,4.4rem)}
.hx .lede{font-size:var(--s-lead);line-height:1.4;max-width:32ch}
.hx .buy{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hx .price{font:700 1.6rem/1 var(--disp);letter-spacing:-0.02em}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chips span{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 14px 8px 10px;font-size:var(--s-small);font-weight:500;background:var(--f,var(--biel))}
.chips .ic{width:22px;height:22px;color:var(--ink)}
.hx-ph{grid-column:7 / span 6;background:#D9D9D9}
.hx-ph img{width:100%;height:auto}
.stlogo{position:absolute;left:24px;top:24px;display:inline-flex;align-items:flex-end;background:var(--cy);padding:14px 22px 12px;border-radius:16px;transform:rotate(-4deg);transition:transform 400ms var(--spring)}
.hx-ph:hover .stlogo{transform:rotate(-1deg) scale(1.04)}
.stlogo b{font:800 clamp(1.9rem,1.3rem + 1.6vw,3rem)/.76 var(--disp);letter-spacing:-0.05em}
.stlogo i{font:800 clamp(1.5rem,1rem + 1.2vw,2.3rem)/.7 var(--hand);font-style:normal;color:var(--rose);display:inline-block;transform:rotate(-6deg);margin-left:.04em}
.stlogo svg{width:clamp(10px,.9vw,14px);height:clamp(28px,2.4vw,38px);margin-left:clamp(6px,.6vw,9px);--lg:#1C2042;flex:none}
@media (max-width:899px){.hx-tx,.hx-ph{grid-column:1 / -1}.hx-ph{order:-1}}
.js .rv{opacity:0;transform:translateY(26px) scale(.985);transition:opacity 700ms var(--ease),transform 800ms var(--spring);transition-delay:var(--d,0ms)}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}.tag,.sk,.btn{transition:none}}
@media (max-width:560px){.o2 .words span{white-space:normal}.o2 .words li{align-items:flex-start}.o2 .words svg{margin-top:.3em}}

/* ===== dopracowanie ===== */
:root{interpolate-size:allow-keywords}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
main section[id],#f3{scroll-margin-top:92px}
::selection{background:var(--cy);color:var(--ink)}
.btn svg{transition:transform 260ms var(--spring)}
.btn:hover svg{transform:translateX(3px)}
.btn-soft{background:var(--biel);color:var(--ink)}.btn-soft:hover{background:var(--kamien)}
.btn-soft svg{width:1.2em;height:1.2em}.btn-soft:hover svg{transform:none}
/* nawigacja */
nav.top{transition:padding 300ms var(--ease)}
nav.top ul a.on{background:var(--kreda)}
nav.top .cart{gap:.55em;padding-right:.9em}
nav.top .cart svg{width:1.15em;height:1.15em}
nav.top .cart:hover svg{transform:none}
.cnt{display:inline-grid;place-items:center;min-width:1.7em;height:1.7em;padding:0 .4em;border-radius:999px;background:var(--cy);color:var(--ink);font:700 .82rem/1 var(--text)}
.cnt.bump{animation:bump 600ms var(--spring)}
@keyframes bump{0%{transform:scale(1)}35%{transform:scale(1.45)}100%{transform:scale(1)}}
@media (max-width:480px){nav.top .cart .lbl{display:none}}
/* hero */
.hx h1{font-size:clamp(2.3rem,1.1rem + 3.2vw,4.4rem)}
.hx-tx{gap:22px}
.hx .price{font-size:clamp(1.6rem,1.3rem + .8vw,2.1rem)}
.stlogo{animation:floaty 5s ease-in-out infinite}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -6px}}
.hx-ph:hover .stlogo{animation-play-state:paused}
/* kroki */
.st{transition:transform 400ms var(--spring)}
.st:hover{transform:translateY(-6px)}
.st .ph{background:var(--kreda)}
.st .ph img{object-fit:contain}
.st h3{margin-top:2px}
.st p{line-height:1.5}
.steps-nav button{transition:transform 180ms var(--spring),opacity 200ms ease,background-color 200ms ease}
.steps-nav button:hover{background:var(--kamien)}
.steps-nav button[disabled]{opacity:.35;cursor:default}
.track.drag{cursor:grabbing;scroll-snap-type:none}
.track.drag *{pointer-events:none}
@media (hover:hover) and (pointer:fine){.track{cursor:grab}}
.prog{display:flex;gap:8px;justify-content:center;margin-top:22px}
.prog i{width:8px;height:8px;border-radius:999px;background:var(--kamien);transition:width 400ms var(--spring),background-color 300ms ease}
.prog i.on{width:28px;background:var(--ink)}
/* w pudełku */
.box .ph{display:grid;place-items:center}
.box .ph img{object-fit:contain}
.box h2{max-width:16ch}
.box ul{gap:14px 18px}
.box li{font-size:1.05rem}
.box li .ic{width:44px;height:44px;padding:8px;border-radius:50%;background:var(--kreda);transition:transform 400ms var(--spring),background-color 300ms ease}
.box li:hover .ic{transform:rotate(-10deg) scale(1.08);background:var(--cy)}
.box-buy{display:flex;align-items:center;gap:16px 20px;flex-wrap:wrap;margin-top:4px}
.box-buy .hand{font:800 clamp(1.2rem,1rem + .5vw,1.5rem)/1 var(--hand);color:var(--rose);transform:rotate(-4deg)}
/* duma */
.proud .q span{font-size:clamp(2.2rem,.9rem + 3.4vw,4.8rem);white-space:nowrap}
.proud .q span:nth-child(2){padding-left:clamp(16px,4vw,72px)}
.proud .ph img{display:block}
@media (max-width:520px){.proud .q span{font-size:clamp(1.45rem,.5rem + 5vw,2.2rem)}.proud .q span:nth-child(2){padding-left:12px}}
/* prezent */
.gift .ph{min-height:0;align-self:start;background:var(--kreda)}
.gift .ph img{position:static;width:100%;height:auto}
.gift .t{align-self:stretch;justify-content:center;gap:22px}
.gift .t > div{margin-top:8px}
@media (max-width:899px){.gift .ph{aspect-ratio:auto}}
/* pytania */
.faq-h{grid-column:1 / span 4;display:flex;flex-direction:column;align-items:flex-start;gap:16px;align-self:start;position:sticky;top:110px}
.faq-h p{font-size:var(--s-lead);line-height:1.4;max-width:24ch}
.faq details{transition:background-color 250ms ease}
.faq details:hover{background:#FDFCFA}
.faq details[open]{background:var(--biel)}
.faq summary{transition:color 200ms ease}
.faq summary:hover{color:var(--blink)}
.faq details::details-content{height:0;overflow:clip;transition:height 380ms var(--ease),content-visibility 380ms allow-discrete}
.faq details[open]::details-content{height:auto}
@media (max-width:899px){.faq-h{grid-column:1 / -1;position:static}}
@media (prefers-reduced-motion:reduce){.faq details::details-content{transition:none}}

/* szafa misia – dodatkowe ubranka */
.wr{background:var(--mg);padding:clamp(28px,4vw,56px) clamp(20px,4vw,56px) clamp(28px,3.6vw,48px)}
.wr-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap;margin-bottom:clamp(22px,3vw,36px)}
.wr-h .note{font:800 clamp(1.15rem,1rem + .5vw,1.5rem)/1 var(--hand);color:var(--blink);transform:rotate(-3deg);display:inline-block;margin-bottom:10px}
.wr-h h2{font-size:var(--s-head)}
.wr-h .lead{max-width:36ch;font-size:var(--s-lead);line-height:1.35}
.wr-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--g)}
.wr-list li{background:var(--biel);border-radius:24px;padding:10px;display:flex;flex-direction:column;transition:transform 400ms var(--spring)}
.wr-list li:hover{transform:translateY(-6px)}
.wr-list .ph{aspect-ratio:1;border-radius:16px;overflow:hidden;background:#D5D9E4}
.wr-list .ph img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease)}
.wr-list li:hover .ph img{transform:scale(1.04)}
.wr-list .soon{background:var(--pe);display:grid;place-items:center;align-content:center;gap:10px;text-align:center;border:2px dashed rgba(28,32,66,.25)}
.wr-list .soon svg{width:64px;height:64px;color:var(--ink)}
.wr-list .soon span{font:700 1rem/1.1 var(--hand);color:var(--ink2)}
.wr-list .t{padding:14px 8px 6px;display:flex;flex-direction:column;gap:6px;flex:1}
.wr-list h3{font-size:clamp(1.15rem,1rem + .4vw,1.4rem);letter-spacing:-0.02em;line-height:1.05}
.wr-list .col{display:flex;align-items:center;gap:6px;font-size:var(--s-small);color:var(--ink2)}
.wr-list .col i{width:14px;height:14px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1.5px rgba(28,32,66,.18);flex:none}
.wr-list .col i+i{margin-left:-10px}
.wr-list .row{margin-top:auto;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.wr-list .price{font:700 1.35rem/1 var(--disp);letter-spacing:-0.02em}
.wr-list .btn{min-height:44px;padding:.65em 1.05em;font-size:.95rem}
.wr-foot{display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap;margin-top:clamp(18px,2.4vw,28px)}
.wr-foot .hand{font:800 clamp(1.1rem,1rem + .4vw,1.4rem)/1.1 var(--hand);color:var(--rose);transform:rotate(-2deg)}
.wr-foot .small{font-size:var(--s-small);color:var(--ink2)}
@media (max-width:1399px){
  .wr-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1 * clamp(20px,4vw,56px));padding:0 clamp(20px,4vw,56px) 6px;scroll-padding-left:clamp(20px,4vw,56px)}
  .wr-list::-webkit-scrollbar{display:none}
  .wr-list li{flex:0 0 clamp(220px,40vw,280px);scroll-snap-align:start}
}
@media (max-width:560px){.wr-list li{flex-basis:72vw}}

/* powiadomienie o dodaniu */
.toast{position:fixed;left:50%;bottom:20px;z-index:40;display:flex;align-items:center;gap:12px;background:var(--ink);color:#fff;border-radius:999px;padding:12px 14px 12px 18px;font-weight:500;transform:translate(-50%,140%);opacity:0;transition:transform 450ms var(--spring),opacity 250ms ease;pointer-events:none;max-width:calc(100vw - 32px)}
.toast svg{width:22px;height:22px;flex:none;color:var(--cy)}
.toast a{background:var(--cy);color:var(--ink);text-decoration:none;border-radius:999px;padding:8px 14px;font-weight:600;white-space:nowrap}
.toast.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}
@media (max-width:480px){.toast span{display:none}}
@media (prefers-reduced-motion:reduce){.stlogo{animation:none}.st,.toast,.prog i,.box li .ic{transition:none}}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* duma – propozycja A */
.ln{font-family:var(--hand);font-weight:800;letter-spacing:-0.015em;line-height:1;white-space:nowrap;display:inline-flex;align-items:flex-end}
.ln .bang{width:.26em;height:.72em;margin-left:.1em;flex:none;margin-bottom:.04em}
.ln.blue{color:var(--rose)}.ln.blue .bang{--lg:var(--rose)}
.ln.rose{color:#A42E50}.ln.rose .bang{--lg:#A42E50}
.lead2{font:600 var(--s-lead)/1.35 var(--disp);letter-spacing:-0.015em;max-width:none;color:#7A1F38}
/* A · Duet z zakreśleniem */
.pa{background:var(--pr);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--g);padding:clamp(32px,5vw,84px) clamp(28px,4.5vw,72px);align-items:center;position:relative}
.pa .q{grid-column:1 / span 7;display:flex;flex-direction:column;gap:clamp(6px,1vw,14px)}
.pa .ln{font-size:clamp(2.2rem,.8rem + 3.9vw,5.4rem);position:relative;isolation:isolate;align-self:flex-start}
.pa .ln::before{content:"";position:absolute;left:-.12em;right:-.1em;bottom:.02em;height:.4em;z-index:-1;border-radius:.3em .5em .25em .6em;rotate:-1.5deg}
.pa .ln.blue::before{background:#fff}
.pa .ln.rose{margin-left:clamp(20px,5vw,90px)}.pa .ln.rose::before{background:#F9C3CF}
.pa .lead2{margin-top:clamp(16px,2vw,28px)}
.pa .ph{grid-column:9 / span 4;position:relative}
.pa .ph .pic{border-radius:14px;overflow:hidden;rotate:3deg;background:var(--kreda);transition:rotate 500ms var(--spring),scale 500ms var(--spring)}
.pa .ph:hover .pic{rotate:0deg;scale:1.02}
.pa .ph img{width:100%}
.pa .note{position:absolute;left:-10px;top:-62px;z-index:2;font:800 clamp(1.1rem,.9rem + .5vw,1.4rem)/1 var(--hand);color:var(--rose);rotate:-6deg;display:flex;align-items:flex-end;gap:6px;white-space:nowrap}
.pa .note svg{width:44px;height:40px;flex:none;translate:0 22px}
@media (max-width:899px){.pa .q,.pa .ph{grid-column:1 / -1}.pa .ln{font-size:clamp(1.6rem,.5rem + 5.8vw,2.6rem)}.pa .ln.rose{margin-left:18px}.pa .ph{max-width:320px;justify-self:center;width:100%;margin-top:56px}}
.pd .ln::before{display:none}
.pd .ln.blue{color:var(--ink)}.pd .ln.blue .bang{--lg:var(--ink)}
.pd .ln.rose{color:var(--rose)}.pd .ln.rose .bang{--lg:var(--rose)}
.pd .lead2{font:500 var(--s-lead)/1.4 var(--text);letter-spacing:0;color:var(--ink)}
@media (max-width:899px){.pd .ph{margin-top:28px}}
.wr-list .btn[aria-disabled]{opacity:.45;pointer-events:none}

/* informacje o bezpieczeństwie (GPSR) */
.safe{font-size:var(--s-small);line-height:1.45;color:var(--ink2);margin-top:16px;max-width:62ch}
.safe b{color:var(--ink)}
.wr .safe{margin-top:14px;max-width:none}

/* wymiary pudełka – odręczny dopisek */
.gift .ph svg.dimh3{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* bezpieczeństwo: plakietki 3+ i 0–3 na zdjęciu, link do pytań */
.box .ph{position:relative}
.box .badges{position:absolute;left:18px;bottom:18px;display:flex;gap:8px;align-items:center}
.box .badges .age,.box .badges .no03{width:44px;height:44px;background:#fff;border-radius:50%;box-shadow:0 2px 10px rgba(28,32,66,.12)}
.box .badges .age{display:inline-grid;place-items:center;font:800 1rem/1 var(--disp);letter-spacing:-.02em;color:var(--ink);box-shadow:0 2px 10px rgba(28,32,66,.12),inset 0 0 0 1.5px var(--ink)}
.box .safe-link{font-size:var(--s-small);color:var(--ink2);text-decoration:underline;text-decoration-color:rgba(28,32,66,.3);text-underline-offset:3px;margin-top:-10px;align-self:flex-start}
.box .safe-link:hover{color:var(--ink)}
#bezpieczenstwo{scroll-margin-top:110px}

/* 1.4.8–1.4.9 – szafa misia: więcej powietrza, karty wiszą na wieszakach */
.wr{padding:clamp(40px,6vw,88px) clamp(20px,5vw,72px) clamp(32px,4.4vw,64px)}
.wr-h{gap:20px 56px;margin-bottom:clamp(36px,4.4vw,64px)}
.wr-h .lead{max-width:32ch;font-size:clamp(1.12rem,1.02rem + .5vw,1.45rem);line-height:1.45;color:var(--ink2)}
.wr .wr-list{gap:clamp(20px,2.2vw,32px);padding-top:76px;background:linear-gradient(#C3D3EC,#C3D3EC) 0 22px / 100% 8px no-repeat;background-attachment:local}
.wr .wr-list li{position:relative;overflow:visible;border-radius:28px;padding:12px;transform-origin:50% -60px;transition:opacity 700ms var(--ease),transform 500ms var(--spring)}
.wr .wr-list li::after{content:"";position:absolute;left:50%;top:-60px;width:92px;height:68px;margin-left:-46px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 84 62'%3E%3Cg fill='none' stroke='%238EA4C8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M42 10c0-5 3.5-7.5 7-7.5s6 3 5 6.5c-1 3-5 4-12 9.5'/%3E%3Cpath d='M42 18.5 6 50c-2 2-1 4.5 2 4.5h68c3 0 4-2.5 2-4.5L42 18.5z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat}
.wr .wr-list li:hover{transform:rotate(-2deg)}
.wr .wr-list li:hover .ph img{transform:none}
.wr .wr-list .ph{border-radius:20px}
.wr .wr-list .t{padding:20px 10px 8px;gap:0}
.wr .wr-list h3{font-size:clamp(1.2rem,1.05rem + .4vw,1.45rem);line-height:1.1}
.wr .wr-list .col{margin-top:8px;gap:7px}
.wr .wr-list .row{padding-top:22px;flex-direction:column;align-items:stretch;gap:14px}
.wr .wr-list .price{font-size:1.5rem}
.wr .wr-list .btn{min-height:48px;padding:.8em 1.1em;width:100%;justify-content:center}
.wr .wr-list .btn > span:first-child::after{content:"\00a0 do koszyka"}
.wr-foot{gap:14px 32px;margin-top:clamp(32px,4vw,56px);padding-top:clamp(22px,2.6vw,32px);border-top:2px dashed rgba(47,91,194,.22)}
.wr-foot .small{max-width:46ch}
.wr-dots{display:none;justify-content:center;gap:8px;margin-top:20px}
.wr-dots i{width:8px;height:8px;border-radius:999px;background:#C9D6EE;transition:width 400ms var(--spring),background-color 300ms ease}
.wr-dots i.on{width:28px;background:var(--ink)}
@media (max-width:1399px){
  .wr .wr-list{gap:clamp(18px,2.2vw,24px);margin:0 calc(-1 * clamp(20px,5vw,72px));padding:76px clamp(20px,5vw,72px) 10px;scroll-padding-left:clamp(20px,5vw,72px)}
  .wr .wr-list li{flex:0 0 clamp(236px,30vw,280px)}
  .wr .wr-list .row{flex-direction:row;align-items:center;justify-content:space-between}
  .wr .wr-list .btn{width:auto;padding:.8em 1.2em}
  .wr .wr-list .btn > span:first-child::after{content:none}
  .wr-dots{display:flex}
}
@media (max-width:560px){.wr .wr-list li{flex-basis:74vw}.wr .wr-list{gap:18px}}
@media (prefers-reduced-motion:reduce){.wr .wr-list li,.wr-dots i{transition:none}.wr .wr-list li:hover{transform:none}}

/* 1.6.2 – ubranko ze zdjęciem „na misiu” (najechanie / przycisk) i plakietka „Nowość” */
.wr-list .ph{position:relative}
.wr-alt .ph img.b{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 420ms ease,transform 700ms ease}
.wr-alt .ph.on img.b{opacity:1;transform:scale(1)}
@media (hover:hover){.wr-alt .ph:hover img.b{opacity:1;transform:scale(1)}}
.wr-list .nw{position:absolute;top:12px;left:12px;z-index:2;background:#C23D5A;color:#fff;font:700 .78rem/1 var(--text);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:7px 11px}
.wr-alt .flip{position:absolute;right:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;background:rgba(255,255,255,.92);color:#1C2042;padding:8px 12px;font:600 .85rem/1 var(--text);cursor:pointer;box-shadow:0 4px 14px -6px rgba(28,32,66,.35);transition:background-color 200ms ease}
.wr-alt .flip svg{width:15px;height:15px;transition:transform 420ms ease}
.wr-alt .ph.on .flip{background:#1C2042;color:#fff}
.wr-alt .ph.on .flip svg{transform:rotate(180deg)}
.wr-alt .flip:focus-visible{outline:3px solid #1C2042;outline-offset:2px}
.wr-list .col i[style*="#FFFFFF"]{box-shadow:inset 0 0 0 1.5px rgba(28,32,66,.25)}
@media (prefers-reduced-motion:reduce){.wr-alt .ph img.b,.wr-alt .flip svg{transition:none}}
/* 1.6.6 – szafa misia: zawsze jeden rząd na wieszaku, przewijany */
@media (min-width:1400px){
  .wr .wr-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1 * clamp(20px,5vw,72px));padding:76px clamp(20px,5vw,72px) 10px;scroll-padding-left:clamp(20px,5vw,72px)}
  .wr .wr-list::-webkit-scrollbar{display:none}
  .wr .wr-list li{flex:0 0 calc((100% - 4 * clamp(20px,2.2vw,32px)) / 5);scroll-snap-align:start}
  .wr-dots{display:flex}
}
.wr-ctl{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:20px}
.wr-ctl[hidden]{display:none}
.wr-ctl .wr-dots{margin-top:0}
.wr-arr{width:48px;height:48px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--ink);color:#fff;cursor:pointer;transition:transform 300ms var(--spring),opacity 200ms ease}
.wr-arr svg{width:22px;height:22px}
.wr-arr:hover{transform:scale(1.08)}
.wr-arr:disabled{opacity:.25;cursor:default;transform:none}
.wr-arr:focus-visible{outline:3px solid var(--blink,#4A7BD0);outline-offset:3px}
/* 1.6.7 – szafa misia: kompaktowy przycisk „Dodaj +” obok ceny, jak na stronie świątecznej */
.wr .wr-list .row{flex-direction:row;align-items:center;justify-content:space-between;padding-top:18px;gap:10px}
.wr .wr-list .btn{width:auto;padding:.8em 1.2em}
.wr .wr-list .btn > span:first-child::after{content:none}
