@font-face{font-family:"Bricolage Grotesque";src:url(../font/bricolage-grotesque-latin-ext.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bricolage Grotesque";src:url(../font/bricolage-grotesque-latin.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Sans";src:url(../font/instrument-sans-latin-ext.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Sans";src:url(../font/instrument-sans-latin.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --tma:#010107;--tma-linka:#303037;--text:#17171b;--tlmeny:#66666e;--svetly:#b9b9c2;--svetlejsi:#d5d5dc;
  --plocha:#f4f4f6;--linka:#dedee3;--akcia:#dc2a2a;--akcia-text:#c82323;
  --okraj:80px;--nadpis:"Bricolage Grotesque",system-ui,sans-serif;--telo:"Instrument Sans",system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--text);font:400 16px/1.5 var(--telo);overflow-wrap:break-word}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
h1,h2,p{margin:0}
h1,h2{font-family:var(--nadpis);font-weight:600;text-wrap:balance}
address{font-style:normal}
:focus-visible{outline:3px solid var(--akcia);outline-offset:3px}
.preskok{position:absolute;left:16px;top:-60px;padding:10px 16px;background:#fff;color:var(--text);z-index:2}
.preskok:focus{top:12px}

.hlavicka{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:100px;padding:0 var(--okraj);background:var(--tma);color:#fff}
.znacka{font:600 24px/1.2 var(--nadpis)}
.navigacia{display:flex;align-items:center;gap:36px;color:var(--svetly)}
.navigacia a{display:inline-flex;align-items:center;gap:8px;min-height:44px;transition:color .15s}
.navigacia a:hover,.navigacia a[aria-current]{color:#fff}
.pocet{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:24px;background:var(--tma-linka);color:#fff;font-size:14px}
.pocet.plna{background:var(--akcia)}

.akcia{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 24px;border-radius:100px;background:var(--akcia);color:#fff;font-weight:600;transition:background .15s}
.akcia:hover{background:var(--akcia-text)}

.uvod{display:flex;align-items:center;gap:64px;padding:40px var(--okraj) 64px;background:var(--tma);color:#fff}
.uvod-text{flex:1 1 0;min-width:0}
.uvod h1{font-size:64px;line-height:1.08;letter-spacing:-1.5px}
.uvod p{margin:28px 0;color:var(--svetlejsi);font-size:20px}
.uvod-foto{flex:0 0 auto;width:min(624px,46%);aspect-ratio:624/452;object-fit:cover;border-radius:12px}

.veta{display:flex;align-items:flex-start;gap:80px;padding:72px var(--okraj)}
.veta-popis{flex:0 0 260px;color:var(--tlmeny);font-size:18px}
.veta-text{flex:1;font:500 34px/1.3 var(--nadpis);letter-spacing:-.5px;text-wrap:balance}

.sekcia{padding:80px var(--okraj)}
.sekcia h2{font-size:42px;line-height:1.15;letter-spacing:-.8px}
.sekcia-uvod{margin-bottom:32px}
.sekcia-uvod p{margin-top:12px;color:var(--tlmeny)}

.temy{padding-top:8px}
.temy-hlavne,.temy-dalsie{display:grid;gap:24px}
.temy-hlavne{grid-template-columns:repeat(2,1fr);margin-bottom:40px}
.temy-dalsie{grid-template-columns:repeat(3,1fr)}
.tema{display:block}
.tema img{width:100%;object-fit:cover;border-radius:12px;transition:opacity .15s}
.tema:hover img{opacity:.88}
.temy-hlavne img{height:320px}
.temy-dalsie img{height:240px}
.tema-info{display:flex;justify-content:space-between;gap:16px;margin-top:16px}
.tema-info strong{display:block;font:600 26px/1.2 var(--nadpis)}
.tema-info small{display:block;margin-top:4px;color:var(--tlmeny);font-size:16px}
.tema-info b{font-size:18px;font-weight:600;white-space:nowrap}

.saten{padding:64px var(--okraj);background:var(--plocha)}
.saten-zoznam{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.saten-zoznam a{display:block}
.saten-zoznam img{width:100%;height:170px;object-fit:cover;border-radius:12px}
.saten-zoznam a>span{display:block;margin-top:16px}
.farba{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600}
.farba i{flex:none;width:14px;height:14px;border-radius:50%}
.saten-zoznam small{display:block;margin-top:4px;color:var(--tlmeny);font-size:16px}

.ponuka-prehlad{display:flex;align-items:center;gap:100px;margin-top:32px}
.kategorie{flex:1 1 0;min-width:0;border-bottom:1px solid var(--linka)}
.kategorie li{border-top:1px solid var(--linka)}
.kategorie a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;font:500 28px/1.2 var(--nadpis);transition:color .15s}
.kategorie a.aktivna,.kategorie a:hover{color:var(--akcia-text)}
.kategorie small{color:var(--tlmeny);font:400 18px var(--telo)}
.kategoria-foto{flex:1 1 0;min-width:0;height:414px;object-fit:cover;border-radius:12px}

.obal{padding:56px var(--okraj) 80px}
.obal-detail{padding-top:40px}
.omrvinky{color:var(--tlmeny)}
.omrvinky a:hover{color:var(--text)}
.hlava-stranky{display:grid;gap:16px;margin-bottom:48px}
.hlava-stranky h1,.detail-info h1,.stav h1,.obsah-kolekcie h2{font-size:42px;line-height:1.15;letter-spacing:-.8px}
.hlava-stranky p{color:var(--tlmeny)}
[hidden]{display:none!important}

.katalog{display:flex;align-items:flex-start;gap:56px}
.filter{flex:0 0 220px}
.filter-nadpis{margin-bottom:8px;font-size:18px;font-weight:600}
.filter ul{display:grid;gap:4px}
.filter a{display:flex;justify-content:space-between;gap:12px;min-height:44px;padding:12px 16px;border-radius:8px;transition:background .15s}
.filter a:hover{background:var(--plocha)}
.filter a[aria-current]{background:var(--tma);color:#fff}
.filter small{color:var(--tlmeny);font-size:16px}
.filter a[aria-current] small{color:var(--svetly)}
.vypis{flex:1;min-width:0}
.vypis-pocet{margin-bottom:24px;color:var(--tlmeny)}
.karty{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 24px}
.karta{display:flex;flex-direction:column;gap:16px}
.karta img{width:100%;height:250px;object-fit:cover;border-radius:12px;transition:opacity .15s}
.karta a:hover img{opacity:.88}
.karta h2{min-height:52px;margin-top:16px;font-size:22px;line-height:1.2}
.karta-cena{font-size:18px}
.pridat{min-height:50px;margin-top:auto;padding:12px 20px;border:0;border-radius:100px;background:var(--plocha);color:var(--text);font:600 16px var(--telo);cursor:pointer;transition:background .15s}
.pridat:hover{background:var(--linka)}
.pridat[aria-pressed="true"]{background:var(--tma);color:#fff}
button.akcia{border:0;font:600 16px var(--telo);cursor:pointer}
button.akcia[aria-pressed="true"]{background:var(--tma)}
.akcia-plna{width:100%}

.detail{display:flex;align-items:flex-start;gap:80px;margin-top:32px}
.galeria{flex:1;min-width:0}
.galeria-hlavna{width:100%;height:450px;object-fit:cover;border-radius:12px}
.nahlady{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin-top:16px}
.nahlady button{display:block;width:100%;padding:0;border:0;border-radius:12px;background:none;cursor:pointer}
.nahlady img{width:100%;height:150px;object-fit:cover;border-radius:12px;transition:opacity .15s}
.nahlady button:hover img{opacity:.8}
.detail-info{display:grid;flex:0 0 440px;gap:24px;min-width:0}
.detail-typ{color:var(--tlmeny);font-size:18px}
.detail-info h1{margin-top:-16px}
.detail-cena{font-size:28px;font-weight:600}
.detail-popis{display:grid;gap:12px;color:var(--tlmeny)}
.detail-popis ul{margin:0;padding-left:20px;list-style:disc}
.tlmene-text{color:var(--tlmeny)}
.celok{padding:20px;border-radius:8px;background:var(--plocha)}
.celok strong{display:block;margin-bottom:4px;font-size:18px;font-weight:600}
.poznamka{font-weight:500}
.obsah-kolekcie{margin-top:80px}
.tabulka{margin-top:24px;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:18px}
th{padding:0 16px 16px 0;color:var(--tlmeny);font-size:16px;font-weight:400;text-align:left}
td{padding:24px 16px 24px 0;border-top:1px solid var(--linka);vertical-align:top}
td:nth-last-child(1),th:nth-last-child(1){width:120px;white-space:nowrap}
.zoznam-obsahu{margin-top:24px;border-bottom:1px solid var(--linka);font-size:18px}
.zoznam-obsahu li{padding:16px 0;border-top:1px solid var(--linka)}

.dopyt{display:flex;align-items:flex-start;gap:80px}
.vyber{flex:0 1 480px;min-width:0}
.vyber-hlava{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:16px}
.vyber h2,.formular h2{font-size:24px}
.vyber li{display:flex;gap:16px;padding:16px 0;border-top:1px solid var(--linka)}
.vyber li img{flex:0 0 112px;width:112px;height:112px;object-fit:cover;border-radius:12px}
.vyber li div{min-width:0}
.vyber-nazov{display:block;font:600 22px/1.2 var(--nadpis)}
.vyber li p{color:var(--tlmeny)}
.vyber li .vyber-cena{color:var(--text);font-size:18px}
.vyber li button{min-height:44px;padding:0;border:0;background:none;color:var(--text);font:400 16px var(--telo);text-decoration:underline;cursor:pointer}
.vyber-pozn{padding-top:24px;border-top:1px solid var(--linka);color:var(--tlmeny)}
.dalej{display:inline-block;margin-top:16px;padding:10px 0;color:var(--akcia-text);font-weight:600;text-decoration:underline}
.formular{display:grid;flex:1;gap:24px;min-width:0;padding:32px;border-radius:12px;background:var(--plocha)}
.polia{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.pole{display:grid;gap:8px;min-width:0}
.pole label{font-weight:500}
.pole input,.pole textarea{width:100%;min-height:54px;padding:14px 16px;border:1px solid var(--linka);border-radius:8px;background:#fff;color:var(--text);font:400 16px var(--telo)}
.pole textarea{min-height:128px;resize:vertical}
.pole ::placeholder{color:var(--tlmeny)}
.pole-web{position:absolute;left:-9999px}
.suhlas{color:var(--tlmeny)}
.chyba{margin-bottom:24px;padding:16px 20px;border-radius:8px;background:#fdeaea;color:#a51b1b;font-weight:500}

.stav{display:grid;gap:56px}
.stav-riadok{display:flex;align-items:center;gap:120px}
.stav-text{display:grid;flex:1;justify-items:start;gap:20px;min-width:0}
.stav-riadok>img{flex:0 1 552px;min-width:0;width:552px;height:420px;object-fit:cover;border-radius:12px}
.stav-popis{color:var(--tlmeny)}
.stav-ok{color:var(--akcia-text);font-size:18px;font-weight:600}
.stav hr{width:100%;margin:0;border:0;border-top:1px solid var(--linka)}

.pata{padding:64px var(--okraj);background:var(--tma);color:#fff}
.pata-hore{display:flex;justify-content:space-between;gap:32px;padding-bottom:48px;border-bottom:1px solid var(--tma-linka)}
.pata h2{margin-bottom:28px;font-size:44px;line-height:1.2}
.pata address{display:flex;flex-direction:column;gap:12px}
.tlmene,.pata-dole{color:var(--svetly)}
.pata-dole{margin-top:48px}

@media (max-width:1100px){
  :root{--okraj:40px}
  .uvod{gap:40px}
  .uvod h1{font-size:52px}
  .veta{gap:40px}
  .veta-popis{flex-basis:180px}
  .saten-zoznam{grid-template-columns:repeat(3,1fr)}
  .ponuka-prehlad{gap:48px}
  .karty{grid-template-columns:repeat(2,1fr)}
  .katalog,.detail,.dopyt{gap:40px}
  .detail-info{flex-basis:360px}
  .stav-riadok{gap:48px}
}
@media (max-width:900px){
  .detail,.dopyt{flex-direction:column;align-items:stretch}
  .detail-info,.vyber{flex:none}
  .katalog{display:block}
  .filter{margin-bottom:32px}
  .filter ul{display:flex;flex-wrap:wrap;gap:8px}
  .filter a{gap:8px;background:var(--plocha)}
  .filter a[aria-current]{background:var(--tma)}
}
@media (max-width:760px){
  :root{--okraj:20px}
  .hlavicka{display:block;padding:20px var(--okraj)}
  .navigacia{justify-content:space-between;gap:16px;margin-top:12px}
  .uvod{flex-direction:column;align-items:stretch;gap:32px;padding:20px var(--okraj) 32px}
  .uvod h1{font-size:40px;letter-spacing:-1px}
  .uvod p{margin:20px 0 24px;font-size:18px}
  .uvod-foto{width:100%;aspect-ratio:320/280}
  .veta{display:block;padding:48px var(--okraj)}
  .veta-popis{display:none}
  .veta-text{font-size:28px}
  .sekcia{padding:56px var(--okraj)}
  .sekcia h2{font-size:32px}
  .temy{padding-top:8px}
  .temy-hlavne,.temy-dalsie{grid-template-columns:1fr;gap:32px}
  .temy-hlavne{margin-bottom:32px}
  .temy-hlavne img,.temy-dalsie img{height:222px}
  .saten{padding:48px var(--okraj)}
  .saten-zoznam{grid-template-columns:1fr;gap:16px}
  .saten-zoznam a{display:flex;align-items:center;gap:16px}
  .saten-zoznam img{flex:0 0 136px;width:136px;height:100px}
  .saten-zoznam a>span{margin-top:0;min-width:0}
  .saten-zoznam small{margin-top:4px}
  .ponuka-prehlad{flex-direction:column-reverse;align-items:stretch;gap:24px;margin-top:24px}
  .kategorie{flex:none}
  .kategorie a{padding:16px 0;font-size:24px}
  .kategoria-foto{flex:none;width:100%;height:240px}
  .obal{padding:32px var(--okraj) 56px}
  .hlava-stranky h1,.detail-info h1,.stav h1,.obsah-kolekcie h2{font-size:32px}
  .karty{grid-template-columns:1fr;gap:32px}
  .karta img{height:222px}
  .karta h2{min-height:0}
  .galeria-hlavna{height:280px}
  .nahlady{grid-template-columns:repeat(3,1fr);gap:8px}
  .nahlady img{height:88px}
  .obsah-kolekcie{margin-top:56px}
  table{font-size:16px}
  td{padding:16px 12px 16px 0}
  td:nth-last-child(1),th:nth-last-child(1){width:64px}
  .formular{padding:20px}
  .polia{grid-template-columns:1fr}
  .stav{gap:32px}
  .stav-riadok{flex-direction:column;align-items:stretch;gap:32px}
  .stav-riadok>img{flex:none;width:100%;height:240px}
  .pata{padding:48px var(--okraj)}
  .pata-hore{flex-direction:column}
  .pata h2{font-size:34px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}
