/* =========================================================
   DIRTOWNIA — dirt park dla Otwocka
   Styl: grunge / tattoo flash. Fonty hostowane lokalnie (OFL).
   ========================================================= */

/* ---------- Fonty (self-hosted, bez Google Fonts) ---------- */
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-ext-800-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:900;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-ext-900-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:900;font-display:swap;src:url(assets/fonts/barlow-condensed-latin-900-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/dm-sans-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/dm-sans-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/dm-sans-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/dm-sans-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/dm-sans-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/dm-sans-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sedgwick Ave Display";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/sedgwick-ave-display-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sedgwick Ave Display";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/sedgwick-ave-display-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Grenze Gotisch";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/grenze-gotisch-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Grenze Gotisch";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/grenze-gotisch-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- Tokeny ---------- */
:root{
  --ink:#191815; --ink-2:#23211d; --ink-3:#2f2c26;
  --paper:#f0e3c7; --paper-2:#e4d2ab; --paper-hi:#f7eedb;
  --yellow:#f5d000; --rust:#a3452a; --muted:#8a7e69; --line-light:rgba(240,227,199,.18);
  --display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --graf:"Sedgwick Ave Display","Comic Sans MS","Marker Felt",cursive;
  --tattoo:"Grenze Gotisch","Old English Text MT",Georgia,serif;
  --body:"DM Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --pad:clamp(20px,6vw,96px); --max:1320px; --header:76px;
  --tear-1:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1200 60%22 preserveAspectRatio=%22none%22%3E%3Cpath fill=%22%23000%22 d=%22M0,60 L0.0,25.4 L6.6,22.6 L17.7,38.1 L43.5,50.8 L69.4,17.6 L78.6,36.6 L102.9,38.6 L119.6,3.4 L141.7,42.5 L159.0,38.0 L182.9,11.9 L195.1,46.6 L206.2,7.4 L218.5,29.8 L239.5,33.9 L249.2,33.5 L272.4,33.7 L279.8,49.0 L295.3,48.6 L306.4,40.0 L325.9,44.8 L342.1,23.1 L352.4,30.5 L373.2,33.4 L386.8,28.8 L408.7,40.0 L422.2,41.0 L447.3,26.5 L467.1,9.0 L473.8,24.1 L487.6,37.9 L494.3,15.2 L516.8,45.6 L528.1,20.0 L551.4,17.6 L575.7,22.0 L593.3,20.1 L607.8,28.7 L629.0,42.7 L647.2,27.3 L662.8,18.6 L678.6,35.7 L688.1,32.4 L696.2,41.6 L704.4,5.9 L720.7,15.4 L738.0,42.9 L758.5,25.9 L776.5,7.1 L796.5,20.0 L811.3,23.0 L830.3,6.0 L844.6,40.9 L858.9,44.5 L881.6,19.3 L893.0,16.4 L908.3,19.8 L915.8,19.2 L930.9,36.2 L939.6,42.4 L946.0,27.6 L962.2,43.4 L977.9,17.3 L998.5,36.7 L1004.6,14.3 L1016.2,39.9 L1029.3,29.0 L1036.2,34.1 L1059.5,37.7 L1067.8,30.5 L1079.3,6.2 L1086.7,30.3 L1095.3,46.6 L1119.8,14.2 L1138.1,28.4 L1153.4,29.1 L1163.1,45.7 L1188.4,23.4 L1199.5,15.0 L1200.0,25.4 L1200,60Z%22/%3E%3C/svg%3E"); --tear-2:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1200 60%22 preserveAspectRatio=%22none%22%3E%3Cpath fill=%22%23000%22 d=%22M0,60 L0.0,5.0 L13.9,20.0 L22.1,42.3 L31.1,38.8 L39.8,31.1 L54.0,18.4 L60.4,29.5 L70.4,28.1 L95.5,22.8 L113.2,49.3 L136.0,22.3 L158.7,16.1 L179.4,38.4 L189.8,41.3 L199.7,22.9 L206.5,27.0 L220.4,45.1 L245.6,50.8 L267.4,21.3 L285.9,39.3 L293.8,48.2 L311.8,18.4 L325.8,38.4 L351.6,31.4 L373.6,43.4 L390.9,4.8 L416.5,6.5 L429.2,45.7 L444.7,43.4 L456.3,37.1 L475.0,5.0 L483.8,39.9 L509.3,24.2 L530.6,27.6 L536.8,25.2 L546.3,5.2 L569.6,14.1 L579.7,44.5 L591.7,31.4 L611.6,45.9 L625.6,40.8 L640.9,31.8 L649.5,17.1 L670.4,39.8 L688.0,45.7 L696.4,20.1 L710.0,30.3 L730.3,23.7 L751.8,44.8 L758.5,47.2 L769.7,44.3 L782.9,44.4 L796.6,22.7 L809.5,28.3 L831.0,7.5 L849.5,33.0 L874.2,21.5 L880.8,25.7 L896.3,3.0 L909.9,25.8 L934.2,29.5 L955.7,36.8 L978.6,26.5 L986.6,21.8 L1000.0,48.9 L1019.5,45.9 L1031.7,39.4 L1048.7,29.8 L1071.2,40.4 L1078.2,39.6 L1090.6,43.7 L1097.9,32.7 L1123.8,3.9 L1136.1,10.4 L1152.9,20.1 L1159.3,30.8 L1174.9,39.7 L1198.9,41.2 L1200.0,5.0 L1200,60Z%22/%3E%3C/svg%3E");
}

/* ---------- Baza ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--paper);font:400 16px/1.65 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
button{cursor:pointer}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
[hidden]{display:none!important}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:12px;top:-60px;z-index:200;background:var(--yellow);color:var(--ink);padding:10px 16px;font:800 15px var(--display);text-transform:uppercase}
.skip-link:focus{top:12px}
.logo{width:100%;height:auto;aspect-ratio:1109/526;color:currentColor;overflow:visible}

/* tła: papier i tusz */
.paper{position:relative;color:var(--ink);background-color:var(--paper);background-image:url(assets/img/tekstura-papier.png),radial-gradient(ellipse at 12% 18%,rgba(255,248,230,.65),transparent 45%),radial-gradient(ellipse at 88% 78%,rgba(196,170,120,.35),transparent 42%);background-size:512px,auto,auto}
.ink{position:relative;color:var(--paper);background-color:var(--ink);background-image:url(assets/img/tekstura-ciemna.png),radial-gradient(ellipse at 80% 10%,rgba(240,227,199,.06),transparent 50%);background-size:512px,auto}

/* rwana krawędź — doklejana od góry sekcji */
.tear-top{overflow-x:clip}
.tear-top::before{content:"";position:absolute;left:0;right:0;top:-34px;height:36px;z-index:3;pointer-events:none;background:inherit;background-position:0 -34px;-webkit-mask:var(--tear-1) left bottom/1200px 36px repeat-x;mask:var(--tear-1) left bottom/1200px 36px repeat-x}
.tear-top.ink::before{-webkit-mask-image:var(--tear-2);mask-image:var(--tear-2)}

/* plamy tuszu */
.splat{position:absolute;pointer-events:none;z-index:0;opacity:.92}

/* ---------- Typografia wspólna ---------- */
.h2{font:900 clamp(42px,5.6vw,80px)/.9 var(--display);text-transform:uppercase;letter-spacing:-.01em;margin:0 0 .45em;filter:url(#rough)}
.h2 em{display:inline-block;font:400 .78em/1.05 var(--graf);text-transform:none;letter-spacing:0;color:var(--rust);transform:rotate(-2deg);margin-top:.12em}
.ink .h2 em{color:var(--yellow)}
.kicker{display:flex;align-items:center;gap:12px;margin:0 0 18px;font:800 14px/1 var(--display);letter-spacing:.2em;text-transform:uppercase}
.kicker::before{content:"";width:34px;height:3px;background:currentColor}
.kicker__no{font:700 26px/1 var(--tattoo);letter-spacing:0;color:var(--rust)}
.kicker--light .kicker__no{color:var(--yellow)}
.hand-note{font:400 clamp(26px,3vw,38px)/1.05 var(--graf);transform:rotate(-3deg);margin:28px 0 0;color:var(--ink)}
.hand-note--sm{font-size:clamp(22px,2.4vw,30px)}
.section-head{position:relative;z-index:2;max-width:760px;margin-bottom:clamp(36px,5vw,64px)}
.section-head>p:last-child{max-width:520px;font-size:17px;opacity:.88}
.section-head--split{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.section-head--split>p{margin:0 0 .6em}

/* wstążka tattoo */
.ribbon{position:relative;display:inline-block;margin:0 0 22px;padding:0 34px;transform:rotate(-2deg)}
.ribbon span{position:relative;z-index:1;display:block;background:var(--ink);color:var(--paper);padding:7px 18px 6px;font:700 clamp(17px,1.6vw,21px)/1.2 var(--tattoo);letter-spacing:.02em;clip-path:polygon(0 0,100% 0,97% 50%,100% 100%,0 100%,3% 50%)}
.ribbon::before,.ribbon::after{content:"";position:absolute;top:9px;width:42px;height:100%;background:var(--ink-3);z-index:0}
.ribbon::before{left:0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,30% 50%)}
.ribbon::after{right:0;clip-path:polygon(0 0,100% 0,70% 50%,100% 100%,0 100%)}

/* przycisk pędzlem */
.brush-btn{position:relative;display:inline-flex;align-items:center;gap:14px;border:0;background:var(--ink);color:var(--paper-hi);padding:16px 30px 16px 16px;font:800 clamp(19px,1.8vw,24px)/1 var(--display);text-transform:uppercase;letter-spacing:.04em;clip-path:polygon(2% 12%,9% 1%,22% 6%,34% 0,48% 5%,62% 0,77% 6%,92% 0,98% 14%,96% 30%,100% 45%,97% 62%,100% 83%,90% 97%,71% 93%,55% 100%,37% 94%,19% 100%,4% 90%,7% 70%,0 52%,3% 32%);transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s}
.brush-btn:hover{transform:translateY(-3px) rotate(-1deg) scale(1.03)}
.brush-btn:active{transform:translateY(0) scale(.98)}
.brush-btn__check{width:34px;height:34px;flex:none;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;font:800 20px var(--body)}
.brush-btn__arrow{font-size:1.4em;line-height:.6;margin-left:4px;transition:transform .25s}
.brush-btn:hover .brush-btn__arrow{transform:translateX(5px)}
.brush-btn--yellow{background:var(--yellow);color:var(--ink)}
.brush-btn--yellow .brush-btn__check{background:var(--ink);color:var(--yellow)}
.brush-btn--full{width:100%;justify-content:center}

/* ---------- Pasek postępu i nagłówek ---------- */
.scroll-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:120;pointer-events:none}
.scroll-progress span{display:block;height:100%;background:var(--yellow);transform-origin:0 50%;transform:scaleX(0)}
.topbar{position:sticky;top:0;z-index:100;height:var(--header);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--pad);background:rgba(25,24,21,.94);border-bottom:1px solid var(--line-light);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:height .3s}
.topbar.is-compact{height:62px}
.topbar__brand{width:140px;flex:none;color:var(--paper);transition:width .3s,color .2s}
.topbar.is-compact .topbar__brand{width:116px}
.topbar__brand:hover{color:var(--yellow)}
.nav{display:flex;align-items:center;gap:clamp(18px,2.6vw,40px);font:700 15px/1 var(--display);letter-spacing:.08em;text-transform:uppercase}
.nav>a:not(.nav__cta){position:relative;opacity:.86;transition:opacity .2s}
.nav>a:not(.nav__cta)::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:3px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform .25s;clip-path:polygon(0 30%,100% 0,98% 100%,2% 80%)}
.nav>a:hover{opacity:1}
.nav>a:not(.nav__cta):hover::after{transform:scaleX(1)}
.nav__insta svg{width:22px;height:22px}
.nav__cta{border:2px solid var(--paper);padding:10px 16px;font-weight:800;transform:rotate(-2deg);transition:background .2s,color .2s,transform .2s,border-color .2s}
.nav__cta:hover{background:var(--yellow);border-color:var(--yellow);color:var(--ink);transform:rotate(0)}
.menu-toggle{display:none;background:none;border:0;padding:10px;margin-right:-10px;color:var(--paper)}
.menu-toggle span{display:block;width:26px;height:3px;background:currentColor;margin:5px 0;transition:transform .25s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ---------- HERO ---------- */
.hero{min-height:min(calc(100svh - var(--header)),940px);display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:20px;padding:clamp(40px,6vh,80px) var(--pad) 110px;overflow:hidden;isolation:isolate}
.hero__ghost{position:absolute;left:-2vw;top:4%;z-index:-1;font:900 clamp(140px,24vw,380px)/.8 var(--display);letter-spacing:-.02em;color:transparent;-webkit-text-stroke:2px rgba(25,24,21,.12);white-space:nowrap;pointer-events:none;user-select:none}
.hero__pines{position:absolute;left:-2%;right:-2%;bottom:0;z-index:-1;background-repeat:repeat-x;background-position:center bottom;pointer-events:none}
.hero__pines--back{height:58%;background-image:url(assets/svg/sosny-3.svg);background-size:auto 100%;opacity:.3;bottom:-4%}
.hero__pines--front{height:44%;background-image:url(assets/svg/sosny-2.svg);background-size:auto 100%;opacity:.16;bottom:-6%}
.splat--h1{width:clamp(220px,26vw,420px);right:3%;top:2%;opacity:.9;z-index:-1}
.splat--h2{width:clamp(120px,12vw,200px);left:38%;bottom:16%;opacity:.75;z-index:-1}
.hero__copy{position:relative;z-index:4;max-width:600px}
.hero__title{margin:0 0 22px;font-weight:400}
.hero__logo{width:min(100%,600px);color:var(--ink);margin-left:-1.5%;filter:drop-shadow(5px 6px 0 rgba(25,24,21,.14))}
.hero__tag{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 16px;margin-top:6px;transform:rotate(-2deg)}
.hero__tag b{font:900 clamp(40px,4.8vw,70px)/.9 var(--display);letter-spacing:.01em;color:var(--ink)}
.hero__tag em{font:400 clamp(34px,3.8vw,56px)/1 var(--graf);font-style:normal;color:var(--rust)}
.hero__lead{font-size:clamp(17px,1.35vw,19px);max-width:470px;margin-bottom:10px}
.hero__sub{font-size:15px;max-width:470px;opacity:.85;margin-bottom:30px}
.hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 28px}
.scrawl-link{font:400 22px/1 var(--graf);border-bottom:3px solid currentColor;padding-bottom:4px;transform:rotate(-2deg);transition:color .2s}
.scrawl-link:hover{color:var(--rust)}
.hero__stage{position:relative;z-index:3;height:clamp(420px,46vw,640px);align-self:center}
.hero__mound{position:absolute;left:-16%;top:63.5%;width:130%;max-width:none;height:75%;color:var(--ink);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}
.hero__bike{position:absolute;left:2%;top:13%;width:96%;z-index:3;transform:rotate(-11deg);transform-origin:40% 60%}
.hero__bike picture{display:block;animation:float 6s ease-in-out infinite}
.hero__bike img{display:block;width:calc(100% * 1451 / 1431);max-width:none;height:auto;margin-bottom:calc(-100% * 44 / 1431)} /* cień wypalony w grafice (Safari iOS gubił obraz z filter+animacją) */
.clump{position:absolute;color:var(--ink);z-index:2}
.clump.c1{width:30px;left:74%;top:72%}
.clump.c2{width:20px;left:82%;top:62%}
.clump.c3{width:14px;left:66%;top:60%}
.clump.c4{width:40px;left:90%;top:78%}
.clump.c5{width:12px;left:58%;top:70%}
.clump.c6{width:24px;left:78%;top:50%}
.badge{position:absolute;right:-2%;top:-3%;z-index:5;width:clamp(120px,12vw,170px);aspect-ratio:1;color:var(--ink)}
.badge::before{content:"";position:absolute;inset:3%;border-radius:50%;background:var(--paper-hi);border:3px solid var(--ink);box-shadow:5px 6px 0 var(--ink)}
.badge__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 22s linear infinite;font:800 16px var(--display);fill:var(--ink)}
.badge__star{position:absolute;inset:31%;width:38%;height:38%;color:var(--ink)}
.scrawl{position:absolute;font:400 clamp(26px,2.6vw,40px)/1 var(--graf);color:var(--ink);z-index:6;pointer-events:none}
.scrawl--send{left:-2%;top:6%;transform:rotate(-12deg);text-shadow:2px 2px 0 var(--paper)}
.hero__arrow{position:absolute;left:4%;top:18%;width:110px;fill:none;stroke:var(--ink);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;transform:rotate(18deg);z-index:6}

/* ---------- Taśmy ---------- */
.tapes{position:relative;z-index:8;height:120px;margin:-70px 0 -50px;pointer-events:none;overflow:hidden}
.tape{position:absolute;left:-5%;right:-5%;height:54px;display:flex;align-items:center;overflow:hidden;box-shadow:0 8px 0 rgba(0,0,0,.18)}
.tape--yellow{top:20px;background:var(--yellow);color:var(--ink);transform:rotate(-2.4deg)}
.tape--ink{top:48px;background:var(--ink);color:var(--paper);transform:rotate(1.6deg);border-top:2px solid var(--paper-2);border-bottom:2px solid var(--paper-2)}
.tape--yellow::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-45deg,transparent 0 22px,rgba(25,24,21,.08) 22px 44px)}
.tape__track{position:relative;display:flex;white-space:nowrap;will-change:transform}
.tape__track span{font:900 26px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;padding:0 22px}
.tape__track i{font-style:normal;font:700 24px/1 var(--tattoo);font-variant-emoji:text}
.badge__ring text{font-variant-emoji:text}

/* ---------- Cechy ---------- */
.features{display:grid;grid-template-columns:repeat(4,1fr) .9fr;padding:110px var(--pad) 70px;gap:0}
.feature{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 18px;border-right:1px solid var(--line-light)}
.feature__icon{width:84px;height:68px;color:var(--paper);margin-bottom:14px;filter:url(#rough);transition:transform .35s cubic-bezier(.2,.8,.2,1),color .2s}
.feature:hover .feature__icon{transform:translateY(-6px) rotate(-4deg);color:var(--yellow)}
.feature h2{font:800 23px/1 var(--display);letter-spacing:.05em;text-transform:uppercase;margin:0 0 8px}
.feature p{font-size:13.5px;line-height:1.5;color:#cfc3aa;margin:0}
.features__slogan{align-self:center;justify-self:center;text-align:center;font:400 34px/.95 var(--graf);transform:rotate(-7deg);margin:0;color:var(--paper)}
.features__slogan svg{width:56px;height:45px;margin:10px auto 0;color:var(--yellow)}

/* ---------- O projekcie ---------- */
.project{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,70px);align-items:center;padding:clamp(76px,8vw,104px) var(--pad) clamp(80px,9vw,120px)}
.project__copy{position:relative;z-index:2;max-width:520px}
.project__copy>p:not(.kicker):not(.hand-note){font-size:16.5px}
.splat--p1{width:clamp(160px,18vw,280px);right:-40px;bottom:-30px;opacity:.5}
.sketch{position:relative;margin:0;z-index:2}
.sketch__label{position:absolute;right:2%;top:-26px;font:800 12px/1 var(--display);letter-spacing:.16em;text-transform:uppercase}
.sketch__map{width:100%;height:auto;transform:rotate(-1.6deg);overflow:visible}
.sk-shadow{fill:none;stroke:#bba67f;stroke-width:42;opacity:.7}
.sk-main{fill:none;stroke:var(--ink);stroke-width:32;stroke-linecap:round}
.sk-dash{fill:none;stroke:var(--paper);stroke-width:2.6;stroke-dasharray:6 8;animation:dash 18s linear infinite}
.sk-ramp{fill:#d6c39e;stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.sk-flight{fill:none;stroke:var(--rust);stroke-width:2.6;stroke-dasharray:3 6;stroke-linecap:round}
.sk-trees{fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round}
.sk-zone{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-dasharray:5 5}
.sk-labels{font:800 13px var(--display);letter-spacing:1.4px;fill:var(--ink)}
.sk-main--lane{stroke-width:24}
.sk-track .sk-shadow{stroke-width:34}
.sk-shadow--pump{stroke-width:22}
.sk-main--pump{stroke-width:14}
.sk-return{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-dasharray:4 7;stroke-linecap:round;opacity:.7}
.sk-rollin__deck{fill:#d6c39e;stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.sk-rollin__hatch{stroke:var(--ink);stroke-width:1.6;opacity:.55}
.sk-rollin__arrow{fill:none;stroke:var(--rust);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.sk-opt{font-size:11px;opacity:.75}
.stamp{position:absolute;left:-2%;top:-8%;width:clamp(130px,13vw,180px);aspect-ratio:1;border-radius:50%;border:3px solid var(--ink);outline:2px dashed var(--ink);outline-offset:5px;background:var(--paper-hi);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:18px;transform:rotate(-14deg);box-shadow:6px 7px 0 rgba(25,24,21,.85);color:var(--ink)}
.stamp .logo{width:96%}
.stamp span{font:800 9.5px/1.1 var(--display);letter-spacing:.14em;text-transform:uppercase;text-align:center}
.sketch__note{position:absolute;right:2%;bottom:-6%;font:400 clamp(20px,2vw,28px)/1.05 var(--graf);transform:rotate(5deg)}

/* ---------- Napisy graffiti w odmianie (Dirtowni / Dirtownią) ---------- */
.wg{display:block}
.wg__svg{display:block;width:100%;height:auto;overflow:visible}
.wg--card{width:min(100%,360px);margin:10px 0 -6px -6px;color:var(--yellow);transform:rotate(-2deg)}
.wg--band{width:190px;color:var(--ink);transform:rotate(-3deg);margin-top:2px}

/* ---------- Dlaczego ---------- */
.reasons{padding:clamp(84px,9vw,120px) var(--pad) clamp(76px,8vw,104px)}
.ghost-word{position:absolute;right:-3vw;top:4%;font:900 clamp(160px,28vw,420px)/.8 var(--display);color:transparent;-webkit-text-stroke:2px rgba(240,227,199,.07);pointer-events:none;user-select:none}
.flash-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px)}
.flash{position:relative;background:var(--ink-2);border:2px solid var(--paper);outline:1px solid rgba(240,227,199,.4);outline-offset:-10px;padding:34px 30px 30px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .2s}
.flash:nth-child(odd){transform:rotate(-.8deg)}
.flash:nth-child(even){transform:rotate(.8deg)}
.flash:hover{transform:rotate(0) translateY(-8px);box-shadow:8px 10px 0 var(--yellow);border-color:var(--yellow)}
.flash__no{position:absolute;right:22px;top:14px;font:700 54px/1 var(--tattoo);color:var(--yellow);opacity:.9}
.flash__icon{width:64px;height:52px;color:var(--paper);margin-bottom:16px;filter:url(#rough)}
.flash h3{font:800 26px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;margin:0 0 10px}
.flash p{font-size:14.5px;line-height:1.65;color:#d4c8b0;margin:0}

/* ---------- Las ---------- */
.forest{position:relative;min-height:max(118vh,860px);overflow:hidden;color:var(--ink);background:linear-gradient(180deg,var(--paper-hi) 0%,var(--paper) 45%,var(--paper-2) 100%);display:flex;align-items:flex-start;padding:clamp(80px,9vw,120px) var(--pad) 0}
.forest::after{content:"";position:absolute;inset:0;background:url(assets/img/tekstura-papier.png);background-size:512px;pointer-events:none;z-index:1}
.forest::before{content:"";position:absolute;left:0;right:0;top:-2px;height:36px;z-index:5;background:var(--ink);-webkit-mask:var(--tear-2) left bottom/1200px 36px repeat-x;mask:var(--tear-2) left bottom/1200px 36px repeat-x;transform:scaleY(-1);pointer-events:none}
.forest__sky{position:absolute;inset:0;z-index:0;pointer-events:none}
.forest__sun{position:absolute;right:12%;top:12%;width:clamp(150px,16vw,240px);color:var(--rust);opacity:.85}
.forest__sun svg{animation:spin 60s linear infinite}
.forest__layer{position:absolute;left:-3%;right:-3%;background-repeat:repeat-x;background-position:center bottom;background-size:auto 100%}
.forest__layer--3{bottom:8%;height:52%;background-image:url(assets/svg/sosny-3.svg);opacity:.7}
.forest__layer--2{bottom:0;height:62%;background-image:url(assets/svg/sosny-2.svg)}
.forest__layer--1{bottom:-12%;height:82%;background-image:url(assets/svg/sosny-1.svg)}
.note-card{position:relative;z-index:4;max-width:600px;background:var(--paper-hi);background-image:url(assets/img/tekstura-papier.png);background-size:512px;padding:clamp(30px,4vw,48px);box-shadow:10px 12px 0 rgba(25,24,21,.88);transform:rotate(-1.4deg);margin-left:clamp(0px,4vw,60px)}
.note-card>p:not(.kicker):not(.hand-note){font-size:16px}
.tape-strip{position:absolute;top:-16px;width:110px;height:34px;background:rgba(245,208,0,.78);box-shadow:0 2px 0 rgba(0,0,0,.08)}
.tape-strip--l{left:-24px;transform:rotate(-24deg)}
.tape-strip--r{right:-24px;transform:rotate(18deg)}

/* ---------- Inne miasta ---------- */
.cities{padding:clamp(84px,9vw,116px) var(--pad) clamp(76px,8vw,104px)}
.ghost-word--left{right:auto;left:-3vw;top:auto;bottom:6%}
.cities__head{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,60px);align-items:center;margin-bottom:clamp(30px,4vw,50px)}
.cities__head .section-head{margin-bottom:0}
.cities__map{position:relative;margin:0;max-width:420px;justify-self:end;width:100%}
.cities__map svg{width:100%;height:auto;overflow:visible}
.map-routes path{fill:none;stroke:var(--paper);stroke-width:2.2;stroke-dasharray:4 8;stroke-linecap:round;opacity:.55;animation:dash 14s linear infinite}
.map-pin circle{fill:var(--paper);stroke:var(--ink);stroke-width:3}
.map-pin text{font:800 15px var(--display);letter-spacing:.06em;text-transform:uppercase;fill:var(--paper)}
.map-pin--otwock circle{fill:var(--yellow)}
.map-pin--otwock text{fill:var(--yellow);font-size:19px}
.map-pin--otwock .map-q{fill:var(--ink);font-size:16px}
.map-pulse{fill:none!important;stroke:var(--yellow)!important;stroke-width:2!important;transform-origin:293px 190px;transform-box:view-box;animation:pulse 2.2s ease-out infinite}
.map-compass circle{fill:none;stroke:rgba(240,227,199,.35);stroke-width:1.5}
.map-compass path{fill:rgba(240,227,199,.5)}
.map-compass text{font:700 14px var(--tattoo);fill:rgba(240,227,199,.6)}
.cities__map-note{position:absolute;right:0;top:0;text-align:right;font:400 clamp(20px,2vw,26px)/1.05 var(--graf);color:var(--yellow);transform:rotate(-6deg)}
.city-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px)}
.city{position:relative;display:flex;flex-direction:column;background:var(--paper-hi);background-image:url(assets/img/tekstura-papier.png);background-size:512px;color:var(--ink);padding:26px 26px 24px;box-shadow:8px 9px 0 rgba(0,0,0,.45);border:2px solid var(--ink);outline:2px dashed rgba(25,24,21,.35);outline-offset:-10px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.city:nth-child(1){transform:rotate(-1deg)}
.city:nth-child(2){transform:rotate(.7deg)}
.city:nth-child(3){transform:rotate(-.5deg)}
.city.reveal.is-visible:nth-child(1){transform:rotate(-1deg)}
.city.reveal.is-visible:nth-child(2){transform:rotate(.7deg)}
.city.reveal.is-visible:nth-child(3){transform:rotate(-.5deg)}
.city.reveal.is-visible:hover,.city:hover{transform:rotate(0) translateY(-6px)}
.city__top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}
.city__stamp{display:inline-block;border:2px solid var(--rust);color:var(--rust);padding:5px 10px 4px;font:800 13px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;transform:rotate(-4deg)}
.city__stamp--open{border-color:var(--ink);color:var(--ink);background:var(--yellow)}
.city__region{font:700 12px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;opacity:.6}
.city h3{font:900 clamp(34px,3vw,44px)/.9 var(--display);text-transform:uppercase;margin:0 0 14px}
.city h3 small{display:block;font:400 .62em/1.2 var(--graf);text-transform:none;color:var(--rust);margin-top:4px}
.city__fact{font:700 16px/1.45 var(--body);margin:0 0 10px}
.city p:not(.city__fact){font-size:14.5px;margin:0 0 18px}
.city__links{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.city__link{align-self:flex-start;margin-top:auto;font:800 15px/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase;border-bottom:2px solid currentColor;padding-bottom:2px;transition:color .2s}
.city__links .city__link{margin-top:0}
.city__link:hover{color:var(--rust)}
.city__link--small{font-size:12px;opacity:.7}
.cities__punch{position:relative;z-index:2;text-align:center;margin:clamp(40px,5vw,60px) 0 0;font:900 clamp(30px,3.6vw,50px)/1 var(--display);text-transform:uppercase}
.cities__punch em{font:400 .95em/1 var(--graf);text-transform:none;color:var(--yellow);font-style:normal}
@keyframes pulse{0%{transform:scale(.8);opacity:1}100%{transform:scale(2.2);opacity:0}}

/* ---------- Plan parku ---------- */
.park{padding:clamp(84px,9vw,116px) var(--pad) clamp(80px,9vw,110px)}
.splat--k1{width:clamp(140px,15vw,240px);left:-50px;top:10%;opacity:.35}
.lines{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px)}
.line{position:relative;background:var(--paper-hi);border:3px solid var(--ink);padding:24px 26px 28px;box-shadow:8px 9px 0 var(--ink);transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.line:hover{transform:translate(-3px,-5px);box-shadow:12px 14px 0 var(--ink)}
.line[data-level="3"]{background:var(--ink);color:var(--paper)}
.line__top{display:flex;justify-content:space-between;font:800 14px/1 var(--display);letter-spacing:.16em;text-transform:uppercase}
.line__dots{letter-spacing:.2em;color:var(--rust)}
.line[data-level="3"] .line__dots{color:var(--yellow)}
.line__art{width:100%;height:auto;margin:18px 0 10px;overflow:visible}
.line__art .ground{stroke:currentColor;stroke-width:3;fill:none}
.line__art .mound{fill:currentColor}
.line__art .flight{fill:none;stroke:var(--rust);stroke-width:3;stroke-linecap:round;stroke-dasharray:4 7;stroke-dashoffset:300}
.line[data-level="3"] .line__art .flight{stroke:var(--yellow)}
.line.is-visible .line__art .flight{animation:flight 1.6s .2s cubic-bezier(.3,.7,.2,1) forwards}
.line h3{font:800 30px/1 var(--display);text-transform:uppercase;margin:0 0 10px}
.line p{font-size:15px;margin:0 0 18px}
.line__tag{display:inline-block;font:400 19px/1 var(--graf);border-bottom:2px solid currentColor;padding-bottom:3px;transform:rotate(-2deg)}
.small-note{position:relative;z-index:2;max-width:760px;margin:40px 0 0;font-size:13px;opacity:.72}

/* ---------- Porównanie ---------- */
.compare{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,5vw,70px);align-items:center;padding:clamp(84px,9vw,112px) var(--pad) clamp(80px,9vw,110px)}
.compare__copy p:last-child{font-size:16px;color:#d4c8b0;max-width:440px}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.compare__table{width:100%;min-width:520px;border-collapse:collapse;font-size:15px}
.compare__table th,.compare__table td{text-align:left;padding:18px 16px;border-bottom:1px solid var(--line-light)}
.compare__table thead th{font:800 15px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:#bfb399;border-bottom:2px solid var(--paper)}
.compare__table tbody th{font:700 15px var(--body);color:#bfb399}
.compare__table .hl{background:rgba(245,208,0,.1);color:var(--yellow);font-weight:700}
.compare__table thead .hl{color:var(--yellow);font-size:19px}

/* ---------- Głosowanie ---------- */
.vote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,6vw,90px);align-items:center;padding:clamp(84px,9vw,116px) var(--pad) clamp(76px,8vw,104px)}
.splat--v1{width:clamp(180px,20vw,320px);left:34%;top:-20px;opacity:.12}
.vote__copy{position:relative;z-index:2}
.vote__copy>p:not(.kicker){font-size:17px;max-width:520px}
.counter{margin:26px 0 8px;max-width:460px}
.counter__label{font:800 13px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;margin:0 0 6px}
.counter__num{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;font:900 clamp(52px,6vw,76px)/1 var(--display);margin:0 0 12px;font-variant-numeric:tabular-nums}
.counter__num span{font-size:clamp(20px,2vw,24px);font-weight:800;letter-spacing:.04em;text-transform:uppercase;opacity:.75}
.counter__num b{font-weight:900}
.counter__num i{font-style:normal}
.counter__bar{position:relative;height:22px;border:3px solid var(--ink);border-radius:20px;background:var(--paper-hi);box-shadow:4px 4px 0 var(--ink)}
.counter__fill{position:absolute;left:0;top:0;bottom:0;width:0;min-width:0;background:var(--ink);border-radius:20px 0 0 20px;transition:width 1.6s cubic-bezier(.2,.8,.2,1);background-image:repeating-linear-gradient(-45deg,transparent 0 10px,rgba(240,227,199,.14) 10px 20px)}
.counter__fill.is-full{border-radius:20px}
.counter__splat{position:absolute;right:-14px;top:50%;width:34px;height:34px;transform:translateY(-50%);color:var(--ink);opacity:0;transition:opacity .3s .9s}
.counter__fill.has-votes .counter__splat{opacity:1}
.counter__meta{display:none}
.counter.is-bump .counter__num strong{animation:bump .6s cubic-bezier(.2,.8,.2,1)}
/* pas z licznikiem (żółty) */
.vote-band{position:relative;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) minmax(0,.8fr);align-items:center;gap:clamp(24px,4vw,60px);padding:clamp(56px,6vw,80px) var(--pad) clamp(52px,5vw,70px);background-color:var(--yellow);background-image:url(assets/img/tekstura-papier.png),repeating-linear-gradient(-45deg,transparent 0 30px,rgba(25,24,21,.035) 30px 60px);background-size:512px,auto;color:var(--ink)}
.vote-band__title{margin:0;font:400 clamp(40px,4.4vw,62px)/.95 var(--graf);transform:rotate(-4deg)}
.counter--band{margin:0;max-width:none}
.counter--band .counter__bar{background:var(--paper-hi)}
.vote-band__cta{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.vote-band__cta p{margin:0;font-size:14px;font-weight:500}
.vote-band__note{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.proof{display:flex;align-items:center;gap:16px;margin-top:30px;max-width:460px}
.proof__star{width:58px;height:58px;flex:none;color:var(--ink)}
.proof p{margin:0;font-size:14.5px}
.proof strong{display:block;font:800 21px/1.1 var(--display);text-transform:uppercase;letter-spacing:.04em}
.vote-card{position:relative;z-index:2;background:var(--ink);background-image:url(assets/img/tekstura-ciemna.png);background-size:512px;color:var(--paper);padding:clamp(28px,3.5vw,44px);box-shadow:12px 14px 0 var(--yellow);transform:rotate(1deg)}
.vote-card__top{display:flex;justify-content:space-between;align-items:center;font:800 13px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;padding-bottom:14px;border-bottom:1px solid var(--line-light)}
.vote-card__top svg{width:40px;height:32px;color:var(--yellow)}
.vote-card h3{font:900 clamp(40px,4vw,56px)/.9 var(--display);text-transform:uppercase;margin:22px 0 22px}
.vote-card h3 em{font:400 .8em/1.1 var(--graf);text-transform:none;color:var(--yellow);display:inline-block;transform:rotate(-2deg)}
.vote-card form{display:grid;gap:8px}
.vote-card label{font:800 14px/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase;margin-top:6px}
.vote-card label span{font:400 12px var(--body);letter-spacing:0;text-transform:none;opacity:.7}
.vote-card input:not([type=checkbox]),.vote-card select{width:100%;padding:13px 14px;border:2px solid var(--paper-2);border-radius:0;background:var(--paper-hi);color:var(--ink);font-size:16px;appearance:none;-webkit-appearance:none}
.vote-card select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 22px) 52%,calc(100% - 15px) 52%;background-size:7px 7px;background-repeat:no-repeat;padding-right:40px}
.vote-card input:focus,.vote-card select:focus{outline:3px solid var(--yellow);outline-offset:1px}
.vote-card input[aria-invalid="true"],.vote-card select[aria-invalid="true"]{border-color:#e0603f}
.consent{display:flex;gap:12px;align-items:flex-start;font:500 14px/1.45 var(--body)!important;letter-spacing:0!important;text-transform:none!important;margin:12px 0 10px!important;cursor:pointer}
.consent input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--yellow)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-error{color:#ffb39f;font-size:14px;margin:0}
.form-note{font-size:12.5px;line-height:1.5;opacity:.68;margin:10px 0 0}
.form-success{display:flex;gap:16px;align-items:center;margin-top:8px;padding:20px;border:2px dashed var(--yellow)}
.form-success svg{width:54px;height:54px;flex:none;color:var(--yellow);animation:spin 8s linear infinite}
.form-success p{margin:0;font-size:14.5px}
.form-success strong{display:block;font:400 28px/1.1 var(--graf);color:var(--yellow);margin-bottom:4px}

/* ---------- Kroki ---------- */
.steps{padding:clamp(84px,9vw,116px) var(--pad) clamp(76px,8vw,104px)}
.steps__track{position:relative}
.steps__line{position:absolute;left:0;right:0;top:-10px;width:100%;height:120px;overflow:visible;pointer-events:none}
.steps__path-bg{fill:none;stroke:rgba(240,227,199,.12);stroke-width:14;stroke-linecap:round}
.steps__path{fill:none;stroke:var(--yellow);stroke-width:5;stroke-linecap:round;stroke-dasharray:6 10}
.steps__list{list-style:none;margin:0;padding:130px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,34px);counter-reset:none}
.step{position:relative;border-top:3px solid var(--paper);padding-top:18px}
.step__no{display:block;font:700 64px/1 var(--tattoo);color:var(--yellow);margin-bottom:10px}
.step h3{font:800 26px/1 var(--display);text-transform:uppercase;margin:0 0 10px}
.step p{font-size:14.5px;color:#d4c8b0;margin:0}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(30px,6vw,90px);padding:clamp(84px,9vw,116px) var(--pad) clamp(76px,8vw,104px)}
.faq__intro p:not(.kicker){font-size:16.5px}
.faq__crown{width:110px;height:88px;margin-top:30px;color:var(--rust);transform:rotate(-8deg);filter:url(#rough)}
.faq__list details{border-bottom:2px solid var(--ink)}
.faq__list details:first-child{border-top:2px solid var(--ink)}
.faq__list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font:800 clamp(20px,1.9vw,25px)/1.15 var(--display);text-transform:uppercase;letter-spacing:.02em;transition:color .2s}
.faq__list summary::-webkit-details-marker{display:none}
.faq__list summary:hover{color:var(--rust)}
.faq__list summary span{position:relative;width:34px;height:34px;flex:none;border:2px solid currentColor;border-radius:50%}
.faq__list summary span::before,.faq__list summary span::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2.5px;background:currentColor;transform:translate(-50%,-50%);transition:transform .3s}
.faq__list summary span::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq__list details[open] summary span::after{transform:translate(-50%,-50%) rotate(0)}
.faq__list details>div{padding:0 50px 22px 4px}
.faq__list details>div p{margin:0;font-size:16px}
.faq__list details[open]>div{animation:fadeDown .35s ease}

/* ---------- Finał ---------- */
.final{min-height:clamp(640px,92vh,900px);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:clamp(110px,12vw,150px) var(--pad) clamp(260px,26vw,340px);overflow-x:clip}
.splat--f1{width:clamp(200px,22vw,360px);right:4%;top:14%;opacity:.12;filter:invert(1)}
.final__crown{width:90px;height:72px;color:var(--yellow);margin-bottom:6px;position:relative;z-index:2}
.final__logo{position:relative;z-index:2;width:min(780px,92%);color:var(--paper);margin-bottom:26px}
.final__title{position:relative;z-index:2;font:900 clamp(40px,5.4vw,78px)/.92 var(--display);text-transform:uppercase;margin:0 0 30px;transform:rotate(-1.5deg);filter:url(#rough)}
.final__title em{font:400 .8em/1.1 var(--graf);text-transform:none;color:var(--yellow)}
.final .brush-btn{position:relative;z-index:2}
.final .kicker{position:relative;z-index:2;justify-content:center}
.final__slogan{position:relative;z-index:2;margin:30px 0 0;font:800 13px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;opacity:.8}
.final__pines{position:absolute;left:-3%;right:-3%;bottom:0;background-repeat:repeat-x;background-position:center bottom;background-size:auto 100%;pointer-events:none;z-index:1}
.final__pines--2{height:42%;background-image:url(assets/svg/sosny-noc-2.svg);bottom:-2%}
.final__pines--1{height:34%;background-image:url(assets/svg/sosny-noc-1.svg);bottom:-4%}

/* ---------- Stopka ---------- */
.footer{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px var(--pad);background:#0d0c0a;color:#b9ad96;font-size:13px;border-top:1px solid var(--line-light)}
.footer__brand{width:110px;color:var(--paper)}
.footer__top{font:800 13px var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--paper)}
.footer__top:hover{color:var(--yellow)}

/* ---------- Pływające CTA (mobile) ---------- */
.sticky-cta{position:fixed;right:16px;bottom:16px;z-index:90;display:none;align-items:center;gap:8px;background:var(--yellow);color:var(--ink);padding:14px 22px;font:800 18px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;box-shadow:5px 6px 0 var(--ink);transform:translateY(140%);transition:transform .35s cubic-bezier(.2,.8,.2,1);clip-path:polygon(3% 8%,30% 0,62% 6%,97% 0,100% 50%,96% 100%,60% 93%,28% 100%,0 92%,2% 50%)}
.sticky-cta.is-on{transform:translateY(0)}

/* ---------- Animacje wejścia ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.75,.25,1)}
.reveal.is-visible{opacity:1;transform:none}
.flash.reveal.is-visible:nth-child(odd){transform:rotate(-.8deg)}
.flash.reveal.is-visible:nth-child(even){transform:rotate(.8deg)}
.flash.reveal.is-visible:hover{transform:rotate(0) translateY(-8px)}
.note-card.reveal.is-visible{transform:rotate(-1.4deg)}
.vote-card.reveal.is-visible{transform:rotate(1deg)}
.flash-grid .flash:nth-child(3n+2),.lines .line:nth-child(2),.features .feature:nth-child(2),.steps__list .step:nth-child(2){transition-delay:.08s}
.flash-grid .flash:nth-child(3n+3),.lines .line:nth-child(3),.features .feature:nth-child(3),.steps__list .step:nth-child(3){transition-delay:.16s}
.features .feature:nth-child(4),.steps__list .step:nth-child(4){transition-delay:.24s}
.no-js .reveal{opacity:1;transform:none}

@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(1.4deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes dash{to{stroke-dashoffset:-280}}
@keyframes flight{to{stroke-dashoffset:0}}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-3deg)}100%{transform:scale(1)}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- Responsywność ---------- */
@media (min-width:1600px){
  .hero,.project,.reasons,.park,.compare,.vote,.steps,.faq{padding-left:calc((100vw - var(--max))/2);padding-right:calc((100vw - var(--max))/2)}
}
@media (max-width:1100px){
  .features{grid-template-columns:repeat(4,1fr)}
  .features__slogan{display:none}
  .flash-grid,.lines,.city-grid{grid-template-columns:repeat(2,1fr)}
  .city-grid .city:nth-child(3){grid-column:1/-1}
  .lines .line:nth-child(3){grid-column:1/-1}
  .steps__list{grid-template-columns:repeat(2,1fr);row-gap:40px}
  .steps__line{display:none}
  .steps__list{padding-top:0}
  .vote-band{grid-template-columns:1fr 1.4fr}
  .vote-band__cta{grid-column:1/-1;flex-direction:row;align-items:center;flex-wrap:wrap}
}
@media (max-width:900px){
  :root{--header:66px}
  .menu-toggle{display:block}
  .topbar__brand{width:118px}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:12px var(--pad) 26px;background:var(--ink);border-bottom:1px solid var(--line-light);font-size:22px;transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .2s,transform .25s,visibility .2s}
  .nav.is-open{opacity:1;visibility:visible;transform:none}
  .nav>a:not(.nav__cta){padding:14px 0;border-bottom:1px solid var(--line-light)}
  .nav>a:not(.nav__cta)::after{display:none}
  .nav__cta{align-self:flex-start;margin-top:18px}
  .nav__insta{padding:14px 0}
  .hero{grid-template-columns:1fr;gap:0;padding-top:38px;padding-bottom:120px;min-height:0}
  .hero__copy{max-width:640px}
  .hero__stage{height:clamp(300px,70vw,520px);margin:10px -4% 0}
  .project,.compare,.vote,.faq,.cities__head{grid-template-columns:1fr}
  .cities__map{justify-self:center;max-width:360px}
  .sketch{margin-top:40px}
  .section-head--split{flex-direction:column;align-items:flex-start;gap:0}
  .forest{min-height:max(110vh,820px)}
  .vote-card{transform:none}
  .vote-card.reveal.is-visible{transform:none}
  .sticky-cta{display:inline-flex}
  .splat--h1{display:none}
}
@media (max-width:640px){
  body{font-size:15px}
  .hero__ghost{font-size:44vw;top:2%}
  .hero__logo{width:100%}
  .hero__actions{gap:16px}
  .brush-btn{font-size:19px;padding:14px 22px 14px 12px;gap:10px}
  .brush-btn__check{width:30px;height:30px;font-size:17px}
  .badge{width:104px;right:0;top:-6%}
  .badge__ring{font-size:16px}
  .scrawl--send{font-size:24px;left:0;top:2%}
  .hero__arrow{width:70px;top:12%}
  .tapes{height:96px;margin:-60px 0 -36px}
  .tape{height:44px}
  .tape__track span{font-size:21px;padding:0 14px}
  .features{grid-template-columns:repeat(2,1fr);padding:90px 20px 56px;row-gap:34px}
  .feature{border-right:0;padding:0 10px}
  .feature:nth-child(odd){border-right:1px solid var(--line-light)}
  .feature__icon{width:70px;height:56px}
  .feature h2{font-size:20px}
  .flash-grid,.lines,.steps__list,.city-grid{grid-template-columns:1fr}
  .city-grid .city:nth-child(3){grid-column:auto}
  .city{padding:22px 20px 20px}
  .flash{padding:28px 22px 24px}
  .flash__no{font-size:44px}
  .stamp{width:110px;left:-4px;top:-14%;padding:12px}
  .stamp span{font-size:7.5px}
  .sketch__label{position:static;display:block;font-size:10px;letter-spacing:.12em;text-align:right;margin-top:14px}
  .sketch{display:flex;flex-direction:column-reverse}
  .sketch__note{display:none}
  .compare__table{min-width:0;font-size:13px}
  .compare__table th,.compare__table td{padding:12px 6px}
  .compare__table thead th{font-size:12px;letter-spacing:.06em}
  .compare__table thead .hl{font-size:14px}
  .compare__table tbody th{font-size:12.5px}
  .note-card{margin-left:0;padding:28px 22px}
  .tape-strip{width:80px;height:28px}
  .line{padding:20px 20px 24px}
  .vote-band{grid-template-columns:1fr;gap:22px}
  .vote-band__title br{display:none}
  .vote-band__cta{flex-direction:column;align-items:flex-start}
  .vote-card{padding:26px 20px}
  .faq__list details>div{padding-right:6px}
  .final{padding-bottom:220px}
  .footer{flex-direction:column;text-align:center;gap:12px;padding-bottom:90px}
}

/* ---------- Ograniczony ruch ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .line__art .flight{stroke-dashoffset:0}
}

/* =========================================================
   DIRTOWNIA — style dla nowego formularza i stopki
   ========================================================= */
.field-area{display:grid;gap:8px}
.field-area[hidden]{display:none}
.consent + .consent{margin-top:2px!important}
.consent a{color:var(--yellow);text-decoration:underline;text-underline-offset:2px}
.consent__req{opacity:.6;font-size:12.5px;white-space:nowrap}
.consent--optional{opacity:.92}
.captcha{min-height:65px;margin:6px 0 4px}
.captcha[hidden]{display:none}
.captcha[aria-invalid="true"]{outline:2px solid #e0603f;outline-offset:3px}
.form-note--rodo{opacity:.78}
.form-note--rodo a{color:var(--yellow);text-decoration:underline;text-underline-offset:2px}
.footer__privacy{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* ---------- Formularz: wiek i rodzic/opiekun (poniżej 16 lat) ---------- */
.age-switch,.guardian{border:0;padding:0;margin:0;min-width:0}
.age-switch legend,.guardian legend{padding:0;margin-bottom:8px;font:800 14px/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase}
.age-switch legend span{font:400 12px var(--body);letter-spacing:0;text-transform:none;opacity:.7}
.age-switch__opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.age-switch__opts label{position:relative;margin:0!important;cursor:pointer}
.age-switch__opts input{position:absolute;opacity:0;inset:0;width:100%!important;height:100%;margin:0;padding:0!important;cursor:pointer}
.age-switch__opts span{display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 10px;border:2px solid var(--paper-2);color:var(--paper);font:800 15px/1.1 var(--display);letter-spacing:.05em;text-transform:uppercase;text-align:center;opacity:1!important;transition:background .2s,color .2s,border-color .2s}
.age-switch__opts input:checked+span{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.age-switch__opts input:focus-visible+span{outline:3px solid var(--yellow);outline-offset:2px}
.field-group{display:grid;gap:8px}
.guardian{display:grid;gap:8px;margin-top:10px;padding:16px 16px 10px;border:2px dashed var(--yellow)}
.guardian legend{padding:0 8px;margin:0;color:var(--yellow)}
.guardian__info{margin:0 0 4px;font-size:13.5px;line-height:1.5;opacity:.9}

/* =========================================================
   DIRTOWNIA — kamienie milowe, numer głosu, ranking osiedli, kontakt
   ========================================================= */
/* Kamienie milowe pod paskiem licznika */
.counter__ms{position:relative;height:44px;margin:6px 0 0}
.counter__ms[hidden]{display:none}
.ms{position:absolute;top:0;display:flex;flex-direction:column;align-items:center;transform:translateX(-50%);color:var(--ink);opacity:.5;white-space:nowrap;line-height:1}
.ms::before{content:"";width:3px;height:9px;background:currentColor;margin-bottom:5px}
.ms--end{align-items:flex-end;transform:translateX(-100%)}
.ms--end::before{margin-right:14px}
.ms b{font:900 15px/1 var(--display);letter-spacing:.04em}
.ms small{font:800 10.5px/1.1 var(--display);letter-spacing:.08em;text-transform:uppercase;margin-top:3px}
.ms.is-done{opacity:1}
.ms.is-done b::before{content:"✓ "}
.counter__stamp{display:inline-block;margin:16px 0 0;padding:7px 12px 6px;border:3px solid var(--rust);color:var(--rust);font:900 15px/1.15 var(--display);letter-spacing:.08em;text-transform:uppercase;transform:rotate(-2.5deg);background:rgba(247,238,219,.55)}
.counter__stamp[hidden]{display:none}
.counter__stamp.is-new{animation:stampIn .55s cubic-bezier(.2,.9,.25,1.2) both}
@keyframes stampIn{0%{opacity:0;transform:rotate(-14deg) scale(1.9)}70%{opacity:1;transform:rotate(-1deg) scale(.94)}100%{opacity:1;transform:rotate(-2.5deg) scale(1)}}

/* Ranking osiedli */
.areas{margin-top:34px;max-width:460px}
.areas[hidden]{display:none}
.areas__title{margin:0 0 12px;font:900 clamp(26px,2.6vw,34px)/.95 var(--display);text-transform:uppercase}
.areas__title em{font:400 .9em/1 var(--graf);text-transform:none;color:var(--rust);font-style:normal}
.areas__list{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:area}
.areas__list li{counter-increment:area;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:4px 10px}
.areas__list li::before{content:counter(area);font:700 22px/1 var(--tattoo);color:var(--rust)}
.areas__name{font:800 17px/1.1 var(--display);letter-spacing:.04em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.areas__num{font:900 17px/1 var(--display);font-variant-numeric:tabular-nums}
.areas__bar{grid-column:2/-1;height:8px;border:2px solid var(--ink);border-radius:8px;background:var(--paper-hi);overflow:hidden}
.areas__bar span{display:block;height:100%;background:var(--ink)}
.areas__list li:first-child .areas__bar span{background:var(--rust)}
.areas__note{margin:12px 0 0;font-size:13.5px;line-height:1.5;opacity:.78}
.areas__list:empty{display:none}

/* Numer głosu + udostępnianie */
.form-success{flex-wrap:wrap}
.form-success>p{flex:1 1 220px}
.share{flex:1 0 100%;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding-top:14px;border-top:1px solid var(--line-light)}
.share[hidden]{display:none}
.share__btn{border:0;cursor:pointer;background:var(--yellow);color:var(--ink);font:900 19px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;padding:13px 22px}
.share__btn:hover{background:var(--paper-hi)}
.share__status{margin:0;font-size:13.5px;opacity:.85}
.share__status:empty{display:none}

/* Baner kontaktu */
.contact-strip{position:relative;z-index:2;background-color:var(--yellow);background-image:repeating-linear-gradient(-45deg,var(--ink) 0 14px,var(--yellow) 14px 28px),repeating-linear-gradient(-45deg,var(--ink) 0 14px,var(--yellow) 14px 28px);background-size:100% 12px,100% 12px;background-position:top,bottom;background-repeat:no-repeat;color:var(--ink);padding:clamp(52px,6vw,72px) var(--pad);text-align:center}
.contact-strip__inner{max-width:760px;margin:0 auto}
.contact-strip__kicker{margin:0 0 10px;font:800 13px/1 var(--display);letter-spacing:.24em;text-transform:uppercase}
.contact-strip__title{margin:0 0 18px;font:900 clamp(30px,4vw,52px)/.95 var(--display);text-transform:uppercase}
.contact-strip__mail{display:inline-block;background:var(--ink);color:var(--yellow);font:900 clamp(22px,3.2vw,38px)/1 var(--display);letter-spacing:.03em;padding:14px 22px 12px;box-shadow:6px 7px 0 rgba(25,24,21,.25);word-break:break-all;transition:transform .2s}
.contact-strip__mail:hover{transform:translate(-2px,-3px)}
.contact-strip__note{margin:18px 0 0;font-size:15px;font-weight:500}
.footer__mail{color:var(--paper);text-decoration:underline;text-underline-offset:2px}
.faq__list a{text-decoration:underline;text-underline-offset:2px}

@media (max-width:640px){
  .ms small{display:none}
  .counter__ms{height:30px}
}

/* =========================================================
   TELEFONY I TABLETY — bez animacji mapy miast i trasy na szkicu parku
   ========================================================= */
@media (max-width:900px), (hover:none) and (pointer:coarse){
  .sk-dash,.map-routes path{animation:none}
  .map-pulse{display:none}
}

/* ---------- 500 głosów: komunikat + konfetti ---------- */
.party{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:20px;background:rgba(25,24,21,.72)}
.party__card{position:relative;max-width:520px;width:100%;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);box-shadow:12px 14px 0 var(--ink);padding:clamp(26px,5vw,40px);text-align:center;transform:rotate(-1deg)}
.party__kicker{margin:0 0 8px;font:800 13px/1 var(--display);letter-spacing:.24em;text-transform:uppercase}
.party__title{margin:0;font:900 clamp(44px,9vw,76px)/.9 var(--display);text-transform:uppercase}
.party__title span{display:block;font-size:1.35em}
.party__lead{margin:10px 0 14px;font:400 clamp(28px,5vw,38px)/1 var(--graf);color:var(--rust);transform:rotate(-2deg)}
.party__text{margin:0 0 22px;font-size:15.5px;line-height:1.55}
.party__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px}
.party__btn{display:inline-block;background:var(--ink);color:var(--yellow);font:900 18px/1 var(--display);letter-spacing:.05em;text-transform:uppercase;padding:14px 20px}
.party__close{border:2px solid var(--ink);background:transparent;color:var(--ink);font:800 16px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;padding:12px 18px;cursor:pointer}
.party__btn:focus-visible,.party__close:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.party__confetti{position:fixed;inset:0;width:100%;height:100%;z-index:301;pointer-events:none}