*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;background:#f7f6f1;color:#1d3326;font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:#4f6f22}
a:hover{color:#1d3326}
h1,h2,h3{font-family:Montserrat,sans-serif;margin:0}
h2{font-weight:700;font-size:clamp(30px,3.6vw,44px);line-height:1.1;letter-spacing:-.015em;text-wrap:balance}
h3{font-weight:700}
p{margin:0}
section{scroll-margin-top:90px}
.ic{font-family:'Material Symbols Outlined';font-weight:300;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;-webkit-font-feature-settings:'liga';font-feature-settings:'liga'}
.wrap{max-width:1240px;margin:0 auto}
.stack{display:flex;flex-direction:column;gap:20px}
.stack-sm{display:flex;flex-direction:column;gap:14px}
.stack-lg{display:flex;flex-direction:column;gap:40px}
.eyebrow{font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;letter-spacing:.14em;color:#4f6f22;text-transform:uppercase}
.hand{font-family:Caveat,cursive;line-height:1;transform:rotate(-5deg)}

.btn{display:inline-flex;align-items:center;gap:8px;font-family:Montserrat,sans-serif;font-weight:600;font-size:14px;text-decoration:none;border-radius:999px;padding:11px 20px;transition:background .2s,color .2s}
.btn .ic{font-size:20px}
.btn-lg{font-size:15px;padding:15px 26px}
.btn-solid{color:#fff;background:#5b7d2a}
.btn-solid:hover{background:#6f9434;color:#fff}
.btn-ghost{color:#fff;border:1.5px solid rgba(255,255,255,.85);padding:14px 26px}
.btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff}
.btn-line{align-self:flex-start;color:#1d3326;border:1.5px solid #4f6f22;padding:13px 24px;font-size:15px;margin-top:6px}
.btn-line:hover{background:#4f6f22;color:#fff}

.hdr{position:fixed;top:14px;left:0;right:0;z-index:50;padding:0 clamp(12px,2.5vw,32px)}
.hdr-bar{max-width:1240px;margin:0 auto;background:rgba(250,249,244,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:16px;box-shadow:0 6px 24px rgba(20,40,25,.12);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 12px 10px 22px;position:relative}
.hdr-logo img{height:34px;width:auto;display:block}
.hdr-nav{display:flex;gap:6px}
.hdr-nav a{font-family:Montserrat,sans-serif;font-weight:600;font-size:14px;text-decoration:none;padding:9px 14px;border-radius:999px;color:#1d3326}
.hdr-nav a:hover,.hdr-nav a.on{background:#e6ecd8}
.hdr-burger{display:none;border:1px solid #c9d0bd;background:transparent;border-radius:12px;width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;color:#1d3326}
.hdr-burger .ic{font-size:24px}
@media (max-width:899px){
  .hdr-cta{display:none}
  .hdr-burger{display:flex}
  .hdr-nav{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;background:#faf9f4;border-radius:16px;box-shadow:0 10px 30px rgba(20,40,25,.16);padding:10px}
  .hdr-nav.open{display:flex}
  .hdr-nav a{font-size:16px;padding:14px;border-radius:10px}
}

.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero{position:relative;min-height:max(640px,92vh);display:flex;align-items:flex-end;overflow:hidden;background:#1d3326}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,28,18,.82) 0%,rgba(14,28,18,.55) 45%,rgba(14,28,18,.05) 80%),linear-gradient(0deg,rgba(14,28,18,.6),rgba(14,28,18,0) 40%)}
.hero-in{position:relative;width:100%;padding:130px clamp(20px,4vw,48px) 44px;display:flex;flex-direction:column;gap:26px}
.badge{display:flex;align-items:center;gap:14px;background:rgba(232,238,220,.94);border-radius:14px;padding:12px 18px;align-self:flex-start;max-width:460px}
.badge .ic{font-size:30px;color:#4f6f22}
.badge div{display:flex;flex-direction:column;gap:2px}
.badge strong{font-size:14px;line-height:1.3}
.badge span{font-size:13px;color:#3d5343}
.badge b{color:#1d3326}
.hero h1{font-weight:800;color:#fff;font-size:clamp(46px,8vw,104px);line-height:.92;letter-spacing:-.02em;text-transform:uppercase}
.hero-lead{color:#fff;font-family:Montserrat,sans-serif;font-weight:600;font-size:clamp(20px,2.3vw,28px);line-height:1.25;max-width:620px;text-wrap:pretty}
.hero-p{color:rgba(255,255,255,.92);font-size:17px;line-height:1.6;max-width:560px;text-wrap:pretty}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.hero-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.25);padding-top:20px;margin-top:10px}
.meta{display:flex;flex-wrap:wrap;gap:8px 22px;color:#fff;font-size:14px;font-weight:500}
.meta i{font-style:normal;opacity:.6}
.hand-w{color:#fff;font-size:clamp(48px,6vw,72px);transform:rotate(-6deg)}

.sec{padding:clamp(64px,8vw,110px) clamp(20px,4vw,48px)}
.sec-tight{padding-top:clamp(40px,5vw,72px);padding-bottom:clamp(48px,6vw,80px)}
.sec p{font-size:17px;line-height:1.65;color:#33473a;text-wrap:pretty}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:clamp(32px,5vw,72px);align-items:center}
.photo{position:relative}
.photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;display:block}
.hand-note{position:absolute;right:-6px;bottom:-26px;background:#f7f6f1;padding:6px 16px;border-radius:12px;font-size:34px;color:#1d3326;transform:rotate(-4deg)}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 60px}
.head>p{max-width:460px;line-height:1.6}

.grid{display:grid;gap:16px}
.benefits{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.card{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid #e3e6da;border-radius:18px;padding:24px;transition:border-color .2s}
.card:hover{border-color:#b9c7a0}
.ico{flex:none;width:56px;height:56px;border-radius:50%;background:#e6ecd8;color:#3d5a1c;display:flex;align-items:center;justify-content:center;font-size:28px}
.card h3{font-size:17px;line-height:1.3;margin-bottom:6px}
.sec .card p{font-size:15px;line-height:1.55;color:#4a5d4f}

.sec-dark{background:#1d3326;color:#f3f1e8}
.sec-dark h2{color:#fff}
.sec-dark .eyebrow{color:#b5cf7e}
.sec-dark .head>p{color:#d6dccd}
.zones{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:28px;align-items:start}
.map{position:relative;border-radius:20px;overflow:hidden;background:#12241a}
.map img{width:100%;display:block;aspect-ratio:590/300;object-fit:cover}
.hot{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid transparent;background:transparent;cursor:pointer;padding:0}
.hot.on{border:3px solid #fff;box-shadow:0 0 0 4px var(--c)}
.hot.on::after{content:'';position:absolute;left:50%;top:50%;width:44px;height:44px;border-radius:50%;border:2px solid #fff;animation:pulse 1.6s ease-out infinite;pointer-events:none}
@keyframes pulse{0%{transform:translate(-50%,-50%) scale(.8);opacity:.9}100%{transform:translate(-50%,-50%) scale(1.9);opacity:0}}
.zone-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));background:#f7f6f1;color:#1d3326;border-radius:20px;overflow:hidden}
.zone-detail img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block}
.zd-body{padding:26px;display:flex;flex-direction:column;gap:10px;justify-content:center}
.zd-body .eyebrow{color:#4f6f22;letter-spacing:.12em}
.zd-body h3{font-size:24px;line-height:1.2}
.sec .zd-body p{font-size:16px;line-height:1.6;color:#3d5343}
.arrows{display:flex;gap:10px;margin-top:8px}
.arrows button{width:44px;height:44px;border-radius:50%;border:1.5px solid #c9d0bd;background:transparent;cursor:pointer;color:#1d3326;font-size:22px}
.arrows button:hover{background:#e6ecd8}
.zone-list{display:flex;flex-direction:column;gap:6px}
.zrow{display:flex;align-items:center;gap:16px;padding:14px 16px;border-radius:14px;border:none;cursor:pointer;width:100%;font-family:inherit;background:transparent;text-align:left}
.zrow:hover{background:rgba(255,255,255,.08)}
.zrow.on{background:rgba(255,255,255,.1);box-shadow:inset 3px 0 0 var(--c)}
.zrow .n{flex:none;width:40px;height:40px;border-radius:50%;background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:17px}
.zrow.on .n{box-shadow:0 0 0 4px rgba(255,255,255,.25)}
.zrow .t{display:flex;flex-direction:column;gap:3px}
.zrow strong{font-family:Montserrat,sans-serif;font-size:16px;color:#fff}
.zrow small{font-size:14px;line-height:1.45;color:#c8d0c0}
.sec .zone-note{margin-top:14px;padding:16px 18px;border:1px dashed rgba(255,255,255,.3);border-radius:14px;font-size:14px;line-height:1.55;color:#d6dccd}

.sec-sage{background:#e8eddc}
.pill{align-self:flex-start;display:flex;align-items:center;gap:10px;background:#1d3326;color:#fff;border-radius:999px;padding:10px 18px;font-family:Montserrat,sans-serif;font-weight:600;font-size:15px}
.pill strong{font-weight:800;color:#b5cf7e;letter-spacing:.02em}
.hand-d{font-size:38px;color:#1d3326}
.steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.step{background:#fff;border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:16px}
.step-top{display:flex;align-items:center;justify-content:space-between}
.step-top .ic{font-size:32px;color:#4f6f22}
.num{width:44px;height:44px;border-radius:50%;background:#1d3326;color:#fff;display:flex;align-items:center;justify-content:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:18px}
.step h3{font-size:19px}
.sec .step p{font-size:15px;line-height:1.55;color:#4a5d4f}
.notice{display:flex;align-items:center;gap:12px;padding:16px 20px;border:1.5px dashed #9fb27f;border-radius:14px;color:#33473a;font-size:15px}
.notice .ic{font-size:22px;color:#4f6f22}

.h-sm{font-size:26px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:1px;background:#dfe3d6;border:1px solid #dfe3d6;border-radius:18px;overflow:hidden}
.facts>div{background:#f7f6f1;padding:22px 24px;display:flex;gap:16px;align-items:flex-start}
.facts .ic{font-size:30px;color:#4f6f22}
.facts>div>div{display:flex;flex-direction:column;gap:4px}
.facts strong{font-family:Montserrat,sans-serif;font-size:15px}
.facts span:not(.ic){font-size:15px;color:#4a5d4f;line-height:1.45}

.cta{position:relative;overflow:hidden;background:#1d3326}
.cta .bg{object-position:center 60%}
.cta-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,28,18,.85),rgba(14,28,18,.35))}
.cta-in{position:relative;padding:clamp(64px,8vw,110px) clamp(20px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.cta-in p{font-family:Montserrat,sans-serif;font-weight:700;color:#fff;font-size:clamp(28px,3.6vw,44px);line-height:1.15;letter-spacing:-.01em}
.cta .btn{font-size:16px;padding:16px 28px}

.ftr{background:#1d3326;color:#d6dccd;padding:clamp(56px,7vw,88px) clamp(20px,4vw,48px) 28px}
.ftr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:40px 56px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.15)}
.ftr-brand{display:flex;flex-direction:column;gap:16px;grid-column:span 1}
.ftr-brand img{height:44px;width:auto;align-self:flex-start;filter:brightness(0) invert(1)}
.ftr-brand p{margin:0;font-size:15px;line-height:1.6;max-width:320px}
.ftr-brand .hand{font-size:30px;color:#b5cf7e;align-self:flex-start;transform:rotate(-3deg)}
.ftr-col{display:flex;flex-direction:column;gap:12px;font-size:15px}
.ftr-h{font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#b5cf7e;margin-bottom:4px}
.ftr-col a:not(.btn){color:#f3f1e8;text-decoration:none;align-self:flex-start}
.ftr-col a:not(.btn):hover{color:#b5cf7e}
.ftr-num{font-family:Montserrat,sans-serif;font-weight:800;font-size:32px;color:#fff;letter-spacing:.01em;margin-top:-6px}
.ftr-col .btn{align-self:flex-start;margin-top:6px}
.ftr-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 32px;padding-top:24px;font-size:14px;color:#aab5a6}
.ftr-bottom a{display:inline-flex;align-items:center;gap:6px;color:#f3f1e8;text-decoration:none}
.ftr-bottom a:hover{color:#b5cf7e}
.ftr-bottom .ic{font-size:18px}

@media (max-width:720px){
  .hdr{top:10px;padding:0 10px}
  .hdr-bar{padding:8px 8px 8px 16px;border-radius:14px}
  .hdr-logo img{height:30px}
  .hero{min-height:auto}
  .hero-in{padding:108px 20px 32px;gap:20px}
  .badge{padding:10px 14px;gap:12px}
  .badge .ic{font-size:26px}
  .badge strong{font-size:13px}
  .badge span{font-size:12px}
  .hero h1{font-size:clamp(42px,13vw,60px)}
  .hero-lead{font-size:19px}
  .hero-p{font-size:16px}
  .btns{flex-direction:column;align-items:stretch}
  .btns .btn{justify-content:center}
  .hero-foot{flex-direction:column;align-items:flex-start;gap:14px}
  .meta{font-size:13px;gap:6px 12px}
  .hand-w{font-size:48px;align-self:flex-end}
  .sec{padding:56px 20px}
  .sec-tight{padding-top:40px;padding-bottom:48px}
  h2{font-size:28px}
  .sec p{font-size:16px}
  .two{gap:40px}
  .photo img{aspect-ratio:4/3;border-radius:16px}
  .hand-note{right:8px;bottom:-22px;font-size:26px;padding:4px 12px}
  .stack-lg{gap:28px}
  .head{gap:14px}
  .card{padding:18px;gap:14px;border-radius:16px}
  .ico{width:46px;height:46px;font-size:24px}
  .zones{gap:20px}
  .map{border-radius:16px}
  .hot{width:34px;height:34px}
  .hot.on::after{width:34px;height:34px}
  .zone-detail{border-radius:16px}
  .zone-detail img{min-height:180px;max-height:220px}
  .zd-body{padding:20px}
  .zd-body h3{font-size:21px}
  .zrow{padding:12px;gap:12px}
  .zrow .n{width:36px;height:36px;font-size:15px}
  .zrow strong{font-size:15px}
  .zrow small{font-size:13px}
  .pill{font-size:14px;padding:9px 16px}
  .hand-d{font-size:32px}
  .step{padding:22px}
  .notice{align-items:flex-start;font-size:14px}
  .h-sm{font-size:22px}
  .facts>div{padding:18px 20px}
  .cta-in{padding:64px 20px;flex-direction:column;align-items:stretch}
  .cta-in p{font-size:28px}
  .cta .btn{justify-content:center}
  .ftr{padding:56px 20px 24px}
  .ftr-grid{gap:36px;padding-bottom:36px}
  .ftr-num{font-size:28px}
  .ftr-col .btn{align-self:stretch;justify-content:center}
  .ftr-bottom{flex-direction:column;align-items:flex-start}
}
@media (max-width:380px){
  .hero h1{font-size:40px}
  .hdr-logo img{height:26px}
}

/* produkcja: dostępność, stopka, zgoda cookies */
:focus-visible{outline:3px solid #b5cf7e;outline-offset:3px}
.sec-sage :focus-visible,.sec:not(.sec-dark) :focus-visible,.hdr :focus-visible{outline-color:#4f6f22}
.ftr-links{display:inline-flex;flex-wrap:wrap;gap:8px 24px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hot.on::after{animation:none}}
