:root{--forest:#1f4d2b;--forest2:#2d6a3e;--lake:#3a7ca5;--lake2:#a8d0e6;--wood:#8b5a2b;--wood2:#c8955a;--cream:#faf5ea;--ink:#1e261f;--red:#b5303a}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,"Segoe UI",Roboto,sans-serif;background:var(--cream);color:var(--ink);line-height:1.5}
a{color:var(--forest2)}img{max-width:100%}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:3px solid var(--lake);outline-offset:2px}
header{background:var(--forest);color:#fff;position:sticky;top:0;z-index:5;box-shadow:0 2px 8px #0003}
.hwrap{max-width:1100px;margin:auto;display:flex;align-items:center;gap:1rem;padding:.7rem 1rem}
.logo{color:#fff;text-decoration:none;font-weight:800;font-size:1.35rem;letter-spacing:.5px}.logo small{display:block;font-weight:400;font-size:.7rem;opacity:.8}
nav.main{margin-left:auto;display:flex;gap:1rem;align-items:center}nav.main a{color:#fff;text-decoration:none}
.cartlink{position:relative;background:var(--wood);padding:.45rem .8rem;border-radius:8px}
.badge{background:var(--red);color:#fff;border-radius:99px;padding:0 .45rem;font-size:.8rem;margin-left:.3rem;font-weight:700}
.folk{height:12px;background:repeating-linear-gradient(45deg,var(--red) 0 6px,transparent 6px 12px),repeating-linear-gradient(-45deg,var(--wood2) 0 6px,var(--cream) 6px 12px)}
main{max-width:1100px;margin:auto;padding:1.2rem 1rem 3rem}
.hero{border-radius:16px;overflow:hidden;color:#fff;padding:3rem 1.5rem;position:relative;background:linear-gradient(180deg,#0000 55%,#1f4d2bcc),linear-gradient(180deg,var(--lake2),var(--lake) 60%,var(--forest2) 61%,var(--forest));min-height:280px;display:flex;flex-direction:column;justify-content:flex-end}
.hero::before{content:"";position:absolute;inset:auto 0 38% 0;height:90px;background:radial-gradient(30px 60px at 5% 100%,var(--forest) 98%,#0000),radial-gradient(40px 80px at 18% 100%,var(--forest) 98%,#0000),radial-gradient(30px 70px at 32% 100%,var(--forest) 98%,#0000),radial-gradient(45px 90px at 60% 100%,var(--forest) 98%,#0000),radial-gradient(30px 60px at 78% 100%,var(--forest) 98%,#0000),radial-gradient(40px 85px at 94% 100%,var(--forest) 98%,#0000)}
.hero h1{margin:0;font-size:clamp(1.8rem,5vw,3rem);text-shadow:0 2px 6px #0007;position:relative}.hero p{position:relative;max-width:520px;text-shadow:0 1px 4px #0008}
.wood{background:repeating-linear-gradient(90deg,#8b5a2b 0 3px,#9a6633 3px 9px,#7e5126 9px 11px,#a06b38 11px 20px);color:#fff;border-radius:12px;padding:.6rem 1rem;display:inline-block;margin:2rem 0 1rem}
h2.wood,h1.wood{font-size:1.3rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem}
.tile{background:linear-gradient(160deg,var(--bg),#fff8);border:3px solid var(--wood);border-radius:14px;padding:1.2rem;text-decoration:none;color:var(--ink);font-weight:700;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem;transition:transform .15s}
.tile:hover{transform:translateY(-3px)}.ic{font-size:2.6rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.card{background:#fff;border-radius:14px;padding:.8rem;box-shadow:0 2px 6px #0001;border-bottom:4px solid var(--wood2);display:flex;flex-direction:column}
.card h3{font-size:1rem;margin:.6rem 0 0}.card h3 a{color:var(--ink);text-decoration:none}.unit{color:#666;font-size:.85rem;margin:.2rem 0 .6rem}
.row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-top:auto}.row.end{justify-content:flex-end;flex-wrap:wrap;margin-top:1rem}
.img{background:radial-gradient(circle at 30% 30%,#fff9,#0000 60%),var(--bg);border-radius:10px;aspect-ratio:4/3;display:grid;place-items:center;font-size:3.5rem}
.img.big{font-size:8rem;border:4px solid var(--wood)}.img.mini{width:64px;font-size:2rem;aspect-ratio:1}
.btn{background:var(--forest2);color:#fff;border:0;border-radius:8px;padding:.7rem 1.1rem;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;font-size:1rem}
.btn:hover{background:var(--forest)}.btn.sm{padding:.45rem .7rem;font-size:.85rem}.btn.ghost{background:#fff;color:var(--forest);border:2px solid var(--forest2)}
.crumbs{font-size:.9rem;margin-bottom:1rem}.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.price{font-size:1.8rem;font-weight:800;color:var(--wood)}
.qty{display:flex;align-items:center;gap:.3rem;margin:1rem 0}.qty input{width:60px;padding:.55rem;text-align:center;border:2px solid #ccc;border-radius:8px;font-size:1rem}.qty .btn{padding:.45rem .8rem}
.panel{background:#fff;border-radius:14px;padding:1.2rem;box-shadow:0 2px 6px #0001}
.line{display:grid;grid-template-columns:64px 1fr auto auto auto;gap:.8rem;align-items:center;padding:.7rem 0;border-bottom:1px dashed #ccc}
.ln{display:flex;flex-direction:column}.ln small{color:#666}.qty.qty{margin:0}.rm{background:none;border:0;color:var(--red);font-size:1.2rem;cursor:pointer;padding:.4rem}
.sum{display:flex;justify-content:space-between;font-size:1.3rem;padding:1rem 0;border-top:3px solid var(--wood2);margin-top:.6rem}
.cols{display:grid;grid-template-columns:3fr 2fr;gap:1.5rem}form label{display:block;font-weight:600;margin:.7rem 0 .2rem}
form input[type=text],form input[type=tel],form input[type=email]{width:100%;padding:.6rem;border:2px solid #ccc;border-radius:8px;font-size:1rem}
fieldset{border:2px solid var(--wood2);border-radius:10px;margin-top:1rem}fieldset label{font-weight:400}
.done{text-align:center}.ok{font-size:3rem;color:#fff;background:var(--forest2);width:80px;height:80px;border-radius:50%;display:grid;place-items:center;margin:auto}.note{color:#666;font-size:.9rem}
.empty{padding:2rem;text-align:center}
footer{background:var(--forest);color:#dfe;text-align:center;padding:1.5rem;font-size:.9rem}
#toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,100px);background:var(--ink);color:#fff;padding:.7rem 1.2rem;border-radius:99px;transition:.25s;opacity:0}#toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:700px){.pgrid,.cols{grid-template-columns:1fr}.img.big{font-size:5rem}nav.main a:not(.cartlink){display:none}
.line{grid-template-columns:56px 1fr auto;}.line .qty{grid-column:2}.line .lt{grid-column:3;grid-row:2}.rm{grid-column:3;grid-row:1}.grid{grid-template-columns:repeat(2,1fr)}.tiles{grid-template-columns:repeat(2,1fr)}}
.logo{display:flex;align-items:center;gap:.6rem;font-family:Georgia,serif}.logo img{border-radius:50%;background:#f6efe2;border:2px solid #c8955a}
.hlogo{position:absolute;right:1.5rem;top:1.5rem;width:190px;height:190px;border-radius:50%;border:4px solid #c8955a;box-shadow:0 4px 14px #0005;z-index:1}
.hero h1,.hero p{max-width:calc(100% - 220px)}
@media(max-width:700px){.hlogo{position:relative;right:auto;top:auto;width:130px;height:130px;margin:0 auto 1rem}.hero h1,.hero p{max-width:none}.logo{font-size:1.05rem}.logo img{width:44px;height:44px}}
.catnav{background:linear-gradient(#2d6a3e,#245a33);border-top:1px solid #ffffff22;border-bottom:3px solid var(--wood2)}
.cwrap{max-width:1100px;margin:auto;padding:0 1rem}
.catnav ul{list-style:none;margin:0;padding:0;display:flex;gap:.25rem;justify-content:space-between}
.catnav a{display:block;color:#fff;text-decoration:none;padding:.55rem .7rem;border-radius:8px;font-size:.92rem;font-weight:600;white-space:nowrap}
.catnav a:hover,.catnav a[aria-current]{background:#f6efe2;color:var(--forest)}
.burger{display:none;background:none;border:0;color:#fff;font-weight:700;font-size:1rem;padding:.6rem 0;cursor:pointer;align-items:center;gap:.6rem}
.bars,.bars::before,.bars::after{display:block;width:22px;height:3px;background:#fff;border-radius:2px;position:relative;transition:.2s}
.bars::before,.bars::after{content:"";position:absolute}.bars::before{top:-7px}.bars::after{top:7px}
.open .bars{background:transparent}.open .bars::before{top:0;transform:rotate(45deg)}.open .bars::after{top:0;transform:rotate(-45deg)}
@media(max-width:960px){.burger{display:flex}.catnav ul{display:none;flex-direction:column;padding-bottom:.6rem}.catnav.open ul{display:flex}.catnav a{padding:.75rem;border-bottom:1px solid #ffffff1a}}
/* === Paleta pastelowa (z logo) === */
:root{--forest:#2f5d3a;--forest2:#3f7350;--ink:#2a2a24;--cream:#f8f3e8;--sage:#dce9d5;--sage2:#c3d9bb;--lakep:#d6e8f1;--woodp:#ead7bd;--woodb:#b98a5e;--brown:#6b4a2e}
body{background:var(--cream)}
header{background:#fbf7ef;color:var(--ink);box-shadow:0 2px 10px #6b4a2e22}
.logo,nav.main a{color:var(--forest)}.logo small{color:var(--brown);opacity:1}
.cartlink{background:var(--woodp);color:var(--brown)!important;border:1px solid var(--woodb)}.badge{background:#c9655b}
.folk{background:repeating-linear-gradient(45deg,#d9a89c 0 6px,transparent 6px 12px),repeating-linear-gradient(-45deg,var(--woodp) 0 6px,var(--cream) 6px 12px)}
.catnav{background:var(--sage);border-top:1px solid var(--sage2);border-bottom:3px solid var(--woodp)}
.catnav a{color:var(--forest)}.catnav a:hover,.catnav a[aria-current]{background:#fff;color:var(--forest);box-shadow:inset 0 -2px 0 var(--woodb)}
.burger{color:var(--forest)}.bars,.bars::before,.bars::after{background:var(--forest)}.open .bars{background:transparent}
@media(max-width:960px){.catnav a{border-bottom:1px solid var(--sage2)}}
.hero{color:var(--ink);background:linear-gradient(180deg,#0000 55%,#f8f3e8aa),linear-gradient(180deg,#eef6fa,var(--lakep) 60%,#cfe2c8 61%,var(--sage2))}
.hero::before{background:radial-gradient(30px 60px at 5% 100%,#a9c9a0 98%,#0000),radial-gradient(40px 80px at 18% 100%,#a9c9a0 98%,#0000),radial-gradient(30px 70px at 32% 100%,#a9c9a0 98%,#0000),radial-gradient(45px 90px at 60% 100%,#a9c9a0 98%,#0000),radial-gradient(30px 60px at 78% 100%,#a9c9a0 98%,#0000),radial-gradient(40px 85px at 94% 100%,#a9c9a0 98%,#0000)}
.hero h1{color:var(--forest);text-shadow:0 1px 0 #fff8}.hero p{text-shadow:none;color:var(--ink)}
.hlogo{border-color:var(--woodp);box-shadow:0 4px 14px #6b4a2e33}
.wood{background:repeating-linear-gradient(90deg,#ead7bd 0 3px,#e4cdae 3px 9px,#efdfc8 9px 11px,#e7d2b4 11px 20px);color:var(--brown);border:1px solid #d9bf9c}
.tile{border-color:var(--woodp);background:linear-gradient(160deg,color-mix(in srgb,var(--bg) 35%,#fff),#fff)}
.card{border-bottom-color:var(--woodp);box-shadow:0 2px 8px #6b4a2e14}
.img{background:radial-gradient(circle at 30% 30%,#fffc,#0000 60%),color-mix(in srgb,var(--bg) 30%,#fff)}.img.big{border-color:var(--woodp)}
.btn{background:var(--sage2);color:var(--forest);border:1px solid #a9c9a0}.btn:hover{background:#b3cfaa;color:var(--forest)}
.btn.ghost{background:#fff;color:var(--forest);border:2px solid var(--sage2)}
.price{color:var(--brown)}.sum{border-top-color:var(--woodp)}.rm{color:#b5574d}fieldset{border-color:var(--woodp)}
.ok{background:var(--sage2);color:var(--forest)}
footer{background:var(--sage);color:var(--forest);border-top:3px solid var(--woodp)}
#toast{background:var(--forest)}

/* tlo ecru z logo */
:root{--cream:#f5ebe1}body{background:#f5ebe1}
header,.hero{background-color:#f5ebe1}header{background:#f5ebe1}.card,.panel{background:#fbf5ee}.tile{background:linear-gradient(160deg,color-mix(in srgb,var(--bg) 30%,#f5ebe1),#fbf5ee)}html{background:#f5ebe1}