/* Wariant D1 — „Ogród w akwareli” (rozwinięcie D „Pastel”).
   Papier z delikatnym ziarnem, akwarelowe plamy w tle nagłówka, organiczne kształty
   zdjęć i kart, ręcznie rysowane gałązki i podkreślenia (same rysunki SVG, bez tekstu).
   Bez zewnętrznych zasobów: czcionki systemowe, grafiki jako data-URI. */
:root {
  --ink: #1f3a2e; --ink2: #3c5146; --zielen: #2f5d46; --zielen2: #24493a;
  --papier: #fbf8ef; --karta: #fffdf7;
  --szalwia: #b9d4ad; --mieta: #dff0e2; --masl: #f8e8b0; --roz: #f9dde2; --law: #e6dff8;
  --serif: "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;

  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .26 0 0 0 0 .18 0 0 0 .55 -.24'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --w-szalwia: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 320'%3E%3Cdefs%3E%3Cfilter id='f' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='3' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='2.2'/%3E%3C/filter%3E%3Cfilter id='g' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='3' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='3.5'/%3E%3C/filter%3E%3C/defs%3E%3Cellipse cx='200' cy='160' rx='140' ry='104' fill='%23b9d4ad' fill-opacity='.62' filter='url(%23f)'/%3E%3Cellipse cx='175' cy='139' rx='70' ry='47' fill='%23b9d4ad' fill-opacity='.5' filter='url(%23g)'/%3E%3Cellipse cx='200' cy='160' rx='140' ry='104' fill='none' stroke='%237fa673' stroke-opacity='.32' stroke-width='4' filter='url(%23g)'/%3E%3C/svg%3E");
  --w-mieta: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 320'%3E%3Cdefs%3E%3Cfilter id='f' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='11' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='2.2'/%3E%3C/filter%3E%3Cfilter id='g' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='11' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='3.5'/%3E%3C/filter%3E%3C/defs%3E%3Cellipse cx='200' cy='160' rx='150' ry='96' fill='%23cfe9d6' fill-opacity='.62' filter='url(%23f)'/%3E%3Cellipse cx='173' cy='141' rx='75' ry='43' fill='%23cfe9d6' fill-opacity='.5' filter='url(%23g)'/%3E%3Cellipse cx='200' cy='160' rx='150' ry='96' fill='none' stroke='%238cc29d' stroke-opacity='.32' stroke-width='4' filter='url(%23g)'/%3E%3C/svg%3E");
  --w-masl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 320'%3E%3Cdefs%3E%3Cfilter id='f' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='7' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='2.2'/%3E%3C/filter%3E%3Cfilter id='g' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='7' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='3.5'/%3E%3C/filter%3E%3C/defs%3E%3Cellipse cx='200' cy='160' rx='132' ry='110' fill='%23f8e3a0' fill-opacity='.62' filter='url(%23f)'/%3E%3Cellipse cx='176' cy='138' rx='66' ry='50' fill='%23f8e3a0' fill-opacity='.5' filter='url(%23g)'/%3E%3Cellipse cx='200' cy='160' rx='132' ry='110' fill='none' stroke='%23e2bf55' stroke-opacity='.32' stroke-width='4' filter='url(%23g)'/%3E%3C/svg%3E");
  --w-roz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 320'%3E%3Cdefs%3E%3Cfilter id='f' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='21' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='2.2'/%3E%3C/filter%3E%3Cfilter id='g' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='21' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='3.5'/%3E%3C/filter%3E%3C/defs%3E%3Cellipse cx='200' cy='160' rx='138' ry='100' fill='%23f6cdd5' fill-opacity='.62' filter='url(%23f)'/%3E%3Cellipse cx='175' cy='140' rx='69' ry='45' fill='%23f6cdd5' fill-opacity='.5' filter='url(%23g)'/%3E%3Cellipse cx='200' cy='160' rx='138' ry='100' fill='none' stroke='%23e09aa8' stroke-opacity='.32' stroke-width='4' filter='url(%23g)'/%3E%3C/svg%3E");
  --w-law: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 320'%3E%3Cdefs%3E%3Cfilter id='f' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='15' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='2.2'/%3E%3C/filter%3E%3Cfilter id='g' x='-30%25' y='-30%25' width='160%25' height='160%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012' numOctaves='3' seed='15' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='70' xChannelSelector='R' yChannelSelector='G' result='d'/%3E%3CfeGaussianBlur in='d' stdDeviation='3.5'/%3E%3C/filter%3E%3C/defs%3E%3Cellipse cx='200' cy='160' rx='146' ry='102' fill='%23dcd3f5' fill-opacity='.62' filter='url(%23f)'/%3E%3Cellipse cx='174' cy='140' rx='73' ry='46' fill='%23dcd3f5' fill-opacity='.5' filter='url(%23g)'/%3E%3Cellipse cx='200' cy='160' rx='146' ry='102' fill='none' stroke='%23a898d9' stroke-opacity='.32' stroke-width='4' filter='url(%23g)'/%3E%3C/svg%3E");
  --swash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 30' preserveAspectRatio='none'%3E%3Cfilter id='r' x='-5%25' y='-40%25' width='110%25' height='180%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.06 .5' numOctaves='2' seed='5' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='5'/%3E%3C/filter%3E%3Cg filter='url(%23r)' fill='none' stroke-linecap='round'%3E%3Cpath d='M8 17C70 8 170 5 292 11' stroke='%239cc495' stroke-width='9' stroke-opacity='.9'/%3E%3Cpath d='M40 23C110 16 190 15 262 18' stroke='%239cc495' stroke-width='5' stroke-opacity='.55'/%3E%3Cpath d='M250 9c14 0 30 1 40 3' stroke='%23f2cf6b' stroke-width='4' stroke-opacity='.9'/%3E%3C/g%3E%3C/svg%3E");
  --swash-masl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 30' preserveAspectRatio='none'%3E%3Cfilter id='r' x='-5%25' y='-40%25' width='110%25' height='180%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.06 .5' numOctaves='2' seed='9' result='t'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='t' scale='5'/%3E%3C/filter%3E%3Cg filter='url(%23r)' fill='none' stroke-linecap='round'%3E%3Cpath d='M8 15C80 9 180 8 292 13' stroke='%23f2cf6b' stroke-width='11' stroke-opacity='.85'/%3E%3Cpath d='M30 22C110 17 200 17 270 20' stroke='%23f2cf6b' stroke-width='5' stroke-opacity='.5'/%3E%3C/g%3E%3C/svg%3E");
  --d-galazka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%231f3a2e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 72C24 54 40 34 68 10'/%3E%3Cpath d='M27 52c-11-1-17-9-17-19 9 1 16 8 17 19z' fill='%23b9d4ad'/%3E%3Cpath d='M27 52c9-6 19-6 26-1-8 6-18 6-26 1z' fill='%23cfe9d6'/%3E%3Cpath d='M42 33c-10-3-14-12-12-21 9 3 13 11 12 21z' fill='%23cfe9d6'/%3E%3Cpath d='M42 33c8-6 17-7 24-3-6 7-16 8-24 3z' fill='%23b9d4ad'/%3E%3Cpath d='M60 17c1-6 5-9 10-9-1 5-5 9-10 9z' fill='%23f8e3a0'/%3E%3C/svg%3E");
  --d-drzewo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%231f3a2e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M24 46c-9 0-14-7-11-14 2-5 7-7 11-6 0-8 7-14 15-13 6 1 10 5 11 10 7-2 15 3 15 11 0 7-5 12-12 12H24z' fill='%23b9d4ad'/%3E%3Cpath d='M28 34c3-3 7-3 10 0M44 26c3-2 6-2 8 1' stroke-width='1.8'/%3E%3Cpath d='M40 46v24M40 58l-7-7M40 54l6-5M28 71h24'/%3E%3C/svg%3E");
  --d-sloje: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%231f3a2e' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M40 12c16 0 28 12 28 27 0 17-13 29-29 29-15 0-27-12-27-28 0-16 12-28 28-28z' fill='%23f8e3a0'/%3E%3Cpath d='M40 22c10 0 18 8 18 17 0 11-8 19-18 19-10 0-18-8-18-18 0-10 8-18 18-18z'/%3E%3Cpath d='M40 31c5 0 9 4 9 9s-4 9-9 9-9-4-9-9 4-9 9-9z'/%3E%3Cpath d='M40 38v3'/%3E%3C/svg%3E");
  --d-slonce: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%231f3a2e' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='40' cy='40' r='13' fill='%23f8e3a0'/%3E%3Cpath d='M40 12v8M40 60v8M12 40h8M60 40h8M20 20l6 6M54 54l6 6M60 20l-6 6M26 54l-6 6'/%3E%3C/svg%3E");
  --d-kielek: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%231f3a2e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M40 66V40'/%3E%3Cpath d='M40 42c-4-12-14-17-25-15 2 11 12 17 25 15z' fill='%23cfe9d6'/%3E%3Cpath d='M40 36c2-12 11-19 24-19 0 12-10 20-24 19z' fill='%23b9d4ad'/%3E%3Cpath d='M18 67c8-3 36-3 44 0'/%3E%3C/svg%3E");
  --d-strzalka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 60' fill='none' stroke='%231f3a2e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12c10 30 30 40 44 28 8-7 2-18-6-13-9 6 1 22 34 20'/%3E%3Cpath d='M72 39l8 8-10 5'/%3E%3C/svg%3E");
  /* siekiera wbita w pieniek (nad pływającym telefonem) */
  --d-siekiera: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 60' fill='none' stroke='%231f3a2e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 38 L15 53 Q13 56 9 58 H55 Q51 56 49 53 L50 38' fill='%23e2c39b'/%3E%3Cpath d='M23 45v8M32 46v9M41 45v8' stroke-width='1.4' opacity='.55'/%3E%3Cellipse cx='32' cy='38' rx='18' ry='6' fill='%23f6e3bf'/%3E%3Cellipse cx='32' cy='38' rx='10.5' ry='3.4' stroke='%23c49a6c' stroke-width='1.3'/%3E%3Cellipse cx='32' cy='38' rx='4.5' ry='1.5' stroke='%23c49a6c' stroke-width='1.3'/%3E%3Cpath d='M18.5 38.6 Q27 37.2 36.5 36.3' stroke-width='1.7'/%3E%3Cpath d='M30 24 L62 13' stroke-width='7.5'/%3E%3Cpath d='M30 24 L62 13' stroke='%23b9824f' stroke-width='4'/%3E%3Cpath d='M23.5 19.5 L32.5 21 L33.5 27 L36 36.6 L20.5 38.2 L23.5 27 Z' fill='%23dfe5e8'/%3E%3Cpath d='M24.5 30.5 L33.5 29.5' stroke='%23ffffff' stroke-width='1.6'/%3E%3Cpath d='M7 51l4-2M58 49l-3-3' stroke-width='1.8'/%3E%3C/svg%3E");
  --d-listek: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 44' fill='none' stroke='%231f3a2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 43c0-10 2-20 9-29'/%3E%3Cpath d='M24 28c-10 0-17-6-19-15 10-1 18 5 19 15z' fill='%23b9d4ad'/%3E%3Cpath d='M29 18c1-8 7-14 15-15 0 9-6 15-15 15z' fill='%23f8e3a0'/%3E%3C/svg%3E");
  --d-galaz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 120' fill='none' stroke='%231f3a2e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 106C46 92 86 66 152 18'/%3E%3Cpath d='M44 88c-4-14 2-26 14-31 3 13-2 25-14 31z' fill='%23b9d4ad'/%3E%3Cpath d='M52 82c13-6 26-3 33 7-12 6-25 3-33-7z' fill='%23cfe9d6'/%3E%3Cpath d='M86 60c-2-14 5-25 18-28 1 13-6 24-18 28z' fill='%23cfe9d6'/%3E%3Cpath d='M96 54c13-3 25 2 30 12-13 4-25-1-30-12z' fill='%23b9d4ad'/%3E%3Cpath d='M124 36c1-11 8-18 18-19 0 10-7 18-18 19z' fill='%23f8e3a0'/%3E%3Ccircle cx='30' cy='94' r='4' fill='%23f6cdd5'/%3E%3Ccircle cx='20' cy='86' r='3' fill='%23f6cdd5'/%3E%3C/svg%3E");
  --fala-ziel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14V8C15 2 25 2 40 7s25 5 40-1 25-4 40 2v6z' fill='%232f5d46'/%3E%3C/svg%3E");
  --fala-law: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14V8C15 2 25 2 40 7s25 5 40-1 25-4 40 2v6z' fill='%23e6dff8'/%3E%3C/svg%3E");
}

/* ---------- papier i akwarela w tle ---------- */
body {
  position: relative; overflow-x: clip;
  background: linear-gradient(var(--law), var(--law)) left bottom / 100% 90px no-repeat, var(--grain), var(--papier) !important; color: var(--ink);
}
body::before {
  content: ""; position: absolute; z-index: -1; left: 0; top: 0; width: 100%; height: 1080px; pointer-events: none;
  background:
    var(--w-szalwia) left -170px top -150px / 760px 600px no-repeat,
    var(--w-masl) right -150px top -90px / 620px 500px no-repeat,
    var(--w-roz) right -210px top 360px / 600px 480px no-repeat,
    var(--w-law) left -230px top 470px / 640px 500px no-repeat,
    var(--w-mieta) center top 250px / 1180px 640px no-repeat;
  -webkit-mask-image: linear-gradient(#000 75%, transparent);
          mask-image: linear-gradient(#000 75%, transparent);
}
::selection { background: var(--masl); color: var(--ink); }
/* body jako kolumna flex: luźny tekst wprost w <body> (np. „Jesteśmy firmą działającą…” na stronach miast)
   staje się anonimowym elementem i ląduje na środku zamiast przy krawędzi; prawdziwe elementy się rozciągają */
body { display: flex !important; flex-direction: column; align-items: center; }
body > * { align-self: stretch; }
body > p:empty { display: none; }
body > p { margin-top: 0 !important; margin-bottom: 14px !important; }
body > h1, body > h2, body > p, body > table, body > div[style*="flex-wrap"], body > div[style*="flex-direction: column"], .zc-onas { width: 100%; }
body > div[style*="flex-wrap"] + p { margin-top: 18px !important; }

/* ---------- menu: miękka „kartka” ---------- */
body > header {
  width: calc(100% - 32px); max-width: 1100px; margin: 14px auto 0 !important; top: 12px;
  background: var(--karta);
  border: 1.5px solid var(--ink); border-radius: 26px 34px 28px 38px / 30px 24px 36px 26px;
  padding: 8px 14px !important; box-shadow: 4px 5px 0 -1px rgba(185, 212, 173, .9);
}
body > header img { mix-blend-mode: multiply; }
body > header .links-container a {
  color: var(--ink); font-size: 14px; border-radius: 60% 40% 55% 45% / 55% 50% 50% 45%;
  transition: background-color .2s;
}
body > header .links-container a:hover { background: var(--mieta); }
a:focus-visible { outline: 2.5px dashed var(--zielen); outline-offset: 3px; }

/* ---------- tytuł z pędzlowym podkreśleniem i naklejkami ---------- */
body > header + div { height: 64px !important; }
body > h1 {
  position: relative; max-width: 900px; margin: 0 auto 12px !important; padding: 0 16px 22px !important; box-sizing: border-box;
  font-family: var(--serif) !important; font-size: clamp(40px, 6vw, 78px) !important; font-weight: 700 !important;
  letter-spacing: -.015em; line-height: 1.05 !important; color: var(--ink) !important;
  background: var(--swash) center bottom / min(440px, 64%) 26px no-repeat;
}
body > h2 {
  max-width: 680px; margin: 0 auto !important; padding: 0 16px !important; box-sizing: border-box;
  font-family: var(--serif) !important; font-style: italic; font-size: clamp(18px, 2.1vw, 23px) !important;
  font-weight: 400 !important; color: var(--ink2) !important;
}
p { color: var(--ink2) !important; }

body > h1::before, body > h1::after {
  content: ""; position: absolute; width: 104px; height: 104px; pointer-events: none;
}
body > h1::before {
  left: -40px; top: -58px; transform: rotate(-14deg);
  background: var(--d-galazka) center / 62% no-repeat, var(--w-masl) center / 140% 120% no-repeat;
}
body > h1::after {
  right: -34px; top: 6px; transform: rotate(9deg);
  background: var(--d-drzewo) center / 64% no-repeat, var(--w-roz) center / 140% 120% no-repeat;
}

/* ---------- przyciski „Zadzwoń” w treści: kamyki ---------- */
body > div[style*="4CAF50"] {
  position: relative; background: var(--zielen) !important; max-width: 300px !important; box-sizing: border-box;
  border-radius: 46% 54% 42% 58% / 60% 48% 52% 40% !important; padding: 15px 22px !important;
  box-shadow: 6px 7px 0 -1px var(--masl), 6px 7px 0 0 var(--ink);
  transition: transform .25s ease;
}
body > div[style*="4CAF50"]:hover { transform: rotate(-1.5deg) scale(1.02); }
body > div[style*="4CAF50"] span { font-size: 20px !important; font-weight: 600; letter-spacing: .01em; }
body > h2 + div[style*="4CAF50"] { margin-top: 30px !important; }
body > h2 + div[style*="4CAF50"]::before {
  content: ""; position: absolute; left: -108px; top: -26px; width: 92px; height: 62px; pointer-events: none;
  background: var(--d-strzalka) center / contain no-repeat;
}

/* ---------- zdjęcia: organiczne kształty ---------- */
.image-container { background: transparent !important; padding: 40px 0 56px !important; gap: 0; }
.image-container > div {
  margin: 0 16px !important; background-position: center !important;
  box-shadow: 0 22px 34px -18px rgba(31, 58, 46, .55);
  transition: border-radius .6s ease, transform .4s ease;
}
.image-container > div:nth-child(1) { border-radius: 58% 42% 46% 54% / 46% 56% 44% 54%; transform: rotate(-3deg); }
.image-container > div:nth-child(2) {
  border-radius: 42% 58% 55% 45% / 48% 40% 60% 52%; transform: translateY(-14px) rotate(2deg);
  outline: 2px dashed rgba(47, 93, 70, .45); outline-offset: 9px;
}
.image-container > div:nth-child(3) { border-radius: 50% 50% 38% 62% / 58% 44% 56% 42%; transform: rotate(-1.5deg); }
.image-container > div:hover { border-radius: 50%; }

/* ---------- karty z akwarelową plamą w rogu ---------- */
body > div[style*="flex-direction: column"] { margin-top: 10px !important; }
td[style*="FBF0E9"] {
  position: relative; background: var(--w-mieta) right -70px top -80px / 260px 210px no-repeat, var(--karta) !important;
  border: 1.5px solid var(--ink) !important; color: var(--ink2);
  border-radius: 30px 22px 34px 24px / 24px 34px 22px 30px !important; padding: 24px 26px 26px !important;
  box-shadow: 5px 6px 0 -1px var(--szalwia);
}
td[style*="FBF0E9"]::before {
  content: ""; display: block; width: 62px; height: 62px; margin: -4px 0 8px -6px;
  background: var(--d-galazka) center / 64% no-repeat, var(--w-masl) center / 150% 130% no-repeat;
}
body > div[style*="flex-direction: column"] > div:nth-child(1) > div:nth-child(2) td {
  background: var(--w-masl) right -70px top -80px / 260px 210px no-repeat, var(--karta) !important;
  border-radius: 22px 34px 26px 30px / 32px 22px 34px 24px !important; box-shadow: 5px 6px 0 -1px var(--masl);
}
body > div[style*="flex-direction: column"] > div:nth-child(1) > div:nth-child(2) td::before { background: var(--d-drzewo) center / 64% no-repeat, var(--w-roz) center / 150% 130% no-repeat; }
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(1) td {
  background: var(--w-law) right -70px top -80px / 260px 210px no-repeat, var(--karta) !important;
  border-radius: 26px 32px 22px 34px / 30px 24px 32px 22px !important; box-shadow: 5px 6px 0 -1px var(--law);
}
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(1) td::before { background: var(--d-sloje) center / 64% no-repeat, var(--w-mieta) center / 150% 130% no-repeat; }
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(2) td {
  background: var(--w-roz) right -70px top -80px / 260px 210px no-repeat, var(--karta) !important;
  border-radius: 34px 24px 30px 22px / 22px 30px 26px 34px !important; box-shadow: 5px 6px 0 -1px var(--roz);
}
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(2) td::before { background: var(--d-slonce) center / 64% no-repeat, var(--w-law) center / 150% 130% no-repeat; }
td[style*="FBF0E9"] > b:first-child { display: inline-block; margin-bottom: 4px; font-family: var(--serif); font-size: 21px; color: var(--ink); }
td[style*="FBF0E9"] b:not(:first-child), body > p b {
  color: var(--ink); background: linear-gradient(transparent 58%, rgba(248, 220, 130, .75) 58%, rgba(248, 220, 130, .75) 92%, transparent 92%);
  padding: 0 2px;
}

/* infografika „Jak działamy?” zostaje, tylko łagodniejsze rogi */
body > div:has(> img[src*="jak.png"]) { box-sizing: border-box; padding: 28px 16px !important; }
img[src*="jak.png"] { border-radius: 30px 24px 34px 26px; box-shadow: 6px 7px 0 -1px var(--mieta), 6px 7px 0 0 rgba(31, 58, 46, .25); }

/* ---------- akapity, obszary, miasta ---------- */
body > p { max-width: 900px; font-size: 16.5px; }
body > div[style*="flex-wrap"] { max-width: 940px; gap: 10px; padding-top: 4px !important; padding-bottom: 6px !important; }
/* etykiety terenów: spokojne, w jednym kolorze (szałwiowy obrys na papierze) */
body > div[style*="flex-wrap"] > div {
  background: #fffdf7; border: 1.5px solid #b9d4ad; color: var(--ink);
  border-radius: 999px !important; padding: 7px 16px !important; font-size: 14.5px;
  transition: background-color .2s ease, border-color .2s ease;
}
body > div[style*="flex-wrap"] > div:hover { background: #eef5ea; border-color: #8fbf84; }

body > table {
  background: var(--w-mieta) right -120px bottom -110px / 420px 320px no-repeat, var(--karta);
  border: 1.5px dashed rgba(31, 58, 46, .55); border-radius: 34px 26px 38px 28px / 28px 38px 26px 34px;
  padding: 16px 18px; box-sizing: border-box;
}
body > table a {
  color: var(--ink); text-decoration: underline; text-decoration-color: #a9c79f; text-decoration-thickness: 2px; text-underline-offset: 4px;
}
body > table a:hover { text-decoration-style: wavy; text-decoration-color: var(--zielen); }
body > table li::marker { color: #7fa673; }

/* ---------- O nas: kartka z zielnika ---------- */
.zc-onas { position: relative; margin-top: 70px !important; margin-bottom: 36px !important; scroll-margin-top: 110px; }
.zc-onas__wrap {
  position: relative; display: grid; grid-template-columns: 1.25fr 1fr; gap: 42px; align-items: center;
  padding: 50px 46px 46px;
  background:
    var(--w-szalwia) left -150px top -140px / 560px 440px no-repeat,
    var(--w-roz) right -170px bottom -150px / 520px 420px no-repeat,
    var(--grain), var(--karta);
  border: 1.5px solid var(--ink); border-radius: 46px 30px 52px 34px / 34px 52px 30px 46px;
  box-shadow: 9px 11px 0 -2px var(--law), 9px 11px 0 -.5px var(--ink);
}
/* kawałki taśmy na rogach */
.zc-onas__wrap::before, .zc-onas__wrap::after {
  content: ""; position: absolute; width: 118px; height: 32px; pointer-events: none;
  background: rgba(248, 226, 150, .78);
  clip-path: polygon(0 8%, 6% 0, 12% 10%, 18% 0, 24% 6%, 100% 0, 96% 18%, 100% 34%, 95% 52%, 100% 70%, 96% 86%, 100% 100%, 18% 96%, 12% 100%, 6% 92%, 0 100%, 4% 70%, 0 50%, 4% 30%);
}
.zc-onas__wrap::before { left: -22px; top: -12px; transform: rotate(-24deg); }
.zc-onas__wrap::after { right: -18px; bottom: -10px; transform: rotate(-18deg); background: rgba(246, 196, 206, .85); }
/* gałązka wychodząca zza kartki */
.zc-onas::after {
  content: ""; position: absolute; right: 36px; top: -76px; width: 170px; height: 128px; pointer-events: none;
  background: var(--d-galaz) center / contain no-repeat; transform: rotate(-4deg);
}
.zc-onas__tekst { position: relative; }
.zc-onas__tytul {
  display: inline-block; width: auto !important; position: relative; margin: 0 0 18px; padding: 0 10px 12px 2px;
  font-family: var(--serif); font-style: italic; font-weight: 700; font-size: clamp(40px, 4.6vw, 58px); line-height: 1; letter-spacing: -.01em; color: var(--ink);
  background: var(--swash-masl) left bottom / 100% 22px no-repeat;
}
.zc-onas__tytul::after {
  content: ""; position: absolute; right: -58px; top: -14px; width: 54px; height: 54px; transform: rotate(16deg);
  background: var(--d-kielek) center / contain no-repeat;
}
.zc-onas p { font-size: 16.5px; line-height: 1.7; }
.zc-onas__tytul + p { font-family: var(--serif); font-size: 19px !important; line-height: 1.6; color: var(--ink) !important; }
.zc-onas__tytul + p::first-letter {
  float: left; margin: 2px 6px 0 -6px; padding: 4px 8px 2px 6px; font-size: 3.1em; line-height: .9; font-weight: 700; color: var(--zielen2);
  background: var(--w-masl) center / 160% 150% no-repeat;
}

.zc-onas__fakty { grid-template-columns: 1fr 1fr; gap: 16px 14px; }
.zc-onas__fakty li {
  position: relative; justify-content: center; min-height: 122px; padding: 20px 18px 18px; box-sizing: border-box;
  background: var(--w-mieta) center / 170% 170% no-repeat, var(--karta);
  border: 1.5px solid var(--ink); border-radius: 74px 52px 68px 46px / 54px 66px 48px 62px;
  text-align: center; align-items: center; transform: rotate(-2deg);
  transition: transform .3s ease;
}
.zc-onas__fakty li:nth-child(2) { background: var(--w-masl) center / 170% 170% no-repeat, var(--karta); border-radius: 52px 76px 46px 70px / 66px 50px 64px 48px; transform: rotate(2.5deg) translateY(10px); }
.zc-onas__fakty li:nth-child(3) { background: var(--w-law) center / 170% 170% no-repeat, var(--karta); border-radius: 64px 70px 50px 76px / 50px 60px 70px 52px; transform: rotate(1.5deg); }
.zc-onas__fakty li:nth-child(4) { background: var(--w-roz) center / 170% 170% no-repeat, var(--karta); border-radius: 78px 48px 70px 56px / 60px 52px 66px 50px; transform: rotate(-2.5deg) translateY(10px); }
.zc-onas__fakty li:hover { transform: rotate(0) scale(1.04); }
.zc-onas__fakty li::before {
  content: ""; position: absolute; top: -20px; left: 50%; width: 40px; height: 40px; margin-left: -20px;
  background: var(--d-sloje) center / contain no-repeat;
}
.zc-onas__fakty li:nth-child(2)::before { background-image: var(--d-galazka); }
.zc-onas__fakty li:nth-child(3)::before { background-image: var(--d-slonce); }
.zc-onas__fakty li:nth-child(4)::before { background-image: var(--d-kielek); }
.zc-onas__fakty strong { font-family: var(--serif); font-size: 28px; font-weight: 700; color: var(--ink); }
.zc-onas__fakty span { color: var(--ink2); font-size: 14px; line-height: 1.35; margin-top: 3px; }

/* ---------- stopka: lawendowe wzgórze ---------- */
footer { position: relative; margin-top: 46px; background: var(--law) !important; color: var(--ink) !important; }
/* komunikat o wolnych terminach (dopisywany skryptem za stopką) jako kamyk na lawendzie */
footer + div { margin: 0 !important; padding: 2px 16px 22px; background: var(--law); }
footer + div p {
  display: inline-block; margin: 0 !important; padding: 8px 18px 8px 46px; color: var(--ink) !important; font-size: 14.5px; font-weight: 600;
  background: var(--d-slonce) 12px center / 26px no-repeat, var(--masl);
  border: 1.5px solid var(--ink); border-radius: 26px 20px 28px 18px / 20px 28px 18px 26px;
}
footer::before {
  content: ""; position: absolute; left: 0; right: 0; top: -13px; height: 14px; pointer-events: none;
  background: var(--fala-law) left top / 240px 14px repeat-x;
}

/* ---------- pływający telefon: naklejka-kamyk z siekierą wbitą w pieniek ---------- */
.zc-call {
  left: 50%; bottom: 20px; transform: translateX(-50%); padding: 9px 12px 9px 9px; gap: 14px;
  background: var(--zielen); color: #fff !important; font-size: 18px;
  border-radius: 40px 32px 44px 30px / 34px 44px 30px 40px;
  box-shadow: 0 0 0 5px var(--papier), 0 0 0 6.5px rgba(31, 58, 46, .35), 0 18px 34px -10px rgba(31, 58, 46, .55);
  transition: transform .25s ease, background-color .25s ease;
}
.zc-call:hover { background: var(--zielen2); transform: translateX(-50%) translateY(-3px) rotate(-.8deg); }
.zc-call:focus-visible { outline: 3px dashed var(--masl); outline-offset: 8px; }
.zc-call::before {
  content: ""; position: absolute; left: 14px; top: -60px; width: 68px; height: 64px; pointer-events: none;
  background: var(--d-siekiera) center bottom / contain no-repeat; transform-origin: 50% 100%;
}
.zc-call .zc-call__ikona {
  width: 44px !important; height: 44px; background: var(--mieta); color: var(--ink);
  border-radius: 58% 42% 52% 48% / 48% 56% 44% 52%;
}
.zc-call__tekst strong { letter-spacing: .02em; }
.zc-call .zc-call__dop {
  background: var(--masl); color: var(--ink); padding: 6px 14px; font-family: var(--serif); font-style: italic; font-size: 14.5px; font-weight: 700;
  border-radius: 55% 45% 50% 50% / 60% 50% 50% 40%;
}

/* ---------- delikatny ruch (tylko gdy użytkownik nie prosi o ograniczenie) ---------- */
@media (prefers-reduced-motion: no-preference) {
  @keyframes d1-unos { 0%, 100% { translate: 0 0; } 50% { translate: 0 -6px; } }
  @keyframes d1-listek { 0%, 100% { rotate: -6deg; } 50% { rotate: 7deg; } }
  body > h1::before { animation: d1-unos 7s ease-in-out infinite; }
  body > h1::after { animation: d1-unos 8s ease-in-out -3s infinite; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
}

/* ---------- telefon / wąskie ekrany ---------- */
@media (max-width: 768px) {
  body::before {
    height: 900px;
    background:
      var(--w-szalwia) left -150px top -120px / 460px 380px no-repeat,
      var(--w-masl) right -150px top -60px / 380px 320px no-repeat,
      var(--w-roz) right -170px top 330px / 380px 320px no-repeat,
      var(--w-law) left -170px top 480px / 400px 330px no-repeat,
      var(--w-mieta) center top 210px / 640px 440px no-repeat;
  }
  body { background-size: 100% 78px, auto, auto !important; }
  body > header { width: calc(100% - 20px); margin-top: 10px !important; padding: 6px 8px !important; }
  body > header + div { height: 56px !important; }
  body > h1 { font-size: 42px !important; padding: 0 16px 18px !important; background-size: min(300px, 70%) 20px; }
  body > h2 { font-size: 18px !important; }
  body > h1::before, body > h1::after { width: 64px; height: 64px; }
  body > h1::before { left: 6px; top: -50px; }
  body > h1::after { right: 6px; top: -46px; }
  body > div[style*="4CAF50"] { width: auto !important; margin-left: 24px !important; margin-right: 24px !important; max-width: none !important; }
  body > h2 + div[style*="4CAF50"]::before { display: none; }
  .image-container { padding: 30px 0 40px !important; gap: 22px; }
  .image-container > div { margin: 0 auto !important; }
  .image-container > div:nth-child(1) { border-radius: 120px 70px 110px 60px / 90px 60px 100px 70px; transform: rotate(-1.5deg); }
  .image-container > div:nth-child(2) { border-radius: 70px 120px 60px 110px / 60px 100px 70px 90px; transform: rotate(1.2deg); outline-offset: 6px; }
  .image-container > div:nth-child(3) { border-radius: 100px 60px 120px 80px / 70px 90px 60px 100px; transform: rotate(-1deg); }
  td[style*="FBF0E9"] { padding: 20px 20px 22px !important; }
  body > p { font-size: 16px; }
  body > table { margin-left: 12px !important; margin-right: 12px !important; padding: 12px 8px; }
  .zc-onas { margin-top: 84px !important; }
  .zc-onas::after { right: 8px; top: -82px; width: 130px; height: 98px; }
  .zc-onas__wrap { grid-template-columns: 1fr; gap: 34px; padding: 34px 20px 30px; }
  .zc-onas__wrap::before { left: -10px; width: 92px; height: 26px; }
  .zc-onas__wrap::after { right: -6px; width: 92px; height: 26px; }
  .zc-onas__tytul + p { font-size: 18px !important; }
  .zc-onas__fakty { gap: 26px 12px; padding: 6px 2px 10px; }
  .zc-onas__fakty li { min-height: 112px; padding: 20px 10px 14px; }
  .zc-onas__fakty strong { font-size: 23px; }
  .zc-onas__fakty span { font-size: 13px; }
  /* pasek telefonu: na całą szerokość, z falistym brzegiem i listkiem */
  .zc-call { background: var(--zielen); box-shadow: none; gap: 12px; }
  .zc-call:hover { transform: none !important; }
  .zc-call::after {
    content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 13px; pointer-events: none;
    background: var(--fala-ziel) left top / 180px 13px repeat-x;
  }
  .zc-call::before { left: 12px; top: -50px; width: 56px; height: 53px; z-index: 1; }
  .zc-call .zc-call__ikona { width: 40px !important; height: 40px; }
}

/* ---------- dół strony: terminy w stopce zawsze nad pływającym telefonem z siekierą ----------
   Miejsce na pływający przycisk daje dolny margines komunikatu w stopce (w kolorze stopki),
   a nie pusty pas pod nim. Gdyby komunikatu nie było, margines dostaje body. */
body { padding-bottom: 0 !important; }
body:not(:has(footer + div)) { padding-bottom: 150px !important; }
footer + div { padding-bottom: 160px !important; }
@media (max-width: 768px) {
  body:not(:has(footer + div)) { padding-bottom: 130px !important; }
  footer + div { padding-bottom: calc(130px + env(safe-area-inset-bottom)) !important; }
}

/* infografika „Jak działamy?” w stylu wariantu (podgląd; przy wdrożeniu podmienia się plik pliki/jak.png) */
body > div > img[src*="jak.png"] {

  width: min(100%, 860px) !important; height: auto !important;
  filter: none !important; mix-blend-mode: normal !important;
}

/* ---------- żywa strona: aktualne terminy pod pierwszym „Zadzwoń” ---------- */
/* komunikat o wolnych terminach (skrypt aktualizuje miesiące) przeniesiony pod pierwszy „Zadzwoń” */
.zc-terminy { margin: 0 !important; padding: 20px 16px 2px !important; background: none !important; text-align: center; }
.zc-terminy p {
  position: relative; display: inline-block; margin: 0 !important; padding: 9px 18px 9px 40px !important;
  color: var(--ink) !important; font-size: 15px !important; font-weight: 600;
  background: #fffdf5 !important; border: 1.5px solid var(--ink);
  border-radius: 26px 20px 28px 18px / 20px 28px 18px 26px;
  box-shadow: 4px 5px 0 -1px var(--mieta), 4px 5px 0 0 var(--ink);
}
/* zielona „dioda”: jesteśmy dostępni */
.zc-terminy p::before {
  content: ""; position: absolute; left: 16px; top: 50%; width: 11px; height: 11px; margin-top: -5.5px;
  border-radius: 50%; background: #2f9e5b; box-shadow: 0 0 0 3px rgba(47, 158, 91, .18);
}

/* ---------- ruch przy wezwaniach do dzwonienia ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* dioda przy terminach pulsuje jak „online” */
  @keyframes d1-dioda {
    0% { box-shadow: 0 0 0 0 rgba(47, 158, 91, .55); }
    70% { box-shadow: 0 0 0 10px rgba(47, 158, 91, 0); }
    100% { box-shadow: 0 0 0 0 rgba(47, 158, 91, 0); }
  }
  .zc-terminy p::before { animation: d1-dioda 1.8s ease-out infinite; }

  /* kamyki „Zadzwoń”: rozchodzący się sygnał + co kilka sekund „dzwonią” */
  @keyframes d1-fala {
    0% { box-shadow: 0 0 0 0 rgba(47, 107, 74, .45), 6px 7px 0 -1px var(--masl), 6px 7px 0 0 var(--ink); }
    100% { box-shadow: 0 0 0 20px rgba(47, 107, 74, 0), 6px 7px 0 -1px var(--masl), 6px 7px 0 0 var(--ink); }
  }
  @keyframes d1-dzwoni {
    0%, 76%, 100% { rotate: 0deg; }
    79% { rotate: -3deg; } 83% { rotate: 3deg; } 87% { rotate: -2deg; } 91% { rotate: 2deg; } 95% { rotate: 0deg; }
  }
  body > div[style*="4CAF50"] { animation: d1-fala 2.2s ease-out infinite, d1-dzwoni 5s ease-in-out infinite; }

  /* rysowana strzałka szturcha w stronę przycisku */
  @keyframes d1-szturch { 0%, 100% { translate: 0 0; } 50% { translate: 8px 3px; } }
  body > h2 + div[style*="4CAF50"]::before { animation: d1-szturch 2.4s ease-in-out infinite; }

  /* pływający telefon: słuchawka dzwoni, pasek co chwilę podskakuje, siekiera „rąbie” */
  @keyframes d1-sluchawka {
    0%, 14%, 100% { rotate: 0deg; }
    2% { rotate: -16deg; } 4% { rotate: 14deg; } 6% { rotate: -12deg; } 8% { rotate: 10deg; } 10% { rotate: -6deg; } 12% { rotate: 4deg; }
  }
  .zc-call__ikona svg { animation: d1-sluchawka 4s ease-in-out infinite; transform-origin: 50% 50%; }
  @keyframes d1-hop {
    0%, 86%, 100% { translate: 0 0; }
    90% { translate: 0 -7px; } 94% { translate: 0 0; } 97% { translate: 0 -3px; }
  }
  .zc-call { animation: d1-hop 8s ease-in-out 2s infinite; }
  @keyframes d1-rab {
    0%, 78%, 100% { rotate: 0deg; translate: 0 0; }
    84% { rotate: -9deg; translate: 0 -5px; }
    88% { rotate: 2deg; translate: 0 1px; }
    92% { rotate: 0deg; translate: 0 0; }
  }
  .zc-call::before { animation: d1-rab 6s ease-in-out infinite; }
  /* „Darmowa wycena”: przelotny błysk */
  @keyframes d1-blysk { 0%, 70% { background-position: -160% 0, 0 0; } 100% { background-position: 260% 0, 0 0; } }
  .zc-call .zc-call__dop {
    background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .8) 50%, transparent 65%) -160% 0 / 60% 100% no-repeat, var(--masl);
    animation: d1-blysk 5s ease-in-out infinite;
  }
}


/* ===== podwersja D1-4 (na bazie D1) ===== */

/* baza: D1 */
/* Wariant D1-4 — „Szkicownik” (lifting D1 „Ogród w akwareli”).
   Szkicownik arborysty: ramki rysowane tuszem zamiast gładkich obwódek, ołówkowe podkreślenia,
   rysowane przerywniki sekcji (gałązka, rządek drzewek, linia cięcia z piłą), kilka notatek na marginesie
   (pilarka, lina z karabinkiem, listki), mniej akwareli, papier pakowy i kratka w paru miejscach.
   Same nadpisania D1. Bez nowych słów i zewnętrznych zasobów: rysunki to data-URI SVG. */
:root {
  --kraft: #ece0c4; --kraft-jasny: #f5eedc; --kraft-rog: #d9c49b;
  --reka: "Segoe Print", "Bradley Hand", "Chalkboard SE", var(--serif);
  --szkic-ramka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140' fill='none' stroke='%231f3a2e' stroke-linecap='round'%3E%3Cg stroke-width='1.7'%3E%3Cpath d='M2.6 8.7C20 8.1 40 9.8 70 8.4S120 7.2 137.4 8.6'/%3E%3Cpath d='M8.5 2.8C7.7 30 9.7 50 8.4 75S8.9 120 8.6 137.6'/%3E%3Cpath d='M131.4 2.2C132.2 30 130.5 60 131.8 90S131.2 125 131.5 136.8'/%3E%3Cpath d='M3.4 131.5C30 132.4 60 130.5 90 131.9S125 131.1 138.2 131.3'/%3E%3C/g%3E%3Cg stroke-width='1' opacity='.4'%3E%3Cpath d='M14 10.7C40 10 70 11.5 104 9.9'/%3E%3Cpath d='M10.5 18C9.8 50 10.9 80 10 112'/%3E%3Cpath d='M129.7 36C130.4 70 129.5 100 130.2 128.6'/%3E%3Cpath d='M30 129.7C60 130.5 90 129.4 127.6 130.2'/%3E%3C/g%3E%3C/svg%3E");
  --szkic-ramka-jasna: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140' fill='none' stroke='%237fa673' stroke-linecap='round'%3E%3Cg stroke-width='1.6'%3E%3Cpath d='M2.6 8.7C20 8.1 40 9.8 70 8.4S120 7.2 137.4 8.6'/%3E%3Cpath d='M8.5 2.8C7.7 30 9.7 50 8.4 75S8.9 120 8.6 137.6'/%3E%3Cpath d='M131.4 2.2C132.2 30 130.5 60 131.8 90S131.2 125 131.5 136.8'/%3E%3Cpath d='M3.4 131.5C30 132.4 60 130.5 90 131.9S125 131.1 138.2 131.3'/%3E%3C/g%3E%3Cg stroke-width='1' opacity='.4'%3E%3Cpath d='M14 10.7C40 10 70 11.5 104 9.9'/%3E%3Cpath d='M10.5 18C9.8 50 10.9 80 10 112'/%3E%3Cpath d='M129.7 36C130.4 70 129.5 100 130.2 128.6'/%3E%3Cpath d='M30 129.7C60 130.5 90 129.4 127.6 130.2'/%3E%3C/g%3E%3C/svg%3E");
  --szkic-obla: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%231f3a2e' stroke-linecap='round'%3E%3Cpath stroke-width='1.7' d='M27 8.6C60 7.7 100 9.8 133 8.3C146 8 151.9 14 151.5 27C151.1 60 152 100 151.4 133C151.7 146 146 151.9 133 151.4C100 152.1 60 150.8 27 151.6C14 151.8 8.2 146 8.6 133C8.2 100 9.2 60 8.5 27C8.2 13.6 14.6 8.2 31 8.9'/%3E%3Cpath stroke-width='1' opacity='.4' d='M10.7 42C10.2 22 14 11.6 30 10.9C50 10.4 70 11.3 92 10.6M149.7 118C150.1 140 146 149.6 130 149.8C110 150.3 90 149.3 70 149.9'/%3E%3C/svg%3E");
  --szkic-obla-jasna: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%237fa673' stroke-linecap='round'%3E%3Cpath stroke-width='1.5' d='M27 8.6C60 7.7 100 9.8 133 8.3C146 8 151.9 14 151.5 27C151.1 60 152 100 151.4 133C151.7 146 146 151.9 133 151.4C100 152.1 60 150.8 27 151.6C14 151.8 8.2 146 8.6 133C8.2 100 9.2 60 8.5 27C8.2 13.6 14.6 8.2 31 8.9'/%3E%3Cpath stroke-width='1' opacity='.4' d='M10.7 42C10.2 22 14 11.6 30 10.9C50 10.4 70 11.3 92 10.6M149.7 118C150.1 140 146 149.6 130 149.8C110 150.3 90 149.3 70 149.9'/%3E%3C/svg%3E");
  --szkic-obla-masl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%23f8e3a0' stroke-linecap='round'%3E%3Cpath stroke-width='2' d='M27 8.6C60 7.7 100 9.8 133 8.3C146 8 151.9 14 151.5 27C151.1 60 152 100 151.4 133C151.7 146 146 151.9 133 151.4C100 152.1 60 150.8 27 151.6C14 151.8 8.2 146 8.6 133C8.2 100 9.2 60 8.5 27C8.2 13.6 14.6 8.2 31 8.9'/%3E%3Cpath stroke-width='1' opacity='.4' d='M10.7 42C10.2 22 14 11.6 30 10.9C50 10.4 70 11.3 92 10.6M149.7 118C150.1 140 146 149.6 130 149.8C110 150.3 90 149.3 70 149.9'/%3E%3C/svg%3E");
  --szkic-podkresl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none' fill='none' stroke='%231f3a2e' stroke-linecap='round'%3E%3Cpath vector-effect='non-scaling-stroke' stroke-width='2.2' opacity='.85' d='M4 8.5C60 6 140 8.6 210 6.4S280 6 296 7.2'/%3E%3Cpath vector-effect='non-scaling-stroke' stroke-width='1.3' opacity='.5' d='M16 13.6C80 11.4 170 13.2 240 11.2C262 10.6 280 11.6 291 12.4'/%3E%3Cpath vector-effect='non-scaling-stroke' stroke-width='1' opacity='.35' d='M228 16.4C250 14.6 268 14.2 287 15'/%3E%3C/svg%3E");
  --d-galaz-poz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 40' fill='none' stroke='%231f3a2e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 24C50 18 92 26 132 20S200 15 232 21'/%3E%3Cpath d='M42 22c-2-9 3-15 11-17 1 8-3 14-11 17z' fill='%23b9d4ad'/%3E%3Cpath d='M64 23c4 8 11 11 19 10-2-8-10-12-19-10z' fill='%23cfe9d6'/%3E%3Cpath d='M104 22c0-9 6-14 14-15 0 8-5 14-14 15z' fill='%23f8e3a0'/%3E%3Cpath d='M142 19c5 7 12 9 19 7-3-7-11-10-19-7z' fill='%23b9d4ad'/%3E%3Cpath d='M182 18c-1-8 4-13 11-15 1 8-4 13-11 15z' fill='%23cfe9d6'/%3E%3Cpath d='M2 25l-1 0M226 15l5-3' stroke-width='1.4'/%3E%3C/svg%3E");
  --d-drzewka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 56' fill='none' stroke='%231f3a2e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 50C60 47.5 120 51.5 180 48.5S240 50 256 49'/%3E%3Cpath d='M40 49v-7M40 14l-10 15h5l-7 12h24l-7-12h5z' fill='%23b9d4ad'/%3E%3Cpath d='M80 49V34M80 15c8 0 13 6 13 11 0 6-5 9-13 9s-13-3-13-9c0-5 5-11 13-11z' fill='%23cfe9d6'/%3E%3Cpath d='M116 49v-5M116 27l-7 10h4l-5 7h16l-5-7h4z' fill='%23b9d4ad'/%3E%3Cpath d='M146 49v-8h14v8' fill='%23f6e3bf'/%3E%3Cpath d='M146 41c1-2.4 13-2.4 14 0-1 2-13 2-14 0z' fill='%23f8e3a0'/%3E%3Cpath d='M153 41.2h.4' stroke-width='1.2'/%3E%3Cpath d='M164 44l6-3M168 47l4 1' stroke-width='1.2'/%3E%3Cpath d='M196 49V36M196 18c7 0 11 5 11 10 0 5-4 8-11 8s-11-3-11-8c0-5 4-10 11-10z' fill='%23b9d4ad'/%3E%3Cpath d='M230 49v-6M230 19l-8 12h4l-6 10h20l-6-10h4z' fill='%23cfe9d6'/%3E%3C/svg%3E");
  --d-pila: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 44' fill='none' stroke='%231f3a2e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 26C50 24.5 110 27.5 166 25' stroke-dasharray='7 6'/%3E%3Cpath d='M180 17L262 12V29L180 25Z' fill='%23dfe5e8' stroke='none'/%3E%3Cpath d='M180 17L262 12M180 17L180 25'/%3E%3Cpath d='M262.0 32.2 L258.3 28.8 L254.5 31.8 L250.8 28.5 L247.1 31.5 L243.4 28.1 L239.6 31.1 L235.9 27.7 L232.2 30.7 L228.5 27.4 L224.7 30.4 L221.0 27.0 L217.3 30.0 L213.5 26.6 L209.8 29.7 L206.1 26.3 L202.4 29.3 L198.6 25.9 L194.9 28.9 L191.2 25.5 L187.5 28.6 L183.7 25.2 L180.0 28.2' stroke-width='1.3'/%3E%3Cpath d='M190 18.6L250 15' stroke='%23ffffff' stroke-width='1.4'/%3E%3Cpath d='M262 9h14c9 0 14 6 14 12.5S285 34 276 34h-14z' fill='%23e2c39b'/%3E%3Cpath d='M269 16h7c3 0 5 2.4 5 5.4S279 27 276 27h-7z' fill='%23fbf8ef'/%3E%3Ccircle cx='265.5' cy='13.5' r='1' fill='%231f3a2e'/%3E%3Ccircle cx='265.5' cy='29.5' r='1' fill='%231f3a2e'/%3E%3Cpath d='M170 33l-2 2M176 36l1 2M163 37l-1 1.5M172 39.5h1' stroke-width='1.3'/%3E%3C/svg%3E");
  --d-spalinowka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 66' fill='none' stroke='%231f3a2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M55 30.5H113c4.6 0 8 3.4 8 8s-3.4 8-8 8H55z' fill='%23fffdf7'/%3E%3Cpath d='M55 27.3H113.5c6.6 0 11.3 5 11.3 11.2s-4.7 11.2-11.3 11.2H55' stroke-width='1.5' stroke-dasharray='2.6 2.6'/%3E%3Ccircle cx='112' cy='38.5' r='2.2' stroke-width='1.4'/%3E%3Cpath d='M15 21.5h34c4.4 0 7 2.8 7 6.5v20c0 4-2.8 6.5-7 6.5H15c-4 0-6.5-2.6-6.5-6.5V28c0-4 2.6-6.5 6.5-6.5z' fill='%23f8e3a0'/%3E%3Cpath d='M18 21.5C17.5 9 29 5.5 42 8.5c6.5 1.6 8.2 6.5 8.2 13' stroke-width='2.4'/%3E%3Cpath d='M8.5 30.5c-6.5.5-7.5 16 0 17' stroke-width='2.4'/%3E%3Cpath d='M23 31.5h20M23 37h20M23 42.5h13' stroke-width='1.3'/%3E%3Ccircle cx='15.5' cy='44' r='2.6' stroke-width='1.4'/%3E%3Cpath d='M124 26l3-3M127 33l3.5-1M121 21.5l1-3.5' stroke-width='1.3'/%3E%3C/svg%3E");
  --d-lina: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 112' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg stroke='%23b9d4ad' stroke-width='5.5'%3E%3Cpath d='M50 34c21 0 33 13 33 28s-12 29-33 29-33-14-33-29 12-28 33-28z'/%3E%3Cpath d='M48 40c17 0 27 10 27 22s-10 23-27 23-27-11-27-23 10-22 27-22z'/%3E%3C/g%3E%3Cg stroke='%231f3a2e' stroke-width='1.5'%3E%3Cpath d='M50 34c21 0 33 13 33 28s-12 29-33 29-33-14-33-29 12-28 33-28z' stroke-dasharray='5 2.4'/%3E%3Cpath d='M48 40c17 0 27 10 27 22s-10 23-27 23-27-11-27-23 10-22 27-22z' stroke-dasharray='5 2.4'/%3E%3Cpath d='M40 31c-2.5 6-2.5 11 0 17M47 30c-2.5 6-2.5 11 0 17M54 30c-2.5 6-2.5 11 0 17' stroke-width='1.8'/%3E%3Cpath d='M72 85c6 7 5 14-1 19'/%3E%3Cpath d='M71 104l-4 2.5M71 104l-1 4.5M71 104l3 3' stroke-width='1.2'/%3E%3C/g%3E%3Cpath d='M41 6.5h14c6 0 8.5 3.2 8.5 8v5.5c0 5-2.6 8.5-8.5 8.5H43c-5.5 0-8-3.4-8-8.5V13c0-4.6 2-6.5 6-6.5z' stroke='%231f3a2e' stroke-width='2.4' fill='%23fffdf7' fill-opacity='.6'/%3E%3Cpath d='M37.5 11.5l5 11' stroke='%231f3a2e' stroke-width='1.6'/%3E%3C/svg%3E");
  --fala-kraft: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14V8C15 2 25 2 40 7s25 5 40-1 25-4 40 2v6z' fill='%23ece0c4'/%3E%3Cpath d='M0 8C15 2 25 2 40 7s25 5 40-1 25-4 40 2' fill='none' stroke='%231f3a2e' stroke-opacity='.45' stroke-width='1.3' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
}

/* ---------- papier: mniej plam (szałwia, masło, mięta), dół strony w papierze pakowym ---------- */
body {
  background: linear-gradient(var(--kraft), var(--kraft)) left bottom / 100% 90px no-repeat, var(--grain), var(--papier) !important;
}
body::before {
  background:
    var(--w-szalwia) left -190px top -160px / 720px 560px no-repeat,
    var(--w-masl) right -170px top -100px / 560px 450px no-repeat,
    var(--w-mieta) center top 300px / 1000px 520px no-repeat;
  opacity: .85;
}

/* ---------- menu: kartka obrysowana tuszem ---------- */
body > header {
  border: 1.5px solid transparent; border-image: var(--szkic-ramka) 20 / 20px / 7px stretch;
  border-radius: 3px; box-shadow: none;
}
body > header .links-container a { border-radius: 4px; background-repeat: no-repeat; background-position: center bottom 3px; background-size: 0 7px; transition: background-size .25s ease; }
/* jedna ołówkowa kreska pod słowem; repeat/position trzeba powtórzyć, bo hover z D1 ustawia skrót `background` i włącza powtarzanie */
body > header .links-container a:hover {
  background-color: transparent; background-image: var(--szkic-podkresl);
  background-repeat: no-repeat; background-position: center bottom 3px; background-size: 78% 7px;
}

/* ---------- tytuł: ołówkowa kreska na maśle; pilarka zamiast drzewka ---------- */
body > h1 {
  padding-bottom: 24px !important;
  background:
    var(--szkic-podkresl) center bottom 2px / min(430px, 62%) 16px no-repeat,
    var(--swash-masl) center bottom / min(400px, 58%) 18px no-repeat;
}
body > h1::before { background: var(--d-galazka) center / 62% no-repeat, var(--w-mieta) center / 140% 120% no-repeat; }
body > h1::after {
  right: -60px; top: -62px; width: 128px; transform: rotate(-8deg);
  background: var(--d-spalinowka) center / 86% no-repeat, var(--w-masl) center / 120% 120% no-repeat;
}

/* ---------- „Zadzwoń” w treści: kamyk obrysowany ręcznie ---------- */
body > div[style*="4CAF50"] {
  border-radius: 26px 20px 28px 18px / 20px 28px 18px 26px !important;
  box-shadow: 6px 7px 0 -1px var(--masl);
}
body > div[style*="4CAF50"]::after {
  content: ""; position: absolute; inset: -12px; pointer-events: none;
  border: 30px solid transparent; border-image: var(--szkic-obla) 30 stretch;
  transform: rotate(-1.4deg); /* obwódka rysowana „z ręki”, nie idealnie na krawędzi */
}

/* wolne terminy: karteczka z ręczną obwódką */
.zc-terminy p {
  border-color: transparent; border-image: var(--szkic-obla) 30 / 24px / 7px stretch;
  border-radius: 16px; box-shadow: none;
}

/* ---------- zdjęcia: odbitki wklejone do szkicownika (biały margines, narożniki, kreska tuszu) ---------- */
.image-container { position: relative; padding-bottom: 76px !important; }
.image-container > div:nth-child(n) {
  position: relative; border-radius: 2px; outline: none;
  box-shadow: 0 0 0 8px #fffdf7, 0 20px 30px -16px rgba(31, 58, 46, .5);
}
.image-container > div:nth-child(n):hover { border-radius: 2px; transform: rotate(0) scale(1.02); }
.image-container > div::after {
  content: ""; position: absolute; inset: -16px; pointer-events: none;
  border: 20px solid transparent; border-image: var(--szkic-ramka) 20 stretch;
}
.image-container > div::before {
  content: ""; position: absolute; inset: -9px; pointer-events: none;
  background:
    linear-gradient(135deg, var(--kraft-rog) 0 47%, rgba(31, 58, 46, .55) 47% 51%, transparent 51%) left top / 30px 30px no-repeat,
    linear-gradient(315deg, var(--kraft-rog) 0 47%, rgba(31, 58, 46, .55) 47% 51%, transparent 51%) right bottom / 30px 30px no-repeat;
}
/* przerywnik pod pasem zdjęć: gałązka; pod drugim pasem rządek drzewek */
.image-container::after {
  content: ""; position: absolute; left: 50%; bottom: 8px; width: 250px; height: 42px; margin-left: -125px; pointer-events: none;
  background: var(--d-galaz-poz) center / contain no-repeat;
}
.image-container ~ .image-container::after { width: 260px; height: 56px; margin-left: -130px; bottom: 2px; background-image: var(--d-drzewka); }

/* ---------- karty: kartki z obrysem tuszem, rysunki narzędzi ---------- */
body > div[style*="flex-direction: column"] { position: relative; }
body > div[style*="flex-direction: column"] > div:nth-child(n) > div:nth-child(n) td[style*="FBF0E9"] {
  background: var(--karta) !important;
  border-color: transparent !important; border-radius: 2px !important; box-shadow: none;
}
/* obrys tuszem jako warstwa nad komórką (border-image na <td> bywa pomijany) */
td[style*="FBF0E9"]::after {
  content: ""; position: absolute; inset: -9px; pointer-events: none;
  border: 20px solid transparent; border-image: var(--szkic-ramka) 20 stretch;
}
body > div[style*="flex-direction: column"] > div:nth-child(1) > div:nth-child(1) td[style*="FBF0E9"]::before { background: var(--d-galazka) center / 64% no-repeat, var(--w-masl) center / 150% 130% no-repeat; }
body > div[style*="flex-direction: column"] > div:nth-child(1) > div:nth-child(2) td[style*="FBF0E9"]::before { background: var(--d-lina) center / 60% no-repeat, var(--w-mieta) center / 150% 130% no-repeat; }
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(1) td[style*="FBF0E9"]::before { background: var(--d-sloje) center / 64% no-repeat, var(--w-szalwia) center / 150% 130% no-repeat; }
body > div[style*="flex-direction: column"] > div:nth-child(2) > div:nth-child(2) td[style*="FBF0E9"]::before { background: var(--d-slonce) center / 64% no-repeat, var(--w-masl) center / 150% 130% no-repeat; }
td[style*="FBF0E9"] > b:first-child {
  padding-bottom: 8px; background: var(--szkic-podkresl) left bottom / 100% 9px no-repeat;
}

/* infografika: wklejona taśmą do szkicownika */
body > div:has(> img[src*="jak.png"]) { position: relative; padding-bottom: 74px !important; }
body > div:has(> img[src*="jak.png"])::before {
  content: ""; position: absolute; left: 50%; top: 12px; width: 132px; height: 30px; margin-left: -66px; z-index: 1; pointer-events: none;
  background: rgba(185, 212, 173, .78); transform: rotate(-3deg);
  clip-path: polygon(0 8%, 6% 0, 12% 10%, 18% 0, 24% 6%, 100% 0, 96% 18%, 100% 34%, 95% 52%, 100% 70%, 96% 86%, 100% 100%, 18% 96%, 12% 100%, 6% 92%, 0 100%, 4% 70%, 0 50%, 4% 30%);
}
/* przerywnik: linia cięcia z piłą */
body > div:has(> img[src*="jak.png"])::after {
  content: ""; position: absolute; left: 50%; bottom: 14px; width: 300px; height: 44px; margin-left: -150px; pointer-events: none;
  background: var(--d-pila) center / contain no-repeat;
}

/* ---------- tereny i miasta ---------- */
body > div[style*="flex-wrap"] > div {
  border-color: transparent; border-image: var(--szkic-obla-jasna) 30 / 18px / 3px stretch; border-radius: 12px !important;
}
body > div[style*="flex-wrap"] > div:hover { border-image-source: var(--szkic-obla); background: #f3f8ef; }
body > table {
  background: var(--grain), var(--kraft-jasny);
  border: 1.5px solid transparent; border-image: var(--szkic-ramka) 20 / 20px / 7px stretch; border-radius: 2px;
}

/* ---------- O nas: strona w kratkę, wklejona na papier pakowy ---------- */
.zc-onas__wrap {
  background:
    linear-gradient(rgba(127, 166, 115, .16) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgba(127, 166, 115, .16) 1px, transparent 1px) 0 0 / 24px 24px,
    var(--w-szalwia) left -170px top -150px / 520px 410px no-repeat,
    var(--w-masl) right -190px bottom -170px / 480px 380px no-repeat,
    var(--karta);
  border: 1.5px solid transparent; border-image: var(--szkic-ramka) 20 / 20px / 8px stretch; border-radius: 2px;
  box-shadow: 12px 14px 0 -2px var(--kraft);
}
.zc-onas__wrap::after { background: rgba(185, 212, 173, .8); }
.zc-onas__tytul {
  font-family: var(--reka); font-style: normal; font-weight: 700; font-size: clamp(34px, 4vw, 48px); line-height: 1.15;
  padding-bottom: 14px;
  background: var(--szkic-podkresl) left bottom 2px / 100% 12px no-repeat, var(--swash-masl) left bottom / 100% 18px no-repeat;
}
.zc-onas__tytul + p::first-letter { background: var(--w-szalwia) center / 160% 150% no-repeat; }
.zc-onas__fakty li:nth-child(n) {
  border-color: transparent; border-image: var(--szkic-obla) 30 / 26px / 5px stretch; border-radius: 20px;
}
.zc-onas__fakty li:nth-child(3) { background: var(--w-szalwia) center / 170% 170% no-repeat, var(--karta); }
.zc-onas__fakty li:nth-child(4) { background: var(--w-mieta) center / 170% 170% no-repeat, var(--karta); }

/* ---------- stopka: papier pakowy ---------- */
/* gładki papier pakowy, bez ziarna — tak samo jak pas z terminami pod stopką, więc nie ma szwu */
footer { background: var(--kraft) !important; }
footer::before { background-image: var(--fala-kraft); }
footer + div { background: var(--kraft); }
footer + div p { border-color: transparent; border-image: var(--szkic-obla) 30 / 24px / 7px stretch; }

/* ---------- pływający telefon: kamyk z ręczną obwódką ---------- */
.zc-call .zc-call__dop { font-family: var(--reka); font-style: normal; font-size: 14px; }
@media (min-width: 769px) {
  .zc-call {
    border-radius: 28px 22px 30px 20px / 22px 30px 20px 28px;
    box-shadow: 0 0 0 7px var(--papier), 0 18px 34px -10px rgba(31, 58, 46, .55);
  }
  .zc-call::after {
    content: ""; position: absolute; inset: -12px; pointer-events: none;
    border: 30px solid transparent; border-image: var(--szkic-obla) 30 stretch;
    transform: rotate(.7deg);
  }
}

/* ---------- notatki na marginesie (tylko gdy jest miejsce) ---------- */
@media (min-width: 1240px) {
  body > div[style*="flex-direction: column"]::after {
    content: ""; position: absolute; left: -112px; top: 46%; width: 104px; height: 116px; pointer-events: none;
    background: var(--d-lina) center / contain no-repeat; transform: rotate(-8deg);
  }
  body > div[style*="flex-wrap"] { position: relative; }
  body > div[style*="flex-wrap"] + div[style*="flex-wrap"]::after {
    content: ""; position: absolute; right: -96px; top: -40px; width: 64px; height: 60px; pointer-events: none;
    background: var(--d-listek) center / contain no-repeat; transform: rotate(18deg);
  }
}

/* ---------- ruch ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* kamyki „Zadzwoń”: ten sam sygnał co w D1, bez twardego cienia tuszem (obwódkę daje szkic) */
  @keyframes d14-fala {
    0% { box-shadow: 0 0 0 0 rgba(47, 107, 74, .45), 6px 7px 0 -1px var(--masl); }
    100% { box-shadow: 0 0 0 20px rgba(47, 107, 74, 0), 6px 7px 0 -1px var(--masl); }
  }
  body > div[style*="4CAF50"] { animation: d14-fala 2.2s ease-out infinite, d1-dzwoni 5s ease-in-out infinite; }
  /* piła w przerywniku co chwilę „tnie” */
  @keyframes d14-pila { 0%, 60%, 100% { background-position: center; } 70%, 90% { background-position: calc(50% - 6px) 50%; } 80% { background-position: calc(50% + 4px) 50%; } }
  body > div:has(> img[src*="jak.png"])::after { animation: d14-pila 4s ease-in-out infinite; }
  @keyframes d14-listek { 0%, 100% { rotate: -6deg; } 50% { rotate: 8deg; } }
  body > div[style*="flex-wrap"] + div[style*="flex-wrap"]::after { animation: d14-listek 6s ease-in-out infinite; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- telefon / wąskie ekrany ---------- */
@media (max-width: 768px) {
  body::before {
    background:
      var(--w-szalwia) left -150px top -120px / 440px 360px no-repeat,
      var(--w-masl) right -160px top -60px / 360px 300px no-repeat,
      var(--w-mieta) center top 260px / 620px 400px no-repeat;
  }
  body > header { border-image-outset: 5px; }
  body > h1 { background-size: min(300px, 72%) 13px, min(280px, 68%) 16px; }
  body > h1::after { right: 2px; top: -44px; width: 84px; height: 60px; }
  body > div[style*="4CAF50"]::after { inset: -10px; }
  .image-container { padding-bottom: 70px !important; gap: 34px; }
  .image-container > div:nth-child(n) { width: min(84%, 350px) !important; }
  .image-container > div::after { inset: -15px; }
  .zc-onas__tytul { font-size: 36px; }
  /* pasek telefonu: falisty brzeg obrysowany tuszem */
  .zc-call::after { filter: drop-shadow(0 -1.2px 0 rgba(31, 58, 46, .55)); }
}


/* ===== podwersja D1-7 (na bazie D1-4) ===== */

/* ----- moduł modul_D1-2_zadzwon.css ----- */
/* MODUŁ: kamyki „Zadzwoń” z D1-2 (wycięte skryptem zrob_moduly.py — nie edytuj ręcznie) */

/* fale dźwięku przesuwają się dzięki animowanej zmiennej (bez obsługi @property: fale stoją w miejscu) */
@property --d12-fala { syntax: "<length>"; inherits: false; initial-value: 0px; }

:root {
  --d12-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%231f3a2e' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E");
  --d12-strzalka: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80' fill='none' stroke='%231f3a2e' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8c4 26 18 46 40 48 14 1 20-10 12-16-9-6-20 6-10 16 12 11 34 10 56 4'/%3E%3Cpath d='M96 53l10 7-11 6'/%3E%3C/svg%3E");
  --d12-strzalka-m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 44' fill='none' stroke='%231f3a2e' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4c1 20 15 31 40 32'/%3E%3Cpath d='M38 28l9 8-11 5'/%3E%3C/svg%3E");
  --d12-iskry: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%231f3a2e' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M9 24V8'/%3E%3Cpath d='M16 29l13-13'/%3E%3Cpath d='M19 36h15'/%3E%3C/svg%3E");
}

/* =====================================================================
   KAMYKI „ZADZWOŃ” (oba): słuchawka w kółku + fale dźwięku + iskry
   ===================================================================== */
body > div[style*="4CAF50"] {
  max-width: 410px !important; padding: 18px 34px 18px 98px !important;
  border-radius: 44px 56px 48px 60px / 42px 38px 46px 40px !important;
  box-shadow: 7px 8px 0 -1px var(--masl), 7px 8px 0 0 var(--ink);
}
body > div[style*="4CAF50"] span { font-size: 22px !important; font-weight: 700; letter-spacing: .015em; text-shadow: 0 1px 0 rgba(0, 0, 0, .18); }

/* słuchawka w żółtym kółku (z lewej, w środku kamyka) */
body > div[style*="4CAF50"]::after {
  content: ""; position: absolute; left: 16px; top: 50%; width: 54px; height: 54px; margin-top: -27px; box-sizing: border-box;
  pointer-events: none; z-index: 1;
  background: var(--d12-tel) center / 26px no-repeat, var(--masl);
  border: 2px solid var(--ink); border-radius: 58% 42% 52% 48% / 48% 56% 44% 52%;
  box-shadow: 2px 3px 0 0 rgba(20, 40, 30, .45);
}
/* fale dźwięku: łuki „)))” wychodzące ze słuchawki w prawo */
body > div[style*="4CAF50"] .zc-cta__link::before {
  --d12-r: 29px; --d12-R: 50px;
  content: ""; position: absolute; left: 43px; top: 50%; width: 52px; height: 74px; margin-top: -37px; pointer-events: none;
  --d12-fala: 0px;
  background: repeating-radial-gradient(circle at 0 50%,
    transparent var(--d12-fala), rgba(248, 232, 176, .95) var(--d12-fala),
    rgba(248, 232, 176, .95) calc(var(--d12-fala) + 2.6px), transparent calc(var(--d12-fala) + 2.6px),
    transparent calc(var(--d12-fala) + 9px));
  -webkit-mask-image:
    conic-gradient(from 0deg at 0 50%, transparent 48deg, #000 66deg, #000 114deg, transparent 132deg),
    radial-gradient(circle at 0 50%, transparent var(--d12-r), #000 calc(var(--d12-r) + 5px), #000 calc(var(--d12-R) - 10px), transparent var(--d12-R));
  -webkit-mask-composite: source-in;
  mask-image:
    conic-gradient(from 0deg at 0 50%, transparent 48deg, #000 66deg, #000 114deg, transparent 132deg),
    radial-gradient(circle at 0 50%, transparent var(--d12-r), #000 calc(var(--d12-r) + 5px), #000 calc(var(--d12-R) - 10px), transparent var(--d12-R));
  mask-composite: intersect;
}
/* „iskry” przy prawym górnym rogu */
body > div[style*="4CAF50"] .zc-cta__link > span::after, body > div[style*="4CAF50"] > span::after {
  content: ""; position: absolute; right: -24px; top: -26px; width: 34px; height: 34px; pointer-events: none;
  background: var(--d12-iskry) center / contain no-repeat; transform-origin: 0 100%;
}

/* ---------- pierwszy kamyk (pod tytułem): większy, z długą strzałką ---------- */
body > h2 + div[style*="4CAF50"] {
  max-width: 470px !important; margin-top: 34px !important; padding: 22px 40px 22px 112px !important;
  border-radius: 48px 62px 52px 66px / 46px 40px 50px 42px !important;
}
body > h2 + div[style*="4CAF50"] span { font-size: 26px !important; }
body > h2 + div[style*="4CAF50"]::after {
  left: 18px; width: 62px; height: 62px; margin-top: -31px; background-size: 30px, auto;
}
body > h2 + div[style*="4CAF50"] .zc-cta__link::before { --d12-r: 33px; --d12-R: 58px; left: 49px; width: 60px; height: 84px; margin-top: -42px; }
body > h2 + div[style*="4CAF50"]::before {
  left: -118px; top: -44px; width: 120px; height: 80px;
  background-image: var(--d12-strzalka);
  -webkit-mask: linear-gradient(#000, #000) left / 100% 100% no-repeat;
          mask: linear-gradient(#000, #000) left / 100% 100% no-repeat;
}

/* ---------- drugi kamyk (w środku strony): strzałka z prawej ---------- */
body > div[style*="flex-direction: column"] + div[style*="4CAF50"] { margin-top: 44px !important; }
body > div[style*="flex-direction: column"] + div[style*="4CAF50"]::before {
  content: ""; position: absolute; right: -124px; top: -40px; width: 110px; height: 74px; pointer-events: none;
  background: var(--d12-strzalka) center / contain no-repeat; transform: scaleX(-1);
  -webkit-mask: linear-gradient(#000, #000) left / 100% 100% no-repeat;
          mask: linear-gradient(#000, #000) left / 100% 100% no-repeat;
}
body > div[style*="flex-direction: column"] + div[style*="4CAF50"] .zc-cta__link > span::after,
body > div[style*="flex-direction: column"] + div[style*="4CAF50"] > span::after {
  right: auto; left: -22px; transform: scaleX(-1); transform-origin: 100% 100%;
}

@media (prefers-reduced-motion: no-preference) {
  /* --- kamyki --- */
  @keyframes d12-fala-kamyka {
    0% { box-shadow: 0 0 0 0 rgba(47, 93, 70, .5), 7px 8px 0 -1px var(--masl), 7px 8px 0 0 var(--ink); }
    100% { box-shadow: 0 0 0 22px rgba(47, 93, 70, 0), 7px 8px 0 -1px var(--masl), 7px 8px 0 0 var(--ink); }
  }
  @keyframes d12-kamyk-dzwoni {
    0%, 12%, 100% { rotate: 0deg; }
    2% { rotate: -1.6deg; } 4% { rotate: 1.6deg; } 6% { rotate: -1.2deg; } 8% { rotate: 1deg; } 10% { rotate: -.4deg; }
  }
  body > div[style*="4CAF50"] { animation: d12-fala-kamyka 2.4s ease-out infinite, d12-kamyk-dzwoni 6s ease-in-out 1s infinite; }

  /* słuchawka dzwoni (drży i lekko rośnie) co 3 s */
  @keyframes d12-sluchawka {
    0%, 26%, 100% { rotate: 0deg; scale: 1; }
    3% { rotate: -16deg; scale: 1.08; } 6% { rotate: 14deg; scale: 1.08; } 9% { rotate: -12deg; scale: 1.08; }
    12% { rotate: 10deg; scale: 1.06; } 15% { rotate: -7deg; scale: 1.04; } 18% { rotate: 4deg; scale: 1.02; } 21% { rotate: -2deg; scale: 1; }
  }
  body > div[style*="4CAF50"]::after { animation: d12-sluchawka 3s ease-in-out 1s infinite; }

  /* fale dźwięku płyną od słuchawki na zewnątrz */
  @keyframes d12-fale { from { --d12-fala: 0px; } to { --d12-fala: 9px; } }
  body > div[style*="4CAF50"] .zc-cta__link::before { animation: d12-fale 1.1s linear infinite; }
  body > div[style*="4CAF50"]:hover .zc-cta__link::before { animation-duration: .55s; }

  /* iskry „błyskają” razem z dzwonieniem */
  @keyframes d12-iskry {
    0%, 30%, 100% { scale: .8; opacity: .55; }
    6% { scale: 1.18; opacity: 1; } 12% { scale: .95; opacity: 1; } 18% { scale: 1.1; opacity: 1; }
  }
  body > div[style*="4CAF50"] .zc-cta__link > span::after,
  body > div[style*="4CAF50"] > span::after { animation: d12-iskry 3s ease-in-out 1s infinite; }

  /* strzałka rysuje się raz po wejściu, potem szturcha w stronę przycisku */
  @keyframes d12-rysuj { from { -webkit-mask-size: 0% 100%; mask-size: 0% 100%; } to { -webkit-mask-size: 100% 100%; mask-size: 100% 100%; } }
  @keyframes d12-szturch { 0%, 100% { translate: 0 0; } 50% { translate: 9px 4px; } }
  @keyframes d12-szturch-l { 0%, 100% { translate: 0 0; } 50% { translate: -9px 4px; } }
  body > h2 + div[style*="4CAF50"]::before { animation: d12-rysuj 1.2s ease-out .4s both, d12-szturch 2.4s ease-in-out 1.6s infinite; }
  body > div[style*="flex-direction: column"] + div[style*="4CAF50"]::before { animation: d12-rysuj 1.2s ease-out .4s both, d12-szturch-l 2.4s ease-in-out 1.6s infinite; }
}

@media (max-width: 768px) {
  body > div[style*="4CAF50"] {
    margin-left: 18px !important; margin-right: 18px !important;
    padding: 16px 12px 16px 86px !important;
  }
  body > div[style*="4CAF50"] span { font-size: 20px !important; }
  body > div[style*="4CAF50"]::after { left: 12px; width: 52px; height: 52px; margin-top: -26px; background-size: 25px, auto; }
  body > div[style*="4CAF50"] .zc-cta__link::before { --d12-r: 28px; --d12-R: 46px; left: 38px; width: 48px; height: 68px; margin-top: -34px; }
  body > div[style*="4CAF50"] .zc-cta__link > span::after,
  body > div[style*="4CAF50"] > span::after { right: -9px; top: -25px; width: 28px; height: 28px; }

  body > h2 + div[style*="4CAF50"] { margin-top: 44px !important; padding: 18px 12px 18px 88px !important; }
  body > h2 + div[style*="4CAF50"] span { font-size: 21px !important; }
  body > h2 + div[style*="4CAF50"]::after { left: 12px; width: 56px; height: 56px; margin-top: -28px; background-size: 27px, auto; }
  body > h2 + div[style*="4CAF50"] .zc-cta__link::before { --d12-r: 30px; --d12-R: 48px; left: 40px; width: 50px; height: 70px; margin-top: -35px; }
  /* krótka strzałka nad lewym rogiem (D1 ją chował) */
  body > h2 + div[style*="4CAF50"]::before {
    display: block; left: -6px; top: -42px; width: 50px; height: 37px;
    background-image: var(--d12-strzalka-m);
  }
  /* drugi kamyk: krótka strzałka nad prawym rogiem */
  body > div[style*="flex-direction: column"] + div[style*="4CAF50"] { margin-top: 44px !important; }
  body > div[style*="flex-direction: column"] + div[style*="4CAF50"]::before {
    right: -6px; top: -42px; width: 50px; height: 37px; background-image: var(--d12-strzalka-m);
  }
  body > div[style*="flex-direction: column"] + div[style*="4CAF50"] .zc-cta__link > span::after,
  body > div[style*="flex-direction: column"] + div[style*="4CAF50"] > span::after { left: -9px; }
}

/* baza: D1-4 */
/* dolacz: modul_D1-2_zadzwon.css */
/* Wariant D1-7 — szkicownik (D1-4: kwadratowe zdjęcia-odbitki, rysunki tuszem)
   z przyciskami „Zadzwoń” z D1-2 (słuchawka w żółtym kółku, fale sygnału, iskry, rysowane strzałki).
   Ręczną obwódkę kamyka z D1-4 zastępuje słuchawka z D1-2 (oba używają ::after). */

/* ozdoby (ramki tuszem, iskry przy przycisku) celowo wystają kilka pikseli poza swoje pudełka;
   przy krawędzi ekranu dawały przewijanie w bok o 2 px na telefonie — ucinamy je na poziomie strony.
   `clip` nie tworzy kontenera przewijania, więc przyklejone menu dalej działa. */
@supports (overflow: clip) { html, body { overflow-x: clip; } }
@supports not (overflow: clip) { html { overflow-x: hidden; } }