html{text-decoration-skip-ink:none}
/* =========================================================
   TOKENY
   ========================================================= */
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
:root{
  --bg:#0d0d10; --bg2:#141419; --card:#1a1a21; --card2:#22222b; --line:#2a2a34; --line2:#3a3a46;
  --text:#f5f5f8; --muted:#a8a8b6; --dim:#8c8c9a;
  --pink:#ff2e88; --cyan:#22d3ee; --yellow:#ffd23f; --violet:#8b5cf6;
  --grad:linear-gradient(90deg,var(--pink),var(--violet) 50%,var(--cyan));
  --ease:cubic-bezier(.2,.7,.2,1);
  /* system odstępów */
  --gutter:clamp(16px,4vw,32px);
  --section:clamp(84px,10vw,140px);
  --head-gap:clamp(36px,4.5vw,64px);
  --gap:clamp(12px,1.6vw,20px);
  --pad:clamp(22px,2.4vw,32px);
  --r:clamp(16px,1.6vw,22px);
  --r-lg:clamp(22px,2.4vw,32px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:16px/1.65 Inter,system-ui,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
::selection{background:var(--pink);color:#fff}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.ico{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:8px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:300;background:var(--text);color:var(--bg);padding:10px 16px;border-radius:10px;font-weight:700}
.skip:focus{top:16px}
.wrap{width:min(1200px,100% - var(--gutter)*2);margin-inline:auto}

/* typografia */
h1,h2,h3{font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:.4px;line-height:1.02;text-transform:uppercase;text-wrap:balance}
h2{font-size:clamp(2.4rem,6.2vw,4.6rem)}
h3{font-size:clamp(1.3rem,2vw,1.6rem)}
p{text-wrap:pretty}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.74rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--cyan)}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 4px rgba(255,46,136,.18),0 0 16px var(--pink)}
.lead{color:var(--muted);max-width:60ch;font-size:clamp(1rem,1.2vw,1.1rem)}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* sekcje – jeden rytm odstępów */
section{padding-block:var(--section);position:relative}
.alt-bg{background:var(--bg2)}
.tight{padding-top:0}
.sec-head{display:grid;gap:16px;margin-bottom:var(--head-gap)}
.sec-head.row{grid-template-columns:1fr auto;align-items:end;gap:16px 32px}
.sec-head.center{justify-items:center;text-align:center}
.sec-head.center .lead{margin-inline:auto}
@media(max-width:760px){.sec-head.row{grid-template-columns:1fr}}

/* przyciski */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:52px;padding:0 28px;border-radius:999px;font-weight:700;border:0;cursor:pointer;font-size:1rem;transition:transform .25s var(--ease),box-shadow .25s,border-color .2s,background-position .4s,background-color .2s,color .2s;white-space:nowrap;position:relative}
.btn .ico{transition:transform .25s var(--ease)}
.btn:hover .ico{transform:translateX(3px)}
.btn-primary{background:var(--grad);background-size:180% 100%;color:#fff;box-shadow:0 10px 30px -10px var(--pink)}
.btn-primary:hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 18px 40px -10px var(--pink)}
.btn-ghost{border:1.5px solid var(--line2);color:var(--text);background:rgba(255,255,255,.03);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(34,211,238,.07)}
.btn-lg{min-height:60px;padding:0 34px;font-size:1.05rem}
.icon-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--card2);display:grid;place-items:center;cursor:pointer;font-size:1.1rem;transition:border-color .2s,background .2s}
.icon-btn:hover{border-color:var(--cyan)}

/* =========================================================
   NAV
   ========================================================= */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:90;background:var(--grad);transform-origin:0 50%;transform:scaleX(0)}
#nav{position:fixed;inset:0 0 auto;z-index:80;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
#nav.scrolled{background:rgba(13,13,16,.8);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);border-color:var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:76px;transition:height .3s}
#nav.scrolled .nav-in{height:64px}
.logo{font-family:Anton;font-size:1.5rem;letter-spacing:1px;white-space:nowrap}
.logo span{color:var(--pink)}
.menu{display:flex;gap:2px;font-size:.9rem;font-weight:500}
.menu a{color:var(--muted);padding:8px 14px;border-radius:999px;transition:color .2s,background .2s}
.menu a:hover{color:var(--text)}
.menu a.active{color:var(--text);background:var(--card2)}
.nav-r{display:flex;align-items:center;gap:10px}
.nav-cta{min-height:44px;padding:0 20px;font-size:.9rem}
.burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--card);cursor:pointer;position:relative}
.burger i{position:absolute;left:12px;right:12px;height:2px;background:var(--text);border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
.burger i:nth-child(1){top:15px}.burger i:nth-child(2){top:21px}.burger i:nth-child(3){top:27px}
body.menu-open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .burger i:nth-child(2){opacity:0}
body.menu-open .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:70;background:rgba(10,10,13,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;justify-content:center;padding:96px var(--gutter) 40px;gap:2px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.mnav a{font-family:Anton;font-size:clamp(2.2rem,11vw,3.4rem);text-transform:uppercase;line-height:1.18;transform:translateY(18px);opacity:0;transition:transform .5s var(--ease),opacity .5s,color .2s;color:var(--text)}
.mnav a:hover{color:var(--pink)}
.mnav small{margin-top:28px;color:var(--muted)}
body.menu-open .mnav{opacity:1;visibility:visible}
body.menu-open .mnav a{transform:none;opacity:1}

@media(max-width:400px){.nav-cta{padding:0 14px;font-size:.82rem}.logo{font-size:1.3rem}}

/* =========================================================
   HERO
   ========================================================= */
.hero{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:calc(76px + 48px) 0 96px;overflow:hidden;position:relative;cursor:crosshair;-webkit-touch-callout:none;isolation:isolate}
.hero.mouse{cursor:none}
.hero.spraying{user-select:none;-webkit-user-select:none}
.blob{position:absolute;border-radius:50%;filter:blur(90px);opacity:.35;z-index:-1;animation:drift 18s ease-in-out infinite alternate}
.blob.b1{width:520px;height:520px;background:var(--pink);top:-140px;left:-120px}
.blob.b2{width:460px;height:460px;background:var(--violet);bottom:-160px;right:-80px;animation-delay:-6s}
.blob.b3{width:320px;height:320px;background:var(--cyan);top:40%;left:55%;opacity:.18;animation-delay:-12s}
@keyframes drift{to{transform:translate(60px,40px) scale(1.12)}}
#spray{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.floaters{position:absolute;inset:0;z-index:0;pointer-events:none}
.fl{position:absolute;width:var(--w);left:var(--x);top:var(--y);transform:translate(calc(var(--mx,0)*var(--d)*1px),calc(var(--my,0)*var(--d)*1px));transition:transform .6s var(--ease)}
.fl>svg{width:100%;filter:drop-shadow(0 24px 30px rgba(0,0,0,.55));animation:bob 7s ease-in-out infinite;animation-delay:var(--del,0s);opacity:.92}
@keyframes bob{0%,100%{transform:translateY(0) rotate(var(--rot,0deg))}50%{transform:translateY(-14px) rotate(calc(var(--rot,0deg) + 3deg))}}
@media(max-width:1100px){.fl{opacity:.35}}
@media(max-width:760px){.floaters{display:none}}
.hero-in{position:relative;z-index:1;text-align:center;pointer-events:none;display:flex;flex-direction:column;align-items:center}
.hero-in a,.hero-in button{pointer-events:auto;cursor:pointer}
.hero h1{font-size:clamp(3.1rem,11.5vw,9.8rem);margin:22px 0 26px;line-height:.98}
.hero h1 .line{display:block;overflow:hidden;padding:.3em .05em .03em;margin-top:-.27em}
.hero h1 .line>span:not(.sr-only){display:inline-block;animation:rise 1s var(--ease) backwards}
.hero h1 .line:nth-child(2)>span{animation-delay:.12s}
.hero h1 .line:nth-child(2)>span+span{animation-delay:.2s}
@keyframes rise{from{transform:translateY(105%)}}
.rot{white-space:nowrap;transition:opacity .45s,filter .45s,transform .45s var(--ease)}
.rot.out{opacity:0;filter:blur(14px);transform:scale(1.06)}
.hero h1 .outline{-webkit-text-stroke:2px var(--text);color:transparent}
.hero .lead{text-align:center;margin-bottom:34px;animation:fade 1s .35s backwards}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;animation:fade 1s .45s backwards}
@keyframes fade{from{opacity:0;transform:translateY(14px)}}
.hint{margin-top:32px;font-size:.78rem;color:var(--muted);letter-spacing:.6px;display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border:1px dashed var(--line2);border-radius:999px;background:rgba(13,13,16,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fade 1s .6s backwards}
.hint b{color:var(--yellow);font-weight:600}
.dots{display:inline-flex;gap:4px}
.dots i{width:8px;height:8px;border-radius:50%}
.stats{display:flex;gap:clamp(28px,5vw,56px);justify-content:center;margin-top:44px;flex-wrap:wrap;animation:fade 1s .7s backwards}
.stat b{display:block;font-family:Anton;font-size:clamp(2rem,3.2vw,2.6rem);line-height:1.1;font-weight:400}
.stat small{color:var(--muted);font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase}
.scroll-cue{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:1;width:26px;height:42px;border:2px solid var(--line2);border-radius:14px;pointer-events:none}
.scroll-cue::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--pink);animation:cue 1.8s infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}
@media(max-height:720px){.scroll-cue{display:none}}
#nozzle{position:fixed;left:0;top:0;z-index:90;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid var(--pink);pointer-events:none;opacity:0;transition:opacity .2s,width .2s,height .2s,margin .2s}
#nozzle::after{content:"";position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px;border-radius:50%;background:currentColor}
#nozzle.show{opacity:1}
#nozzle.down{width:18px;height:18px;margin:-9px 0 0 -9px}

/* =========================================================
   TAŚMY
   ========================================================= */
.tapes{position:relative;height:clamp(150px,16vw,200px);overflow:hidden;display:grid;place-items:center}
.tape{position:absolute;left:-10%;right:-10%;overflow:hidden;padding:16px 0}
.tape.t1{background:var(--grad);transform:rotate(-3deg);z-index:2;box-shadow:0 20px 40px -10px rgba(0,0,0,.6)}
.tape.t2{background:var(--card);border-block:1px solid var(--line);transform:rotate(2.2deg)}
.tape-track{display:flex;gap:40px;width:max-content;animation:mq 36s linear infinite;font-family:Anton;font-size:clamp(1.4rem,2.6vw,2rem);text-transform:uppercase;white-space:nowrap}
.t1 .tape-track{color:#0d0d10}
.t2 .tape-track{animation-direction:reverse;color:transparent;-webkit-text-stroke:1px var(--muted)}
.tape-track span::after{content:"✦";margin-left:40px}
@keyframes mq{to{transform:translateX(-50%)}}

/* =========================================================
   PORTFOLIO
   ========================================================= */
.filters{display:flex;gap:4px;background:var(--card);padding:5px;border-radius:999px;border:1px solid var(--line)}
.filters button{background:transparent;color:var(--muted);border:0;padding:10px 18px;border-radius:999px;cursor:pointer;font-weight:600;font-size:.88rem;transition:background .2s,color .2s;white-space:nowrap}
.filters button:hover{color:var(--text)}
.filters button.on{background:var(--text);color:var(--bg)}
@media(max-width:760px){.filters{overflow-x:auto;max-width:100%;scrollbar-width:none;justify-self:start}.filters::-webkit-scrollbar{display:none}.filters button{flex:none;padding:9px 15px}}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:1020px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.grid{grid-template-columns:repeat(2,1fr)}}
.tile{--rx:0deg;--ry:0deg;--ty:0px;border-radius:var(--r);overflow:hidden;background:var(--card);border:1px solid var(--line);cursor:pointer;text-align:left;padding:0;display:flex;flex-direction:column;width:100%;position:relative;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--ty));
  transition:opacity .8s var(--ease),translate .8s var(--ease),transform .35s var(--ease),border-color .3s,box-shadow .35s}
.tile:hover{--ty:-6px;border-color:var(--line2);box-shadow:0 30px 50px -24px rgba(0,0,0,.8)}
.tile::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--px,50%) var(--py,50%),rgba(255,255,255,.13),transparent 45%)}
.tile:hover::after{opacity:1}
.tile.big{grid-column:span 2;grid-row:span 2}
.tile.big .art{aspect-ratio:auto;flex:1;min-height:260px}
.tile.big .meta b{font-size:1.05rem}
.tile.hide{display:none}
.art{aspect-ratio:1;display:grid;place-items:center;position:relative;overflow:hidden;width:100%}
.art svg{width:74%;transition:transform .7s var(--ease)}
.tile:hover .art svg,.tile:hover .art .photo{transform:scale(1.06)}
.art .ph{position:absolute;bottom:12px;left:12px;font-size:.66rem;background:rgba(0,0,0,.6);padding:3px 8px;border-radius:6px;color:#ccc;letter-spacing:.3px}
.art .view{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.95);color:#111;display:grid;place-items:center;font-size:1.05rem;opacity:0;transform:scale(.7);transition:opacity .25s,transform .3s var(--ease);z-index:1}
.tile:hover .view,.tile:focus-visible .view{opacity:1;transform:none}
.meta{padding:16px 18px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.meta b{font-size:.94rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tag{font-size:.68rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--cyan);flex:none}
@media(max-width:760px){.tile:not(.big) .tag{display:none}.meta{padding:13px 14px}.meta b{font-size:.86rem}}
.more{margin-top:var(--head-gap);display:flex;justify-content:center}

/* lightbox */
dialog{border:0;padding:0;background:transparent;color:var(--text);width:min(1040px,calc(100% - 24px));max-width:none;max-height:calc(100vh - 24px);max-height:calc(100svh - 24px);margin:auto;overflow:auto}
dialog::backdrop{background:rgba(6,6,9,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
dialog[open]{animation:pop .4s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.98)}}
.lb{display:grid;grid-template-columns:1.25fr 1fr;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
@media(max-width:760px){.lb{grid-template-columns:1fr}}
.lb .art{aspect-ratio:1}
.lb-info{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:16px}
.lb-info h3{font-size:clamp(1.8rem,3vw,2.4rem)}
.lb-info p{color:var(--muted)}
.lb-specs{list-style:none;display:grid;gap:10px;font-size:.9rem}
.lb-specs li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line);padding-bottom:10px}
.lb-specs span{color:var(--muted)}
.lb-nav{display:flex;gap:8px;margin-top:auto;padding-top:8px}
.lb-close{position:absolute;top:14px;right:14px;z-index:2;background:rgba(0,0,0,.6)}

/* =========================================================
   PRZED / PO
   ========================================================= */
.ba-wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(36px,6vw,88px);align-items:center}
@media(max-width:900px){.ba-wrap{grid-template-columns:1fr}}
.ba{position:relative;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);user-select:none;touch-action:pan-y;cursor:ew-resize;box-shadow:0 40px 80px -40px rgba(0,0,0,.9)}
.ba .layer{position:absolute;inset:0;display:grid;place-items:center}
.ba .before{background:linear-gradient(160deg,#f1f1f4,#d9d9e0)}
.ba .after{background:radial-gradient(circle at 30% 30%,#33184d,#0d0d10);clip-path:inset(0 0 0 50%)}
.ba svg{width:80%}
.ba .bar{position:absolute;top:0;bottom:0;left:50%;width:3px;background:#fff;transform:translateX(-50%);box-shadow:0 0 20px rgba(255,255,255,.5)}
.ba .knob{position:absolute;top:50%;left:50%;width:52px;height:52px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;transform:translate(-50%,-50%);font-weight:800;box-shadow:0 6px 24px rgba(0,0,0,.45)}
.ba .lbl{position:absolute;top:16px;font-size:.7rem;font-weight:700;letter-spacing:2px;padding:5px 12px;border-radius:999px;background:rgba(0,0,0,.65);color:#fff;z-index:1}
.ba .lbl.l{left:16px}.ba .lbl.r{right:16px}
.ba-copy{display:grid;gap:18px}
.checks{list-style:none;display:grid;gap:14px;margin-top:8px}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks li .ico{color:var(--cyan);font-size:1.3rem;margin-top:2px}

/* =========================================================
   USŁUGI (SEO)
   ========================================================= */
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:1020px){.services{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.services{grid-template-columns:1fr}}
.svc{position:relative;padding:var(--pad);border-radius:var(--r);background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:14px;overflow:hidden;transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .3s,transform .35s var(--ease)}
.svc:hover{border-color:var(--line2);transform:translateY(-4px)}
.svc .num{position:absolute;top:14px;right:18px;font-family:Anton;font-size:3.4rem;line-height:1;color:transparent;-webkit-text-stroke:1px var(--line2)}
.svc h3{font-size:1.45rem;padding-right:40px}
.svc p{color:var(--muted);font-size:.93rem;flex:1}
.svc ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.svc li{font-size:.74rem;padding:4px 10px;border-radius:999px;background:var(--card2);color:var(--muted)}
.svc a{font-weight:700;font-size:.92rem;display:inline-flex;align-items:center;gap:8px;margin-top:4px}
.svc a:hover{color:var(--cyan)}
.p-ico{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;background:var(--card2);border:1px solid var(--line);font-size:1.6rem;color:var(--pink)}
.local{margin-top:var(--head-gap);padding:var(--pad);border-radius:var(--r);border:1px dashed var(--line2);display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;color:var(--muted);font-size:.95rem}
.local .p-ico{color:var(--yellow)}
.local b{color:var(--text)}
@media(max-width:560px){.local{grid-template-columns:1fr}}

/* =========================================================
   O MNIE
   ========================================================= */
.about{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,7vw,104px);align-items:center}
@media(max-width:900px){.about{grid-template-columns:1fr}}
.portrait{position:relative;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);
  background:radial-gradient(circle at 25% 20%,rgba(255,46,136,.55),transparent 45%),radial-gradient(circle at 80% 75%,rgba(34,211,238,.45),transparent 45%),radial-gradient(circle at 70% 25%,rgba(255,210,63,.35),transparent 35%),#17171d}
.portrait-wrap{position:relative}
.portrait .ph-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:rgba(255,255,255,.78);font-size:.85rem;padding:20px}
.portrait .ph-c svg{width:68px;height:68px;margin:0 auto 10px;opacity:.85}
.float-badge{position:absolute;left:-20px;bottom:40px;background:var(--text);color:var(--bg);border-radius:16px;padding:14px 18px;font-weight:700;box-shadow:0 20px 40px -10px rgba(0,0,0,.6);transform:rotate(-4deg);z-index:2}
.float-badge small{display:block;font-weight:500;font-size:.75rem;color:#555}
.float-badge.b2{left:auto;right:-16px;bottom:auto;top:36px;transform:rotate(5deg);background:var(--yellow)}
@media(max-width:900px){.float-badge{left:12px}.float-badge.b2{right:12px}}
.about-copy{display:grid;gap:18px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.chips span{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:.85rem;background:var(--card)}
.sign{font-family:Caveat,cursive;font-size:2.8rem;line-height:1;margin-top:4px}

/* =========================================================
   CENNIK
   ========================================================= */
.prices{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:1020px){.prices{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.prices{grid-template-columns:1fr}}
.price{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--pad);position:relative;overflow:hidden;display:flex;flex-direction:column;transition:opacity .8s var(--ease),translate .8s var(--ease),transform .35s var(--ease),border-color .3s}
.price:hover{transform:translateY(-4px)}
.price::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--grad)}
.price .p-ico{margin-bottom:20px}
.price h3{font-size:1.75rem}
.price .from{color:var(--muted);font-size:.82rem;margin-top:6px}
.price .amt{font-family:Anton;font-size:clamp(2.4rem,3.4vw,2.9rem);margin:2px 0 20px;line-height:1.1}
.price ul{list-style:none;color:var(--muted);font-size:.9rem;flex:1}
.price li{padding:9px 0;border-top:1px dashed var(--line);display:flex;gap:8px}
.price li::before{content:"✓";color:var(--cyan);font-weight:700}
.price.hot{border:1.5px solid transparent;background:linear-gradient(180deg,#25121f,var(--card) 45%) padding-box,conic-gradient(from var(--a),var(--pink),var(--violet),var(--cyan),var(--yellow),var(--pink)) border-box;animation:spinb 6s linear infinite}
.price.hot::before{display:none}
@keyframes spinb{to{--a:360deg}}
.badge{position:absolute;top:22px;right:20px;background:var(--pink);font-size:.64rem;font-weight:700;padding:5px 10px;border-radius:999px;letter-spacing:1px}
.p-cta{margin-top:22px;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:8px;font-size:.92rem;background:none;border:0;cursor:pointer;padding:0;align-self:flex-start}
.p-cta:hover{color:var(--cyan)}
.note{margin-top:28px;color:var(--dim);font-size:.85rem}

/* =========================================================
   KROKI
   ========================================================= */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);counter-reset:s;position:relative}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{padding:var(--pad);border-radius:var(--r);background:var(--bg);border:1px solid var(--line);position:relative;display:flex;flex-direction:column;gap:10px;transition:opacity .8s var(--ease),translate .8s var(--ease)}
.step::before{counter-increment:s;content:"0" counter(s);font-family:Anton;font-size:3.6rem;display:block;line-height:1;margin-bottom:6px}
.step:nth-child(1)::before{color:var(--pink)}.step:nth-child(2)::before{color:var(--violet)}
.step:nth-child(3)::before{color:var(--cyan)}.step:nth-child(4)::before{color:var(--yellow)}
.step p{color:var(--muted);font-size:.93rem;flex:1}
.step .time{align-self:flex-start;margin-top:8px;font-size:.7rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;background:var(--card2);padding:5px 11px;border-radius:999px}

/* =========================================================
   FORMULARZ
   ========================================================= */
.order-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,88px)}
@media(max-width:960px){.order-grid{grid-template-columns:1fr}}
.order-side{display:grid;gap:28px;align-content:start}
@media(min-width:961px){.order-side{position:sticky;top:110px}}
.form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,3vw,36px);box-shadow:0 40px 80px -50px rgba(0,0,0,.9)}
.types{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:24px}
@media(max-width:520px){.types{grid-template-columns:1fr 1fr}}
.types input{position:absolute;opacity:0;pointer-events:none}
.types label{border:1.5px solid var(--line);border-radius:14px;padding:16px 6px;text-align:center;cursor:pointer;font-size:.86rem;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:8px;transition:border-color .2s,background .2s}
.types label .ico{font-size:1.5rem;color:var(--muted)}
.types label:hover{border-color:var(--line2)}
.types input:checked+label{border-color:var(--pink);background:rgba(255,46,136,.08)}
.types input:checked+label .ico{color:var(--pink)}
.types input:focus-visible+label{outline:2px solid var(--cyan);outline-offset:2px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){.row{grid-template-columns:1fr}}
.field{margin-bottom:18px}
.field>label,.flabel{display:block;font-size:.8rem;font-weight:600;color:var(--muted);margin-bottom:8px}
.field>label i{color:var(--pink);font-style:normal}
.field input:not([type=range]):not([type=checkbox]),.field textarea,.field select{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:14px 15px;font:inherit;font-size:.95rem;transition:border-color .2s,box-shadow .2s;min-height:50px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(34,211,238,.15)}
.field.bad input,.field.bad textarea{border-color:var(--pink)}
.err{display:none;color:var(--pink);font-size:.78rem;margin-top:6px}
.field.bad .err{display:block}
textarea{min-height:130px;resize:vertical}
.counter{float:right;font-weight:500;color:var(--dim)}
.budget-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}
.budget-out{font-family:Anton;font-size:1.5rem;color:var(--yellow)}
input[type=range]{width:100%;accent-color:var(--pink)}
.drop{border:1.5px dashed var(--line2);border-radius:14px;padding:26px;text-align:center;color:var(--muted);font-size:.88rem;cursor:pointer;transition:border-color .2s,background .2s;display:flex;flex-direction:column;align-items:center;gap:8px}
.drop .ico{font-size:1.6rem;color:var(--cyan)}
.drop:hover,.drop.over{border-color:var(--cyan);background:rgba(34,211,238,.05)}
.thumbs{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.thumbs:empty{display:none}
.thumb{position:relative}
.thumb img{width:68px;height:68px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.thumb button{position:absolute;top:-7px;right:-7px;width:24px;height:24px;border-radius:50%;border:0;background:var(--pink);color:#fff;font-size:.8rem;cursor:pointer;line-height:1}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.82rem;color:var(--muted);cursor:pointer}
.field>label.consent{display:flex;gap:12px;align-items:flex-start;margin:0;font-weight:500;line-height:1.5}
.consent input{-webkit-appearance:none;appearance:none;flex:none;width:22px;height:22px;margin:0;border-radius:7px;border:1.5px solid var(--line2);background:var(--bg);display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}
.consent input::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg) scale(0);transition:transform .2s var(--ease)}
.consent input:checked{background:var(--grad) border-box;border-color:transparent}
.consent input:checked::after{transform:translateY(-1px) rotate(45deg) scale(1)}
.consent input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.field.bad .consent input{border-color:var(--pink)}
.form-actions{display:grid;gap:10px;margin-top:8px}
.form-actions .btn{width:100%}
.btn-wa{background:#17241b;border:1.5px solid #25d366;color:#7ef0a8}
.btn-wa:hover{background:#25d366;color:#062b14}
.btn.loading{pointer-events:none;opacity:.85}
.btn.loading::after{content:"";width:16px;height:16px;border:2px solid #fff;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.fine{font-size:.74rem;color:var(--dim);text-align:center;margin-top:4px}
.ok{display:none;text-align:center;padding:40px 10px}
.ok .big-ico{width:80px;height:80px;margin:0 auto 22px;border-radius:50%;background:var(--grad);display:grid;place-items:center;font-size:2rem;color:#fff}
.ok h3{font-size:2.6rem;margin-bottom:10px}
.ok .sum{margin:24px auto;max-width:380px;text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:18px;font-size:.9rem;color:var(--muted)}
.ok .sum b{color:var(--text)}
.contacts{display:grid;gap:10px}
.contacts a{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--card);transition:border-color .2s,transform .25s var(--ease)}
.contacts a:hover{border-color:var(--cyan);transform:translateX(4px)}
.contacts .ico{font-size:1.5rem}
.contacts small{color:var(--muted)}
.promise{display:grid;gap:12px;font-size:.93rem;color:var(--muted)}
.promise div{display:flex;gap:12px;align-items:center}
.promise .ico{color:var(--yellow);font-size:1.15rem}

/* =========================================================
   OPINIE
   ========================================================= */
.rev-nav{display:flex;gap:8px}
.rev-track{display:grid;grid-auto-flow:column;grid-auto-columns:min(390px,86%);gap:var(--gap);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:none;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}
@media(min-width:1264px){.rev-track{margin-inline:0;padding-inline:0;scroll-padding-inline:0}}
.rev-track::-webkit-scrollbar{display:none}
.rev{scroll-snap-align:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--pad);display:flex;flex-direction:column;gap:16px}
.rev .stars{color:var(--yellow);letter-spacing:3px}
.rev p{font-size:1rem;flex:1}
.who{display:flex;gap:12px;align-items:center;padding-top:16px;border-top:1px solid var(--line)}
.av{width:44px;height:44px;border-radius:50%;background:var(--grad);display:grid;place-items:center;font-weight:700;font-size:.9rem;color:#fff;flex:none}
.who small{display:block;color:var(--muted);font-size:.8rem}
.sample{align-self:flex-start;font-size:.62rem;letter-spacing:1px;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);padding:3px 8px;border-radius:999px}
.rating{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:.9rem}
.rating b{font-family:Anton;font-size:2.4rem;color:var(--text);font-weight:400;line-height:1}

/* =========================================================
   INSTAGRAM
   ========================================================= */
.ig{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media(max-width:760px){.ig{grid-template-columns:repeat(3,1fr);gap:8px}}
.ig a{aspect-ratio:1;border-radius:14px;overflow:hidden;position:relative;display:grid;place-items:center;border:1px solid var(--line)}
.ig a svg.shape{width:70%;transition:transform .5s var(--ease)}
.ig a::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.45);opacity:0;transition:opacity .25s}
.ig a>.ico{position:absolute;z-index:1;font-size:1.8rem;color:#fff;opacity:0;transition:opacity .25s}
.ig a:hover::after,.ig a:hover>.ico{opacity:1}
.ig a:hover svg.shape,.ig a:hover .photo{transform:scale(1.08)}

/* =========================================================
   BON
   ========================================================= */
.gift{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,64px);align-items:center;background:radial-gradient(circle at 0% 0%,rgba(255,46,136,.22),transparent 50%),radial-gradient(circle at 100% 100%,rgba(34,211,238,.18),transparent 50%),var(--bg2);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(28px,5vw,64px);overflow:hidden}
@media(max-width:900px){.gift{grid-template-columns:1fr}}
.gift-copy{display:grid;gap:18px;justify-items:start}
.voucher{aspect-ratio:16/9;border-radius:20px;background:var(--grad);padding:clamp(18px,2.4vw,28px);display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 30px 60px -20px rgba(255,46,136,.55);transform:rotate(-4deg);transition:transform .5s var(--ease);position:relative;overflow:hidden;color:#fff}
.voucher:hover{transform:rotate(0) scale(1.02)}
.voucher::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 60%);transform:translateX(-100%);animation:shine 4s infinite}
@keyframes shine{60%,100%{transform:translateX(100%)}}
.voucher b{font-family:Anton;font-size:clamp(2rem,5vw,3rem);line-height:1;font-weight:400}
.voucher small{opacity:.92;font-weight:600;letter-spacing:1px}
.amounts{display:flex;gap:8px;flex-wrap:wrap}
.amounts button{min-height:42px;padding:0 16px;border-radius:999px;border:1px solid var(--line2);background:var(--card);cursor:pointer;font-weight:600;font-size:.9rem;transition:border-color .2s,background .2s}
.amounts button.on{border-color:var(--pink);background:rgba(255,46,136,.12)}

/* =========================================================
   FAQ + PIELĘGNACJA
   ========================================================= */
.two{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,96px)}
@media(max-width:960px){.two{grid-template-columns:1fr}}
.faq-list{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-size:1.04rem;transition:color .2s}
summary:hover{color:var(--cyan)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";width:32px;height:32px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;color:var(--pink);font-size:1.2rem;line-height:1;transition:transform .3s var(--ease),background .2s;flex:none}
details[open] summary::after{transform:rotate(45deg);background:var(--card2)}
details p{color:var(--muted);padding:0 48px 22px 0;font-size:.95rem}
.care{display:grid;gap:12px}
.care>div{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.care .c-ico{width:46px;height:46px;border-radius:12px;background:var(--card2);display:grid;place-items:center;font-size:1.3rem;color:var(--cyan);flex:none}
.care b{display:block;margin-bottom:2px}
.care p{color:var(--muted);font-size:.9rem}

/* =========================================================
   WSPARCIE
   ========================================================= */
.support{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media(max-width:900px){.support{grid-template-columns:1fr}}
.sup{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--pad);display:flex;flex-direction:column;gap:12px;transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .3s,transform .35s var(--ease)}
.sup:hover{border-color:var(--line2);transform:translateY(-4px)}
.sup .p-ico{margin-bottom:8px}
.sup b{font-size:1.12rem}
.sup p{color:var(--muted);font-size:.93rem;flex:1}
.sup a{font-weight:700;color:var(--cyan);display:inline-flex;gap:6px;align-items:center;margin-top:4px}

/* =========================================================
   CTA BAND
   ========================================================= */
.cta-band{position:relative;overflow:hidden;text-align:center;padding-block:clamp(96px,13vw,180px);isolation:isolate;border-top:1px solid var(--line)}
.cta-band .blob{opacity:.28}
.cta-band h2{font-size:clamp(3rem,10vw,8.4rem);line-height:.95}
.cta-band h2 .outline{-webkit-text-stroke:2px var(--text);color:transparent;display:block}
.cta-band .lead{margin:28px auto 36px;text-align:center}
.cta-band .hero-actions{animation:none}

/* =========================================================
   STOPKA
   ========================================================= */
footer{border-top:1px solid var(--line);padding:clamp(64px,8vw,96px) 0 calc(110px + env(safe-area-inset-bottom));color:var(--muted);font-size:.92rem;background:var(--bg2)}
.foot{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:clamp(28px,4vw,56px)}
@media(max-width:900px){.foot{grid-template-columns:1fr 1fr}.foot>div:first-child{grid-column:1/-1}}
.foot-h{color:var(--text);font-size:.76rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px}
.foot .logo{color:var(--text);margin-bottom:12px;display:inline-block}
.foot p{max-width:34ch}
.foot a:hover{color:var(--text)}
.foot ul{list-style:none;display:grid;gap:10px}
.socials{display:flex;gap:8px;margin-top:22px}
.socials a{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);display:grid;place-items:center;font-size:1.2rem;transition:border-color .2s,color .2s}
.socials a:hover{border-color:var(--pink);color:var(--pink)}
.foot-bottom{margin-top:clamp(40px,5vw,64px);padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.82rem;color:var(--dim)}

/* =========================================================
   PŁYWAJĄCE
   ========================================================= */
.wa{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:60;background:#25d366;color:#062b14;font-weight:700;height:56px;padding:0 22px;border-radius:999px;display:flex;gap:8px;align-items:center;box-shadow:0 12px 30px -8px rgba(37,211,102,.65);transition:transform .25s var(--ease)}
.wa .ico{font-size:1.4rem;stroke-width:2}
.wa:hover{transform:translateY(-3px)}
.wa::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid #25d366;animation:ping 2.4s var(--ease) infinite}
@keyframes ping{0%{opacity:.8;transform:scale(1)}80%,100%{opacity:0;transform:scale(1.35)}}
@media(max-width:640px){.wa{width:56px;padding:0;justify-content:center}.wa span{display:none}}
.top{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:calc(90px + env(safe-area-inset-bottom));z-index:60;width:44px;height:44px;border-radius:50%;background:var(--card2);border:1px solid var(--line);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,transform .3s,visibility .3s}
.top.show{opacity:1;visibility:visible;transform:none}
.toast{position:fixed;left:50%;bottom:96px;z-index:150;transform:translate(-50%,20px);background:var(--text);color:var(--bg);padding:12px 20px;border-radius:12px;font-size:.9rem;font-weight:600;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s var(--ease);max-width:calc(100% - 32px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.proto{position:fixed;left:18px;bottom:18px;z-index:60;background:rgba(0,0,0,.8);border:1px solid var(--line);font-size:.68rem;padding:6px 12px;border-radius:999px;color:var(--muted)}
@media(max-width:640px){.proto{display:none}}


/* ---------- poprawki po audycie UX/UI ---------- */
body{-webkit-tap-highlight-color:transparent}
@media(max-width:1399px){.fl-xl{display:none}}
.fl>svg{filter:drop-shadow(0 24px 30px rgba(0,0,0,.55)) drop-shadow(0 0 1px rgba(255,255,255,.15))}
.filters button{min-height:44px;display:inline-flex;align-items:center;gap:6px}
.filters .cnt{font-size:.7rem;font-weight:700;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--card2);color:var(--muted);display:inline-grid;place-items:center}
.filters button.on .cnt{background:var(--bg);color:var(--text)}
.svc a,.p-cta,.sup a{min-height:44px;display:inline-flex;align-items:center}
.amounts button{min-height:44px}
.field input:not([type=range]):not([type=checkbox]),.field textarea,.field select{font-size:1rem}
input[type=range]{-webkit-appearance:none;appearance:none;height:8px;border-radius:999px;margin:14px 0 6px;cursor:pointer;
  background:linear-gradient(90deg,var(--pink),var(--violet) var(--v,24%),var(--card2) var(--v,24%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:5px solid var(--pink);box-shadow:0 4px 14px rgba(255,46,136,.55);transition:transform .15s}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:5px solid var(--pink);box-shadow:0 4px 14px rgba(255,46,136,.55)}
input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
.range-scale{display:flex;justify-content:space-between;font-size:.72rem;color:var(--dim)}
.icon-btn:disabled{opacity:.35;cursor:default;border-color:var(--line)}
.wa{transition:transform .25s var(--ease),opacity .3s}
.wa.hide{opacity:0;pointer-events:none;transform:translateY(20px)}
.wa::before{animation-iteration-count:3}
.lb .art{touch-action:pan-y}
.swipe-hint{display:none;font-size:.75rem;color:var(--dim)}
@media(hover:none){.swipe-hint{display:block}}


/* ---------- ikony: dwutonowe z gradientem marki ---------- */
.ico{stroke-width:1.7}
.p-ico,.c-ico{--if:url(#icoG);border:1px solid transparent!important;
  background:linear-gradient(var(--card2),var(--card2)) padding-box,linear-gradient(135deg,rgba(255,46,136,.55),rgba(139,92,246,.25) 50%,rgba(34,211,238,.55)) border-box!important;
  box-shadow:0 10px 24px -12px rgba(255,46,136,.45),inset 0 1px 0 rgba(255,255,255,.06)}
.p-ico .ico,.c-ico .ico{width:28px;height:28px;stroke:url(#icoG);filter:drop-shadow(0 0 6px rgba(255,46,136,.25))}
.svc:hover .p-ico,.price:hover .p-ico,.sup:hover .p-ico{transform:rotate(-6deg) scale(1.06)}
.p-ico{transition:transform .35s var(--ease)}
.types input:checked+label .ico{--if:url(#icoG);stroke:url(#icoG)}
.promise .ico{--if:var(--yellow)}
.checks li .ico{--if:var(--cyan)}
.socials a:hover .ico{--if:var(--pink)}
.big-ico .ico{--if:#fff;stroke-width:2}


/* ---------- prawdziwe prace ---------- */
.tile .photo{object-position:50% 30%}
.tile.big .photo{object-position:50% 45%}
.lb .art{aspect-ratio:4/5;max-height:calc(100svh - 48px)}
.lb .art .photo{object-fit:contain;background:#0d0d10}
.ba{aspect-ratio:4/5;max-height:760px;margin-inline:auto;width:100%}
#ba .before .photo{object-position:72% 50%}
#ba .after .photo{object-position:42% 50%}
.portrait .photo{object-position:50% 30%}
.tile-cta{grid-column:span 3;display:flex;align-items:center;gap:clamp(18px,3vw,36px);padding:var(--pad);border-radius:var(--r);border:1.5px dashed var(--line2);
  background:radial-gradient(circle at 0% 0%,rgba(255,46,136,.16),transparent 55%),radial-gradient(circle at 100% 100%,rgba(34,211,238,.12),transparent 55%),var(--card);
  transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .3s,transform .35s var(--ease)}
.tile-cta:hover{border-color:var(--pink);transform:translateY(-4px)}
.cta-ill{display:flex;align-items:center;gap:4px;flex:none}
.cta-ill svg{width:84px;filter:drop-shadow(0 12px 16px rgba(0,0,0,.5));transition:transform .5s var(--ease)}
.cta-ill svg:nth-child(1){width:120px;transform:rotate(-8deg)}
.cta-ill svg:nth-child(3){transform:rotate(8deg)}
.tile-cta:hover .cta-ill svg{transform:translateY(-6px) rotate(0)}
.cta-txt{display:grid;gap:6px;flex:1}
.cta-txt b{font-family:Anton;font-size:clamp(1.4rem,2.4vw,2rem);font-weight:400;text-transform:uppercase;line-height:1.05}
.cta-txt>span:last-child{color:var(--muted);font-size:.93rem}
.tile-cta .btn{flex:none}
@media(max-width:1020px){.tile-cta{grid-column:1/-1}}
@media(max-width:760px){
  #grid{grid-auto-flow:row dense}   /* bez dziur w 2 kolumnach (także po filtrowaniu) */
  .tile-cta{flex-direction:column;text-align:center}
  .cta-ill svg{width:64px}.cta-ill svg:nth-child(1){width:96px}
  .cta-txt{justify-items:center}
}


/* ---------- menu odzwierciedlające sekcje ---------- */
.menu{gap:0}
.menu a{padding:8px 11px;font-size:.86rem;white-space:nowrap}
@media(max-width:1259px){.menu{display:none}.burger{display:block}}
@media(min-width:1260px){.menu{display:flex}.burger{display:none}}
.mnav{justify-content:flex-start;overflow-y:auto;padding-top:92px;gap:0}
.mnav a{display:flex;align-items:baseline;gap:14px;font-size:clamp(1.7rem,7.6vw,2.6rem);line-height:1.25;padding:2px 0}
.mnav a i{font-family:Inter,sans-serif;font-style:normal;font-size:.75rem;font-weight:700;color:var(--pink);letter-spacing:1px;min-width:22px}
.mnav a.active{color:var(--pink)}
@media(min-width:700px){.mnav{display:grid;grid-template-columns:1fr 1fr;align-content:center;column-gap:48px}.mnav small{grid-column:1/-1}}


/* ---------- wczytywanie zdjęć (połysk) ---------- */
.art[data-img]:not(.has-img)::after,.portrait[data-img]:not(.has-img)::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.07) 50%,transparent 70%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
@keyframes shimmer{to{background-position:-200% 0}}
.photo{animation:photoIn .7s var(--ease) backwards}
@keyframes photoIn{from{opacity:0;filter:blur(10px);transform:scale(1.04)}}

/* ---------- lightbox ---------- */
.lb-nav{align-items:center}
.lb-count{font-family:Anton;font-size:1.1rem;color:var(--muted);min-width:56px;text-align:center}

/* ---------- suwak – podpowiedź ---------- */
.drag-hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:2;font-size:.78rem;font-weight:700;padding:8px 14px;border-radius:999px;background:rgba(13,13,16,.75);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);transition:opacity .4s;pointer-events:none}
.drag-hint.gone{opacity:0}

/* ---------- paralaksa zdjęcia O mnie ---------- */
.portrait .photo{transform:translateY(var(--par,0px)) scale(1.12)}

/* ---------- przyciski magnetyczne ---------- */
.btn.mag{transition:transform .35s var(--ease),box-shadow .25s,background-position .4s}

/* ---------- stopka: wielki napis ---------- */
footer{overflow:hidden}
.wordmark{font-family:Anton;font-size:clamp(3rem,14.2vw,15.5rem);line-height:.85;text-align:center;white-space:nowrap;margin-top:clamp(40px,6vw,80px);color:transparent;-webkit-text-stroke:1px var(--line2);background:linear-gradient(90deg,var(--pink),var(--violet),var(--cyan));-webkit-background-clip:text;background-clip:text;background-size:0% 100%;background-repeat:no-repeat;transition:background-size 1.4s var(--ease);user-select:none}
.wordmark.in{background-size:100% 100%}
.wordmark span{color:inherit}
@media (prefers-reduced-motion:reduce){.photo{animation:none}}


/* =========================================================
   ANIMACJE "AEROGRAFOWE"
   Maska = rdzeń (pełny kolor) + ziarnista krawędź (szum ∩ pierścień)
   ========================================================= */
@property --sr{syntax:'<percentage>';inherits:false;initial-value:150%}
@property --pp{syntax:'<percentage>';inherits:false;initial-value:130%}
:root{--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 9 -4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* 1) prace i zdjęcie Klaudii odsłaniają się natryskiem */
.tile .art,.portrait{--sx:50%;--sy:50%;
  -webkit-mask-image:radial-gradient(circle at var(--sx) var(--sy),#000 calc(var(--sr) - 24%),transparent calc(var(--sr) - 9%)),var(--noise),radial-gradient(circle at var(--sx) var(--sy),#000 calc(var(--sr) - 7%),transparent var(--sr));
  -webkit-mask-size:100% 100%,160px 160px,100% 100%;-webkit-mask-repeat:no-repeat,repeat,no-repeat;-webkit-mask-composite:source-over,source-in;
  mask-image:radial-gradient(circle at var(--sx) var(--sy),#000 calc(var(--sr) - 24%),transparent calc(var(--sr) - 9%)),var(--noise),radial-gradient(circle at var(--sx) var(--sy),#000 calc(var(--sr) - 7%),transparent var(--sr));
  mask-size:100% 100%,160px 160px,100% 100%;mask-repeat:no-repeat,repeat,no-repeat;mask-composite:add,intersect}
.tile.rv:not(.in) .art,.portrait-wrap.rv:not(.in) .portrait{--sr:0%}
.tile.rv.in .art,.portrait-wrap.rv.in .portrait{animation:sprayIn 1.6s cubic-bezier(.3,.6,.3,1) backwards;animation-delay:var(--sd,.1s)}
@keyframes sprayIn{from{--sr:0%}to{--sr:150%}}

/* 2) gradientowe słowa w nagłówkach malowane od lewej */
h2 .grad-text{
  -webkit-mask-image:linear-gradient(90deg,#000 calc(var(--pp) - 16%),transparent calc(var(--pp) - 5%)),var(--noise),linear-gradient(90deg,#000 calc(var(--pp) - 5%),transparent var(--pp));
  -webkit-mask-size:100% 100%,80px 80px,100% 100%;-webkit-mask-repeat:no-repeat,repeat,no-repeat;-webkit-mask-composite:source-over,source-in;
  mask-image:linear-gradient(90deg,#000 calc(var(--pp) - 16%),transparent calc(var(--pp) - 5%)),var(--noise),linear-gradient(90deg,#000 calc(var(--pp) - 5%),transparent var(--pp));
  mask-size:100% 100%,80px 80px,100% 100%;mask-repeat:no-repeat,repeat,no-repeat;mask-composite:add,intersect}
.rv:not(.in) h2 .grad-text{--pp:-12%}
.rv.in h2 .grad-text{animation:paintIn 1.4s .35s cubic-bezier(.4,.1,.3,1) backwards}
@keyframes paintIn{from{--pp:-12%}to{--pp:130%}}

/* 3) suwak: rozpylona granica zamiast ostrej linii */
.ba .after{clip-path:none;--p:50%;
  -webkit-mask-image:linear-gradient(90deg,transparent calc(var(--p) + 1%),#000 calc(var(--p) + 6%)),var(--noise),linear-gradient(90deg,transparent calc(var(--p) - 7%),#000 calc(var(--p) - 1%));
  -webkit-mask-size:100% 100%,120px 120px,100% 100%;-webkit-mask-repeat:no-repeat,repeat,no-repeat;-webkit-mask-composite:source-over,source-in;
  mask-image:linear-gradient(90deg,transparent calc(var(--p) + 1%),#000 calc(var(--p) + 6%)),var(--noise),linear-gradient(90deg,transparent calc(var(--p) - 7%),#000 calc(var(--p) - 1%));
  mask-size:100% 100%,120px 120px,100% 100%;mask-repeat:no-repeat,repeat,no-repeat;mask-composite:add,intersect}
.ba .bar{width:2px;background:linear-gradient(transparent,rgba(255,255,255,.75) 20%,rgba(255,255,255,.75) 80%,transparent);box-shadow:0 0 18px 4px rgba(255,46,136,.35)}

/* 4) kroki zapalają się po kolei */
.step{overflow:hidden;transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .5s}
.step:nth-child(1){--c:var(--pink)}.step:nth-child(2){--c:var(--violet)}.step:nth-child(3){--c:var(--cyan)}.step:nth-child(4){--c:var(--yellow)}
.step::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--c),transparent);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s var(--ease)}
.step::before{transition:color .5s,text-shadow .6s}
.step:not(.lit)::before{color:var(--line2)!important}
.step.lit{border-color:var(--line2);border-color:color-mix(in srgb,var(--c) 40%,var(--line))}
.step.lit::before{text-shadow:0 0 28px var(--c)}
.step.lit::after{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){.step:not(.lit)::before{color:inherit!important}}


/* ---------- usługi jako frazy z przykładami ---------- */
.svc-jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.svc-jump a{padding:9px 16px;border-radius:999px;border:1px solid var(--line2);font-size:.86rem;font-weight:600;color:var(--muted);transition:border-color .2s,color .2s,background .2s}
.svc-jump a:hover{border-color:var(--pink);color:var(--text);background:rgba(255,46,136,.08)}
.svc-list{display:grid;gap:clamp(18px,2.4vw,28px)}
.svc-row{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(24px,4.5vw,64px);align-items:center;padding:clamp(16px,2vw,24px);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);scroll-margin-top:96px;transition:opacity .9s var(--ease),translate .9s var(--ease),border-color .3s}
.svc-row:hover{border-color:var(--line2)}
.svc-row:nth-child(even) .svc-media{order:2}
@media(max-width:900px){.svc-row{grid-template-columns:1fr}.svc-row:nth-child(even) .svc-media{order:0}}
.svc-media{position:relative;aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(circle at 25% 25%,rgba(255,46,136,.28),transparent 50%),radial-gradient(circle at 80% 80%,rgba(34,211,238,.22),transparent 50%),#121218}
.svc-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .8s var(--ease)}
.svc-row:hover .svc-photo{transform:scale(1.04)}
.svc-ill{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.svc-ill svg{filter:drop-shadow(0 20px 26px rgba(0,0,0,.55));transition:transform .6s var(--ease)}
.svc-row:hover .svc-ill svg{transform:translateY(-6px)}
.svc-note{position:absolute;left:12px;bottom:12px;font-size:.68rem;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#ccc}
.mini-voucher{width:42%;aspect-ratio:16/10;border-radius:14px;background:var(--grad);display:flex;flex-direction:column;justify-content:center;padding:14px 16px;color:#fff;transform:rotate(6deg);box-shadow:0 20px 30px -12px rgba(255,46,136,.55)}
.mini-voucher small{font-size:.62rem;font-weight:700;letter-spacing:2px;opacity:.9}
.mini-voucher b{font-family:Anton;font-weight:400;font-size:clamp(1.3rem,2.6vw,2rem);line-height:1}
.svc-body{display:grid;gap:14px;padding:clamp(4px,1vw,12px) clamp(4px,1.5vw,16px)}
.svc-num{font-family:Anton;font-size:1rem;color:var(--pink);letter-spacing:2px}
.svc-body h3{font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.02}
.svc-lead{font-size:1.08rem;font-weight:600}
.svc-body p:not(.svc-lead){color:var(--muted);font-size:.96rem}
.svc-chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.svc-chips li{font-size:.78rem;padding:5px 11px;border-radius:999px;background:var(--card2);color:var(--muted)}
.svc-ex{display:grid;gap:10px;padding-top:14px;border-top:1px dashed var(--line)}
.svc-ex-l{font-size:.72rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--cyan)}
.svc-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.svc-thumb{width:68px;height:84px;border-radius:12px;overflow:hidden;padding:0;border:2px solid var(--line);background:var(--card2);cursor:pointer;transition:border-color .2s,transform .3s var(--ease)}
.svc-thumb img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.svc-thumb:hover{border-color:var(--pink);transform:translateY(-3px)}
.svc-more{font-weight:700;font-size:.92rem;display:inline-flex;gap:8px;align-items:center;min-height:44px}
.svc-more:hover{color:var(--cyan)}
.svc-cta{padding-top:4px}
.svc-cta .btn{min-height:48px}


/* ---------- usługi: kompaktowe karty z frazami ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media(max-width:1020px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.svc-grid{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:84%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gutter)*-1);padding:0 var(--gutter) 8px;scroll-padding-inline:var(--gutter)}.svc-grid::-webkit-scrollbar{display:none}.sc{scroll-snap-align:start}}
.sc{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden;scroll-margin-top:96px;transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .3s,transform .35s var(--ease)}
.sc:hover{border-color:var(--line2);transform:translateY(-4px)}
.sc-media{position:relative;aspect-ratio:16/9;overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(circle at 25% 25%,rgba(255,46,136,.28),transparent 50%),radial-gradient(circle at 80% 80%,rgba(34,211,238,.22),transparent 50%),#121218}
.sc-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 28%;transition:transform .8s var(--ease)}
.sc:hover .sc-photo{transform:scale(1.05)}
.sc-ill{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.sc-ill svg{filter:drop-shadow(0 16px 22px rgba(0,0,0,.55));transition:transform .6s var(--ease)}
.sc:hover .sc-ill svg{transform:translateY(-5px)}
.sc-ill .mini-voucher{width:36%;padding:10px 12px}
.sc-note{position:absolute;left:10px;bottom:10px;font-size:.64rem;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.6);color:#ccc}
.sc-num{position:absolute;top:10px;right:12px;font-family:Anton;font-size:1.6rem;line-height:1;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.sc-body{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2vw,24px);flex:1}
.sc-body h3{font-size:clamp(1.25rem,1.7vw,1.5rem);line-height:1.08}
.sc-body p{color:var(--muted);font-size:.92rem;flex:1}
.sc-chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.sc-chips li{font-size:.72rem;padding:4px 10px;border-radius:999px;background:var(--card2);color:var(--muted)}
.sc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px;margin-top:4px;border-top:1px dashed var(--line);min-height:56px}
.sc-thumbs{display:flex}
.sc-thumbs .svc-thumb{width:40px;height:48px;border-radius:10px;margin-right:-8px;border:2px solid var(--card)}
.sc-thumbs .svc-thumb:hover{z-index:1;border-color:var(--pink)}
.sc-ig{font-size:.8rem;font-weight:600;color:var(--muted)}
.sc-ig:hover{color:var(--cyan)}
.sc-cta{font-weight:700;font-size:.92rem;display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--text);white-space:nowrap}
.sc-cta:hover{color:var(--pink)}
.sc-local{justify-content:center;gap:14px;padding:clamp(22px,2.6vw,32px);border-style:dashed;background:radial-gradient(circle at 100% 0%,rgba(255,210,63,.12),transparent 55%),var(--card)}
.sc-local .p-ico{--if:url(#icoG)}
.sc-local h3{font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.1}
.sc-local p{color:var(--muted);font-size:.92rem}
.sc-local .btn{align-self:flex-start;min-height:48px}


/* ---------- taśmy: zestawy słów powielane do szerokości ekranu ---------- */
.tape-set{display:flex;gap:40px;flex:none}
.tape-track{gap:40px}
.tape-set span::after{content:"✦";margin-left:40px}


/* ---------- logo: podpis artystki ---------- */
.logo{display:flex;align-items:center;line-height:0}
.brand{display:block;height:48px;width:auto;overflow:visible}
.brand.b-nav{height:62px;transition:height .3s}
#nav.scrolled .brand.b-nav{height:52px}
.brand.b-foot{height:70px}
@media(max-width:640px){.brand.b-nav{height:48px}#nav.scrolled .brand.b-nav{height:44px}}
@media(max-width:400px){.brand.b-nav{height:43px}#nav.scrolled .brand.b-nav{height:40px}}
.brand .pen{filter:drop-shadow(0 0 4px #ff2e88) drop-shadow(0 0 10px #8b5cf6)}


/* ---------- formularz: lista rozwijana ze strzałką i odstępem ---------- */
.field select{-webkit-appearance:none;appearance:none;padding-right:52px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23a8a8b6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center;background-size:16px}
.field select:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%2322d3ee' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.field select option{background:#1a1a21;color:#f5f5f8}

/* ---------- znak wodny na zdjęciach ---------- */
svg.wm{position:absolute;right:4%;bottom:4%;width:clamp(84px,36%,190px);height:auto;opacity:.96;pointer-events:none;z-index:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.9)) drop-shadow(0 2px 6px rgba(0,0,0,.65)) drop-shadow(0 0 14px rgba(0,0,0,.45))}
.ig a .wm{width:46%;right:6%;bottom:6%}
.tile.big svg.wm{width:clamp(110px,26%,200px)}
.tile:hover .art svg.wm{transform:none}
.ig a svg.wm{width:46%;right:6%;bottom:6%}

/* ---------- aerograf w hero: narzędzia ---------- */
/* przyciski aerografu pod paletą – w układzie strony, miejsce zarezerwowane (nic nie przykrywają na żadnym ekranie) */
.spray-tools{position:relative;z-index:2;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;min-height:40px;margin:14px 0 4px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .4s,transform .4s var(--ease),visibility 0s .4s}
.spray-tools.show{opacity:1;visibility:visible;transform:none;transition:opacity .4s,transform .4s var(--ease),visibility 0s}
.spray-tools button{pointer-events:auto;font:600 .82rem Inter;color:var(--text);min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line2);background:rgba(13,13,16,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;transition:border-color .2s}
.spray-tools button:hover{border-color:var(--pink)}

/* ---------- więcej ofert (strona główna) ---------- */
.sc-body h3 a{transition:color .2s}
.sc-body h3 a:hover{color:var(--pink)}
.offer-more{margin-top:var(--head-gap);display:grid;gap:16px}
.offer-more h3{font-size:1.3rem}
.om-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:900px){.om-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.om-list{grid-template-columns:1fr}}
.om-list a{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--card);transition:border-color .2s,transform .25s var(--ease)}
.om-list a:hover{border-color:var(--pink);transform:translateY(-3px)}
.om-list svg.om-ill{width:56px;height:44px;flex:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
.om-list b{display:block;font-size:.95rem}
.om-list small{color:var(--muted);font-size:.8rem}

/* =========================================================
   PODSTRONY USŁUG
   ========================================================= */
.sub-hero{padding:calc(76px + 48px) 0 clamp(64px,8vw,110px);position:relative;overflow:hidden;isolation:isolate}
.sub-hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,72px);align-items:center}
@media(max-width:900px){.sub-hero .wrap{grid-template-columns:1fr}}
.crumbs{font-size:.84rem;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.crumbs a:hover{color:var(--text)}
.crumbs span{color:var(--dim)}
.sub-hero h1{font-size:clamp(2.5rem,6vw,4.8rem);margin:14px 0 18px;line-height:1}
.sub-hero .lead{margin-bottom:28px}
.sub-hero .hero-actions{justify-content:flex-start}
.sub-facts{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.sub-facts span{display:inline-flex;align-items:center;gap:8px;font-size:.84rem;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted)}
.sub-facts .ico{color:var(--yellow)}
.sub-media{position:relative;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);display:grid;place-items:center;
  background:radial-gradient(circle at 25% 20%,rgba(255,46,136,.3),transparent 50%),radial-gradient(circle at 80% 80%,rgba(34,211,238,.24),transparent 50%),#121218;box-shadow:0 40px 80px -40px #000}
@media(max-width:900px){.sub-media{aspect-ratio:4/3}}
.sub-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.sub-media .ill{display:flex;align-items:center;justify-content:center;gap:4%;width:100%;height:100%}
.sub-media .ill svg{filter:drop-shadow(0 24px 30px rgba(0,0,0,.55));animation:bob 7s ease-in-out infinite}
.sub-media .ill svg:nth-child(2){animation-delay:-3s}
.sub-media .note{position:absolute;left:14px;bottom:14px;font-size:.7rem;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#ccc}
.what{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media(max-width:960px){.what{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.what{grid-template-columns:1fr}}
.what article{padding:var(--pad);border:1px solid var(--line);border-radius:var(--r);background:var(--card);display:grid;gap:10px;align-content:start;transition:opacity .8s var(--ease),translate .8s var(--ease),border-color .3s}
.what article:hover{border-color:var(--line2)}
.what .p-ico{width:48px;height:48px;font-size:1.4rem}
.what h3{font-size:1.3rem}
.what p{color:var(--muted);font-size:.93rem}
.ex-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:900px){.ex-grid{grid-template-columns:repeat(2,1fr)}}
.ex-grid figure{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);margin:0}
.ex-grid img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .7s var(--ease)}
.ex-grid figure:hover img{transform:scale(1.05)}
.ex-grid figcaption{position:absolute;left:10px;top:10px;font-size:.74rem;font-weight:700;padding:5px 10px;border-radius:999px;background:rgba(13,13,16,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:2}
.ex-empty{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;padding:var(--pad);border:1px dashed var(--line2);border-radius:var(--r);color:var(--muted)}
@media(max-width:700px){.ex-empty{grid-template-columns:1fr}}
.price-band{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:clamp(24px,3vw,40px);border-radius:var(--r-lg);border:1px solid var(--line);
  background:radial-gradient(circle at 0 0,rgba(255,46,136,.2),transparent 50%),radial-gradient(circle at 100% 100%,rgba(34,211,238,.16),transparent 50%),var(--bg2)}
@media(max-width:700px){.price-band{grid-template-columns:1fr}}
.price-band .amt{font-family:Anton;font-size:clamp(2.4rem,5vw,3.6rem);line-height:1}
.price-band p{color:var(--muted)}
.related{display:flex;flex-wrap:wrap;gap:10px}
.related a{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid var(--line2);font-weight:600;font-size:.9rem;transition:border-color .2s,background .2s}
.related a:hover{border-color:var(--pink);background:rgba(255,46,136,.08)}
.step.lit::before{text-shadow:0 0 28px var(--c)}

/* prawdziwe zdjęcia (folder img/) */
.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;transition:transform .7s var(--ease)}
.has-img>svg:not(.wm),.has-img>.ph,.has-img>.ph-c{display:none}
.ig a.has-img svg.shape{display:none}

/* pojawianie się */
.rv{opacity:0;translate:0 28px;transition:opacity .9s var(--ease),translate .9s var(--ease)}
.rv.in{opacity:1;translate:0 0}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important}
  .rv{opacity:1;translate:none}
  .rot{transition:none}
}

/* ---------- ikony w "Co jeszcze maluję" – jednolite kafelki ---------- */
.om-ico{width:64px;height:64px;flex:none;border-radius:16px;display:grid;place-items:center;overflow:hidden;border:1px solid transparent;
  background:radial-gradient(circle at 30% 25%,rgba(255,46,136,.18),transparent 60%) padding-box,linear-gradient(var(--card2),var(--card2)) padding-box,linear-gradient(135deg,rgba(255,46,136,.6),rgba(139,92,246,.25) 50%,rgba(34,211,238,.6)) border-box;
  box-shadow:0 10px 22px -12px rgba(255,46,136,.5),inset 0 1px 0 rgba(255,255,255,.06)}
.om-ico svg.om-ill{width:78%;height:78%;filter:drop-shadow(0 6px 6px rgba(0,0,0,.55));transition:transform .45s var(--ease)}
.om-list a:hover .om-ico svg.om-ill{transform:scale(1.1) rotate(-5deg)}
.om-list a[href^="aerografia"] .om-ill{width:92%;height:92%}
.om-list a[href^="dla-firm"] .om-ill{width:72%;height:72%}
.om-list a{gap:16px;padding:14px 18px}

/* ---------- okno zakupu bonu ---------- */
.vd{display:grid;grid-template-columns:.9fr 1.1fr;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;position:relative}
@media(max-width:820px){.vd{grid-template-columns:1fr}}
.vd-side{padding:clamp(22px,3vw,36px);display:grid;gap:18px;align-content:start;background:radial-gradient(circle at 0 0,rgba(255,46,136,.22),transparent 55%),radial-gradient(circle at 100% 100%,rgba(34,211,238,.18),transparent 55%),var(--bg2)}
.vd-side h3{font-size:clamp(1.8rem,3vw,2.4rem)}
.vd-card{transform:none!important;aspect-ratio:16/10;gap:6px}
.vd-card:hover{transform:none}
.vd-meta{display:grid;gap:2px;font-size:.85rem;font-weight:600}
.vd-meta #vpMsg{font-family:Caveat,cursive;font-size:1.3rem;font-weight:700;line-height:1.1}
.vd-points{list-style:none;display:grid;gap:8px;font-size:.88rem;color:var(--muted)}
.vd-points li{display:flex;gap:10px;align-items:flex-start}
.vd-points .ico{color:var(--cyan);font-size:1.1rem;margin-top:1px;--if:var(--cyan)}
#vForm{padding:clamp(22px,3vw,36px);display:block}
#vForm .flabel{display:block}
.vd-fmt{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vd-fmt input{position:absolute;opacity:0;pointer-events:none}
.vd-fmt label{border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;cursor:pointer;display:grid;gap:2px;transition:border-color .2s,background .2s}
.vd-fmt label small{color:var(--muted);font-size:.78rem}
.vd-fmt input:checked+label{border-color:var(--pink);background:rgba(255,46,136,.08)}
.vd-fmt input:focus-visible+label{outline:2px solid var(--cyan);outline-offset:2px}
.vd-total{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 16px;border-top:1px dashed var(--line);margin-top:4px;color:var(--muted)}
.vd-total b{font-family:Anton;font-weight:400;font-size:2.2rem;color:var(--text)}
.vd-ok{text-align:center;padding:30px 6px;display:grid;gap:14px;justify-items:center}
.vd-ok h3{font-size:2rem}
.vd-ok .big-ico{width:76px;height:76px;border-radius:50%;background:var(--grad);display:grid;place-items:center;font-size:2rem;color:#fff}
.vd-ok .big-ico .ico{--if:#fff;stroke-width:2}
#vDlg{width:min(980px,calc(100% - 24px))}

/* atrybut hidden zawsze ukrywa (nadpisuje display z klas) */
[hidden]{display:none!important}

/* ---------- stopka: ikony social mediów ---------- */
.soc-h{margin-top:22px;font-size:.74rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--text)}
.socials{margin-top:12px;gap:10px}
.socials a{width:48px;height:48px;border-radius:14px;font-size:22px;--if:url(#icoG);border:1px solid transparent;
  background:linear-gradient(var(--card2),var(--card2)) padding-box,linear-gradient(135deg,rgba(255,46,136,.6),rgba(139,92,246,.3) 50%,rgba(34,211,238,.6)) border-box;
  box-shadow:0 8px 18px -10px rgba(255,46,136,.5);transition:transform .25s var(--ease),box-shadow .25s,background .25s}
.socials a .ico{width:22px;height:22px;stroke:url(#icoG);stroke-width:1.9}
.socials a:hover{transform:translateY(-3px);background:linear-gradient(135deg,#ff2e88,#8b5cf6 50%,#22d3ee) padding-box,linear-gradient(135deg,#ff2e88,#22d3ee) border-box;box-shadow:0 12px 24px -10px rgba(255,46,136,.7)}
.socials a:hover .ico{stroke:#fff;--if:#fff}

/* ---------- cennik: uwagi ---------- */
.price .from{min-height:2.6em}
.price-notes{margin-top:28px;display:grid;gap:12px}
.price-notes p{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:.92rem;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.price-notes p:first-child{border-color:rgba(255,46,136,.45);background:linear-gradient(90deg,rgba(255,46,136,.08),var(--card) 60%)}
.price-notes b{color:var(--text)}
.price-notes .ico{flex:none;font-size:1.25rem;margin-top:1px;--if:url(#icoG);stroke:url(#icoG)}
.socials a:hover{color:#fff}

/* ---------- aerograf: paleta kolorów ---------- */
.palette{flex-wrap:wrap;justify-content:center;gap:10px 14px;pointer-events:auto;border-radius:22px;padding:10px 16px;max-width:min(680px,100%)}
.sw-row{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:7px;align-items:center}
.sw{width:24px;height:24px;flex:none;border-radius:50%;border:2px solid rgba(255,255,255,.22);background:var(--c);cursor:pointer;padding:0;position:relative;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s}
.sw:hover{transform:scale(1.18)}
.sw.on{border-color:#fff;transform:scale(1.12);box-shadow:0 0 0 3px rgba(255,255,255,.14),0 0 14px var(--c,#ff2e88)}
.sw-auto{background:conic-gradient(#ff2e88,#ffd23f,#22c55e,#22d3ee,#3b82f6,#8b5cf6,#ff2e88)}
.sw-custom{background:conic-gradient(#f43f5e,#ffd23f,#a3e635,#22d3ee,#3b82f6,#d946ef,#f43f5e);overflow:hidden;display:inline-block}
.sw-custom::after{content:"+";position:absolute;inset:0;display:grid;place-items:center;font:800 14px/1 Inter;color:#0d0d10;text-shadow:0 0 3px #fff}
.sw-custom.picked{background:var(--c)}
.sw-custom.picked::after{content:""}
.sw-custom input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0}
@media(max-width:640px){.sw{width:28px;height:28px}.hint-t{width:100%;text-align:center}}
.palette{flex-direction:column;gap:9px;padding:12px 18px;width:auto}
.hint-t{text-align:center}

/* ---------- usługi: tło ikon ---------- */
.sc-icon{position:relative;height:clamp(150px,13vw,180px);display:grid;place-items:center;border-bottom:1px solid var(--line);overflow:hidden;
  background:radial-gradient(circle at 50% 58%,rgba(139,92,246,.10),transparent 70%),repeating-linear-gradient(135deg,rgba(255,255,255,.012) 0 2px,transparent 2px 6px)}
.sc-icon .sc-num{color:transparent;-webkit-text-stroke:1px var(--line2);text-shadow:none;font-size:2.4rem;top:12px;right:16px}
.om-ico{background:radial-gradient(circle at 50% 55%,rgba(139,92,246,.18),transparent 70%) padding-box,linear-gradient(var(--card2),var(--card2)) padding-box,linear-gradient(135deg,rgba(255,46,136,.5),rgba(139,92,246,.2) 50%,rgba(34,211,238,.5)) border-box!important;overflow:visible!important}

/* ---------- usługi: dopracowane ilustracje-ikony ---------- */
.sc-icon .sc-ill{position:relative;z-index:1;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.sc-icon::before{content:"";position:absolute;left:50%;top:50%;width:62%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,46,136,.22),rgba(139,92,246,.12) 45%,transparent 70%);filter:blur(6px)}
.sc-icon::after{content:"";position:absolute;left:50%;bottom:14%;width:46%;height:12px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent)}
.sc-icon .sc-ill svg{filter:drop-shadow(0 14px 14px rgba(0,0,0,.5));transition:transform .6s var(--ease)}
.sc:hover .sc-icon .sc-ill svg{translate:0 -6px}
.om-list a[href^="aerografia"] .om-ill{width:96%;height:96%}
.om-list a[href^="instrumenty"] .om-ill,.om-list a[href^="akcesoria"] .om-ill,.om-list a[href^="gaming"] .om-ill,.om-list a[href^="murale"] .om-ill,.om-list a[href^="dla-firm"] .om-ill{width:82%;height:82%}
/* om-list: wyraźny sygnał, że pozycja prowadzi do podstrony */
.om-list a>span:nth-child(2){flex:1;min-width:0}
.om-list a::after{content:"";flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/16px no-repeat;
  opacity:.55;transition:transform .3s var(--ease),opacity .3s,background-color .3s,border-color .3s}
.om-list a:hover::after{opacity:1;transform:translateX(4px);background-color:var(--pink,#ff2e88);border-color:transparent}
/* stopka: autor strony */
.fb-links{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.foot-bottom .credit{color:var(--dim);transition:color .2s}
.foot-bottom .credit b{font-weight:600;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.foot-bottom .credit:hover{color:var(--text,#fff)}

/* ---------- podstrona O mnie ---------- */
.story{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(36px,6vw,88px);align-items:center}
@media(max-width:900px){.story{grid-template-columns:1fr}}
.story-copy p:not(.eyebrow){color:var(--muted);font-size:1.05rem;line-height:1.75;margin-top:18px}
.story-copy h2{margin-bottom:6px}
.story-copy .lnk{color:var(--text);text-decoration:underline;text-decoration-color:var(--pink);text-underline-offset:3px}
.story-ph{position:relative;margin:0;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.story-ph img{width:100%;height:100%;object-fit:cover}
.story-ph figcaption{position:absolute;left:12px;right:12px;bottom:12px;padding:10px 14px;border-radius:12px;font-size:.84rem;background:rgba(13,13,16,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--muted)}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px)}
@media(max-width:900px){.tools{grid-template-columns:1fr}}
.tools>div{padding:clamp(22px,2.6vw,30px);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card)}
.tools h3{font-size:1.05rem;margin-bottom:14px}
.more-ig{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:clamp(28px,4vw,44px)}
.about-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:8px}
.story-ph svg.wm{bottom:62px;width:clamp(96px,40%,180px)}
.amt .amt-od{font-family:Inter,system-ui,sans-serif;font-size:.95rem;font-weight:600;color:var(--muted);margin-right:6px;letter-spacing:0;vertical-align:.55em}
/* paski pod hero: rozsunięte, żeby się nie zakrywały */
.tapes{height:clamp(196px,17vw,236px)}
.tape.t2{transform:translateY(-58%) rotate(1deg)}
.tape.t1{transform:translateY(52%) rotate(-1.5deg)}
.t2 .tape-track{-webkit-text-stroke:1.3px var(--muted)}
@media(max-width:700px){
  .tapes{height:150px}
  .tape{padding:12px 0}
  .tape.t2{transform:translateY(-52%) rotate(3deg)}
  .tape.t1{transform:translateY(46%) rotate(-3deg)}
  .t2 .tape-track{color:var(--muted);-webkit-text-stroke:0}
}

/* ---------- smuga aerografu za ikonami ---------- */
:root{--smudge1:url("../img/smuga-1.svg");--smudge2:url("../img/smuga-2.svg");--smudge3:url("../img/smuga-3.svg");--smudgeSq:url("../img/smuga-sq.svg")}
.sc-icon::before{width:92%;height:88%;aspect-ratio:auto;border-radius:0;filter:none;opacity:.9;
  background:var(--smudge1) center/contain no-repeat;transition:transform .8s var(--ease),opacity .4s}
.sc:nth-child(3n+2) .sc-icon::before{background-image:var(--smudge2)}
.sc:nth-child(3n) .sc-icon::before{background-image:var(--smudge3)}
.sc:hover .sc-icon::before{transform:translate(-50%,-50%) scale(1.08) rotate(-2deg);opacity:1}
.om-ico{position:relative}
.om-ico::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--smudgeSq) center/contain no-repeat;opacity:1;pointer-events:none;transition:transform .5s var(--ease),opacity .3s}
.om-list li:nth-child(2n) .om-ico::before,.om-list a:nth-child(2n) .om-ico::before{transform:scaleX(-1)}
.om-ico svg.om-ill{position:relative;z-index:1}
.om-list a:hover .om-ico::before{opacity:1}
.price .p-ico,.what .p-ico{position:relative}

/* ---------- FAQ: karty z animowanym rozwijaniem ---------- */
.faq-list{border-top:0;display:grid;gap:10px;counter-reset:faq}
.faq-list details{position:relative;border:1px solid var(--line);border-radius:18px;background:var(--card);padding:0 clamp(16px,2vw,22px);
  transition:border-color .3s,background .3s,box-shadow .5s var(--ease),transform .3s var(--ease)}
.faq-list details:hover{border-color:var(--line2);transform:translateX(3px)}
.faq-list details.is-open{transform:none;border-color:transparent;
  background:linear-gradient(var(--card2),var(--card2)) padding-box,var(--grad) border-box;box-shadow:0 22px 46px -22px rgba(255,46,136,.45),0 0 0 1px rgba(139,92,246,.08)}
.faq-list summary{justify-content:flex-start;padding:19px 0;gap:14px;line-height:1.35}
.faq-list summary:hover{color:var(--text)}
.faq-list summary::before{counter-increment:faq;content:counter(faq,decimal-leading-zero);flex:none;width:36px;font-family:Anton,sans-serif;font-size:1.35rem;font-weight:400;line-height:1;
  color:transparent;-webkit-text-stroke:1px var(--dim);transition:-webkit-text-stroke-color .3s}
.faq-list details:hover summary::before{-webkit-text-stroke-color:var(--muted)}
.faq-list details.is-open summary::before{-webkit-text-stroke:0;background:var(--grad);-webkit-background-clip:text;background-clip:text}
.faq-list summary::after{content:"";margin-left:auto;width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);flex:none;
  background:linear-gradient(var(--pink),var(--pink)) center/12px 2px no-repeat,linear-gradient(var(--pink),var(--pink)) center/2px 12px no-repeat;
  transition:transform .55s cubic-bezier(.34,1.56,.64,1),border-color .3s,box-shadow .3s}
.faq-list details:hover summary::after{border-color:var(--pink)}
.faq-list details.is-open summary::after{transform:rotate(135deg);border-color:transparent;
  background:linear-gradient(#fff,#fff) center/12px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 12px no-repeat,var(--grad);
  box-shadow:0 6px 18px -4px rgba(255,46,136,.6)}
.faq-list details>:not(summary){position:relative;margin:0 0 0 50px;padding:0 6px 22px 18px;color:var(--muted);font-size:.95rem;line-height:1.7}
.faq-list details>:not(summary)::before{content:"";position:absolute;left:0;top:3px;bottom:25px;width:2px;border-radius:2px;background:var(--grad);transform-origin:top;transform:scaleY(0);transition:transform .6s var(--ease) .1s}
.faq-list details.is-open>:not(summary)::before{transform:scaleY(1)}
.faq-list details.is-open>:not(summary){animation:faqIn .6s var(--ease) .06s both}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:600px){
  .faq-list summary::before{width:28px;font-size:1.15rem}
  .faq-list details>:not(summary){margin-left:0;padding-left:16px}
}
@media(prefers-reduced-motion:reduce){.faq-list details.is-open>:not(summary){animation:none}}
.faq-list summary::after{background-origin:border-box;background-clip:border-box}
.faq-list details.is-open summary::after{border-color:transparent;background-repeat:no-repeat;background-origin:border-box;background-clip:border-box}
/* chipy jako linki do podstron */
.chips a{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:.85rem;background:var(--card);color:var(--text);
  display:inline-flex;align-items:center;gap:6px;transition:border-color .25s,background .25s,transform .25s var(--ease)}
.chips a::after{content:"→";font-size:.8em;color:var(--pink);opacity:.7;transition:transform .25s var(--ease),opacity .25s}
.chips a:hover{border-color:var(--pink);background:var(--card2);transform:translateY(-2px)}
.chips a:hover::after{transform:translateX(3px);opacity:1}
/* podstrony: wizualizacja jak ikony na stronie głównej (ze smugą aerografu) */
.sub-media .ill-smudge{position:relative;background:radial-gradient(circle at 50% 55%,rgba(139,92,246,.16),transparent 65%)}
.sub-media .ill-smudge::before{content:"";position:absolute;left:2%;right:2%;top:18%;bottom:18%;background:var(--smudge1) center/contain no-repeat;opacity:.95;pointer-events:none}
.sub-media .ill-smudge::after{content:"";position:absolute;left:50%;bottom:21%;width:52%;height:22px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);pointer-events:none}
.sub-media .ill-smudge svg{position:relative;z-index:1}
/* podstrony: klikalne realizacje */
.zoomable{cursor:zoom-in}
.zoomable::after{content:"";position:absolute;right:10px;top:10px;width:38px;height:38px;border-radius:50%;z-index:2;
  background:rgba(13,13,16,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M16 16l4 4M11 8.5v5M8.5 11h5'/%3E%3C/svg%3E") center/18px no-repeat;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);opacity:0;transform:scale(.8);transition:opacity .3s,transform .3s var(--ease)}
.zoomable:hover::after,.zoomable:focus-visible::after{opacity:1;transform:none}
.zoomable:focus-visible{outline:2px solid var(--pink);outline-offset:3px}
@media(hover:none){.zoomable::after{opacity:.9;transform:none}}
/* stopka: równe odstępy, ostatnia kolumna wyrównana do prawej krawędzi */
.foot{grid-template-columns:minmax(260px,320px) repeat(4,auto);justify-content:space-between;column-gap:clamp(32px,4vw,64px);row-gap:40px}
.foot>div:first-child p{max-width:30ch;line-height:1.65}
.foot-h{margin-bottom:18px}
.foot ul{gap:12px}
.foot .socials{margin-top:14px}
@media(max-width:1100px){.foot{grid-template-columns:repeat(4,auto)}.foot>div:first-child{grid-column:1/-1}.foot>div:first-child p{max-width:52ch}}
@media(max-width:700px){.foot{grid-template-columns:1fr 1fr;justify-content:stretch;column-gap:24px;row-gap:36px}}
/* przełącznik języka PL / EN */
.lang{display:inline-flex;align-items:center;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--card);gap:2px}
.lang a{min-width:34px;height:30px;padding:0 8px;border-radius:999px;display:grid;place-items:center;font-size:.72rem;font-weight:800;letter-spacing:1px;color:var(--dim);transition:color .2s,background .2s}
.lang a:hover{color:var(--text)}
.lang a.on{color:#fff;background:var(--grad);box-shadow:0 4px 12px -4px rgba(255,46,136,.6)}
.lang-m{display:none}
.mnav .lang-m{display:inline-flex;align-self:flex-start;margin:22px 0 8px}
.mnav .lang-m a{height:36px;padding:0 16px;font-size:.82rem;letter-spacing:.5px}
.mnav .lang-m a::before{display:none}
@media(min-width:700px){.mnav .lang-m{grid-column:1/-1}}
@media(max-width:560px){.nav-r>.lang{display:none}}
.mnav .lang-m a{font-family:Inter,sans-serif;text-transform:none;line-height:1;display:grid;place-items:center;align-items:center;gap:0;color:var(--dim)}
.mnav .lang-m a.on{color:#fff}
.mnav .lang-m a:hover{color:var(--text)}
.mnav .lang-m{justify-self:start;width:max-content}
/* stopka: linki do usług (linkowanie wewnętrzne) */
.foot-services{margin-top:clamp(36px,4vw,52px);padding-top:28px;border-top:1px solid var(--line)}
.foot-services div{display:flex;flex-wrap:wrap;gap:8px 10px}
.foot-services a{font-size:.85rem;padding:7px 14px;border:1px solid var(--line);border-radius:999px;color:var(--muted);transition:color .2s,border-color .2s}
.foot-services a:hover{color:var(--text);border-color:var(--pink)}
#o-mnie .portrait .photo{object-position:50% 40%}
/* ---------- miejsca na zdjęcia (placeholdery) ---------- */
.ph-badge{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:3;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  font-size:.72rem;font-weight:700;letter-spacing:.3px;padding:6px 12px;border-radius:999px;background:rgba(13,13,16,.78);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.14);color:var(--muted)}
.ph-badge .ico{width:14px;height:14px;color:var(--pink)}
.ph-badge.ph-top{top:56px;bottom:auto}
.ph-art,.ph-fig{position:relative;display:grid!important;place-items:center;overflow:hidden}
.ph-art::before,.ph-fig::before{content:"";position:absolute;inset:6% 4%;background:var(--smudge1) center/contain no-repeat;opacity:.75;pointer-events:none}
.ph-art::after,.ph-fig::after{content:"";position:absolute;inset:10px;border:1.5px dashed rgba(255,255,255,.13);border-radius:calc(var(--r) - 6px);pointer-events:none}
.ph-ill{position:relative;z-index:1;height:auto;max-height:70%;filter:drop-shadow(0 14px 18px rgba(0,0,0,.5));transition:transform .6s var(--ease)}
.ph-tile{cursor:default}
.ph-tile:hover .ph-ill{transform:translateY(-6px) rotate(-3deg)}
.tile.big .ph-ill{width:56%!important}
.ph-fig{background:radial-gradient(circle at 50% 45%,rgba(139,92,246,.2),var(--card) 72%)}
.ph-fig .ph-ill{width:60%}
.ex-grid .ph-fig .ph-badge{font-size:.66rem;padding:5px 10px}
.story-ph.ph-fig .ph-ill{width:64%}
/* Instagram: kafelki-miejsca z ramką */
.ig a.ph-ig{position:relative}
.ig a.ph-ig::after{content:"";position:absolute;inset:8px;border:1.5px dashed rgba(255,255,255,.12);border-radius:10px;pointer-events:none}
/* portfolio: pasek kategorii pod nagłówkiem, na całą szerokość */
#portfolio .sec-head.row{grid-template-columns:1fr;align-items:start}
#portfolio .filters{justify-self:start;max-width:100%;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
#portfolio .filters::-webkit-scrollbar{display:none}
#portfolio .filters button{flex:none}
#portfolio .filters .cnt{display:none}
/* karty usług: małe miejsca na zdjęcia realizacji – równe odstępy */
.sc-thumbs{gap:8px;align-items:center}
.sc-thumbs .svc-thumb{margin-right:0;border:1.5px dashed var(--line2)}
.svc-thumb.ph-mini{width:40px;height:48px;border-radius:10px;display:grid;place-items:center;cursor:default;
  background:radial-gradient(circle at 50% 40%,rgba(139,92,246,.22),var(--card2) 75%)}
.svc-thumb.ph-mini .ico{width:16px;height:16px;color:var(--dim)}
.svc-thumb.ph-mini:hover{transform:none;border-color:var(--line2)}
.sc-foot{gap:16px}
/* =========================================================
   BLOG
   ========================================================= */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media(max-width:1000px){.post-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.post-grid{grid-template-columns:1fr}}
.post-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.post-card:hover{border-color:var(--line2);transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(255,46,136,.35)}
.post-card.hide{display:none}
.pc-media{aspect-ratio:16/10;border-bottom:1px solid var(--line)}
.pc-media .ph-ill{width:46%!important}
.post-card:hover .ph-ill{transform:translateY(-6px) rotate(-3deg)}
.pc-cat{position:absolute;left:14px;top:14px;z-index:3;font-size:.68rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;padding:6px 11px;border-radius:999px;background:rgba(13,13,16,.78);border:1px solid rgba(255,255,255,.14);color:var(--cyan)}
.pc-body{display:flex;flex-direction:column;gap:10px;padding:clamp(20px,2.2vw,26px);flex:1}
.pc-meta{font-size:.78rem;color:var(--dim)}
.pc-body h3{font-size:1.15rem;line-height:1.3;font-family:Inter,sans-serif;font-weight:700;text-transform:none}
.pc-body h3 a:hover{color:var(--pink)}
.pc-body>p:not(.pc-meta){color:var(--muted);font-size:.9rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pc-more{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.9rem}
.pc-more .ico{transition:transform .3s var(--ease)}
.post-card:hover .pc-more .ico{transform:translateX(4px)}
.blog-filters{justify-self:end}
/* wpis */
.post-hero h1{font-size:clamp(2.2rem,5vw,3.8rem)}
.post-author{display:flex;align-items:center;gap:12px;margin-top:28px}
.post-author img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:50% 25%;border:2px solid var(--pink)}
.post-author b{display:block;font-size:.95rem}
.post-author span{font-size:.82rem;color:var(--muted)}
.post-sec{padding-top:clamp(56px,7vw,96px)}
.post-layout{display:grid;grid-template-columns:260px minmax(0,720px);gap:clamp(32px,5vw,80px);justify-content:center;align-items:start}
@media(max-width:1000px){.post-layout{grid-template-columns:1fr}.post-toc{position:static!important}}
.post-toc{position:sticky;top:100px;padding:22px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.post-toc ol{list-style:none;display:grid;gap:4px;counter-reset:t;margin:0;padding:0}
.post-toc li{counter-increment:t}
.post-toc a{display:flex;gap:10px;padding:6px 0;font-size:.88rem;color:var(--muted);line-height:1.35;transition:color .2s}
.post-toc a::before{content:counter(t,decimal-leading-zero);font-family:Anton,sans-serif;color:var(--dim);font-size:.85rem}
.post-toc a:hover,.post-toc a.on{color:var(--text)}
.post-toc a.on::before{color:var(--pink)}
.toc-service{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line)}
.toc-service p{font-size:.72rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.toc-service a{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.9rem;color:var(--text)}
.toc-service a:hover{color:var(--pink)}
.prose{font-size:1.06rem;line-height:1.8;color:#d5d5de}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-top:1.9em;color:var(--text);scroll-margin-top:100px;line-height:1.15}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:Inter,sans-serif;text-transform:none;font-size:1.15rem;font-weight:700;color:var(--text);margin-top:1.5em}
.prose strong{color:var(--text)}
.prose a{color:var(--text);text-decoration:underline;text-decoration-color:var(--pink);text-underline-offset:3px;text-decoration-thickness:2px}
.prose a:hover{color:var(--pink)}
.prose ol,.prose ul{padding-left:1.3em;display:grid;gap:.45em}
.prose ol li::marker{color:var(--pink);font-weight:800}
.prose ul.checks-list{list-style:none;padding-left:0}
.prose ul.checks-list li{position:relative;padding-left:30px}
.prose ul.checks-list li::before{content:"";position:absolute;left:0;top:.45em;width:18px;height:18px;border-radius:50%;
  background:var(--grad);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.6 14.2l-4-4 1.4-1.4 2.6 2.6 5.8-5.8 1.4 1.4z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.6 14.2l-4-4 1.4-1.4 2.6 2.6 5.8-5.8 1.4 1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.post-ph{aspect-ratio:16/9;border:1px solid var(--line);border-radius:var(--r);margin-top:2em!important;margin-bottom:.4em}
.post-ph .ph-ill{width:34%!important}
.post-ph figcaption{position:absolute;left:0;right:0;top:16px;text-align:center;font-size:.8rem;color:var(--dim);z-index:3;padding:0 20px}
.post-cta{margin-top:2em!important;padding:clamp(22px,3vw,30px);border-radius:var(--r);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:linear-gradient(var(--card2),var(--card2)) padding-box,var(--grad) border-box;border:1px solid transparent;box-shadow:0 22px 46px -24px rgba(255,46,136,.45)}
.post-cta p{margin:0;flex:1 1 280px;color:var(--text);font-weight:600;line-height:1.55}
.post-table{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}
.post-table table{width:100%;border-collapse:collapse;font-size:.92rem;line-height:1.5}
.post-table th,.post-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.post-table th{font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);background:var(--card)}
.post-table tr:last-child td{border-bottom:0}
.post-table td:first-child{font-weight:700;color:var(--text)}
.toc-service a::before{content:none!important}
.post-toc .toc-service a{padding:0}
.prose a.btn{text-decoration:none;color:#fff}
.prose a.btn:hover{color:#fff}
/* lista wpisów: pierwszy wpis wyróżniony */
#postGrid .post-card:first-child{grid-column:1/-1;flex-direction:row}
#postGrid .post-card:first-child .pc-media{flex:0 0 52%;aspect-ratio:auto;min-height:320px;border-bottom:0;border-right:1px solid var(--line)}
#postGrid .post-card:first-child .pc-body{justify-content:center;padding:clamp(28px,4vw,48px)}
#postGrid .post-card:first-child h3{font-size:clamp(1.4rem,2.4vw,1.9rem)}
#postGrid .post-card:first-child .pc-body>p:not(.pc-meta){-webkit-line-clamp:4;font-size:1rem}
@media(max-width:760px){#postGrid .post-card:first-child{flex-direction:column}#postGrid .post-card:first-child .pc-media{flex:none;aspect-ratio:16/10;min-height:0;border-right:0;border-bottom:1px solid var(--line)}}
.post-author .pa-link{color:inherit;transition:color .2s}
.post-author a.pa-link:hover b{color:var(--pink)}
.post-author a.pa-link img{transition:transform .3s var(--ease),box-shadow .3s}
.post-author a.pa-link:hover img{transform:scale(1.06);box-shadow:0 0 0 3px rgba(255,46,136,.25)}
/* tytuły wpisów: więcej miejsca na polskie znaki (ogonki, kreski) między liniami */
.post-hero h1{line-height:1.14;letter-spacing:.01em;padding-top:.06em}
.sub-hero h1{line-height:1.08}
/* O mnie – na telefonie i tablecie plakietki pod zdjęciem (nie zasłaniają twarzy) */
@media(max-width:900px){
  .portrait-wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
  .portrait-wrap .portrait{grid-column:1/-1}
  .portrait-wrap .float-badge{position:static;left:auto;right:auto;top:auto;bottom:auto;margin:0;transform:rotate(-1.5deg);
    display:flex;flex-direction:column;justify-content:center;padding:12px 16px;font-size:1rem}
  .portrait-wrap .float-badge.b2{transform:rotate(1.5deg);order:2}
  .portrait-wrap .float-badge:not(.b2){order:3}
}
/* O mnie – plakietki pod zdjęciem także na komputerze */
.portrait-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}
.portrait-wrap .portrait{grid-column:1/-1}
.portrait-wrap .float-badge{position:static;left:auto;right:auto;top:auto;bottom:auto;margin:0;transform:rotate(-1.5deg);
  display:flex;flex-direction:column;justify-content:center;padding:14px 18px;font-size:1.05rem}
.portrait-wrap .float-badge.b2{transform:rotate(1.5deg);order:2}
.portrait-wrap .float-badge:not(.b2){order:3}
/* portfolio: prawdziwe prace + „Pokaż więcej” */
.tile.clip{display:none}
.pf-more{display:flex;justify-content:center;margin-top:clamp(28px,4vw,44px)}
.pf-more[hidden]{display:none}
.tile .art .photo{object-fit:cover}
/* portfolio: stronicowanie */
.pager{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:clamp(28px,4vw,44px)}
.pager[hidden]{display:none}
.pg{min-width:44px;height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--line2);background:var(--card);color:var(--muted);font-weight:700;font-size:.92rem;cursor:pointer;display:inline-grid;place-items:center;transition:color .2s,border-color .2s,background .2s,transform .2s}
.pg:hover:not(:disabled){color:var(--text);border-color:var(--pink);transform:translateY(-2px)}
.pg.on{color:#fff;border-color:transparent;background:var(--grad) border-box;box-shadow:0 8px 20px -8px rgba(255,46,136,.6)}
.pg:disabled{opacity:.35;cursor:default}
.pg .ico{width:18px;height:18px}
.pg-info{flex-basis:100%;text-align:center;font-size:.82rem;color:var(--dim);margin-top:4px}
#grid .tile{animation:pgIn .45s var(--ease) backwards}
@keyframes pgIn{from{opacity:0;transform:translateY(10px)}}
@media(prefers-reduced-motion:reduce){#grid .tile{animation:none}}
.pg.on{background:var(--grad) border-box;background-origin:border-box;border-color:transparent}
.sc-thumbs .svc-thumb:not(.ph-mini){border:2px solid var(--line2);background:var(--card2)}
.sc-thumbs .svc-thumb:not(.ph-mini):hover{border-color:var(--pink);transform:translateY(-3px)}
/* przed/po: prawdziwe zdjęcia szkicu i obrazu */
.ba.ba-photo{aspect-ratio:900/1224;max-height:780px;background:#1a1a20}
.ba.ba-photo .layer{background:#1a1a20}
.ba.ba-photo .layer .photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* „Co jeszcze maluję” – miniatury realizacji */
.om-thumbs{display:flex;flex:none;margin-left:auto;padding-left:8px}
.om-thumbs img{width:40px;height:48px;object-fit:cover;border-radius:9px;border:2px solid var(--card);margin-left:-12px;box-shadow:0 6px 14px -6px rgba(0,0,0,.7);transition:transform .3s var(--ease),margin .3s var(--ease)}
.om-thumbs img:first-child{margin-left:0}
.om-list a:hover .om-thumbs img{margin-left:-4px}
.om-list a:hover .om-thumbs img:first-child{margin-left:0}
@media(max-width:420px){.om-thumbs img{width:34px;height:42px}}
.om-thumbs{margin:10px 0 0;padding:0}
.om-thumbs img{width:34px;height:34px;border-radius:8px;margin-left:-8px}
.om-list a:hover .om-thumbs img{margin-left:-2px}
/* „Co jeszcze maluję” – miniatury jak w kartach usług (bez nachodzenia) */
.om-thumbs{display:flex;gap:8px;margin-top:10px}
.om-thumbs img,.om-thumbs img:first-child,.om-list a:hover .om-thumbs img,.om-list a:hover .om-thumbs img:first-child{width:40px;height:48px;margin:0;border-radius:10px;border:2px solid var(--line2);background:var(--card2);box-shadow:none}
.om-thumbs .om-thumb{cursor:zoom-in;transition:transform .3s var(--ease),border-color .2s}
.om-thumbs .om-thumb:hover,.om-thumbs .om-thumb:focus-visible{border-color:var(--pink);transform:translateY(-3px);outline:none}
/* O mnie – rozbudowany opis */
.about-copy>p:not(.eyebrow):not(.lead){color:var(--muted);line-height:1.75;margin:0}
.about-points{list-style:none;display:grid;gap:10px;margin:6px 0 0;padding:0}
.about-points li{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.about-points .ico{flex:none;width:22px;height:22px;margin-top:2px;stroke:url(#icoG);--if:url(#icoG)}
.about-points b{display:block;font-size:.95rem;margin-bottom:2px}
.about-points span{font-size:.88rem;color:var(--muted);line-height:1.55}
.about-copy .chips{margin-top:0}
.about-copy{gap:16px}
/* O mnie: większe zdjęcie, dopasowane do dłuższego opisu */
@media(min-width:901px){
  .about{grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,80px);align-items:stretch}
  .portrait-wrap{grid-template-rows:1fr auto;align-self:stretch}
  .portrait-wrap .portrait{aspect-ratio:auto;height:100%;min-height:640px}
}
#o-mnie .portrait .photo{object-position:50% 35%}
.about-foot{justify-content:flex-start}
/* audyt UX: brak przewijania w bok na wąskich telefonach */
.order-grid>*,.price-band>*,.about>*,.ba-wrap>*,.story>*,.sub-hero .wrap>*{min-width:0}
@media(max-width:960px){.order-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){.price-band{grid-template-columns:minmax(0,1fr)}.price-band .btn{white-space:normal;text-align:center;justify-content:center}.price-band .amt{font-size:clamp(2rem,10vw,3rem)}}
.form-card .btn{white-space:normal;text-align:center}
/* większe pola dotyku: przełącznik języka */
.lang a{min-width:40px;height:36px}
.sec-head>*{min-width:0}
.sec-head .btn{max-width:100%;white-space:normal;text-align:center;overflow-wrap:anywhere}
.blog-filters{max-width:100%;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
.blog-filters::-webkit-scrollbar{display:none}
.blog-filters button{flex:none}
@media(max-width:900px){.sec-head.row:has(.blog-filters){grid-template-columns:minmax(0,1fr)}.blog-filters{justify-self:start}}
.post-layout>*,.prose{min-width:0}.post-table table{min-width:460px}
.pg-mob{display:none}
@media(max-width:560px){
  .pager .pg:not(.prev):not(.next){display:none}
  .pg-mob{display:inline-grid;place-items:center;min-width:96px;height:44px;padding:0 16px;border-radius:999px;background:var(--grad);color:#fff;font-weight:800;font-size:.95rem;box-shadow:0 8px 20px -8px rgba(255,46,136,.6)}
}
/* blog: prawdziwe zdjęcia prac we wpisach */
.post-img{position:relative;margin:2em 0 .4em!important;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--card)}
.post-img img{display:block;width:100%;max-height:560px;object-fit:cover;object-position:50% 40%}
.post-img figcaption{padding:12px 16px;font-size:.84rem;color:var(--dim);border-top:1px solid var(--line)}
.post-img svg.wm{bottom:56px}
.wordmark{font-size:clamp(2rem,13vw,15.5rem);padding:.06em .08em 0;max-width:100%;overflow:visible}
.wordmark{font-size:clamp(2rem,13vw,12.4rem);width:fit-content;margin-left:auto;margin-right:auto}
/* ---------- lokalne SEO: miasta, zasięg ---------- */
.cities{display:flex;flex-wrap:wrap;gap:10px}
.cities span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-weight:600;font-size:.92rem}
.cities .ico{width:16px;height:16px;color:var(--pink)}
.cities-sm{gap:6px;margin:14px 0 4px}
.cities-sm span{padding:5px 11px;font-size:.78rem;font-weight:500;color:var(--muted);background:var(--card2)}
.reach{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
@media(max-width:860px){.reach{grid-template-columns:1fr}}
.reach-card{display:flex;gap:18px;align-items:flex-start;padding:clamp(22px,3vw,32px);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.reach-card:hover{border-color:var(--line2);transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(255,46,136,.35)}
.reach-card h3{font-size:1.25rem;margin-bottom:8px}
.reach-card p{color:var(--muted);line-height:1.65}
.reach-card .p-ico{flex:none}
.reach-card .pc-more{display:inline-flex;margin-top:12px}
.loc-band{padding:28px 0}
/* pasek „Obszar działania” na podstronach – karta w kolorach marki/stylu */
.loc-card{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;gap:16px 22px;align-items:center;max-width:1000px;margin:0 auto;padding:20px 22px;border-radius:20px;
  background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(120deg,var(--pink),var(--line) 70%) border-box;
  background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(120deg,color-mix(in srgb,var(--pink) 60%,transparent),color-mix(in srgb,var(--violet,#8b5cf6) 35%,transparent) 38%,var(--line) 72%) border-box;border:1px solid transparent;
  box-shadow:0 26px 50px -32px rgba(255,46,136,.45);box-shadow:0 26px 50px -32px color-mix(in srgb,var(--pink) 55%,transparent)}
.loc-card::before{content:"";position:absolute;right:-40px;top:-60px;width:260px;height:220px;pointer-events:none;opacity:.35;
  background:radial-gradient(circle,var(--pink) 1.2px,transparent 1.8px) 0 0/17px 19px,radial-gradient(circle,var(--cyan) 1px,transparent 1.6px) 7px 9px/23px 21px;
  -webkit-mask:radial-gradient(closest-side,#000,transparent);mask:radial-gradient(closest-side,#000,transparent)}
.loc-card>*{position:relative}
.loc-ic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;--if:#fff;
  background:linear-gradient(135deg,var(--pink),var(--violet,#8b5cf6));box-shadow:0 12px 26px -12px var(--pink)}
.loc-ic .ico{width:26px;height:26px}
.loc-txt{display:grid;gap:3px;min-width:0}
.loc-t{font-size:1.06rem;font-weight:800;color:var(--text)}
.loc-s{font-size:.92rem;color:var(--muted);line-height:1.5}
.loc-links{display:flex;gap:10px;flex-wrap:wrap}
.loc-chip{position:relative;display:grid;gap:1px;min-width:160px;padding:10px 40px 10px 16px;border-radius:14px;border:1px solid var(--line2);background:var(--card2);color:var(--text);text-decoration:none;
  transition:border-color .2s,transform .2s,box-shadow .2s}
.loc-chip span{font-weight:800;font-size:.95rem}
.loc-chip small{font-size:.75rem;color:var(--dim);font-weight:500}
.loc-chip::after{content:"→";position:absolute;right:14px;top:50%;translate:0 -50%;color:var(--pink);font-weight:800;transition:translate .2s}
.loc-chip:hover{border-color:var(--pink);transform:translateY(-2px);box-shadow:0 12px 24px -16px var(--pink)}
.loc-chip:hover::after{translate:3px -50%}
.loc-chip:focus-visible{outline:2px solid var(--pink);outline-offset:2px}
@media(max-width:860px){.loc-card{grid-template-columns:auto 1fr}.loc-links{grid-column:1/-1}.loc-chip{flex:1 1 200px}}
@media(max-width:420px){.loc-card{padding:18px 16px;gap:14px}.loc-ic{width:46px;height:46px;border-radius:14px}}
.what-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.what-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.what-4{grid-template-columns:1fr}}
/* opinie z Facebooka */
a.rating{text-decoration:none;transition:opacity .2s}
a.rating:hover{opacity:.85}
.rating-stars{color:var(--yellow);letter-spacing:2px}
.rev-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.rev-src{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;color:var(--dim);letter-spacing:.3px}
.rev-src .ico{width:14px;height:14px;color:#1877f2}
.rev p{line-height:1.65}
.who .av{background:var(--grad);color:#fff;font-weight:800}
.rev-more{display:flex;justify-content:center;margin-top:clamp(24px,3vw,36px)}
.rev-more .ico{width:18px;height:18px;color:#1877f2}
/* blog: okładki kategorii */
.pc-cover{display:block;position:relative;overflow:hidden;aspect-ratio:16/10;border-bottom:1px solid var(--line);background:#121217}
.pc-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease)}
.post-card:hover .pc-cover img{transform:scale(1.05)}
.sub-media.sub-cover{background:#121217}
.sub-media.sub-cover>img{object-fit:cover;object-position:50% 50%}
#postGrid .post-card:first-child .pc-cover{aspect-ratio:auto}
.sub-media.sub-cover{aspect-ratio:16/10;align-self:center}
.sub-media.cover-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;aspect-ratio:16/10}
.sub-media.cover-grid>img{position:static;width:100%;height:100%;object-fit:cover;border-radius:12px}
/* blog: karta autorki */
.post-author{display:flex;align-items:center;gap:16px;margin-top:30px;padding:14px 20px 14px 14px;width:fit-content;max-width:100%;border:1px solid var(--line);border-radius:999px;background:rgba(22,22,28,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.post-author .pa-av{flex:none;width:64px;height:64px;border-radius:50%;padding:3px;background:var(--grad);display:block;transition:transform .3s var(--ease)}
.post-author .pa-av:hover{transform:scale(1.05)}
.post-author .pa-av img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;border:2px solid var(--bg)}
.post-author .pa-txt,.post-author .pa-date{display:flex;flex-direction:column;gap:2px}
.post-author .pa-lbl{font-size:.66rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--cyan)}
.post-author .pa-name{font-weight:800;font-size:1.05rem;color:var(--text);line-height:1.2}
.post-author .pa-name:hover{color:var(--pink)}
.post-author .pa-meta{font-size:.84rem;color:var(--muted)}
.post-author .pa-date{padding-left:18px;margin-left:4px;border-left:1px solid var(--line2)}
.post-author .pa-date time{font-weight:700;font-size:.92rem;color:var(--text)}
@media(max-width:520px){.post-author{border-radius:20px;flex-wrap:wrap}.post-author .pa-date{border-left:0;padding-left:0;margin-left:80px}}
/* formularze: pułapka na boty, komunikaty */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
#formMsg.bad,#vMsgOut.bad{color:#ff6b9d}
#formMsg a,#vMsgOut a,.consent a{color:var(--text);text-decoration:underline;text-decoration-color:var(--pink);text-underline-offset:3px}
#vMsgOut{margin-top:10px;text-align:center}
.btn:disabled{opacity:.7;cursor:wait}
.legal-hero .wrap{grid-template-columns:1fr}.legal-hero h1{font-size:clamp(2.4rem,5vw,4rem)}.prose ol{padding-left:1.4em}
.foot-bottom .firm{display:inline-block;margin-top:4px;font-size:.76rem;color:var(--dim)}
/* bon w oknie zamówienia: równe odstępy po uzupełnieniu danych */
.vd-card{aspect-ratio:auto;min-height:230px;justify-content:flex-start;gap:0;padding:24px 26px}
.vd-card>small:first-child{margin-bottom:12px}
.vd-card>b{font-size:clamp(2rem,3.4vw,2.6rem)}
.vd-card .vd-meta{margin:16px 0 0;gap:4px}
.vd-card .vd-meta:empty,.vd-card .vd-meta span:empty{display:none}
.vd-card .vd-meta #vpMsg{overflow-wrap:anywhere}
.vd-card>small:last-child{margin-top:auto;padding-top:16px}
/* liczby obserwujących */
.social-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:var(--gap)}
@media(max-width:1000px){.social-stats{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.social-stats{grid-template-columns:1fr}}
.ss{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);transition:border-color .25s,transform .3s var(--ease)}
a.ss:hover{border-color:var(--line2);transform:translateY(-3px)}
.ss b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:1.7rem;line-height:1.05;color:var(--text)}
.ss small{display:block;font-size:.8rem;color:var(--muted);line-height:1.35}
.ss-ico{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center}
.ss-ico .ico{width:22px;height:22px;color:#fff}
.ss-fb{background:#1877f2}.ss-tt{background:#111;box-shadow:inset 2px 0 0 #25f4ee,inset -2px 0 0 #fe2c55}.ss-ig{background:linear-gradient(45deg,#f9a825,#e91e63 55%,#8e24aa)}
.ss-total{border-color:transparent;background:linear-gradient(var(--card2),var(--card2)) padding-box,var(--grad) border-box;justify-content:center;text-align:center}
.ss-total b{font-size:2rem}
/* sociale autorki */
.author-social{display:grid;gap:12px;padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.as-h{font-size:.72rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--cyan)}
.as-h span{color:var(--muted);text-transform:none;letter-spacing:0;font-weight:600;font-size:.88rem}
.as-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:520px){.as-row{grid-template-columns:1fr}}
.as{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--card2);transition:border-color .25s,transform .3s var(--ease)}
.as:hover{border-color:var(--line2);transform:translateY(-2px)}
.as .ss-ico{width:38px;height:38px;border-radius:11px}
.as .ss-ico .ico{width:18px;height:18px}
.as b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:1.25rem;line-height:1.05;color:var(--text)}
.as small{display:block;font-size:.74rem;color:var(--muted)}
/* moje prace u was */
.uwas{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media(max-width:900px){.uwas{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.uwas{grid-template-columns:repeat(2,1fr)}}
.uw{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;border:1px solid var(--line);display:block;background:var(--card)}
.uw img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
button.uw{padding:0;font:inherit;color:inherit;text-align:left;cursor:zoom-in;width:100%}
button.uw:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.uw-lb .lb-info h3{overflow-wrap:anywhere}
.uw-post{justify-content:center}.uw-post[hidden]{display:none}
.uw-post .ico{width:18px;height:18px}
.uw:hover img{transform:scale(1.06)}
.uw-meta{position:absolute;left:0;right:0;bottom:0;display:grid;gap:2px;padding:48px 12px 11px;background:linear-gradient(transparent,rgba(0,0,0,.6) 45%,rgba(0,0,0,.9));line-height:1.3;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.uw-plat{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;color:#fff}
.uw-plat .ico{width:15px;height:15px}
.uw-meta b{font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uw-meta small{color:#d0d0d8;font-size:.74rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* paleta: własny kolor – czytelna ikonka „+” */
.sw-custom{background:conic-gradient(from 0deg,#ff2e88,#ffd23f,#a3e635,#22d3ee,#3b82f6,#8b5cf6,#ff2e88);border-color:rgba(255,255,255,.35)}
.sw-custom::before{content:"";position:absolute;inset:4px;border-radius:50%;background:#16161c;pointer-events:none}
.sw-custom::after{content:"";inset:0;margin:auto;width:10px;height:10px;font:0/0 a;text-shadow:none;pointer-events:none;
  background:linear-gradient(#fff,#fff) center/10px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 10px no-repeat}
@media(max-width:640px){.sw-custom::before{inset:5px}.sw-custom::after{width:12px;height:12px;background-size:12px 2px,2px 12px}}
.sw-custom.picked::before{display:none}
.sw-custom.picked::after{background:none}
/* moje prace u was – instrukcja oznaczania */
.uwas-how{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:var(--gap)}
@media(max-width:860px){.uwas-how{grid-template-columns:1fr}}
.uh{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.uh-n{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;font-family:Anton,sans-serif;font-size:1.1rem}
.uh>div>b{display:block;margin-bottom:4px}
.uh small{display:block;color:var(--muted);font-size:.86rem;line-height:1.5}
.uh small b{color:var(--text)}
/* paleta: własny kolor – gładki pierścień gradientu (bez ząbków na bokach) */
.sw-custom{border:3px solid transparent;background:linear-gradient(#16161c,#16161c) padding-box,conic-gradient(from 0deg,#ff2e88,#ffd23f,#a3e635,#22d3ee,#3b82f6,#8b5cf6,#ff2e88) border-box;box-shadow:none}
.sw-custom::before{display:none}
.sw-custom::after{position:absolute;inset:0;margin:auto;width:10px;height:10px}
.sw-custom:hover{box-shadow:0 0 12px rgba(139,92,246,.6)}
.sw-custom.picked{background:linear-gradient(var(--c),var(--c)) padding-box,conic-gradient(from 0deg,#ff2e88,#ffd23f,#a3e635,#22d3ee,#3b82f6,#8b5cf6,#ff2e88) border-box}
/* spójne odstępy: dwie sąsiednie sekcje na tym samym tle nie dublują odstępu */
main>section:not(.alt-bg):not(.cta-band)+section:not(.alt-bg):not(.cta-band),
main>section.alt-bg+section.alt-bg{padding-top:0}
.uwas-how:has(+ .uwas[hidden]){margin-bottom:0}
/* moje prace u was – formularz wgrywania */
/* pasek CTA + okno wgrywania */
.uwas-cta{margin-top:var(--gap);display:flex;align-items:center;gap:clamp(14px,2vw,22px);padding:clamp(18px,2.4vw,24px) clamp(18px,2.6vw,28px);border:1px solid var(--line);border-radius:var(--r-lg);background:radial-gradient(circle at 0 50%,rgba(255,46,136,.14),transparent 45%),var(--card)}
#uwasGrid:not([hidden])+.uwas-cta{margin-top:clamp(28px,4vw,44px)}
.uwas-cta-ic{flex:none;width:52px;height:52px;border-radius:16px;background:var(--grad);display:grid;place-items:center;color:#fff}
.uwas-cta-ic .ico{width:24px;height:24px;--if:#fff}
.uwas-cta-t{flex:1;display:grid;gap:4px;min-width:0}
.uwas-cta-t b{font-size:1.08rem}.uwas-cta-t span{color:var(--muted);font-size:.9rem}
.uwas-cta .btn{flex:none}
@media(max-width:640px){.uwas-cta{flex-wrap:wrap}.uwas-cta-t{flex-basis:calc(100% - 80px)}.uwas-cta .btn{width:100%;justify-content:center}}
.up-main{padding:clamp(22px,3vw,36px);padding-top:clamp(56px,6vw,64px)}
.up-form{display:grid;gap:18px}
.up-form[hidden]{display:none}
.up-form .field{margin:0}
.up-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.up-row{grid-template-columns:1fr}}
.field .opt{font-weight:400;color:var(--dim)}
.up-drop{position:relative;display:grid;place-items:center;min-height:190px;border:2px dashed var(--line2);border-radius:var(--r);background:var(--bg);cursor:pointer;overflow:hidden;transition:border-color .2s,background .2s}
.up-drop:hover,.up-drop.over{border-color:var(--pink);background:rgba(255,46,136,.06)}
.up-drop.bad{border-color:#ff6b9d}
.up-ph{display:grid;gap:6px;justify-items:center;text-align:center;padding:24px}
.up-ph .ico{width:34px;height:34px;color:var(--pink)}
.up-ph small{color:var(--dim);font-size:.8rem}
.up-drop img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#09090c}
.up-foot{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;padding-top:4px}
.up-foot .fine{margin:0;text-align:left;flex:1;min-width:180px}
#upMsg.bad{color:#ff6b9d}
.up-ok{display:grid;justify-items:center;gap:10px;text-align:center;padding:40px 10px}
.up-ok[hidden]{display:none}
.up-ok>.ico{width:64px;height:64px;padding:16px;border-radius:50%;background:var(--grad);color:#fff;--if:#fff}
.up-ok b{font-size:1.3rem}.up-ok span{color:var(--muted)}
.up-ok-acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}
@media(max-width:820px){.up-drop{min-height:150px}.up-vd .vd-points{display:none}.up-vd .vd-side{padding-bottom:6px}.up-main{padding-top:clamp(18px,3vw,24px)}}

/* ===== menu: rozwijane „Usługi” ===== */
.nav-in{position:relative}
.dd{position:static;display:flex}
.dd-t{display:inline-flex;align-items:center;gap:6px}
.dd-t::after{content:"";width:6px;height:6px;border:solid currentColor;border-width:0 1.6px 1.6px 0;transform:translateY(-2px) rotate(45deg);transition:transform .25s var(--ease);opacity:.7}
.dd:hover .dd-t,.dd:focus-within .dd-t,.dd.open .dd-t{color:var(--text)}
.dd:hover .dd-t::after,.dd:focus-within .dd-t::after,.dd.open .dd-t::after{transform:translateY(1px) rotate(225deg)}
.dd-panel{position:absolute;top:calc(100% - 4px);left:50%;width:min(880px,calc(100vw - 48px));display:grid;grid-template-columns:1fr 250px;background:#16161c;border:1px solid var(--line2);border-radius:var(--r-lg);box-shadow:0 40px 90px -20px rgba(0,0,0,.9);overflow:hidden;opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .22s,transform .3s var(--ease),visibility .22s;z-index:60}
.dd-panel::before{content:"";position:absolute;left:0;right:0;top:-28px;height:28px}
.dd:hover .dd-panel,.dd:focus-within .dd-panel,.dd.open .dd-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}
.dd-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:14px}
.menu .dd-grid a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;color:var(--text);white-space:normal;font-size:.9rem}
.menu .dd-grid a:hover,.menu .dd-grid a:focus-visible,.menu .dd-grid a.on{background:var(--card2)}
.dd-ic{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#1f1f28,#121217);border:1px solid var(--line);color:#f5f5f8;--ma:url(#mGrad);transition:border-color .2s,background .25s,transform .25s var(--ease)}
.dd-ic .ico{width:22px;height:22px;stroke-width:1.6}
.dd-grid a:hover .dd-ic,.dd-grid a.on .dd-ic{background:var(--grad) border-box;border-color:transparent;color:#fff;--ma:#fff;transform:scale(1.06);box-shadow:0 8px 20px -8px rgba(255,46,136,.6)}
.dd-grid b,.dd-zone b{display:block;font-weight:700;line-height:1.25}
.dd-grid small,.dd-zone small{display:block;color:var(--dim);font-size:.76rem;line-height:1.35;margin-top:2px}
.dd-side{padding:20px;display:flex;flex-direction:column;gap:8px;border-left:1px solid var(--line);background:radial-gradient(circle at 100% 0,rgba(255,46,136,.16),transparent 60%),radial-gradient(circle at 0 100%,rgba(34,211,238,.12),transparent 60%),var(--bg2)}
.dd-eye{font-size:.7rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--cyan);margin-bottom:2px}
.menu .dd-zone{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:12px;color:var(--text);white-space:normal;font-size:.88rem}
.menu .dd-zone:hover{background:rgba(255,255,255,.05)}
.dd-zone>.ico{flex:none;width:22px;height:22px;margin-top:0;color:#f5f5f8;--ma:url(#mGrad);stroke-width:1.6}
.menu .dd-cta{margin-top:auto;justify-content:center;color:#fff;padding:12px 16px;font-size:.88rem}
.menu .dd-cta:hover{color:#fff}
.menu .dd-all{text-align:center;font-size:.8rem;color:var(--muted);padding:6px;text-decoration:underline;text-decoration-color:var(--pink);text-underline-offset:3px}
/* mobile */
.m-dd{display:flex;flex-direction:column}
.m-dd-t{display:flex;align-items:baseline;gap:14px;width:100%;background:none;border:0;padding:2px 0;color:var(--text);font-family:Anton;font-size:clamp(1.7rem,7.6vw,2.6rem);line-height:1.25;text-transform:uppercase;text-align:left;cursor:pointer;transform:translateY(18px);opacity:0;transition:transform .5s var(--ease),opacity .5s,color .2s}
body.menu-open .m-dd-t{transform:none;opacity:1}
.m-dd-t i{font-family:Inter,sans-serif;font-style:normal;font-size:.75rem;font-weight:700;color:var(--pink);letter-spacing:1px;min-width:22px}
.m-dd-t:hover,.m-dd.open .m-dd-t{color:var(--pink)}
.m-chev{width:12px;height:12px;border:solid currentColor;border-width:0 3px 3px 0;transform:translateY(-6px) rotate(45deg);transition:transform .3s var(--ease);align-self:center}
.m-dd.open .m-chev{transform:translateY(2px) rotate(225deg)}
.m-dd-list{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.m-dd.open .m-dd-list{grid-template-rows:1fr}
.m-dd-list>div{overflow:hidden;display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-left:36px}
.m-dd.open .m-dd-list>div{padding-top:8px;padding-bottom:14px}
.mnav .m-dd-list a{font-family:Inter,sans-serif;text-transform:none;font-size:.92rem;font-weight:600;line-height:1.25;display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);transform:none;opacity:1}
.mnav .m-dd-list a .ico{flex:none;width:20px;height:20px;color:#f5f5f8;--ma:url(#mGrad);stroke-width:1.6}
.mnav .m-dd-list a.m-dd-all{grid-column:1/-1;justify-content:center;background:transparent;color:var(--muted)}
@media(max-width:520px){.m-dd-list>div{padding-left:0}.mnav .m-dd-list a{font-size:.82rem;padding:9px 10px;gap:8px;min-height:48px}.mnav .m-dd-list a .ico{width:16px;height:16px}}
@media(max-width:330px){.m-dd-list>div{grid-template-columns:1fr}}
@media(min-width:700px){.mnav .m-dd.open{grid-column:1/-1}}

/* hero: dalszy plan latających elementów */
.fl.far{z-index:-1}
.fl.far>svg{opacity:.62;filter:blur(1.1px) drop-shadow(0 16px 20px rgba(0,0,0,.5));animation-duration:9s}
@media(max-width:1100px){.fl.far{display:none}}

/* natrysk za kursorem (strona główna, poza hero) */
#trail{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:65}

/* cena w euro (wersja EN) – mniejszy wiersz pod kwotą w PLN */
.amt .amt-eur{display:block;font-family:Inter,system-ui,sans-serif;font-size:.95rem;font-weight:600;color:var(--muted);letter-spacing:0;line-height:1.3;margin-top:6px}
.budget-out .b-eur{font-family:Inter,system-ui,sans-serif;font-size:.82rem;font-weight:600;color:var(--muted);letter-spacing:0}
/* O mnie – „Moja historia”: rytm odstępów */
.story-copy .author-social{margin-top:30px}
.story-copy .author-social .as-h{margin:0;font-size:.72rem;line-height:1.5;color:var(--cyan)}
.story-copy .sign{margin-top:22px}

/* hero na telefonie: małe grafiki z oferty w wolnych miejscach (duże latające są ukryte <=760px; motyw sezonowy ma własne) */
.hm{display:none}
@media(max-width:760px){
  .hero h1,.hero .hero-actions{position:relative}
  .hm{display:block;position:absolute;height:auto;pointer-events:none;filter:drop-shadow(0 8px 12px rgba(0,0,0,.55))}
  .hm-air{width:46px;left:-2px;top:-30px;transform:rotate(-14deg);animation:hmBob 5s ease-in-out infinite}
  .hm-shoe{width:58px;left:-8px;bottom:6px;z-index:-1;transform:rotate(-12deg)}
  .hm-helmet{width:44px;right:-2px;top:-6px;z-index:-1;animation:hmBob 6s ease-in-out -2s infinite}
  .hm-canvas{width:46px;right:7%;top:72px;z-index:0;transform:rotate(9deg);opacity:.75}
  .hm-game{width:54px;left:14px;bottom:16px;z-index:1;transform:rotate(-10deg)}
  .hm-gift{width:42px;right:18px;bottom:26px;z-index:1;transform:rotate(10deg);opacity:.9}
  html[class*="motyw-"] .hm{display:none}
}
@keyframes hmBob{50%{translate:0 -6px}}
@media(prefers-reduced-motion:reduce){.hm{animation:none!important}}
