/* ============================================================
   MALÍŘKREATIV — řemeslný skin (zelená + modrá na teplém papíru)
   Drží stejné názvy tříd jako původní skin, aby fungovaly všechny
   CMS podstránky (pagebuilder, blog, kontakt).
   Designový jazyk: malířská páska, tvrdé ofsetové stíny, ručně
   malované nerovné rohy, zrnitý papír, Caveat pro psané akcenty.
   ============================================================ */

:root{
 --paper:#faf6ee;--paper-2:#f4ecdd;--card:#fffdf7;
 --bg:var(--paper);--soft:#e9f2e4;--soft2:#f3f7ee;--softb:#e9eff7;
 --ink:#22333b;--muted:#63705f;
 --green:#38a35b;--green-d:#2b8748;--green-l:#5cc27e;
 --blue:#2f7fd6;--blue-d:#2265b1;--blue-l:#6fa9e8;
 --yellow:#f7c948;--coral:#f26d5f;
 --line:#e3d9c4;--mintg:#cfe3c6;
 --tape:rgba(235,221,178,.92);--tape-d:rgba(222,205,152,.9);
 --shadow-ink:rgba(34,51,59,.12);
 /* aliasy původního skinu — teal → zelená, ať zdědí všechno ostatní */
 --teal:var(--green);--teal-d:var(--green-d);--mint:var(--mintg);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Nunito','Inter',sans-serif;color:var(--ink);line-height:1.7;font-size:16.5px;
 background-color:var(--paper);
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E")}
h1,h2,h3,h4{font-family:'Baloo 2','Poppins',sans-serif;font-weight:700;line-height:1.12;letter-spacing:0}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 26px}
.narrow{max-width:920px;margin:0 auto;padding:0 26px}

/* tlačítka = namalované tahy: nerovné rohy, tvrdý ofsetový stín */
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--green);color:#fff;padding:14px 28px;
 border-radius:16px 22px 14px 24px/22px 14px 24px 16px;
 font-family:'Baloo 2';font-weight:700;font-size:15.5px;transition:.18s;border:none;cursor:pointer;
 box-shadow:4px 5px 0 var(--shadow-ink)}
.btn:hover{background:var(--green-d);transform:translate(-2px,-2px) rotate(-1deg);box-shadow:7px 8px 0 var(--shadow-ink)}
.btn.blue{background:var(--blue)}
.btn.blue:hover{background:var(--blue-d)}
.btn.soft{background:var(--soft);color:var(--green-d);box-shadow:4px 5px 0 rgba(56,163,91,.15)}
.btn.soft:hover{background:var(--mintg);box-shadow:7px 8px 0 rgba(56,163,91,.15)}
.btn.line{background:var(--card);color:var(--ink);border:2px solid var(--ink);box-shadow:4px 5px 0 var(--shadow-ink)}
.btn.line:hover{border-color:var(--ink);color:var(--blue-d);box-shadow:7px 8px 0 var(--shadow-ink)}

/* psané akcenty */
.eyebrow{font-family:'Caveat',cursive;text-transform:none;letter-spacing:.01em;font-size:24px;font-weight:700;color:var(--blue-d)}
section{padding:92px 0}
h2.title{font-size:clamp(2rem,4.4vw,3rem);font-weight:800}
.lead{color:var(--muted);font-size:1.1rem}
.center{text-align:center}

/* hravý podtrh štětcem */
.brush-u{position:relative;display:inline-block;white-space:nowrap}
.brush-u::after{content:"";position:absolute;left:-3%;right:-5%;bottom:.02em;height:.38em;z-index:-1;
 border-radius:3px 12px 4px 14px/12px 4px 14px 3px;
 background:linear-gradient(100deg,var(--green-l),var(--blue-l));opacity:.55;transform:rotate(-1.4deg)}

/* topbar */
.topbar{background:var(--ink);border-bottom:none;font-size:13.5px;color:#c9d6cd}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:44px}
.topbar .r{display:flex;gap:22px}.topbar b{color:#fff;font-weight:700}

/* nav */
header.site{position:sticky;top:0;z-index:100;background:rgba(250,246,238,.95);backdrop-filter:blur(10px);border-bottom:2px solid var(--ink)}
.site .wrap{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{font-family:'Baloo 2';font-size:26px;font-weight:800;display:flex;align-items:center;gap:10px;color:var(--ink)}
.brand .dot{width:38px;height:38px;border-radius:12px 15px 11px 16px/15px 11px 16px 12px;background:linear-gradient(135deg,var(--green),var(--blue));display:flex;align-items:center;justify-content:center;transform:rotate(-6deg);box-shadow:3px 4px 0 var(--shadow-ink)}
.brand span{color:var(--green-d)}
.brand .b2{color:var(--blue-d)}
.menu{display:flex;gap:28px;list-style:none;font-size:15.5px;font-weight:700}
.menu a{color:var(--muted);transition:.2s;padding:6px 0;border-bottom:3px solid transparent}
.menu a:hover{color:var(--ink)}
.menu a.active{color:var(--green-d);border-bottom-color:var(--green)}
.nav-r{display:flex;align-items:center;gap:14px}
.burger{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink)}
.mobmenu{display:none}

/* ===== HERO — malovací stěna (zachováno) ===== */
.hero{padding:0;background:var(--paper);overflow:hidden;position:relative}
.hero-wall{position:relative;min-height:620px;display:flex;align-items:center;
 background:
  radial-gradient(1200px 500px at 85% -10%, rgba(111,169,232,.16), transparent 60%),
  radial-gradient(900px 400px at 5% 110%, rgba(92,194,126,.14), transparent 60%),
  var(--paper)}
#heroCanvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.hero-content{position:relative;z-index:5;pointer-events:none;width:100%}
.hero-content .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:70px;padding-bottom:90px}
.hero h1{font-size:clamp(2.5rem,5.4vw,4.1rem);font-weight:800;margin:14px 0 16px}
.hero h1 em{font-style:normal;color:var(--green-d)}
.hero h1 .hb2{color:var(--blue-d)}
.hero p{font-size:1.15rem;color:var(--muted);max-width:480px;margin-bottom:26px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero-cta a,.hero-palette,.hero-hint a{pointer-events:auto}
.hero-cta a{cursor:pointer}
.hero-badges{display:flex;gap:20px;flex-wrap:wrap;margin-top:30px}
.hb{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:700}
.hb .c{width:34px;height:34px;border-radius:46% 54% 52% 48%/54% 46% 54% 46%;background:var(--soft);color:var(--green-d);display:flex;align-items:center;justify-content:center}

/* paleta barev v hero */
.hero-palette{position:absolute;z-index:6;bottom:22px;left:50%;transform:translateX(-50%) rotate(-.5deg);display:flex;gap:10px;align-items:center;
 background:var(--card);border:2px solid var(--ink);border-radius:14px 18px 13px 19px/18px 13px 19px 14px;padding:9px 16px;box-shadow:5px 6px 0 var(--shadow-ink)}
.hero-palette .lbl{font-size:16px;font-weight:700;color:var(--muted);font-family:'Caveat';text-transform:none;letter-spacing:0;margin-right:2px}
.hp-color{width:30px;height:30px;border-radius:46% 54% 50% 50%/52% 48% 54% 46%;border:2px solid #fff;box-shadow:0 0 0 2px var(--line);cursor:pointer;transition:.15s;padding:0}
.hp-color:hover{transform:scale(1.15) rotate(6deg)}
.hp-color.active{box-shadow:0 0 0 3px var(--ink);transform:scale(1.12)}
.hp-clear{background:none;border:none;cursor:pointer;font-size:15px;font-weight:700;color:var(--muted);font-family:'Caveat';padding:4px 6px}
.hp-clear:hover{color:var(--coral)}
.hero-hint{position:absolute;z-index:6;top:18px;right:22px;background:var(--card);border:2px dashed var(--blue);color:var(--blue-d);
 font-family:'Caveat';font-size:17px;font-weight:700;border-radius:4px 14px 5px 15px/14px 5px 15px 4px;padding:6px 14px;pointer-events:none;transform:rotate(1.5deg);animation:hintFloat 3.2s ease-in-out infinite}
@keyframes hintFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1.5deg)}}

/* štětec u kurzoru — špička (levý horní roh obrázku) míří na kurzor,
   násada vede dolů doprava. Kurzor zůstává normální. */
#heroBrush{position:absolute;z-index:7;pointer-events:none;left:0;top:0;will-change:transform;
 transition:opacity .2s;filter:drop-shadow(0 10px 14px rgba(34,51,59,.28))}
#heroBrush img{display:block;width:auto;transform-origin:0 0}
.hero-wall.brush-hidden #heroBrush{opacity:0}

/* výběr šířky stopy */
.hp-size{background:var(--card);border:2px solid var(--line);border-radius:8px 11px 7px 12px/11px 7px 12px 8px;cursor:pointer;
 display:flex;align-items:center;justify-content:center;width:34px;height:30px;transition:.15s;padding:0}
.hp-size span{display:block;background:var(--ink);border-radius:99px}
.hp-size[data-tool="small"] span{width:14px;height:2px}
.hp-size[data-tool="medium"] span{width:16px;height:6px}
.hp-size[data-tool="roller"] span{width:18px;height:13px}
.hp-size:hover{border-color:var(--blue-l)}
.hp-size.active{border-color:var(--ink);background:var(--softb)}
.hero-palette .sep{width:1px;height:22px;background:var(--line);margin:0 4px}

/* ===== trust strip — pruh od válečku ===== */
.trust{background:var(--paper-2);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);position:relative}
.trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.ti{display:flex;gap:14px;align-items:center}
/* volitelný zoom výhody při najetí (zapíná se v Admin > Homepage) */
.trust--zoom .ti{transition:transform .22s cubic-bezier(.34,1.4,.64,1);cursor:default}
.trust--zoom .ti:hover{transform:scale(1.1) rotate(-1deg)}
.ti .ic{width:54px;height:54px;border-radius:42% 58% 55% 45%/58% 42% 58% 42%;background:var(--card);border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:26px;transform:rotate(-4deg);box-shadow:3px 4px 0 var(--shadow-ink)}
.ti:nth-child(even) .ic{transform:rotate(3deg);border-radius:56% 44% 45% 55%/44% 56% 44% 56%}
.ti h4{font-size:1.02rem;font-weight:800}.ti p{font-size:13.5px;color:var(--muted)}

/* ===== services — vzorníky barev ===== */
.sec-head{max-width:660px;margin:0 auto 52px;text-align:center}
.svcs{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.svc{background:var(--card);border:2px solid var(--ink);border-radius:6px 18px 8px 20px/18px 8px 20px 6px;padding:32px 28px;transition:.2s;position:relative;
 box-shadow:6px 7px 0 var(--shadow-ink)}
.svc::before{content:"";position:absolute;top:0;left:0;right:0;height:10px;
 border-radius:4px 16px 0 0/16px 6px 0 0;
 background:linear-gradient(95deg,var(--green-l),var(--green))}
.svc:nth-child(3n+2)::before{background:linear-gradient(95deg,var(--blue-l),var(--blue))}
.svc:nth-child(3n)::before{background:linear-gradient(95deg,var(--yellow),#eab53a)}
.svc:nth-child(odd){transform:rotate(-.4deg)}
.svc:nth-child(even){transform:rotate(.4deg)}
.svc:hover{transform:translate(-3px,-4px) rotate(0);box-shadow:10px 12px 0 var(--shadow-ink)}
.svc .ic{width:58px;height:58px;border-radius:44% 56% 52% 48%/56% 44% 56% 44%;background:var(--soft);display:flex;align-items:center;justify-content:center;margin:8px 0 18px;font-size:28px;transform:rotate(-5deg)}
.svc:nth-child(3n+2) .ic{background:var(--softb)}
.svc h3{font-size:1.35rem;margin-bottom:7px}
.svc p{color:var(--muted);font-size:14.5px}
.svc .price-tag{display:inline-block;margin-top:14px;background:var(--ink);color:var(--yellow);font-weight:800;font-size:13.5px;border-radius:4px 10px 4px 10px/10px 4px 10px 4px;padding:5px 14px;font-family:'Baloo 2';transform:rotate(-1deg)}
.svc .go{margin-top:16px;display:inline-flex;align-items:center;gap:7px;color:var(--green-d);font-weight:800;font-size:14.5px;font-family:'Baloo 2'}
.svc .go::after{content:"→";transition:.2s}
.svc:hover .go::after{transform:translateX(4px)}

/* ===== split — fotka přilepená páskou ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;border:2px solid var(--ink);
 box-shadow:8px 9px 0 var(--shadow-ink);transform:rotate(-1.2deg)}
.split>div:first-child{position:relative}
.split>div:first-child::before,.split>div:first-child::after{content:"";position:absolute;z-index:2;height:30px;width:110px;
 background:linear-gradient(100deg,var(--tape),var(--tape-d));box-shadow:0 2px 5px rgba(34,51,59,.15);opacity:.95}
.split>div:first-child::before{top:-14px;left:8%;transform:rotate(-5deg)}
.split>div:first-child::after{bottom:-12px;right:6%;transform:rotate(4deg)}
.checks{list-style:none;display:grid;gap:16px;margin-top:22px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px}
.checks .ck{flex-shrink:0;width:26px;height:26px;border-radius:46% 54% 50% 50%/52% 48% 54% 46%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;transform:rotate(-4deg)}

/* team (zachováno pro CMS bloky) */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px}
.member{background:var(--card);border:2px solid var(--ink);border-radius:6px;overflow:hidden;transition:.2s;box-shadow:6px 7px 0 var(--shadow-ink)}
.member:hover{transform:translate(-2px,-3px);box-shadow:9px 10px 0 var(--shadow-ink)}
.member img{width:100%;aspect-ratio:1/1;object-fit:cover}
.member .b{padding:22px 24px}
.member h3{font-size:1.25rem}
.member .role{color:var(--blue-d);font-weight:800;font-size:14px;margin-bottom:6px}
.member p{color:var(--muted);font-size:14px}

/* ceník */
.prices{max-width:820px;margin:0 auto;background:var(--card);border:2px solid var(--ink);border-radius:6px 14px 6px 16px/14px 6px 16px 6px;overflow:hidden;box-shadow:7px 8px 0 var(--shadow-ink)}
.prow{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:20px 30px;border-bottom:1px dashed var(--line);transition:.15s}
.prow:last-child{border-bottom:none}.prow:hover{background:var(--soft2)}
.prow .pn{font-family:'Baloo 2';font-weight:700;font-size:1.08rem}
.prow .pd{color:var(--muted);font-size:13.5px;flex:1;margin:0 14px}
.prow .pp{font-family:'Baloo 2';font-weight:800;color:var(--green-d);white-space:nowrap}

/* ===== reviews — lístky přilepené na zdi ===== */
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:52px}
.qc{background:#fdf9e8;border:2px solid var(--ink);border-radius:3px 8px 4px 9px/8px 4px 9px 3px;padding:34px 30px 30px;transition:.2s;position:relative;box-shadow:5px 6px 0 var(--shadow-ink)}
.qc::before{content:"";position:absolute;top:-13px;left:50%;width:96px;height:26px;transform:translateX(-50%) rotate(-3deg);
 background:linear-gradient(100deg,var(--tape),var(--tape-d));box-shadow:0 2px 5px rgba(34,51,59,.15)}
.qc:nth-child(2){background:#eef4fb;transform:rotate(1deg)}
.qc:nth-child(2)::before{transform:translateX(-50%) rotate(2.5deg)}
.qc:nth-child(3n+1){transform:rotate(-.8deg)}
.qc:hover{transform:rotate(0) translateY(-3px)}
.qc .st{color:#f5b301;letter-spacing:2px;margin-bottom:12px}
.qc p{font-size:15px;margin-bottom:16px}
.qc .who{display:flex;align-items:center;gap:12px;font-weight:700;font-family:'Caveat';font-size:20px}
.qc .av{width:42px;height:42px;border-radius:46% 54% 50% 50%/52% 48% 54% 46%;background:var(--mintg);color:var(--green-d);display:flex;align-items:center;justify-content:center;font-family:'Baloo 2';font-size:15px}

/* ===== big CTA — čerstvě natřený flek na zdi ===== */
.bcta{background:linear-gradient(120deg,var(--green) 0%,var(--green-d) 45%,var(--blue-d) 100%);
 border:2px solid var(--ink);border-radius:10px 26px 12px 30px/26px 12px 30px 10px;
 padding:60px 40px;text-align:center;color:#fff;position:relative;box-shadow:9px 10px 0 var(--shadow-ink)}
.bcta::before,.bcta::after{content:"";position:absolute;height:32px;width:120px;z-index:2;
 background:linear-gradient(100deg,var(--tape),var(--tape-d));box-shadow:0 2px 5px rgba(34,51,59,.2)}
.bcta::before{top:-16px;left:7%;transform:rotate(-6deg)}
.bcta::after{top:-16px;right:7%;transform:rotate(5deg)}
.bcta h2{color:#fff;font-size:clamp(1.8rem,4vw,2.7rem);position:relative}
.bcta p{color:#e7f6ec;max-width:520px;margin:14px auto 26px;position:relative}
.bcta .btn{background:#fff;color:var(--green-d);position:relative;box-shadow:4px 5px 0 rgba(0,0,0,.25)}
.bcta .btn:hover{background:var(--yellow);color:var(--ink);box-shadow:7px 8px 0 rgba(0,0,0,.25)}

/* pagehead */
.pagehead{background:var(--paper-2);text-align:center;padding:70px 0 60px;border-bottom:2px solid var(--ink);position:relative;overflow:hidden}
.pagehead h1{font-size:clamp(2.4rem,5.5vw,3.5rem);font-weight:800;margin-top:12px}
.pagehead p{color:var(--muted);max-width:620px;margin:12px auto 0}

/* ===== kalkulačka ===== */
.calc-grid{display:grid;grid-template-columns:1fr 400px;gap:32px;align-items:start}
.calc-card{background:var(--card);border:2px solid var(--ink);border-radius:6px 16px 8px 18px/16px 8px 18px 6px;padding:34px;box-shadow:7px 8px 0 var(--shadow-ink)}
.calc-card h3{font-size:1.35rem;margin-bottom:4px;display:flex;align-items:center;gap:10px}
.calc-step{font-family:'Caveat';font-weight:700;font-size:21px;letter-spacing:0;text-transform:none;color:var(--blue-d);margin:26px 0 8px}
.calc-step:first-of-type{margin-top:18px}
.calc-dims{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.calc-field label{display:block;font-size:13.5px;font-weight:800;margin-bottom:5px;color:var(--ink)}
.calc-field input[type=number],.calc-field input[type=text],.calc-field input[type=email],.calc-field input[type=tel],.calc-field textarea{
 width:100%;padding:12px 14px;border:2px solid var(--ink);border-radius:8px 12px 8px 13px/12px 8px 13px 8px;background:#fff;font-family:'Nunito';font-size:15.5px;font-weight:600;color:var(--ink);transition:.15s;box-shadow:2px 3px 0 var(--shadow-ink)}
.calc-field input:focus,.calc-field textarea:focus{outline:none;border-color:var(--green-d);box-shadow:2px 3px 0 rgba(56,163,91,.35)}
.calc-extras{display:grid;gap:9px}
.calc-extra{display:flex;align-items:center;gap:11px;background:var(--soft2);border:2px solid transparent;border-radius:8px 13px 8px 14px/13px 8px 14px 8px;padding:11px 14px;cursor:pointer;transition:.15s;font-size:14.5px;font-weight:700}
.calc-extra:hover{border-color:var(--ink)}
.calc-extra input{width:19px;height:19px;accent-color:var(--green);flex-shrink:0}
.calc-extra .xp{margin-left:auto;color:var(--blue-d);font-family:'Baloo 2';font-weight:800;white-space:nowrap;font-size:13.5px}
.calc-check{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:700;cursor:pointer;margin-top:10px}
.calc-check input{width:19px;height:19px;accent-color:var(--blue)}

/* souhrn kalkulačky — tmavá tabule */
.calc-sum{position:sticky;top:100px;background:#22333b;border:2px solid var(--ink);border-radius:8px 16px 8px 18px/16px 8px 18px 8px;color:#fff;padding:32px;overflow:hidden;box-shadow:7px 8px 0 var(--shadow-ink)}
.calc-sum h3{color:#fff;font-size:1.3rem;margin-bottom:16px;display:flex;align-items:center;gap:9px}
.calc-sum .rows{display:grid;gap:9px;font-size:14.5px}
.calc-sum .row{display:flex;justify-content:space-between;gap:14px;color:#cfe3ea}
.calc-sum .row b{color:#fff;white-space:nowrap}
.calc-sum .row.small{font-size:13px;color:#9fbecb}
.calc-sum hr{border:none;border-top:1px dashed rgba(255,255,255,.25);margin:14px 0}
.calc-sum .total{display:flex;justify-content:space-between;align-items:baseline;font-family:'Baloo 2'}
.calc-sum .total .tl{font-size:15px;font-weight:700;color:#cfe3ea}
.calc-sum .total .tv{font-size:2rem;font-weight:800;color:var(--yellow)}
.calc-sum .note{font-size:12px;color:#9fbecb;margin-top:10px;line-height:1.5}
.calc-travel-res{margin-top:8px;font-size:13.5px;font-weight:700;border-radius:8px;padding:9px 12px;background:rgba(255,255,255,.08)}
.calc-travel-res.ok{color:#8fe3ab}
.calc-travel-res.warn{color:#ffd88a}
.calc-travel-res.err{color:#ff9d94}
.calc-addr-row{display:flex;gap:9px}
.calc-addr-row input{flex:1}
.calc-addr-row .btn{padding:10px 18px;font-size:14px;flex-shrink:0}

/* benefity pod kalkulačkou — čistota, poctivost, zkušenosti */
.calc-benefits{margin-top:26px;background:var(--paper-2);border:2px solid var(--ink);border-radius:6px 14px 8px 16px/14px 8px 16px 6px;padding:28px 30px;box-shadow:5px 6px 0 var(--shadow-ink)}
.calc-benefits h3{font-size:1.2rem;margin-bottom:16px}
.cb-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cb{display:flex;gap:12px;align-items:flex-start}
.cb .ic{flex-shrink:0;width:46px;height:46px;border-radius:44% 56% 52% 48%/56% 44% 56% 44%;background:var(--card);border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;transform:rotate(-4deg);box-shadow:2px 3px 0 var(--shadow-ink)}
.cb b{display:block;font-size:14.5px;margin-bottom:2px}
.cb p{font-size:13px;color:var(--muted);line-height:1.55}
@media(max-width:700px){.cb-grid{grid-template-columns:1fr}}

/* poptávkový formulář uvnitř tmavého souhrnu */
.calc-sum-form{margin-top:18px;border-top:1px dashed rgba(255,255,255,.25);padding-top:16px;position:relative}
.calc-sum-form .cf-head{font-family:'Baloo 2';font-weight:700;font-size:14.5px;color:#fff;margin-bottom:12px}
.calc-sum-form .calc-field{margin-bottom:10px}
.calc-sum-form .calc-field label{color:#cfe3ea;font-size:12.5px;margin-bottom:4px}
.calc-sum-form .calc-field input,.calc-sum-form .calc-field textarea{
 background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.2);color:#fff;padding:10px 12px;font-size:14.5px;box-shadow:none}
.calc-sum-form .calc-field input::placeholder,.calc-sum-form .calc-field textarea::placeholder{color:rgba(255,255,255,.35)}
.calc-sum-form .calc-field input:focus,.calc-sum-form .calc-field textarea:focus{border-color:var(--green-l);box-shadow:0 0 0 4px rgba(92,194,126,.2)}

/* ===== reference — fotky přilepené páskou ===== */
.refs{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 28px}
.refc{background:var(--card);border:2px solid var(--ink);border-radius:4px;overflow:visible;transition:.2s;position:relative;
 box-shadow:6px 7px 0 var(--shadow-ink);padding:12px 12px 0}
.refc:nth-child(odd){transform:rotate(-.9deg)}
.refc:nth-child(even){transform:rotate(.9deg)}
.refc::before{content:"";position:absolute;top:-13px;left:50%;width:104px;height:27px;transform:translateX(-50%) rotate(-2.5deg);z-index:3;
 background:linear-gradient(100deg,var(--tape),var(--tape-d));box-shadow:0 2px 5px rgba(34,51,59,.15)}
.refc:nth-child(even)::before{transform:translateX(-50%) rotate(2.5deg)}
.refc:hover{transform:rotate(0) translateY(-5px);box-shadow:9px 11px 0 var(--shadow-ink)}
.refc .im{aspect-ratio:4/3;overflow:hidden;position:relative;border:1px solid var(--line)}
.refc .im img{width:100%;height:100%;object-fit:cover;transition:.35s}
.refc:hover .im img{transform:scale(1.05)}
.refc .im.ph{display:flex;align-items:center;justify-content:center;font-size:52px}
.refc .b{padding:16px 12px 20px}
.refc h3{font-size:1.2rem;margin-bottom:5px}
.refc p{color:var(--muted);font-size:14px}
.refc .chip{position:absolute;top:22px;left:22px;width:26px;height:26px;border-radius:46% 54% 50% 50%/52% 48% 54% 46%;border:3px solid #fff;box-shadow:0 4px 10px rgba(34,51,59,.25);z-index:2}

/* lightbox referencí — zvětší se celá kartička i s rámečkem a páskou */
.refc .im{cursor:zoom-in}
.ref-lb{position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:34px;background:rgba(23,40,46,.72);backdrop-filter:blur(4px)}
.ref-lb.open{display:flex}
.ref-lb .lb-card{background:var(--card);border:2px solid var(--ink);border-radius:4px;box-shadow:12px 14px 0 rgba(0,0,0,.3);padding:14px 14px 0;max-width:min(940px,94vw);position:relative;transform:rotate(-.6deg);animation:lbPop .28s cubic-bezier(.34,1.4,.64,1)}
.ref-lb .lb-card::before{content:"";position:absolute;top:-14px;left:50%;width:120px;height:30px;transform:translateX(-50%) rotate(-2.5deg);z-index:3;background:linear-gradient(100deg,var(--tape),var(--tape-d));box-shadow:0 2px 5px rgba(34,51,59,.2)}
.ref-lb .lb-im{border:1px solid var(--line);overflow:hidden}
.ref-lb .lb-im img{display:block;max-width:100%;max-height:calc(92vh - 170px);object-fit:contain}
.ref-lb .lb-b{padding:14px 8px 18px}
.ref-lb .lb-b h3{font-size:1.3rem;margin-bottom:4px}
.ref-lb .lb-b p{color:var(--muted);font-size:14.5px;max-width:640px;margin:0}
.ref-lb .lb-chip{position:absolute;top:24px;left:24px;width:30px;height:30px;border-radius:46% 54% 50% 50%/52% 48% 54% 46%;border:3px solid #fff;box-shadow:0 4px 10px rgba(34,51,59,.3);z-index:2}
.ref-lb .lb-close{position:absolute;top:-18px;right:-18px;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;border:2px solid #fff;font-size:20px;cursor:pointer;line-height:1;box-shadow:3px 4px 0 rgba(0,0,0,.3);transition:.15s;z-index:4}
.ref-lb .lb-close:hover{transform:rotate(90deg);background:var(--coral)}
@keyframes lbPop{from{transform:scale(.8) rotate(-4deg);opacity:0}to{transform:scale(1) rotate(-.6deg);opacity:1}}
@media(max-width:700px){.ref-lb{padding:16px}.ref-lb .lb-close{top:-14px;right:-14px}}

/* kontakt */
.ksplit{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.kinfo{display:grid;gap:22px}
.ki{display:flex;gap:16px;align-items:flex-start}
.ki .kc{flex-shrink:0;width:48px;height:48px;border-radius:44% 56% 52% 48%/56% 44% 56% 44%;background:var(--card);border:2px solid var(--ink);color:var(--green-d);display:flex;align-items:center;justify-content:center;font-size:21px;transform:rotate(-4deg);box-shadow:3px 4px 0 var(--shadow-ink)}
.ki h4{font-size:.98rem;font-weight:800}.ki p{color:var(--muted);font-size:15px}
.kform{display:grid;gap:14px}
.kform input,.kform select,.kform textarea{width:100%;padding:14px 16px;border:2px solid var(--ink);border-radius:8px 12px 8px 13px/12px 8px 13px 8px;background:#fff;font-family:'Nunito';font-size:15px;font-weight:600;resize:vertical;box-shadow:2px 3px 0 var(--shadow-ink)}
.kform input:focus,.kform select:focus,.kform textarea:focus{outline:none;border-color:var(--green-d);box-shadow:2px 3px 0 rgba(56,163,91,.35)}
.mapwrap{height:420px;border-top:2px solid var(--ink)}
.mapwrap iframe{width:100%;height:100%;border:0}

/* ===== footer — kapající horní okraj ===== */
.foot{background:#1b2a31;color:#a5c0cb;padding:76px 0 30px;position:relative;margin-top:26px}
.foot::before{content:"";position:absolute;top:-21px;left:0;right:0;height:22px;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='22' viewBox='0 0 140 22'%3E%3Cpath fill='%231b2a31' d='M0 22 L0 10 C8 4 16 4 24 10 C30 14 38 14 44 10 C52 3 62 3 70 10 L70 12 C74 21 78 21 82 12 L82 10 C90 4 100 4 108 10 C116 15 124 15 132 10 L140 6 L140 22 Z'/%3E%3C/svg%3E") repeat-x;background-size:auto 22px}
.foot .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px}
.foot .brand{color:#fff;margin-bottom:12px}
.foot h4{font-family:'Caveat';color:#7fd6a0;font-size:1.45rem;margin-bottom:14px}
.foot a{color:#a5c0cb}.foot a:hover{color:#fff}
.foot ul{list-style:none;display:grid;gap:9px;font-size:14.5px}
.copy{border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:22px;text-align:center;font-size:13px;opacity:.7}

@media(max-width:900px){
 .hero-content .wrap,.split,.ksplit,.foot .cols,.calc-grid{grid-template-columns:1fr}
 .svcs,.team,.revs,.refs{grid-template-columns:1fr}
 .trust .wrap{grid-template-columns:1fr 1fr}
 .topbar .r{display:none}
 .menu{display:none}.burger{display:block}
 .site .wrap{height:auto;min-height:62px;padding:10px 20px}
 .brand{font-size:21px;gap:7px}
 .brand .dot{width:32px;height:32px}
 .nav-r .btn{display:none}
 .mobmenu.open{display:flex;flex-direction:column;gap:2px;background:var(--paper);border-top:1px solid var(--line);padding:10px 20px}
 .mobmenu.open a{padding:12px 26px;font-weight:700}
 section{padding:64px 0}
 .hero-wall{min-height:560px;cursor:auto}
 #heroBrush{display:none}
 /* na mobilu se nemaluje — jen animace smajlíků na pozadí */
 .hero-palette,.hero-hint{display:none}
 #heroCanvas{touch-action:auto;pointer-events:none}
 .calc-dims{grid-template-columns:1fr}
 .calc-sum{position:static}
 .svc:nth-child(odd),.svc:nth-child(even),.refc:nth-child(odd),.refc:nth-child(even){transform:rotate(0)}
 /* iOS zoomuje na inputy s písmem < 16px a už se nevrátí — držet 16px */
 input,select,textarea{font-size:16px!important}
}

/* ===== mapování tokenů pro CMS podstránky (pagebuilder, blog, kontakt) ===== */
:root{
 --bg-1:#faf6ee;--bg-2:#fffdf7;--bg-3:#f4ecdd;--bg-4:#efe6d4;--bg-dark:#1b2a31;--bg-dark-2:#22333b;
 --line-strong:#22333b;--fg-0:#22333b;--fg-1:#31434c;--fg-2:#63705f;--fg-on-dark:#fff;--fg-on-dark-2:#bfd8d3;
 --red:#38a35b;--red-hot:#2b8748;--red-deep:#2265b1;--red-tint:rgba(56,163,91,.12);--red-glow:rgba(56,163,91,.25);
 --primary:#38a35b;--primary-dark:#2b8748;--primary-light:#5cc27e;--primary-rgb:56,163,91;--primary-tint:rgba(56,163,91,.10);
 --font-display:'Baloo 2',sans-serif;--font-body:'Nunito',sans-serif;--font-mono:'JetBrains Mono',monospace;
 --r-pill:14px;
}
main{display:block}
.container{max-width:1140px;margin:0 auto;padding:0 22px}
.btn-primary{background:var(--green);color:#fff;border-radius:14px 18px 13px 19px/18px 13px 19px 14px;box-shadow:4px 5px 0 var(--shadow-ink)}
.btn-primary:hover{background:var(--green-d)}
h1,h2,h3{font-family:'Baloo 2',sans-serif;font-style:normal}

/* kontaktní formulář — výrazná pole */
.cf-input,.cf-textarea,.cf-select,
input.cf-input,textarea.cf-textarea,select.cf-select{
  background:#fff!important;border:2px solid var(--ink)!important;border-radius:10px!important;
  padding:13px 16px!important;color:var(--ink)!important;
  box-shadow:2px 3px 0 var(--shadow-ink)!important;transition:border-color .15s, box-shadow .15s}
.cf-input::placeholder,.cf-textarea::placeholder{color:#9aa694}
.cf-input:hover,.cf-textarea:hover,.cf-select:hover{border-color:var(--green-d)!important}
.cf-input:focus,.cf-textarea:focus,.cf-select:focus{outline:none!important;border-color:var(--green)!important;box-shadow:2px 3px 0 rgba(56,163,91,.35)!important}
.contact-grid label,.cf-label{color:var(--ink)!important;font-weight:800!important;font-size:14px!important}

/* page hero podstránek */
.page-hero{background:var(--paper-2)!important;text-align:center;padding:70px 0 60px!important;border-bottom:2px solid var(--ink);color:var(--ink)!important}
.page-hero .page-hero-h1,.page-hero h1{font-size:clamp(2.4rem,5.5vw,3.5rem)!important;font-weight:800!important;margin-top:12px;color:var(--ink)!important;font-style:normal!important;text-transform:none!important}
.page-hero .page-hero-eyebrow{font-family:'Caveat',cursive;text-transform:none;letter-spacing:0;font-size:23px;font-weight:700;color:var(--blue-d)!important;justify-content:center}
.page-hero .page-hero-dot{background:var(--green)!important}
.page-hero p{color:var(--muted)!important;max-width:560px;margin:12px auto 0}
.page-hero .page-hero-lead{color:var(--muted)!important;max-width:560px;margin:12px auto 0!important;font-size:1.02rem}