/* === FONTY LOKALNE (self-hosted WOFF2, bez render-blocking) === */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('/assets/fonts/fraunces-normal-400_800-latin.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:'Fraunces';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('/assets/fonts/fraunces-normal-400_800-latin-ext.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:'Fraunces';font-style:italic;font-weight:400;font-display:swap;
  src:url('/assets/fonts/fraunces-italic-400-latin.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:'Fraunces';font-style:italic;font-weight:400;font-display:swap;
  src:url('/assets/fonts/fraunces-italic-400-latin-ext.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:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/inter-var-latin.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:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/inter-var-latin-ext.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}
/* === KONIEC FONTÓW === */
/* =================================================================
   GREEN THUMBS — Cinematic Visual Experience (zmodernizowane)
   ================================================================= */
:root{
  --bg:#13150f; --bg2:#1b1e15; --ink:#ece8dd; --muted:#a7a18f;
  --green:#aebf78; --green2:#5c6a3a; --olive:#6f7a48; --olive-d:#5a6439; --sage:#d7dcc5; --gold:#c8b27e;
  --line:rgba(244,240,231,.16); --glass:rgba(255,255,255,.08); --glass2:rgba(255,255,255,.13);
  --shadow:0 30px 90px rgba(0,0,0,.45); --radius:28px;
  --display:"Fraunces", Georgia, serif;
  --sans:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease:cubic-bezier(0.16,1,0.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:var(--sans);overflow-x:hidden;line-height:1.55;
  background:
    radial-gradient(circle at 15% -10%, rgba(174,191,120,.14), transparent 34%),
    radial-gradient(circle at 90% 8%, rgba(200,178,126,.09), transparent 30%),
    linear-gradient(180deg,#0f110b 0%, #15180f 50%, #1a1d14 100%);}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.01em;line-height:1.02}
::selection{background:rgba(157,212,90,.35)}
body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:none}

/* overlays */
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--green),var(--gold));z-index:9999;box-shadow:0 0 20px rgba(157,212,90,.6)}
.grain{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.blob{position:fixed;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(157,212,90,.14),transparent 60%);pointer-events:none;z-index:0;transform:translate(-50%,-50%);will-change:transform}
@media (hover:none),(pointer:coarse){.blob{display:none}}
.cursor{position:fixed;top:0;left:0;width:34px;height:34px;border:1.5px solid rgba(244,240,231,.7);border-radius:50%;
  z-index:9000;pointer-events:none;transform:translate(-50%,-50%);mix-blend-mode:difference;
  transition:width .3s var(--ease),height .3s var(--ease),background .3s}
.cursor.is-hover{width:58px;height:58px;background:rgba(157,212,90,.18);border-color:transparent}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* nav */
.nav{position:fixed;z-index:50;top:18px;left:50%;transform:translateX(-50%);width:min(1280px,calc(100% - 28px));
  display:flex;align-items:center;justify-content:space-between;padding:12px 14px 12px 18px;border:1px solid var(--line);
  background:rgba(5,11,8,.55);backdrop-filter:blur(22px);border-radius:999px;box-shadow:0 10px 40px rgba(0,0,0,.2);
  transition:padding .35s var(--ease),background .35s}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:18px;white-space:nowrap}
.brandLogo{width:40px;height:40px;border-radius:50%;object-fit:contain;display:block;flex:0 0 auto}
.brandWord{font-family:var(--display);font-weight:600;font-size:18px}
.leafmark{width:34px;height:34px;border:1px solid rgba(157,212,90,.45);border-radius:50%;display:grid;place-items:center;background:rgba(157,212,90,.1)}
.leafmark svg{width:20px;height:20px}
.navlinks{display:flex;gap:4px;align-items:center;flex-shrink:0}
.navlinks a{border:1px solid transparent;border-radius:999px;padding:9px 11px;color:rgba(244,240,231,.82);font-size:14px;white-space:nowrap;transition:.25s ease}
.navlinks a:hover{border-color:var(--line);background:rgba(255,255,255,.07)}
.pillbtn{border:1px solid transparent;border-radius:999px;padding:11px 18px;background:var(--olive);color:#f2efe4;font-weight:700;cursor:pointer;transition:transform .3s var(--ease),background .3s}
.pillbtn:hover{background:var(--olive-d)}
.pillbtn:hover{transform:translateY(-2px)}
.hamb{display:none;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--ink);border-radius:999px;padding:9px 12px;cursor:pointer}
.mobileMenu{display:none;position:fixed;z-index:60;top:76px;left:16px;right:16px;border:1px solid var(--line);border-radius:26px;background:rgba(5,11,8,.95);backdrop-filter:blur(22px);padding:12px}
.mobileMenu a{display:block;padding:14px;border-bottom:1px solid var(--line)}
.mobileMenu a:last-child{border-bottom:0}
.mobileMenu .mm-cta{margin-top:8px;text-align:center;background:var(--olive);color:#f2efe4;font-weight:700;border-radius:999px;border-bottom:0}
.mobileMenu .mm-cta:hover{background:var(--olive-d)}
.mobileMenu.open{display:block}

section{position:relative;z-index:2}
.container{width:min(1160px,calc(100% - 32px));margin:0 auto}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:14px 18px;border:1px solid var(--line);
  font-weight:700;cursor:pointer;background:rgba(255,255,255,.08);color:var(--ink);transition:transform .3s var(--ease),box-shadow .3s,background .3s;will-change:transform}
.btn.primary{background:var(--olive);color:#f2efe4;border-color:transparent}
.btn.primary:hover{background:var(--olive-d)}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(0,0,0,.25)}
.eyebrow{display:inline-flex;gap:9px;align-items:center;border:1px solid var(--line);background:rgba(255,255,255,.07);padding:8px 12px;border-radius:999px;color:var(--muted);font-size:13px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 18px var(--green)}

/* hero */
.hero{min-height:100svh;display:grid;align-items:center;padding:130px 0 80px;overflow:hidden}
.hero__canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%;pointer-events:none;opacity:.9}
.heroGrid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 520px;gap:54px;align-items:center}
h1{font-size:clamp(46px,7vw,88px);line-height:.96;margin:22px 0 18px;letter-spacing:-.02em}
.accent{color:var(--green);font-style:italic;font-weight:400}
.lead{font-size:clamp(17px,2vw,22px);color:var(--muted);line-height:1.55;max-width:650px}
.ctaRow{display:flex;gap:12px;flex-wrap:wrap;margin:32px 0}
.heroStats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:36px;max-width:620px}
.stat{border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:20px;padding:15px}
.stat strong{font-family:var(--display);font-size:26px}
.stat span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.stage{height:640px;perspective:1400px;position:relative}
.heroCard{height:100%;border-radius:42px;overflow:hidden;border:1px solid rgba(244,240,231,.18);box-shadow:var(--shadow);transform-style:preserve-3d;transition:transform .15s ease;background:#111}
.heroCard img{width:100%;height:100%;object-fit:cover;filter:saturate(1.04) contrast(1.05)}
.heroCard:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.64));z-index:2}
.heroBadge{position:absolute;z-index:4;left:24px;bottom:24px;right:24px;border:1px solid rgba(255,255,255,.18);background:rgba(6,14,10,.62);backdrop-filter:blur(20px);border-radius:26px;padding:20px}
.heroBadge h3{margin:0;font-size:23px}
.heroBadge p{margin:8px 0 0;color:var(--muted);line-height:1.45;font-size:15px}
.floatTag{position:absolute;z-index:5;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);backdrop-filter:blur(18px);border-radius:999px;padding:10px 13px;box-shadow:0 20px 50px rgba(0,0,0,.25);font-weight:700;font-size:13px}
.t1{top:54px;left:-34px}.t2{right:-26px;top:170px}.t3{left:28px;top:300px}
.orb{position:absolute;border-radius:50%;background:rgba(157,212,90,.16);filter:blur(2px);animation:float 7s ease-in-out infinite}
.orb.o1{width:150px;height:150px;right:-55px;top:-32px}.orb.o2{width:90px;height:90px;left:-40px;bottom:78px;animation-delay:-2s}.orb.o3{width:34px;height:34px;right:28px;bottom:120px;animation-delay:-5s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-24px)}}
.hero__scroll{position:absolute;z-index:3;bottom:26px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:9px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hero__scroll-line{width:1px;height:46px;background:linear-gradient(var(--green),transparent);animation:scrollLine 2s var(--ease) infinite}
@keyframes scrollLine{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}50.1%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- Cinematic 3D scroll ---------- */
.cine{position:relative;height:340vh;background:#0f110b}
.cine__sticky{position:sticky;top:0;height:100vh;display:grid;place-items:center;padding:90px 18px 40px}
.cine__inner{width:min(1000px,94vw);text-align:center}
.cine__step{display:inline-block;font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--green);margin-bottom:12px;transition:.3s ease}
.cine__title{font-size:clamp(1.7rem,3.6vw,3rem);line-height:1.05;margin:0 0 18px}
.cine__stage{position:relative;width:100%;aspect-ratio:16/9;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:#0a0d08}
.cine__frames{position:absolute;inset:0}
.cine__frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;visibility:hidden}
.cine__frame.is-on{opacity:1;visibility:visible}
.cine__cap{margin:18px auto 0;max-width:56ch;color:var(--muted);font-size:clamp(.95rem,1.4vw,1.1rem);transition:.3s ease}
.cine__bar{position:absolute;left:0;bottom:0;width:100%;height:4px;background:rgba(255,255,255,.14);z-index:3}
.cine__bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--gold))}

/* section heads */
.sectionHead{padding:100px 0 34px}
.sectionHead h2{font-size:clamp(34px,5vw,64px);line-height:1;margin:0 0 14px}
.sectionHead p{color:var(--muted);font-size:18px;line-height:1.55;max-width:760px;margin:0}

/* experience */
.experienceRail{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.experienceCard{min-height:210px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border-radius:26px;padding:22px;position:relative;overflow:hidden;cursor:pointer;transition:.25s ease}
.experienceCard b{font-size:18px;font-family:var(--display);font-weight:500}
.experienceCard p{color:var(--muted);line-height:1.5;margin:10px 0 0}
.experienceCard:after{content:"";position:absolute;inset:auto -30px -50px auto;width:170px;height:170px;background:radial-gradient(circle,rgba(157,212,90,.28),transparent 70%);transition:.4s ease}
.experienceCard:hover{transform:translateY(-4px);border-color:rgba(157,212,90,.38)}
.experienceCard:hover:after{transform:scale(1.4)}

/* story */
.story{padding:60px 0 100px}
.storyGrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.stickyVisual{position:sticky;top:110px;border-radius:38px;overflow:hidden;border:1px solid var(--line);height:680px;background:#111;box-shadow:var(--shadow)}
.stickyVisual img{width:100%;height:100%;object-fit:cover;transition:opacity .45s ease, transform .7s ease}
.stickyVisual .label{position:absolute;left:22px;top:22px;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.34);backdrop-filter:blur(18px);border-radius:999px;padding:10px 14px;font-weight:700}
.chapters{display:grid;gap:22px}
.chapter{min-height:360px;border:1px solid var(--line);border-radius:30px;padding:34px;background:rgba(255,255,255,.055);display:flex;flex-direction:column;justify-content:center;opacity:.5;transform:translateY(18px);transition:.45s ease}
.chapter.active{opacity:1;transform:translateY(0);border-color:rgba(157,212,90,.46);background:linear-gradient(180deg,rgba(157,212,90,.11),rgba(255,255,255,.05))}
.chapter small{color:var(--green);font-weight:800;letter-spacing:.18em}
.chapter h3{font-size:clamp(26px,3vw,40px);line-height:1.06;margin:12px 0}
.chapter p{color:var(--muted);font-size:17px;line-height:1.6}
.miniList{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.miniList span{font-size:13px;padding:8px 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}

/* before/after */
.beforeAfter{padding:80px 0}
.baBox{display:grid;grid-template-columns:430px 1fr;gap:26px;align-items:stretch;border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:36px;padding:22px;overflow:hidden}
.baCopy{padding:24px}
.baCopy h2{font-size:clamp(30px,3.4vw,44px);line-height:1;margin:14px 0}
.baCopy p{color:var(--muted);line-height:1.6}
.slider{position:relative;min-height:540px;border-radius:28px;overflow:hidden;background:#1a1f18;cursor:ew-resize;touch-action:none;user-select:none}
.ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;pointer-events:none}
.after{clip-path:inset(0 0 0 50%)}
.ba-tag{position:absolute;top:18px;z-index:5;font-size:12px;font-weight:800;letter-spacing:.12em;padding:7px 12px;border-radius:999px;background:rgba(6,14,10,.62);color:var(--ink);border:1px solid rgba(255,255,255,.2);pointer-events:none}
.ba-tag--before{left:18px}
.ba-tag--after{right:18px;background:var(--green);color:#0c1a0c;border-color:transparent}
.range{position:absolute;left:24px;right:24px;bottom:24px;z-index:6;cursor:ew-resize;opacity:.6}
.handleLine{position:absolute;top:0;bottom:0;left:50%;width:2px;background:rgba(255,255,255,.9);z-index:4;box-shadow:0 0 30px rgba(255,255,255,.6);pointer-events:none}
.handleGrip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:rgba(6,14,10,.8);border:1.5px solid rgba(255,255,255,.7);color:#fff;font-size:22px;box-shadow:0 8px 30px rgba(0,0,0,.4)}
.baFakeBefore{position:absolute;inset:0;background:linear-gradient(135deg,#efe8dc,#d9c7ad);display:grid;place-items:center;color:#403525;font-family:var(--display);font-weight:600;font-size:38px}
.baFakeBefore span{opacity:.55}

/* gallery */
.gallery{padding:50px 0 110px}
.filterBar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.chip{border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--ink);border-radius:999px;padding:10px 13px;cursor:pointer;transition:.2s ease}
.chip.active{background:var(--sage);color:#122015;font-weight:800}
.masonry{columns:3 280px;column-gap:16px}
.tile{break-inside:avoid;margin:0 0 16px;border-radius:28px;overflow:hidden;border:1px solid var(--line);position:relative;cursor:pointer;background:#111}
.tile img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:.5s ease}
.tile.tall img{aspect-ratio:4/5}.tile.wide img{aspect-ratio:16/10}
.tile:hover img{transform:scale(1.05)}
.loadMoreWrap{display:flex;justify-content:center;margin:26px auto 0}
.tileOverlay{position:absolute;inset:auto 12px 12px 12px;background:rgba(8,14,10,.72);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:14px}
.tileOverlay b{display:block;font-family:var(--display);font-weight:500}
.tileOverlay span{display:block;color:rgba(244,240,231,.75);font-size:13px;margin-top:4px}

/* products */
.products{padding:70px 0 110px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.035),transparent)}
.productGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.product{border:1px solid var(--line);border-radius:32px;overflow:hidden;background:rgba(255,255,255,.06);cursor:pointer;position:relative;transform-style:preserve-3d;transition:.3s ease}
.product:hover{transform:translateY(-6px);border-color:rgba(157,212,90,.45)}
.productImg{position:relative;height:330px;overflow:hidden;background:#dfe7d9}
.product__tag{position:absolute;top:14px;left:14px;background:var(--green);color:#0c1a0c;font-size:12px;font-weight:800;letter-spacing:.04em;padding:6px 11px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.productImg img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.product:hover .productImg img{transform:scale(1.05)}
.productCopy{padding:22px}
.productCopy h3{font-size:24px;margin:0 0 4px}
.price{display:inline-flex;margin:10px 0 12px;color:#132016;background:var(--sage);padding:8px 10px;border-radius:999px;font-weight:800}
.productCopy p{color:var(--muted);line-height:1.55}
.specs{display:grid;gap:8px;margin-top:16px}
.specs span{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:8px}
.mockProduct{display:grid;place-items:center;height:330px;background:radial-gradient(circle at 30% 20%,rgba(157,212,90,.45),transparent 30%),linear-gradient(140deg,#183322,#0b140f);font-size:74px}

/* calc */
.calc{padding:90px 0}
.calcBox{display:grid;grid-template-columns:1fr 1fr;gap:22px;border:1px solid var(--line);border-radius:36px;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035))}
.calc h2{font-size:clamp(32px,3.4vw,44px);line-height:1;margin:12px 0}
.field{display:grid;gap:8px;margin-bottom:14px}
.field label{font-size:13px;color:var(--muted)}
.field input,.field select{width:100%;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:16px;color:var(--ink);padding:14px;font:inherit}
.field input:focus,.field select:focus{outline:1px solid rgba(157,212,90,.6)}
.field select option{color:#111}
.result{border:1px solid rgba(157,212,90,.25);background:rgba(157,212,90,.08);border-radius:26px;padding:24px;display:grid;align-content:center}
.result span{color:var(--muted);font-size:13px}
.result strong{font-family:var(--display);font-size:34px}
.result__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;border-bottom:1px solid var(--line)}
.result__row:last-of-type{border-bottom:0}
.result p{color:var(--muted);line-height:1.6;margin:10px 0 0;font-size:13px}

/* contact */
.contact{padding:110px 0}
.contactCard{border:1px solid var(--line);border-radius:42px;padding:54px;overflow:hidden;position:relative;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.04))}
.contactCard:before{content:"";position:absolute;inset:0;background:url('../img/ChatGPT-Image-29-maj-2026-13_46_43-5.webp') center/cover;opacity:.24;filter:saturate(1.1);z-index:-1}
.contactCard h2{font-size:clamp(34px,5vw,68px);line-height:1;margin:0 0 18px;max-width:760px}
.contactGrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:34px}
.contactItem{border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);backdrop-filter:blur(18px);border-radius:22px;padding:18px;transition:.3s ease}
.contactItem:hover{transform:translateY(-3px);border-color:rgba(157,212,90,.5)}
.contactItem span{display:block;color:var(--muted);font-size:13px;margin-bottom:6px}
.contactItem b{font-family:var(--display);font-weight:500;font-size:18px}

/* footer */
.footer{border-top:1px solid var(--line);padding:28px 0 46px;color:var(--muted);font-size:13px}
.footer .container{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* drawer + lightbox */
.drawer,.lightbox{position:fixed;inset:0;z-index:100;display:none}
.drawer.active,.lightbox.active{display:block}
.scrim{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(9px)}
.drawerPanel{position:absolute;right:18px;top:18px;bottom:18px;width:min(520px,calc(100% - 36px));border:1px solid var(--line);background:#08110d;border-radius:32px;padding:22px;overflow:auto;box-shadow:var(--shadow);animation:drawerIn .5s var(--ease)}
@keyframes drawerIn{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
.drawerPanel img{border-radius:24px;margin-bottom:16px;width:100%}
.close{position:absolute;right:18px;top:18px;border:1px solid var(--line);background:rgba(255,255,255,.09);color:var(--ink);width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:18px;z-index:5}
.drawerPanel h3{font-family:var(--display);font-size:34px;line-height:1;margin:8px 0}
.drawerPanel p{color:var(--muted);line-height:1.6}
.lightboxView{position:absolute;inset:4vh 4vw;display:grid;place-items:center}
.lightboxView img{max-height:84vh;border-radius:28px;box-shadow:var(--shadow);object-fit:contain}
.lightboxCaption{position:absolute;left:50%;bottom:2vh;transform:translateX(-50%);background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:11px 14px;backdrop-filter:blur(18px)}

/* reveal */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* responsive */
@media (max-width:980px){
  .navlinks{display:none}.hamb{display:block}.nav>.pillbtn{display:none}
  .heroGrid,.storyGrid,.baBox,.calcBox{grid-template-columns:1fr}
  .stage{height:560px}.stickyVisual{position:relative;top:auto;height:520px}
  .experienceRail,.productGrid,.contactGrid{grid-template-columns:1fr 1fr}
  .heroStats{grid-template-columns:repeat(3,1fr)}.baBox{padding:14px}.masonry{columns:2 250px}
}
@media (max-width:640px){
  h1{letter-spacing:-.01em}.hero{padding-top:104px}.stage{height:480px}
  .experienceRail,.productGrid,.contactGrid,.heroStats{grid-template-columns:1fr}
  .contactCard{padding:32px 22px}.sectionHead{padding-top:70px}.masonry{columns:1}
  .heroBadge{left:14px;right:14px;bottom:14px}.floatTag{display:none}.calcBox{padding:18px}.slider{min-height:420px}
  .hero__scroll{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}

/* ============ HERO v3 — wyśrodkowany tekst + kadrowana karuzela (ostre) ============ */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;padding:130px 0 70px;overflow:hidden;color:var(--ink);text-align:center}
.hero__inner{position:relative;z-index:2;width:100%;display:flex;flex-direction:column;align-items:center}
.heroCopy{max-width:760px;margin:0 auto}
.hero h1{color:var(--ink);font-size:clamp(40px,6.4vw,80px)}
.hero .lead{color:var(--muted);margin:0 auto;max-width:56ch}
.hero .ctaRow{justify-content:center}
.hero__showcase{position:relative;width:min(1080px,94vw);aspect-ratio:16/9;margin-top:40px;border-radius:26px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.4s ease}
.hero__slide.is-on{opacity:1}
.hero__dots{position:absolute;z-index:3;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:10px}
.hero__dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer;padding:0;transition:.3s ease}
.hero__dots button.is-on{background:var(--green);width:28px;border-radius:6px}
.hero .hero__scroll{left:50%;right:auto;transform:translateX(-50%)}
@media (max-width:700px){
  .hero__showcase{aspect-ratio:4/3}
  #heroBg .hero__slide:first-child{background-image:url("../img/hero/hero-1-m.webp")!important}
}

/* ============ REDESIGN v3 (mockup oliwka) ============ */
.section__tag{display:inline-block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--green);margin-bottom:14px}

/* 3 kroki */
.steps{padding:90px 0 80px}
.steps__top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:start}
.steps__intro h2{font-size:clamp(30px,4vw,52px);line-height:1.04;margin:0 0 16px}
.steps__intro p{color:var(--muted);max-width:44ch;margin-bottom:26px}
.steps__list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:24px}
.stepRow{display:flex;gap:18px;align-items:flex-start}
.stepRow__n{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-family:var(--display);font-size:18px;color:var(--green)}
.stepRow b{font-size:18px;font-family:var(--display);font-weight:500}
.stepRow p{color:var(--muted);margin:4px 0 0;font-size:15px}
.steps__imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:46px}
.steps__imgs figure{margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line)}
.steps__imgs img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.steps__imgs figure:hover img{transform:scale(1.05)}

/* before/after — slider duży po lewej, copy po prawej */
.baBox{grid-template-columns:1.6fr 1fr;align-items:center}
.baCopy h2{font-size:clamp(30px,3.6vw,46px);line-height:1.02}

/* produkty wg mockupu */
.productGrid{grid-template-columns:repeat(4,1fr)}
.product{border-radius:24px}
.productImg{height:240px}
.productCopy{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px}
.productCopy__main h3{font-size:18px;margin:0;line-height:1.1}
.product .price{margin:7px 0 0;background:none;color:var(--green);padding:0;font-weight:700;font-size:14px;display:block}
.product__add{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;transition:.35s var(--ease);display:grid;place-items:center}
.product:hover .product__add{background:var(--olive);border-color:transparent;color:#fff;transform:rotate(90deg)}

/* CTA z ikonami */
.contactCard{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(30px,5vw,56px);align-items:center}
.contactCard__copy h2{font-size:clamp(30px,4.4vw,58px);line-height:1.02;margin:0 0 16px}
.contactCard__copy p{color:var(--muted);max-width:46ch;margin-bottom:24px}
.contactCard__nap{margin-top:22px;font-size:13px;color:var(--muted);opacity:.85;max-width:none}
.contactCard__feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:22px}
.contactCard__feats li{display:flex;gap:16px;align-items:flex-start}
.featIco{flex:0 0 auto;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(174,191,120,.14);border:1px solid var(--line);color:var(--green);font-size:20px}
.contactCard__feats b{display:block;font-family:var(--display);font-weight:500;font-size:17px}
.contactCard__feats span{color:var(--muted);font-size:14px}

@media (max-width:900px){
  .steps__top{grid-template-columns:1fr}
  .baBox{grid-template-columns:1fr}
  .productGrid{grid-template-columns:repeat(2,1fr)}
  .contactCard{grid-template-columns:1fr}
}
@media (max-width:560px){
  .steps__imgs{grid-template-columns:1fr}
  .productGrid{grid-template-columns:1fr}
}

/* O nas */
.about{padding:90px 0}
.about__grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,64px);align-items:center}
.about__media{border-radius:26px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/5}
.about__media img{width:100%;height:100%;object-fit:cover}
.about__copy h2{font-size:clamp(32px,4.4vw,56px);line-height:1.02;margin:0 0 18px}
.about__copy p{color:var(--muted);max-width:54ch;margin:0 0 16px}
.about__copy strong{color:var(--ink)}
.about__mini{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.about__mini span{font-size:13px;padding:8px 12px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}
@media(max-width:900px){.about__grid{grid-template-columns:1fr}.about__media{aspect-ratio:16/10;order:-1}}

/* CEO */
.ceo{display:flex;gap:18px;align-items:flex-start;margin-top:30px;padding:22px 24px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.04)}
.ceo__ava{flex:0 0 auto;width:56px;height:56px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:var(--olive);color:#f2efe4;font-family:var(--display);font-size:19px;font-weight:600;letter-spacing:.02em}
.ceo__quote{font-family:var(--display);font-style:italic;font-size:clamp(15px,1.6vw,18px);line-height:1.55;color:var(--ink);margin:0 0 12px}
.ceo__name{font-weight:700;margin:0;color:var(--ink)}
.ceo__role{color:var(--green);font-size:13px}

/* przed/po — zakładki scen */
.ba-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 22px}
.ba-tab{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--muted);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;transition:.25s ease}
.ba-tab:hover{color:var(--ink);border-color:var(--green)}
.ba-tab.is-on{background:var(--olive);color:#f2efe4;border-color:transparent}

/* PROCES — karuzela 5 kroków */
.proc{padding:90px 0}
.proc__wrap{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2vw,22px);margin-top:34px}
.proc__viewport{overflow:hidden;border-radius:24px;width:min(560px,84vw);box-shadow:var(--shadow);border:1px solid var(--line);cursor:zoom-in}
.proc__track{display:flex;will-change:transform;transition:transform .55s var(--ease)}
.proc__slide{flex:0 0 100%;margin:0}
.proc__slide img{width:100%;height:auto;display:block}
.proc__arrow{flex:0 0 auto;width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font-size:26px;line-height:1;cursor:pointer;transition:.3s ease;display:grid;place-items:center}
.proc__arrow:hover{background:var(--olive);border-color:transparent;color:#fff}
.proc__dots{display:flex;justify-content:center;gap:10px;margin-top:24px}
.proc__dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.3);cursor:pointer;padding:0;transition:.3s ease}
.proc__dots button.is-on{background:var(--green);width:28px;border-radius:6px}
@media(max-width:560px){.proc__arrow{width:42px;height:42px;font-size:22px}}

/* produkt: licznik zdjęć + karuzela w drawerze */
.product__count{position:absolute;bottom:12px;right:12px;background:rgba(6,14,10,.7);color:#fff;font-size:11px;font-weight:600;padding:5px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.2)}
.dgal{position:relative;border-radius:18px;overflow:hidden;margin-bottom:16px}
.dgal__track{display:flex;transition:transform .45s var(--ease)}
.dgal__slide{flex:0 0 100%;aspect-ratio:4/3;background-size:cover;background-position:center}
.dgal__a{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:rgba(6,14,10,.6);color:#fff;font-size:22px;cursor:pointer;display:grid;place-items:center;z-index:2}
.dgal__prev{left:10px}.dgal__next{right:10px}
.dgal__dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:7px;z-index:2}
.dgal__dots span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer}
.dgal__dots span.is-on{background:var(--green);width:20px;border-radius:5px}

/* FAQ */
.faq{padding:90px 0}
.faq__head{text-align:center;margin-bottom:30px}
.faq__head h2{font-size:clamp(28px,4vw,46px)}
.faq__list{max-width:820px;margin:0 auto}
.faq__item{border-bottom:1px solid var(--line)}
.faq__item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 0;font-family:var(--display);font-size:clamp(1.05rem,2vw,1.35rem);cursor:pointer;color:var(--ink)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__plus{position:relative;width:20px;height:20px;flex-shrink:0}
.faq__plus::before,.faq__plus::after{content:"";position:absolute;background:var(--green);top:50%;left:50%;transform:translate(-50%,-50%);transition:.4s var(--ease)}
.faq__plus::before{width:18px;height:2px}.faq__plus::after{width:2px;height:18px}
.faq__item[open] .faq__plus::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
.faq__a{overflow:hidden;max-height:0;transition:max-height .45s var(--ease)}
.faq__item[open] .faq__a{max-height:360px}
.faq__a p{color:var(--muted);padding:0 0 22px;max-width:72ch}

/* stopka — sociale */
.footer .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.footer__social{display:flex;gap:10px}
.footer__social a{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;padding:8px 14px;color:var(--ink);font-size:13px;font-weight:600;transition:.25s ease}
.footer__social a:hover{background:var(--olive);border-color:transparent;color:#fff}
.footer__social svg{display:block}

/* formularz kontaktowy */
.contactForm{margin-top:22px;background:var(--bg2);border:1px solid var(--line);border-radius:26px;padding:clamp(22px,3vw,40px)}
.contactForm h3{font-family:var(--display);font-weight:500;font-size:clamp(1.2rem,2.4vw,1.7rem);margin:0 0 20px}
.cf__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contactForm .field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.contactForm label{font-size:13px;color:var(--muted)}
.contactForm input,.contactForm textarea{background:#0f110b;border:1px solid var(--line);border-radius:12px;color:var(--ink);padding:12px 14px;font:inherit;width:100%}
.contactForm textarea{min-height:120px;resize:vertical}
.contactForm input:focus,.contactForm textarea:focus{outline:1px solid var(--green)}
.cf__hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.cf__foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.cf__status{font-size:14px;color:var(--muted)}
.cf__status.ok{color:var(--green)}
.cf__status.err{color:#e0a37a}
@media(max-width:640px){.cf__row{grid-template-columns:1fr}}

/* ===== Zgoda RODO w formularzu ===== */
.cf__consent{display:flex;gap:10px;align-items:flex-start;margin:4px 0 2px;font-size:13px;color:rgba(236,232,221,.78);line-height:1.5}
.cf__consent input{margin-top:3px;flex:0 0 auto;width:16px;height:16px;accent-color:var(--olive)}
.cf__consent a{color:var(--green);text-decoration:underline}
.cf__rodo{font-size:11.5px;color:var(--muted);line-height:1.5;margin:2px 0 0}
.cf__rodo a{color:var(--green);text-decoration:underline}

/* ===== Linki prawne w stopce ===== */
.footer__legal{display:flex;gap:8px 16px;flex-wrap:wrap;align-items:center}
.footer__legal a{color:var(--muted);font-size:13px}
.footer__legal a:hover{color:var(--ink)}

/* ===== Baner cookies ===== */
.cookieBar{position:fixed;z-index:90;left:16px;right:16px;bottom:16px;max-width:700px;margin:0 auto;background:rgba(10,13,9,.97);border:1px solid var(--line);border-radius:20px;padding:18px 20px;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.cookieBar p{margin:0 0 12px;font-size:13.5px;color:rgba(236,232,221,.88);line-height:1.6}
.cookieBar a{color:var(--green);text-decoration:underline}
.cookieBar .cookieBtns{display:flex;gap:10px;flex-wrap:wrap}
.cookieBar button{border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer;border:1px solid var(--line);font-size:14px}
.cookieBar .ck-accept{background:var(--olive);color:#f2efe4;border-color:transparent}
.cookieBar .ck-accept:hover{background:var(--olive-d)}
.cookieBar .ck-reject{background:transparent;color:var(--ink)}

/* ===== Strony prawne ===== */
.legalTop{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 20px;background:rgba(19,21,15,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.legalTop .brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink)}
.legalTop .brand img{width:34px;height:34px;border-radius:50%;object-fit:contain}
.legalTop a.back{color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:14px}
.legalTop a.back:hover{background:rgba(255,255,255,.07)}
.legalWrap{max-width:820px;margin:0 auto;padding:54px 20px 90px}
.legalWrap h1{font-family:var(--display);font-size:clamp(28px,5vw,44px);line-height:1.08;margin:0 0 6px}
.legalWrap .legalMeta{color:var(--muted);font-size:14px;margin-bottom:30px}
.legalWrap h2{font-family:var(--display);font-size:21px;margin:32px 0 10px;color:var(--ink)}
.legalWrap h3{font-size:16.5px;margin:20px 0 6px;color:var(--ink)}
.legalWrap p,.legalWrap li{color:rgba(236,232,221,.86);line-height:1.72;font-size:15px}
.legalWrap .lead{font-size:16.5px;color:var(--ink)}
.legalWrap ul,.legalWrap ol{padding-left:22px;margin:8px 0}
.legalWrap li{margin:6px 0}
.legalWrap a{color:var(--green);text-decoration:underline}
.legalWrap table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14px}
.legalWrap th,.legalWrap td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
.legalWrap .box-note{border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:rgba(255,255,255,.03);margin:16px 0}
.legalWrap .tofill{background:rgba(174,191,120,.16);border-bottom:1px dashed var(--green);padding:0 4px;border-radius:3px}

/* ===== Blog ===== */
.blogIndex .section__tag{display:inline-block;margin-bottom:8px}
.blogGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin:34px 0 10px}
@media(max-width:720px){.blogGrid{grid-template-columns:1fr}}
.blogCard{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:rgba(255,255,255,.03);text-decoration:none!important;transition:transform .3s var(--ease),border-color .3s}
.blogCard:hover{transform:translateY(-4px);border-color:rgba(174,191,120,.5)}
.blogCard__media{aspect-ratio:16/10;overflow:hidden;background:#111}
.blogCard__media img{width:100%;height:100%;object-fit:cover;transition:.5s ease}
.blogCard:hover .blogCard__media img{transform:scale(1.05)}
.blogCard__body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px}
.blogCard__meta{display:flex;gap:12px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:var(--muted)}
.blogCard__cat{color:var(--green);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.blogCard h2{font-family:var(--display);font-size:19px!important;line-height:1.2;margin:2px 0!important;color:var(--ink)}
.blogCard p{font-size:14px;color:rgba(236,232,221,.78);margin:0}
.blogCard__more{margin-top:6px;color:var(--green);font-weight:600;font-size:14px}
.blogPost__cover{border-radius:22px;overflow:hidden;margin:18px 0 26px;border:1px solid var(--line)}
.blogPost__cover img{width:100%;display:block;max-height:440px;object-fit:cover}
.blogPost__body p:first-child{font-size:16.5px;color:var(--ink)}
.blogCta{margin:38px 0 10px;border:1px solid var(--line);border-radius:22px;padding:26px;background:linear-gradient(180deg,rgba(174,191,120,.10),rgba(255,255,255,.02))}
.blogCta h3{margin:0 0 6px;font-family:var(--display);font-size:22px;color:var(--ink)}
.blogCta p{margin:0 0 16px;color:rgba(236,232,221,.85)}
.blogCta .btn{display:inline-block}
.blogRelated{margin-top:48px;border-top:1px solid var(--line);padding-top:10px}

/* ===== Opinie klientów ===== */
.reviewsGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:8px}
@media(max-width:760px){.reviewsGrid{grid-template-columns:1fr}}
.reviewCard{border:1px solid var(--line);border-radius:22px;padding:24px 26px;background:rgba(255,255,255,.03);margin:0;display:flex;flex-direction:column}
.reviewCard__stars{color:#e8c66a;font-size:16px;letter-spacing:3px;margin-bottom:12px}
.reviewCard blockquote{margin:0 0 16px;font-size:15.5px;line-height:1.66;color:rgba(236,232,221,.9);font-style:italic}
.reviewCard figcaption{display:flex;flex-direction:column;gap:2px;margin-top:auto}
.reviewCard figcaption b{font-weight:700;color:var(--ink)}
.reviewCard figcaption span{font-size:13px;color:var(--muted)}

/* ===== Pływający dok szybkiego kontaktu (konwersja) =====
   Progresywny: bez JS widoczny od razu (linki działają); z JS chowa się nad heroem
   i wjeżdża po zjechaniu w dół. z-index 55 = nad treścią, pod banerem cookies (90) i modalami (100). */
.quickDock{position:fixed;right:clamp(14px,3.5vw,26px);bottom:clamp(14px,3.5vw,26px);z-index:55;
  display:flex;flex-direction:column;gap:12px;align-items:center;
  opacity:1;transform:none;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.quickDock.qd-managed{opacity:0;transform:translateY(18px);pointer-events:none}
.quickDock.qd-managed.is-on{opacity:1;transform:none;pointer-events:auto}
.qd{position:relative;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.16);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease);
  -webkit-tap-highlight-color:transparent}
.qd:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 20px 46px rgba(0,0,0,.52)}
.qd:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.qd svg{display:block}
.qd--wa{background:linear-gradient(180deg,#2ad366,#1faa52)}
.qd--call{background:var(--glass2);backdrop-filter:blur(8px);color:var(--ink)}
.qd--quote{background:linear-gradient(180deg,var(--green),var(--olive));color:#15180f}
.qd[data-label]::after{content:attr(data-label);position:absolute;right:calc(100% + 12px);top:50%;
  transform:translateY(-50%) translateX(6px);white-space:nowrap;background:rgba(18,20,14,.94);color:var(--ink);
  border:1px solid var(--line);padding:7px 11px;border-radius:10px;font-size:13px;font-family:var(--sans);font-weight:500;
  opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;box-shadow:var(--shadow)}
.qd:hover[data-label]::after,.qd:focus-visible[data-label]::after{opacity:1;transform:translateY(-50%) translateX(0)}
@media(max-width:640px){.qd{width:50px;height:50px}.qd[data-label]::after{display:none}}
@media(prefers-reduced-motion:reduce){
  .quickDock{transition:opacity .2s linear}
  .quickDock.qd-managed{transform:none}
  .qd{transition:opacity .15s linear,background .2s}
  .qd:hover{transform:none}
  .qd[data-label]::after{transition:opacity .15s linear;transform:translateY(-50%)}
}

/* ===== Hero: brandowa linia + podtytuł z frazą kluczową (SEO) ===== */
.hero__brand{display:block}
.hero__kw{display:block;margin-top:.4em;font-family:var(--sans);font-weight:600;
  font-size:clamp(15px,1.7vw,21px);letter-spacing:.005em;line-height:1.3;color:var(--muted)}

/* ===== Sekcja wiedzy + tabela porównawcza (SEO/AI) ===== */
.knowledge{padding:90px 0}
.knowledge__lead{max-width:880px;font-size:clamp(16px,2vw,19px);line-height:1.7;color:rgba(236,232,221,.9)}
.knowledge h3{font-family:var(--display);font-size:clamp(20px,3vw,28px);margin:38px 0 16px}
.compareWrap{overflow-x:auto;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.03)}
.compare{width:100%;border-collapse:collapse;min-width:560px;font-size:15px}
.compare th,.compare td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.compare thead th{font-family:var(--sans);font-weight:700;color:var(--ink);background:rgba(174,191,120,.10);letter-spacing:.01em}
.compare td:nth-child(2){color:var(--ink);font-weight:600}
.compare td:first-child{color:var(--muted)}
.compare tbody tr:last-child td{border-bottom:0}
.knowledge__cta{margin-top:22px;color:rgba(236,232,221,.85);font-size:15px}
.knowledge__cta a{color:var(--green);text-decoration:underline;text-underline-offset:2px}
.useLinks{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.useLinks a{display:inline-block;padding:9px 15px;border:1px solid var(--line);border-radius:999px;color:var(--ink);font-size:14px;background:rgba(255,255,255,.03);transition:border-color .25s,background .25s}
.useLinks a:hover{border-color:rgba(174,191,120,.55);background:rgba(174,191,120,.10)}

/* ===== Strony docelowe (landing.php) ===== */
.landing__crumbs{font-size:13px;color:var(--muted);margin-bottom:14px}
.landing__crumbs a{color:var(--green);text-decoration:none}
.landing .lead{font-size:clamp(16px,2vw,19px);color:var(--ink);line-height:1.7}
.landing__cta{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 10px}
.landing__links{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:8px}
.landing__links a{color:var(--green);text-decoration:underline;text-underline-offset:2px}
.calcPreview{display:none;width:100%;max-height:170px;object-fit:cover;border-radius:14px;margin-bottom:14px;border:1px solid var(--line)}


/* ===== Blog: obrazy w treści, FAQ, autor ===== */
.blogPost__body figure.postImg{margin:24px 0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#111}
.postImg img{width:100%;display:block;height:auto}
.postImg figcaption{font-size:13px;color:var(--muted);padding:9px 14px;border-top:1px solid var(--line)}
.blogPost__body table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14.5px}
.blogPost__body th,.blogPost__body td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.blogPost__body th{color:var(--ink);background:rgba(255,255,255,.04)}
.postFaq{margin-top:34px}
.authorBox{display:flex;gap:14px;align-items:flex-start;margin:30px 0 6px;border:1px solid var(--line);border-radius:18px;padding:16px 18px;background:rgba(255,255,255,.03)}
.authorBox b{display:block;color:var(--ink);margin-bottom:4px}
.authorBox span{font-size:14px;color:rgba(236,232,221,.8);line-height:1.6}
.authorBox a{color:var(--green);text-decoration:underline}
.ctaRowInline{display:flex;gap:12px;flex-wrap:wrap;margin:0}
.ctaRowInline .btn{display:inline-block}


/* ===== Nawigacja: rozwijane menu Oferta ===== */
.navdrop{position:relative;display:flex;align-items:center}
.navdrop__btn{border:1px solid transparent;border-radius:999px;padding:9px 11px;color:rgba(244,240,231,.82);font-size:14px;font-family:inherit;background:none;cursor:pointer;white-space:nowrap;transition:.25s ease}
.navdrop:hover .navdrop__btn,.navdrop:focus-within .navdrop__btn{border-color:var(--line);background:rgba(255,255,255,.07);color:var(--ink)}
.navdrop__menu{position:absolute;top:100%;left:0;margin-top:10px;min-width:262px;flex-direction:column;gap:2px;padding:8px;border:1px solid var(--line);border-radius:20px;background:rgba(5,11,8,.97);backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.55);display:none;z-index:70}
.navdrop__menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.navdrop:hover .navdrop__menu,.navdrop:focus-within .navdrop__menu{display:flex}
.navdrop__menu a{padding:10px 13px;border-radius:13px;font-size:14px;color:rgba(244,240,231,.86);white-space:nowrap;transition:.2s ease}
.navdrop__menu a:hover{background:rgba(255,255,255,.08);color:var(--ink)}
.navdrop__sep{height:1px;background:var(--line);margin:6px 6px}

/* Menu mobilne: sekcja oferty + przewijanie przy dłuższej liście */
.mobileMenu{max-height:calc(100vh - 110px);overflow-y:auto;-webkit-overflow-scrolling:touch}
.mm-sect{display:block;padding:16px 14px 6px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}

/* Stopka: nawigacja serwisu */
.footer__nav{flex:1 1 100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;text-align:left;padding-bottom:26px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.footer__col{display:flex;flex-direction:column;gap:7px;min-width:0}
.footer__col b{color:var(--ink);font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;margin-bottom:4px}
.footer__col a,.footer__col span{color:var(--muted);font-size:13.5px;line-height:1.45}
.footer__col a:hover{color:var(--ink)}
@media(max-width:860px){.footer__nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}}
@media(max-width:460px){.footer__nav{grid-template-columns:1fr;gap:20px}}

/* Węższe ekrany desktopowe: pełne menu ustępuje hamburgerowi zanim zabraknie miejsca */
@media (max-width:1260px){.navlinks{display:none}.hamb{display:block}}


/* === A11Y + LCP (2026-08-25) === */
/* Kontrast przycisków: ciemniejsza oliwka + biały tekst (WCAG AA 5.2:1) */
:root{--olive:#68723f;--olive-d:#525c33}
.btn.primary,.pillbtn,.ck-accept,.mobileMenu .mm-cta,.ceo__ava{color:#fff}
.btn.primary:hover,.pillbtn:hover,.ck-accept:hover,.mobileMenu .mm-cta:hover{background:var(--olive-d);color:#fff}
.blogCard__more,.landing__links a{color:#c2d18d}

/* Nagłówek hero: tagline poza H1, wygląd bez zmian */
.heroTagline{display:block;font-family:var(--display);font-size:clamp(40px,6.4vw,80px);line-height:.96;letter-spacing:-.02em;color:var(--ink);margin:22px 0 0}
.hero h1{margin:0 0 18px}

/* Obszar dotykowy kropek 44x44 bez powiększania samych kropek */
.proc__dots,.hero__dots{gap:0}
.proc__dots button,.hero__dots button{width:44px;height:44px;margin:0 -7px;background:none;display:grid;place-items:center;border-radius:50%}
.proc__dots button::before,.hero__dots button::before{content:"";display:block;width:9px;height:9px;border-radius:50%;transition:.3s ease}
.proc__dots button::before{background:rgba(255,255,255,.45)}
.hero__dots button::before{background:rgba(255,255,255,.6)}
.proc__dots button.is-on,.hero__dots button.is-on{background:none;width:44px;border-radius:50%}
.proc__dots button.is-on::before,.hero__dots button.is-on::before{background:var(--green);width:28px;border-radius:6px}
.proc__dots button:focus-visible,.hero__dots button:focus-visible{outline:2px solid var(--green);outline-offset:-6px}


/* === LCP: pierwszy ekran renderuje się natychmiast (bez czekania na GSAP/JSON) === */
.hero .reveal{opacity:1;transform:none;transition:none}
@keyframes gtIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero .eyebrow{animation:gtIn .6s var(--ease) both}
.hero .lead{animation:gtIn .7s var(--ease) both;animation-delay:.08s}
.hero .ctaRow{animation:gtIn .7s var(--ease) both;animation-delay:.16s}
.hero__showcase{animation:gtIn .8s var(--ease) both;animation-delay:.1s}
.heroTagline,.hero h1{animation:none}
@media (prefers-reduced-motion:reduce){.hero .eyebrow,.hero .lead,.hero .ctaRow,.hero__showcase{animation:none}}

/* Kontrast przycisku zgody cookies (specyficzność .cookieBar) */
.cookieBar .ck-accept{background:var(--olive);color:#fff}
.cookieBar .ck-accept:hover{background:var(--olive-d);color:#fff}
.cookieBar .ck-reject{color:var(--ink)}


/* === Menu na podstronach (ten sam wygląd co na stronie głównej) === */
.legalTop{gap:14px}
.legalTop .navlinks{margin-left:auto}
.legalTop .back{white-space:nowrap}
.legalTop .navdrop__menu{margin-top:12px}
@media (max-width:1260px){.legalTop .navlinks{display:none}}
@media (max-width:620px){.legalTop .back{display:none}}
@media (max-width:1150px){.legalTop .hamb{display:block}}


/* === Formularz: pliki i nowe pola === */
.cf__files{border:1px solid var(--line);border-radius:14px;padding:16px;margin:14px 0}
.cf__files legend{padding:0 8px;font-size:14px;color:var(--muted)}
.cf__files input[type=file]{width:100%;padding:10px;border:1px dashed var(--line);border-radius:10px;background:transparent;color:inherit}
.cf__files input[type=file]:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
.cf__hint{font-size:13px;color:var(--muted);margin:10px 0 0;line-height:1.5}
.field select{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;font:inherit}

/* === Strony produktow i encji === */
.productPage .prodHero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px;align-items:start;margin:22px 0 30px}
.prodHero__img img{width:100%;height:auto;border-radius:16px}
.prodLead{font-size:17px;line-height:1.65}
.prodTable{width:100%;border-collapse:collapse;margin:16px 0}
.prodTable th,.prodTable td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.prodTable th{width:38%;font-weight:600;color:var(--muted)}
.prodNote{font-size:14px;color:var(--muted);border-left:3px solid var(--olive);padding-left:12px;margin:14px 0}
.muted{color:var(--muted);font-weight:400}
.prodList{display:grid;gap:22px;margin:22px 0}
.prodListItem{display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;align-items:start;padding-bottom:22px;border-bottom:1px solid var(--line)}
.prodListItem__img img{width:100%;height:auto;border-radius:12px}
.prodListItem__body h2{margin:0 0 6px;font-size:22px}
.prodOther{columns:2;gap:24px}
.authorPosts li{margin:6px 0}
.product__desc{font-size:14px;color:var(--muted);margin:4px 0 6px;line-height:1.5}
.product__unit{display:block;font-size:13px;color:var(--muted);font-weight:400}
@media (max-width:820px){.productPage .prodHero{grid-template-columns:1fr}.prodListItem{grid-template-columns:110px minmax(0,1fr);gap:14px}.prodOther{columns:1}}

/* === Katalog prawdziwych realizacji === */
.realizationsPage{position:relative;z-index:2}
.realizationsWrap{width:min(1160px,calc(100% - 32px));margin:0 auto}
.realizationsHero{padding:72px 0 74px;border-bottom:1px solid var(--line);overflow:hidden;position:relative}
.realizationsHero:after{content:"";position:absolute;width:520px;height:520px;right:-150px;top:-230px;border-radius:50%;background:radial-gradient(circle,rgba(174,191,120,.2),transparent 68%);pointer-events:none}
.realizationsHero h1{font-size:clamp(44px,7vw,82px);max-width:900px;margin:18px 0}
.realizationsHero .lead{max-width:830px;color:rgba(236,232,221,.84)}
.realizationsProof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:38px;max-width:850px}
.realizationsProof span{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:18px;padding:15px 17px;color:var(--muted);background:rgba(255,255,255,.035)}
.realizationsProof b{font-family:var(--display);font-size:18px;font-weight:500;color:var(--green)}
.realizationsList{padding:82px 0 92px}
.realizationsHead{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,480px);gap:42px;align-items:end;margin-bottom:30px}
.realizationsHead h2{font-size:clamp(34px,5vw,58px);margin:12px 0 0}
.realizationsHead p{margin:0;color:var(--muted);font-size:16px;line-height:1.65}
.realizationsGrid{display:grid;gap:26px}
.realizationCard{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);border:1px solid var(--line);border-radius:32px;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));box-shadow:0 24px 70px rgba(0,0,0,.24)}
.realizationCard__media{position:relative;min-height:490px;overflow:hidden}
.realizationCard__media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.realizationCard:hover .realizationCard__media img{transform:scale(1.035)}
.realizationCard__place{position:absolute;left:20px;top:20px;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:8px 13px;background:rgba(8,14,10,.72);backdrop-filter:blur(14px);font-weight:700;font-size:13px;color:var(--ink)}
.realizationCard__body{padding:38px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.realizationCard__meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.realizationCard__meta span{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--green);font-size:12px;font-weight:700}
.realizationCard h3{font-size:clamp(28px,3.5vw,43px);margin:0 0 15px;line-height:1.08}
.realizationCard h3 a{color:var(--ink)}
.realizationCard__body p{color:var(--muted);line-height:1.7;margin:0 0 25px}
.realizationsCta{padding:0 0 100px}
.realizationsCta__box{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:38px;border:1px solid rgba(174,191,120,.3);border-radius:30px;background:linear-gradient(135deg,rgba(174,191,120,.13),rgba(255,255,255,.025))}
.realizationsCta h2{font-size:clamp(29px,4vw,45px);margin:10px 0 10px}
.realizationsCta p{color:var(--muted);margin:0;max-width:720px;line-height:1.65}
.realizationsCta .btn{flex:0 0 auto}
@media(max-width:900px){.realizationCard{grid-template-columns:1fr}.realizationCard__media{min-height:380px}.realizationsHead{grid-template-columns:1fr;gap:12px}.realizationsCta__box{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.realizationsHero{padding:48px 0 56px}.realizationsProof{grid-template-columns:1fr}.realizationsList{padding:60px 0 68px}.realizationCard__media{min-height:270px}.realizationCard__body{padding:25px}.realizationsCta__box{padding:27px}.realizationsCta{padding-bottom:72px}}

@media print{.legalTop,.mobileMenu,footer,.ctaRowInline,.cookieBar{display:none!important}
  .legalWrap{max-width:none;padding:0}body{background:#fff;color:#000}}