@charset "UTF-8";
/* =========================================================================
   SDÍLENÁ ZÁKLADNA (jednotný stack klienta — nepřepisovat, jen rozšiřovat)
   Zdroj: pb.zip / docs předloha. Tokeny + mixiny shodné napříč weby.
   ========================================================================= */
@import url("font.css");
:root {
  /* --- Sdílená paleta --- */
  --Pribram_sedo_modra: #8C959E;
  --cerna: #000;
  --cervena: #92063B;
  --bila: #fff;
  --seda: #ccc;
  --lang_hover_bck: #f5f5f5;
  --tmave_pismo: #23282D;
  --pruhledny_stin_seda: rgba(255, 255, 255, 0.30);
  --stin_seda: #d7d7d7;
  --border-sedy: #E5E7EB;
  --cerne-pismo: #101828;
  --sede-pismo: #5D666E;
  --sede-pismo-svetle: #6A7282;
  --sede-pismo-tmavsi: #4A5565;
  --bily-border: #F3F4F6;
  --rgba-cerna: rgba(0, 0, 0, 0.08);
  --rgba-cerna01: rgba(0, 0, 0, 0.1);
  --sedomodre-pismo: #364153;
  --seda-pismo-6c: #6C758D;
  --rgba-cerna75: rgba(0, 0, 0, 0.75);
  --barva-border-top: #E0E0E0;
  --barva-paticka: #FAFAFA;
  --pismo-paticka-seda: #525252;
  --barva-tlacitko-seda: #ECEFF2;
  --pismo-seda-placeholder: #4C5256;
  --bilaF8: #F8F9FB;
  --barva-border-top-e5: #E5E7EB;
  --barva-paticka-f8: #F8F9FB;
  --barva-border-E0: #E0DBDB;
  --sipka-border: #92063852;
  --barva-svetla-hneda: #F9F5F1;
  --barva-cena-box: #E2D2C680;
  --barva-slider-background: #E2D3C6;
  /* --- Šířky --- */
  --hlavni-sirka: 1280px; /* max. šířka containeru */
  --sirka-procenta: 94%;
  /* --- Velikosti písma --- */
  --pismo12: 12px;
  --pismo13: 13px;
  --pismo14: 14px;
  --pismo15: 15px;
  --pismo16: 16px;
  --pismo18: 18px;
  --pismo20: 20px;
  --pismo21: 21px;
  --pismo22: 22px;
  --pismo24: 24px;
  --pismo25: 25px;
  --pismo28: 28px;
  --pismo30: 30px;
  --pismo32: 32px;
  --pismo35: 35px;
  --pismo40: 40px;
  --pismo48: 48px;
  --pismo54: 54px;
  --pismo64: 64px;
  /* --- PROJEKT: brand tokeny (dle grafického návrhu) --- */
  --primarni: #90063B; /* purpurová — tlačítka, akcenty, badge text */
  --primarni-hover: #7A052D; /* tmavší odstín pro :hover */
  --badge-pozadi: #F5E7EB; /* světle růžové pozadí štítků */
  --tlacitko-svetle: #F6EBEF; /* světlé tlačítko = primární @8 % na bílé */
  --tlacitko-svetle-hover: #EEDAE2; /* světlé tlačítko :hover (≈ primární @15 %) */
  --nadpis-pismo: #1A1A1A; /* barva nadpisů */
  --text-pismo: #6D645D; /* barva běžného textu */
  --pozadi: #FEFCFB; /* pozadí stránky */
  --paticka-pozadi: #1A1410; /* tmavé pozadí patičky */
  --text-tmave: #1B0E04; /* tmavé pozadí patičky */
  --zaobleni: 16px; /* zaoblení karet */
  --zaobleni-velke: 28px; /* zaoblení velkých bloků */
  --zaobleni-male: 12px; /* zaoblení polí formuláře a menších karet */
  --zelena: #16A34A; /* stav "Skladem" v košíku */
  --pole-pozadi: #FFFFFF; /* pozadí vstupních polí */
}

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
  border: 0;
  outline: none;
}

.clr {
  clear: both;
  float: none;
}

/* --- Sdílené mixiny (ZIP) — používat, neopisovat hodnoty --- */
/* --- Mixiny projektu (stejná konvence, sdílené napříč stránkami) --- */
/* =========================================================================
   PROJEKT — podlahysmisou.cz
   MOBILE-FIRST: základ = mobil, větší rozlišení přidávej přes @media (min-width).
   Breakpointy: 480 / 768 / 1024 / 1280. Container max-width = 1280px (.zarovnani).
   ========================================================================= */
body, html, main {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--pozadi);
  overflow-x: clip;
}
body h1, body h2, body h3, body h4, html h1, html h2, html h3, html h4, main h1, main h2, main h3, main h4 {
  color: var(--nadpis-pismo);
  font-weight: 700;
}
body h1, html h1, main h1 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo64);
  line-height: 100%;
  letter-spacing: -2px;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (min-width: 768px) {
  body h1, html h1, main h1 {
    font-size: var(--pismo40);
  }
}
@media (min-width: 1024px) {
  body h1, html h1, main h1 {
    font-size: var(--pismo54);
  }
}
body h2, html h2, main h2 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo48);
  line-height: 100%;
  letter-spacing: -2px;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (min-width: 1024px) {
  body h2, html h2, main h2 {
    font-size: var(--pismo40);
  }
}
body h3, html h3, main h3 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .zarovnani, html .zarovnani, main .zarovnani {
  width: 100%;
  max-width: var(--hlavni-sirka);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}
@media (min-width: 1280px) {
  body .zarovnani, html .zarovnani, main .zarovnani {
    padding-left: 24px;
    padding-right: 24px;
  }
}
body .grid, html .grid, main .grid {
  display: grid;
  gap: 20px;
}
@media (min-width: 768px) {
  body .grid, html .grid, main .grid {
    gap: 24px;
  }
}
body .grid.grid-2, html .grid.grid-2, main .grid.grid-2 {
  grid-template-columns: 1fr;
}
body .grid.grid-3, html .grid.grid-3, main .grid.grid-3 {
  grid-template-columns: 1fr;
}
body .grid.grid-4, html .grid.grid-4, main .grid.grid-4 {
  grid-template-columns: 1fr;
}
@media (min-width: 600px) {
  body .grid.grid-2, html .grid.grid-2, main .grid.grid-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  body .grid.grid-3, html .grid.grid-3, main .grid.grid-3 {
    grid-template-columns: repeat(2, 1fr);
  }
  body .grid.grid-4, html .grid.grid-4, main .grid.grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  body .grid.grid-3, html .grid.grid-3, main .grid.grid-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  body .grid.grid-4, html .grid.grid-4, main .grid.grid-4 {
    grid-template-columns: repeat(4, 1fr);
  }
}
body main > section, html main > section, main main > section {
  padding-top: 48px;
  padding-bottom: 48px;
}
body .sekce_info_produkty, html .sekce_info_produkty, main .sekce_info_produkty {
  margin-bottom: 32px;
}
html body .sekce_info_produkty h2 {
    color: #1B0E04;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px; /* 116.667% */
    letter-spacing: -2px;
}
body .sekce_info_produkty .stitek, html .sekce_info_produkty .stitek, main .sekce_info_produkty .stitek {
  margin-bottom: 34px;
}
body .sekce_info_produkty .sekce_info_produkty_prava, html .sekce_info_produkty .sekce_info_produkty_prava, main .sekce_info_produkty .sekce_info_produkty_prava {
    text-align: right;
    max-width: 339px;
    color: #6D645D;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 120% */
}
@media (max-width: 1024px) {
  body .sekce_info_produkty .sekce_info_produkty_prava, html .sekce_info_produkty .sekce_info_produkty_prava, main .sekce_info_produkty .sekce_info_produkty_prava {
    margin-top: 48px;
  }
}
@media (min-width: 768px) {
  body .sekce_info_produkty, html .sekce_info_produkty, main .sekce_info_produkty {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    margin-bottom: 48px;
  }
  body .sekce_info_produkty > p, html .sekce_info_produkty > p, main .sekce_info_produkty > p {
    color: var(--text-pismo);
    font-size: var(--pismo20);
  }
}
body .sekce_info_produkty.sekce_info_produkty_stred, html .sekce_info_produkty.sekce_info_produkty_stred, main .sekce_info_produkty.sekce_info_produkty_stred {
  text-align: center;
}
body .sekce_info_produkty.sekce_info_produkty_stred h2, html .sekce_info_produkty.sekce_info_produkty_stred h2, main .sekce_info_produkty.sekce_info_produkty_stred h2 {
    font-family: "Satoshi medium";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 32px;
    color: #1B0E04;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px; /* 116.667% */
    letter-spacing: -2px;
}
body .sekce_info_produkty.sekce_info_produkty_stred .stitek, html .sekce_info_produkty.sekce_info_produkty_stred .stitek, main .sekce_info_produkty.sekce_info_produkty_stred .stitek {
  margin-bottom: 32px;
}
body .sekce_info_produkty.sekce_info_produkty_stred > p, html .sekce_info_produkty.sekce_info_produkty_stred > p, main .sekce_info_produkty.sekce_info_produkty_stred > p {
  line-height: 160%;
}
body .sekce_info_produkty.sekce_info_produkty_stred > p a , html .sekce_info_produkty.sekce_info_produkty_stred > p a, main .sekce_info_produkty.sekce_info_produkty_stred > p a {
    color: var(--tmave_pismo);
}
body .sekce_info_produkty.sekce_info_produkty_stred > p a:hover , html .sekce_info_produkty.sekce_info_produkty_stred > p a:hover, main .sekce_info_produkty.sekce_info_produkty_stred > p a:hover {
    text-decoration: none;
}
main .reference p {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    color: #6D645D;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px; /* 133.333% */
}
@media (min-width: 768px) {
  body .sekce_info_produkty.sekce_info_produkty_stred, html .sekce_info_produkty.sekce_info_produkty_stred, main .sekce_info_produkty.sekce_info_produkty_stred {
    display: block;
  }
  body .sekce_info_produkty.sekce_info_produkty_stred > p, html .sekce_info_produkty.sekce_info_produkty_stred > p, main .sekce_info_produkty.sekce_info_produkty_stred > p {
    margin: 16px auto 0;
    text-align: center;
  }
}
body .tlacitko, html .tlacitko, main .tlacitko {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 24px;
  border-radius: 100px;
  background: none;
  border: solid 1px var(--bila);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 300ms ease;
}
body .tlacitko:hover, html .tlacitko:hover, main .tlacitko:hover {
  background-color: var(--primarni-hover);
  border: solid 1px var(--primarni-hover);
}
body .tlacitko .sipka, html .tlacitko .sipka, main .tlacitko .sipka {
  width: 24px;
  height: 24px;
}
body .tlacitko.tlacitko_primary, html .tlacitko.tlacitko_primary, main .tlacitko.tlacitko_primary {
  background-color: var(--primarni);
  border: solid 1px var(--primarni);
  color: var(--bila);
}
.spocitat_cenu {
    border-radius: 24px!important;
    height: 60px;
}
body .tlacitko.tlacitko_primary:hover, html .tlacitko.tlacitko_primary:hover, main .tlacitko.tlacitko_primary:hover {
  background-color: var(--primarni-hover);
}
body .tlacitko.tlacitko_primary .sipka, html .tlacitko.tlacitko_primary .sipka, main .tlacitko.tlacitko_primary .sipka {
  color: var(--bila);
  border: none;
}
body .tlacitko.tlacitko_svetle, html .tlacitko.tlacitko_svetle, main .tlacitko.tlacitko_svetle {
  background-color: var(--tlacitko-svetle);
  color: var(--primarni);
}
body .tlacitko.tlacitko_svetle:hover, html .tlacitko.tlacitko_svetle:hover, main .tlacitko.tlacitko_svetle:hover {
  background-color: var(--tlacitko-svetle-hover);
}
body .tlacitko.tlacitko_nobg, html .tlacitko.tlacitko_nobg, main .tlacitko.tlacitko_nobg {
  background-color: rgba(0, 0, 0, 0);
  color: var(--primarni);
  border: solid 1px var(--primarni);
}
body .tlacitko.tlacitko_nobg:hover, html .tlacitko.tlacitko_nobg:hover, main .tlacitko.tlacitko_nobg:hover {
  background-color: var(--tlacitko-svetle-hover);
}
body .stitek, html .stitek, main .stitek {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 100px;
  background-color: var(--badge-pozadi);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .sipka, html .sipka, main .sipka {
  flex: none;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--primarni);
  color: var(--primarni);
  background-color: transparent;
  transition: background-color 300ms, color 300ms, rotate 300ms ease;
}
body .sipka::before, html .sipka::before, main .sipka::before {
  content: "";
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("../img/arrow-right.svg") center/24px 24px no-repeat;
  mask: url("../img/arrow-right.svg") center/24px 24px no-repeat;
}
body header, html header, main header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background-color: var(--pozadi);
  transition: box-shadow 300ms ease, background-color 300ms ease;
}
body header.zafixovane, html header.zafixovane, main header.zafixovane {
  box-shadow: 0 6px 24px var(--rgba-cerna);
}
body header .hlavicka, html header .hlavicka, main header .hlavicka {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 18px;
  padding-bottom: 18px;
}
body header .logo, html header .logo, main header .logo {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
body header .logo span, html header .logo span, main header .logo span {
  color: var(--primarni);
}
body header .hlavni_menu > ul, html header .hlavni_menu > ul, main header .hlavni_menu > ul {
  display: none;
  list-style: none;
}
body header .hlavni_menu > ul a, html header .hlavni_menu > ul a, main header .hlavni_menu > ul a {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo15);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
body header .hlavni_menu > ul a:hover, html header .hlavni_menu > ul a:hover, main header .hlavni_menu > ul a:hover {
  color: var(--text-tmave);
}
@media (min-width: 1024px) {
  body header .hlavni_menu > ul, html header .hlavni_menu > ul, main header .hlavni_menu > ul {
    display: flex;
    gap: 28px;
  }
}
body header .hlavni_menu.open > ul, html header .hlavni_menu.open > ul, main header .hlavni_menu.open > ul {
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 100;
  padding: 16px 20px 24px;
  background-color: var(--bila);
  box-shadow: 0 12px 30px var(--rgba-cerna);
}
body header .hlavni_menu.open > ul a, html header .hlavni_menu.open > ul a, main header .hlavni_menu.open > ul a {
  display: block;
  padding: 12px 0;
}
@media (min-width: 1024px) {
  body header .hlavni_menu.open > ul, html header .hlavni_menu.open > ul, main header .hlavni_menu.open > ul {
    position: static;
    flex-direction: row;
    box-shadow: none;
    padding: 0;
    background: none;
  }
}
body header .tlacitko_kontakt, html header .tlacitko_kontakt, main header .tlacitko_kontakt {
  display: none;
}
@media (min-width: 1024px) {
  body header .tlacitko_kontakt, html header .tlacitko_kontakt, main header .tlacitko_kontakt {
    display: inline-flex;
    background-color: var(--primarni);
  }
}
body header .hamburger, html header .hamburger, main header .hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 10px;
  background: none;
  cursor: pointer;
}
@media (min-width: 1024px) {
  body header .hamburger, html header .hamburger, main header .hamburger {
    display: none;
  }
}
body header .hamburger span, html header .hamburger span, main header .hamburger span {
  width: 100%;
  height: 2px;
  background-color: var(--nadpis-pismo);
  border-radius: 2px;
}
body .hero, html .hero, main .hero {
  background: url("../img/hero-mask.png") calc(50% + 200px) calc(50% - 70px) no-repeat;
}
body .hero .hero_grid, html .hero .hero_grid, main .hero .hero_grid {
  display: grid;
  gap: 32px;
}
@media (min-width: 1024px) {
  body .hero .hero_grid, html .hero .hero_grid, main .hero .hero_grid {
    grid-template-columns: 1fr 580px;
    align-items: center;
    gap: 56px;
  }
}
body .hero .hero_text .stitek, html .hero .hero_text .stitek, main .hero .hero_text .stitek {
  margin-bottom: 20px;
  color: var(--primarni);
  font-size: var(--pismo16);
}
body .hero .hero_text h1, html .hero .hero_text h1, main .hero .hero_text h1 {
    margin-bottom: 20px;
    max-width: 500px;
    color: #1B0E04;
    font-size: 64px;
    font-style: normal;
    font-weight: 500;
    line-height: 72px; /* 112.5% */
    letter-spacing: -2px;
}
body .hero .hero_text p, html .hero .hero_text p, main .hero .hero_text p {
    margin-bottom: 64px;
    max-width: 440px;
    color: #6D645D;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px; /* 160% */
}
body .hero .hodnoceni, html .hero .hodnoceni, main .hero .hodnoceni {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 48px;
}
body .hero .hodnoceni .avatary, html .hero .hodnoceni .avatary, main .hero .hodnoceni .avatary {
  display: flex;
}
body .hero .hodnoceni .avatary img, html .hero .hodnoceni .avatary img, main .hero .hodnoceni .avatary img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid var(--bila);
  object-fit: cover;
  margin-left: -10px;
}
body .hero .hodnoceni .avatary img:first-child, html .hero .hodnoceni .avatary img:first-child, main .hero .hodnoceni .avatary img:first-child {
  margin-left: 0;
}
html .hero .hodnoceni .svistlitko {
    width: 0.5px;
    height: 30px;
    background-color: #D3B193;
    opacity: 0.2;
    display: block;
}
body .hero .hodnoceni span, html .hero .hodnoceni span, main .hero .hodnoceni span {
    font-family: "Satoshi medium";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #1B0E04;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 22.44px; /* 140.248% */
    letter-spacing: -0.48px;
}
body .hero .hero_obrazek, html .hero .hero_obrazek, main .hero .hero_obrazek {
  position: relative;
}
body .hero .hero_obrazek img, html .hero .hero_obrazek img, main .hero .hero_obrazek img {
  width: 100%;
  border-radius: var(--zaobleni-velke);
  object-fit: cover;
  aspect-ratio: 580/680;
}
body .hero .hero_obrazek .label, html .hero .hero_obrazek .label, main .hero .hero_obrazek .label {
  position: absolute;
  padding: 12px 24px;
  border-radius: 100px;
  background-color: var(--nadpis-pismo);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: -1px;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .hero .hero_obrazek .label_1, html .hero .hero_obrazek .label_1, main .hero .hero_obrazek .label_1 {
  top: 48px;
  left: 0px;
}
body .hero .hero_obrazek .label_2, html .hero .hero_obrazek .label_2, main .hero .hero_obrazek .label_2 {
  top: 60%;
  right: 0px;
}
body .hero .hero_obrazek .label_3, html .hero .hero_obrazek .label_3, main .hero .hero_obrazek .label_3 {
  bottom: 48px;
  left: 0px;
}
@media (min-width: 1024px) {
  body .hero .hero_obrazek .label_1, html .hero .hero_obrazek .label_1, main .hero .hero_obrazek .label_1 {
    top: 48px;
    left: -10px;
  }
  body .hero .hero_obrazek .label_2, html .hero .hero_obrazek .label_2, main .hero .hero_obrazek .label_2 {
    top: 60%;
    right: -10px;
  }
  body .hero .hero_obrazek .label_3, html .hero .hero_obrazek .label_3, main .hero .hero_obrazek .label_3 {
    bottom: 48px;
    left: -10px;
  }
}
@media (min-width: 1348px) {
  body .hero .hero_obrazek .label_1, html .hero .hero_obrazek .label_1, main .hero .hero_obrazek .label_1 {
    top: 48px;
    left: -62px;
  }
  body .hero .hero_obrazek .label_2, html .hero .hero_obrazek .label_2, main .hero .hero_obrazek .label_2 {
    top: 60%;
    right: -62px;
  }
  body .hero .hero_obrazek .label_3, html .hero .hero_obrazek .label_3, main .hero .hero_obrazek .label_3 {
    bottom: 48px;
    left: -62px;
  }
}
body .katalog .produkt, body .podobne .produkt, html .katalog .produkt, html .podobne .produkt, main .katalog .produkt, main .podobne .produkt {
  display: block;
  text-decoration: none;
  background-color: var(--barva-svetla-hneda);
  border-radius: var(--zaobleni);
  padding: 12px;
  border: 1px solid var(--bily-border);
  transition: box-shadow 300ms;
}
body .katalog .produkt:hover, body .podobne .produkt:hover, html .katalog .produkt:hover, html .podobne .produkt:hover, main .katalog .produkt:hover, main .podobne .produkt:hover {
  box-shadow: 0 12px 30px var(--rgba-cerna);
}
body .katalog .produkt .sipka, body .podobne .produkt .sipka, html .katalog .produkt .sipka, html .podobne .produkt .sipka, main .katalog .produkt .sipka, main .podobne .produkt .sipka {
  background-color: var(--barva-svetla-hneda);
  border: solid 1px var(--primarni);
  color: var(--primarni);
}
body .katalog .produkt:hover .sipka, body .podobne .produkt:hover .sipka, html .katalog .produkt:hover .sipka, html .podobne .produkt:hover .sipka, main .katalog .produkt:hover .sipka, main .podobne .produkt:hover .sipka {
  background-color: var(--primarni);
  color: var(--bila);
  rotate: -45deg;
}
body .katalog .produkt_obrazek, body .podobne .produkt_obrazek, html .katalog .produkt_obrazek, html .podobne .produkt_obrazek, main .katalog .produkt_obrazek, main .podobne .produkt_obrazek {
  position: relative;
  border-radius: 10px;
  background-size: cover;
  background-position: center;
  aspect-ratio: 4/3;
  margin-bottom: 14px;
}
body .katalog .produkt_obrazek .pocet, body .podobne .produkt_obrazek .pocet, html .katalog .produkt_obrazek .pocet, html .podobne .produkt_obrazek .pocet, main .katalog .produkt_obrazek .pocet, main .podobne .produkt_obrazek .pocet {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: var(--primarni);
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo13);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .katalog .produkt_info, body .podobne .produkt_info, html .katalog .produkt_info, html .podobne .produkt_info, main .katalog .produkt_info, main .podobne .produkt_info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 6px 8px;
}
body .katalog .produkt_info h3, body .podobne .produkt_info h3, html .katalog .produkt_info h3, html .podobne .produkt_info h3, main .katalog .produkt_info h3, main .podobne .produkt_info h3 {
  margin-bottom: 12px;
  color: var(--text-tmave);
}
body .katalog .produkt_info p, body .podobne .produkt_info p, html .katalog .produkt_info p, html .podobne .produkt_info p, main .katalog .produkt_info p, main .podobne .produkt_info p {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .faq .dotazy, html .faq .dotazy, main .faq .dotazy {
  max-width: 848px;
  padding: 12px;
  background-color: var(--barva-svetla-hneda);
  border-radius: 24px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .faq .dotaz, html .faq .dotaz, main .faq .dotaz {
  background-color: var(--bila);
  border-radius: var(--zaobleni);
  border: 1px solid var(--bily-border);
  overflow: hidden;
}
body .faq .dotaz .otazka, html .faq .dotaz .otazka, main .faq .dotaz .otazka {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 24px;
  cursor: pointer;
}
body .faq .dotaz .otazka h3, html .faq .dotaz .otazka h3, main .faq .dotaz .otazka h3 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .faq .dotaz .otazka .ikona, html .faq .dotaz .otazka .ikona, main .faq .dotaz .otazka .ikona {
  flex: none;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--primarni);
  color: var(--primarni);
}
body .faq .dotaz .otazka .ikona::after, html .faq .dotaz .otazka .ikona::after, main .faq .dotaz .otazka .ikona::after {
  content: "+";
}
body .faq .dotaz .odpoved, html .faq .dotaz .odpoved, main .faq .dotaz .odpoved {
  max-height: 0;
  overflow: hidden;
  transition: max-height 350ms ease;
}
body .faq .dotaz .odpoved p, html .faq .dotaz .odpoved p, main .faq .dotaz .odpoved p {
  padding: 0 24px 22px;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo15);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .faq .dotaz.active .ikona::after, html .faq .dotaz.active .ikona::after, main .faq .dotaz.active .ikona::after {
  content: "−";
}
body .reference, html .reference, main .reference {
  text-align: center;
}
body .reference .reference_carousel, html .reference .reference_carousel, main .reference .reference_carousel {
  position: relative;
  margin: 0 auto;
  padding: 0 8px;
}
body .reference .reference_okno, html .reference .reference_okno, main .reference .reference_okno {
  position: relative;
  transition: opacity 250ms ease;
}
body .reference .reference_slide, html .reference .reference_slide, main .reference .reference_slide {
  display: none;
  text-decoration: none;
}
body .reference .reference_slide.active, html .reference .reference_slide.active, main .reference .reference_slide.active {
  display: block;
}
body .reference .uvozovky, html .reference .uvozovky, main .reference .uvozovky {
  display: inline-block;
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo54);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 12px;
}
body .reference .citace, html .reference .citace, main .reference .citace {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo22);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-top: 12px;
  margin-bottom: 12px;
}
body .reference .reference_autor, html .reference .reference_autor, main .reference .reference_autor {
  margin-top: 28px;
}
body .reference .reference_autor .avatar, html .reference .reference_autor .avatar, main .reference .reference_autor .avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 10px;
}
body .reference .reference_autor .jmeno, html .reference .reference_autor .jmeno, main .reference .reference_autor .jmeno {
  display: block;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo24);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .reference .sip, html .reference .sip, main .reference .sip {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 1px solid var(--sipka-border);
  color: var(--primarni);
  background: none;
  cursor: pointer;
  font-size: var(--pismo24);
}
@media (max-width: 480px) {
  body .reference .sip, html .reference .sip, main .reference .sip {
    top: 68%;
  }
}
body .reference .sip:hover, html .reference .sip:hover, main .reference .sip:hover {
  background-color: var(--primarni);
  color: var(--bila);
}
body .reference .sip.sip_vlevo, html .reference .sip.sip_vlevo, main .reference .sip.sip_vlevo {
  left: -8px;
  z-index: 10;
}
body .reference .sip.sip_vpravo, html .reference .sip.sip_vpravo, main .reference .sip.sip_vpravo {
  right: -8px;
}
@media (min-width: 768px) {
  body .reference .sip.sip_vlevo, html .reference .sip.sip_vlevo, main .reference .sip.sip_vlevo {
    left: 0px;
  }
  body .reference .sip.sip_vpravo, html .reference .sip.sip_vpravo, main .reference .sip.sip_vpravo {
    right: 0px;
  }
}
body .banner .banner_box, html .banner .banner_box, main .banner .banner_box {
  position: relative;
  border-radius: var(--zaobleni-velke);
  background: url("../img/mrizka-banner.png") right top no-repeat var(--primarni);
  padding: 36px 24px;
  color: var(--bila);
}
@media (min-width: 1024px) {
  body .banner .banner_box, html .banner .banner_box, main .banner .banner_box {
    display: grid;
    grid-template-columns: 0.75fr;
    align-items: center;
    gap: 40px;
    padding: 56px;
  }
}
body .banner .banner_pruh, html .banner .banner_pruh, main .banner .banner_pruh {
    max-width: 700px;
}
body .banner .banner_box h2, html .banner .banner_box h2, main .banner .banner_box h2 {
  color: var(--bila);
  margin-bottom: 16px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo32);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .banner .banner_box p, html .banner .banner_box p, main .banner .banner_box p {
  color: rgba(255, 255, 255, 0.85);
}
main .banner .banner_box p .zluty {
    color: #F7FF00;
    font-family: "Satoshi medium";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
}
body .banner .banner_pruh, html .banner .banner_pruh, main .banner .banner_pruh {
  margin-top: 24px;
  padding-top: 20px;
}
body .banner .banner_pruh strong, html .banner .banner_pruh strong, main .banner .banner_pruh strong {
  display: block;
  margin-bottom: 8px;
  color: var(--bila);
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo24);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .banner .banner_obrazek img, html .banner .banner_obrazek img, main .banner .banner_obrazek img {
  max-width: 100%;
  height: auto;
  position: absolute;
  bottom: 24px;
  right: -48px;
  border-radius: var(--zaobleni);
}
@media (max-width: 1300px) {
  body .banner .banner_obrazek, html .banner .banner_obrazek, main .banner .banner_obrazek {
    text-align: center;
    padding-top: 48px;
    right: -12px;
  }
  body .banner .banner_obrazek img, html .banner .banner_obrazek img, main .banner .banner_obrazek img {
    position: relative;
    right: inherit;
    bottom: inherit;
  }
}
body .blog .clanek, html .blog .clanek, main .blog .clanek {
  display: block;
  text-decoration: none;
  background: #F9F5F1;
  border-radius: var(--zaobleni);
  overflow: hidden;
  border: 1px solid var(--bily-border);
  transition: box-shadow 300ms;
  padding: 24px;
}
body .blog .clanek_obrazek, html .blog .clanek_obrazek, main .blog .clanek_obrazek {
    border-radius: 16px;
}
body .blog .clanek:hover, html .blog .clanek:hover, main .blog .clanek:hover {
  box-shadow: 0 12px 30px var(--rgba-cerna);
}
body .blog .clanek_obrazek, html .blog .clanek_obrazek, main .blog .clanek_obrazek {
  background-size: cover;
  background-position: center;
  aspect-ratio: 16/10;
}
body .blog .clanek_info, html .blog .clanek_info, main .blog .clanek_info {
  padding: 20px;
}
body .blog .clanek_info .datum, html .blog .clanek_info .datum, main .blog .clanek_info .datum {
    font-family: "Satoshi regular";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #6D645D;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 150% */
    background-image: url('../img/datum.svg');
    padding-left: 20px;
    background-size: initial;
    background-repeat: no-repeat;
    background-position: left center;
}
main .blog h2 {
    max-width: 408px;
}
body .blog .clanek_info h3, html .blog .clanek_info h3, main .blog .clanek_info h3 {
  margin: 10px 0;
}
body .blog .clanek_info p, html .blog .clanek_info p, main .blog .clanek_info p {
  font-family: "Satoshi regular";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 14px;
  color: #6D645D;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 125% */
}
body .blog .clanek_info .vice, html .blog .clanek_info .vice, main .blog .clanek_info .vice {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: underline;
}
body .informace .info_karta, html .informace .info_karta, main .informace .info_karta {
  background-color: var(--barva-svetla-hneda);
  border: 1px solid var(--bily-border);
  border-radius: var(--zaobleni-velke);
  padding: 32px;
}
body .informace .info_karta .ico_kontakt, html .informace .info_karta .ico_kontakt, main .informace .info_karta .ico_kontakt {
  display: block;
  width: 64px;
  height: 64px;
  border-radius: 10px;
  padding: 20px;
  background-color: var(--primarni);
  margin-bottom: 48px;
}
body .informace .info_karta h3, html .informace .info_karta h3, main .informace .info_karta h3 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo22);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 20px;
}
body .informace .info_karta.info_karta_tmava, html .informace .info_karta.info_karta_tmava, main .informace .info_karta.info_karta_tmava {
  background-color: var(--primarni);
}
body .informace .info_karta.info_karta_tmava h3, html .informace .info_karta.info_karta_tmava h3, main .informace .info_karta.info_karta_tmava h3 {
  color: var(--bila);
}
body .informace .info_karta.info_karta_tmava .adresa, html .informace .info_karta.info_karta_tmava .adresa, main .informace .info_karta.info_karta_tmava .adresa {
  color: rgba(255, 255, 255, 0.85);
}
body .informace .info_karta .adresa, html .informace .info_karta .adresa, main .informace .info_karta .adresa {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
body .informace .info_karta .adresa img, html .informace .info_karta .adresa img, main .informace .info_karta .adresa img {
  margin-right: 10px;
}
body .informace .info_karta .info_obrazek img, html .informace .info_karta .info_obrazek img, main .informace .info_karta .info_obrazek img {
  width: 100%;
  border-radius: var(--zaobleni);
}
body .informace .info_karta .kontakt_radek, html .informace .info_karta .kontakt_radek, main .informace .info_karta .kontakt_radek {
  display: flex;
  align-content: center;
  margin-bottom: 8px;
  gap: 8px;
  text-decoration: none;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .informace .info_karta .kontakt_radek:hover, html .informace .info_karta .kontakt_radek:hover, main .informace .info_karta .kontakt_radek:hover {
  color: var(--primarni);
}
body .informace .info_karta .tlacitko, html .informace .info_karta .tlacitko, main .informace .info_karta .tlacitko {
  margin-top: 20px;
  background-color: var(--primarni);
}
body .informace .info_karta .tlacitko .sipka, html .informace .info_karta .tlacitko .sipka, main .informace .info_karta .tlacitko .sipka {
  color: var(--bila);
  background-color: var(--primarni);
  border: none;
}
body .informace .info_karta .tlacitko:hover, html .informace .info_karta .tlacitko:hover, main .informace .info_karta .tlacitko:hover {
  background-color: var(--tlacitko-svetle);
  color: var(--primarni);
}
body .informace .info_karta .tlacitko:hover .sipka, html .informace .info_karta .tlacitko:hover .sipka, main .informace .info_karta .tlacitko:hover .sipka {
  background-color: var(--tlacitko-svetle);
  color: var(--primarni);
  border: none;
}
body footer, html footer, main footer {
  background-color: var(--paticka-pozadi);
  color: rgba(255, 255, 255, 0.7);
  padding-top: 56px;
  padding-bottom: 28px;
}
body footer .paticka_grid, html footer .paticka_grid, main footer .paticka_grid {
  display: grid;
  gap: 32px;
}
@media (min-width: 768px) {
  body footer .paticka_grid, html footer .paticka_grid, main footer .paticka_grid {
    grid-template-columns: 2fr 1fr 1fr;
    gap: 40px;
  }
}
body footer .logo, html footer .logo, main footer .logo {
  color: var(--bila);
}
body footer .paticka_brand p, html footer .paticka_brand p, main footer .paticka_brand p {
  margin: 16px 0 20px;
  color: rgba(255, 255, 255, 0.7);
  max-width: 280px;
}
body footer h4, html footer h4, main footer h4 {
  color: var(--bila);
  margin-bottom: 14px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body footer .paticka_sloupec a, html footer .paticka_sloupec a, main footer .paticka_sloupec a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
}
body footer .paticka_sloupec a:hover, html footer .paticka_sloupec a:hover, main footer .paticka_sloupec a:hover {
  color: var(--bila);
}
body footer .paticka_spodek, html footer .paticka_spodek, main footer .paticka_spodek {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo13);
  line-height: 150%;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.6);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body footer .paticka_spodek a, html footer .paticka_spodek a, main footer .paticka_spodek a {
  color: var(--text-pismo);
}
@media (min-width: 600px) {
  body footer .paticka_spodek, html footer .paticka_spodek, main footer .paticka_spodek {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}
body .zvyrazneno, html .zvyrazneno, main .zvyrazneno {
  color: var(--primarni);
}
body p strong, html p strong, main p strong {
  font-family: "Satoshi bold";
  font-weight: 500;
  color: var(--nadpis-pismo);
}
body p strong.zvyrazneno, html p strong.zvyrazneno, main p strong.zvyrazneno {
  color: var(--primarni);
}
body .produkt_hero .produkt_hero_grid, html .produkt_hero .produkt_hero_grid, main .produkt_hero .produkt_hero_grid {
  display: grid;
  gap: 24px;
}
body .produkt_hero .produkt_hero_grid > *, html .produkt_hero .produkt_hero_grid > *, main .produkt_hero .produkt_hero_grid > * {
  min-width: 0;
}
@media (min-width: 1024px) {
  body .produkt_hero .produkt_hero_grid, html .produkt_hero .produkt_hero_grid, main .produkt_hero .produkt_hero_grid {
    grid-template-columns: 2fr 3fr;
    align-items: start;
    gap: 32px;
  }
}
body .produkt_hero .produkt_hero_obrazek img, html .produkt_hero .produkt_hero_obrazek img, main .produkt_hero .produkt_hero_obrazek img {
  width: 100%;
  max-width: 391px;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: var(--zaobleni-velke);
}
@media (max-width: 768px) {
  body .produkt_hero .produkt_hero_obrazek img, html .produkt_hero .produkt_hero_obrazek img, main .produkt_hero .produkt_hero_obrazek img {
    max-width: 100%;
  }
}
body .produkt_hero .produkt_hero_text .tlacitko, html .produkt_hero .produkt_hero_text .tlacitko, main .produkt_hero .produkt_hero_text .tlacitko {
  font-size: var(--pismo24) !important;
}
body .produkt_hero .produkt_hero_text h1, html .produkt_hero .produkt_hero_text h1, main .produkt_hero .produkt_hero_text h1 {
  font-family: "Satoshi bold";
  margin-bottom: 20px;
  line-height: 52px;
}
body .produkt_hero .produkt_hero_text p, html .produkt_hero .produkt_hero_text p, main .produkt_hero .produkt_hero_text p {
  font-family: "Satoshi regular";
  margin-bottom: 32px;
  font-size: var(--pismo20);
  color: var(--text-pismo);
  line-height: 32px;
  max-width: 620px;
  text-align: justify;
}
body .kombinace .kombinace_grid, html .kombinace .kombinace_grid, main .kombinace .kombinace_grid {
  display: grid;
  gap: 32px;
}
body .kombinace .kombinace_grid > *, html .kombinace .kombinace_grid > *, main .kombinace .kombinace_grid > * {
  min-width: 0;
}
@media (min-width: 1024px) {
  body .kombinace .kombinace_grid, html .kombinace .kombinace_grid, main .kombinace .kombinace_grid {
    grid-template-columns: 1fr 465px;
    align-items: center;
    gap: 56px;
  }
}
body .kombinace .kombinace_text h2, html .kombinace .kombinace_text h2, main .kombinace .kombinace_text h2 {
  font-family: "Satoshi medium";
  line-height: 52px;
  font-weight: 500;
}
body .kombinace .kombinace_text p, html .kombinace .kombinace_text p, main .kombinace .kombinace_text p {
  font-family: "Satoshi regular";
  margin-top: 20px;
  font-size: var(--pismo20);
  text-align: justify;
  color: var(--text-pismo);
  line-height: 32px;
}
body .kombinace .kombinace_galerie, html .kombinace .kombinace_galerie, main .kombinace .kombinace_galerie {
  display: flex;
  gap: 16px;
  margin-top: 32px;
}
body .kombinace .kombinace_miniatura, html .kombinace .kombinace_miniatura, main .kombinace .kombinace_miniatura {
  position: relative;
  display: block;
  flex: 0 1 92px;
  min-width: 0;
  max-width: 92px;
  aspect-ratio: 92/83;
  border-radius: var(--zaobleni);
  overflow: hidden;
}
body .kombinace .kombinace_miniatura img, html .kombinace .kombinace_miniatura img, main .kombinace .kombinace_miniatura img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body .kombinace .kombinace_miniatura.kombinace_miniatura_pocet span, html .kombinace .kombinace_miniatura.kombinace_miniatura_pocet span, main .kombinace .kombinace_miniatura.kombinace_miniatura_pocet span {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background-color: rgba(0, 0, 0, 0.45);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kombinace .kombinace_obrazek, html .kombinace .kombinace_obrazek, main .kombinace .kombinace_obrazek {
  display: block;
}
body .kombinace .kombinace_obrazek img, html .kombinace .kombinace_obrazek img, main .kombinace .kombinace_obrazek img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--zaobleni-velke);
}
body .kalkulacka .kalkulacka_karta, html .kalkulacka .kalkulacka_karta, main .kalkulacka .kalkulacka_karta {
  display: block;
  background-color: var(--barva-svetla-hneda);
  border: 1px solid var(--bily-border);
  border-radius: var(--zaobleni-velke);
  padding: 24px;
}
@media (min-width: 768px) {
  body .kalkulacka .kalkulacka_karta, html .kalkulacka .kalkulacka_karta, main .kalkulacka .kalkulacka_karta {
    padding: 40px;
  }
}
body .kalkulacka .kalkulacka_grid, html .kalkulacka .kalkulacka_grid, main .kalkulacka .kalkulacka_grid {
  display: grid;
  gap: 32px;
}
body .kalkulacka .kalkulacka_grid > *, html .kalkulacka .kalkulacka_grid > *, main .kalkulacka .kalkulacka_grid > * {
  min-width: 0;
}
@media (min-width: 1024px) {
  body .kalkulacka .kalkulacka_grid, html .kalkulacka .kalkulacka_grid, main .kalkulacka .kalkulacka_grid {
    grid-template-columns: 320px 1fr;
    gap: 56px;
  }
}
body .kalkulacka .kalkulacka_obrazek img, html .kalkulacka .kalkulacka_obrazek img, main .kalkulacka .kalkulacka_obrazek img {
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
  border-radius: var(--zaobleni);
}
@media (min-width: 1024px) {
  body .kalkulacka .kalkulacka_obrazek img, html .kalkulacka .kalkulacka_obrazek img, main .kalkulacka .kalkulacka_obrazek img {
    aspect-ratio: 4/5;
  }
}
body .kalkulacka .kalkulacka_obsah h2, html .kalkulacka .kalkulacka_obsah h2, main .kalkulacka .kalkulacka_obsah h2 {
    font-family: "Satoshi medium";
    color: var(--nadpis-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 28px;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px; /* 116.667% */
    letter-spacing: -2px;
}
body .kalkulacka .kalkulacka_pole, html .kalkulacka .kalkulacka_pole, main .kalkulacka .kalkulacka_pole {
  margin-bottom: 28px;
}
body .kalkulacka .kalkulacka_popisek, html .kalkulacka .kalkulacka_popisek, main .kalkulacka .kalkulacka_popisek {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    font-family: "Satoshi medium";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #1B0E04;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 160% */
}
body .kalkulacka .kalkulacka_hodnota, html .kalkulacka .kalkulacka_hodnota, main .kalkulacka .kalkulacka_hodnota {
  flex: none;
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kalkulacka .kalkulacka_slider, html .kalkulacka .kalkulacka_slider, main .kalkulacka .kalkulacka_slider {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 6px;
  border-radius: 100px;
  background: linear-gradient(to right, var(--primarni) 0%, var(--primarni) var(--postup, 25%), var(--barva-slider-background) var(--postup, 25%), var(--barva-slider-background) 100%);
  cursor: pointer;
}
body .kalkulacka .kalkulacka_slider::-webkit-slider-thumb, html .kalkulacka .kalkulacka_slider::-webkit-slider-thumb, main .kalkulacka .kalkulacka_slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--primarni);
  border: 3px solid var(--bila);
  box-shadow: 0 2px 6px var(--rgba-cerna01);
  cursor: pointer;
}
body .kalkulacka .kalkulacka_slider::-moz-range-track, html .kalkulacka .kalkulacka_slider::-moz-range-track, main .kalkulacka .kalkulacka_slider::-moz-range-track {
  height: 6px;
  border-radius: 100px;
  background: var(--barva-slider-background);
}
body .kalkulacka .kalkulacka_slider::-moz-range-progress, html .kalkulacka .kalkulacka_slider::-moz-range-progress, main .kalkulacka .kalkulacka_slider::-moz-range-progress {
  height: 6px;
  border-radius: 100px;
  background: var(--primarni);
}
body .kalkulacka .kalkulacka_slider::-moz-range-thumb, html .kalkulacka .kalkulacka_slider::-moz-range-thumb, main .kalkulacka .kalkulacka_slider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--primarni);
  border: 3px solid var(--bila);
  cursor: pointer;
}
body .kalkulacka .kalkulacka_spodek, html .kalkulacka .kalkulacka_spodek, main .kalkulacka .kalkulacka_spodek {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  body .kalkulacka .kalkulacka_spodek, html .kalkulacka .kalkulacka_spodek, main .kalkulacka .kalkulacka_spodek {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
  }
}
body .kalkulacka .tlacitko.kalkulacka_tlacitko, html .kalkulacka .tlacitko.kalkulacka_tlacitko, main .kalkulacka .tlacitko.kalkulacka_tlacitko {
  font-size: var(--pismo24);
}
body .kalkulacka .kalkulacka_prislusenstvi, html .kalkulacka .kalkulacka_prislusenstvi, main .kalkulacka .kalkulacka_prislusenstvi {
  flex: 1;
}
body .kalkulacka .kalkulacka_prislusenstvi > p, html .kalkulacka .kalkulacka_prislusenstvi > p, main .kalkulacka .kalkulacka_prislusenstvi > p {
  margin-bottom: 16px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 700;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kalkulacka .kalkulacka_polozka, html .kalkulacka .kalkulacka_polozka, main .kalkulacka .kalkulacka_polozka {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  cursor: pointer;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kalkulacka .kalkulacka_polozka:last-child, html .kalkulacka .kalkulacka_polozka:last-child, main .kalkulacka .kalkulacka_polozka:last-child {
  margin-bottom: 0;
}
body .kalkulacka .kalkulacka_checkbox, html .kalkulacka .kalkulacka_checkbox, main .kalkulacka .kalkulacka_checkbox {
  -webkit-appearance: none;
  appearance: none;
  display: grid;
  place-items: center;
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid var(--barva-border-E0);
  background-color: var(--barva-cena-box);
  cursor: pointer;
  transition: background-color 200ms, border-color 200ms;
}
body .kalkulacka .kalkulacka_checkbox::before, html .kalkulacka .kalkulacka_checkbox::before, main .kalkulacka .kalkulacka_checkbox::before {
  content: "";
  width: 10px;
  height: 6px;
  border-left: 2px solid var(--bila);
  border-bottom: 2px solid var(--bila);
  transform: rotate(-45deg) translateY(-1px);
  opacity: 0;
}
body .kalkulacka .kalkulacka_checkbox:checked, html .kalkulacka .kalkulacka_checkbox:checked, main .kalkulacka .kalkulacka_checkbox:checked {
  background-color: var(--primarni);
  border-color: var(--primarni);
}
body .kalkulacka .kalkulacka_checkbox:checked::before, html .kalkulacka .kalkulacka_checkbox:checked::before, main .kalkulacka .kalkulacka_checkbox:checked::before {
  opacity: 1;
}
body .kalkulacka .kalkulacka_cena, html .kalkulacka .kalkulacka_cena, main .kalkulacka .kalkulacka_cena {
  flex: none;
  padding: 20px 32px;
  border-radius: var(--zaobleni);
  background-color: var(--barva-cena-box);
  text-align: center;
}
body .kalkulacka .kalkulacka_cena .kalkulacka_cena_hodnota, html .kalkulacka .kalkulacka_cena .kalkulacka_cena_hodnota, main .kalkulacka .kalkulacka_cena .kalkulacka_cena_hodnota {
  font-weight: 700;
}
@media (min-width: 768px) {
  body .kalkulacka .kalkulacka_cena, html .kalkulacka .kalkulacka_cena, main .kalkulacka .kalkulacka_cena {
    min-width: 220px;
  }
}
body .kalkulacka .kalkulacka_cena span, html .kalkulacka .kalkulacka_cena span, main .kalkulacka .kalkulacka_cena span {
  display: block;
  margin-bottom: 10px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kalkulacka .kalkulacka_cena strong, html .kalkulacka .kalkulacka_cena strong, main .kalkulacka .kalkulacka_cena strong {
  display: inline-block;
  padding-bottom: 6px;
  border-bottom: 2px solid var(--primarni);
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo32);
  line-height: 100%;
  letter-spacing: -1px;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kalkulacka .kalkulacka_tlacitko, html .kalkulacka .kalkulacka_tlacitko, main .kalkulacka .kalkulacka_tlacitko {
  display: flex;
  justify-content: center;
  width: 100%;
}
body .pokladka .pokladka_grid, html .pokladka .pokladka_grid, main .pokladka .pokladka_grid {
  display: grid;
  gap: 32px;
}
body .pokladka .pokladka_grid > *, html .pokladka .pokladka_grid > *, main .pokladka .pokladka_grid > * {
  min-width: 0;
}
@media (min-width: 1024px) {
  body .pokladka .pokladka_grid, html .pokladka .pokladka_grid, main .pokladka .pokladka_grid {
    grid-template-columns: 1fr 438px;
    align-items: start;
    gap: 56px;
  }
}
body .pokladka .pokladka_text h2, html .pokladka .pokladka_text h2, main .pokladka .pokladka_text h2 {
    font-family: "Satoshi medium";
    color: #1B0E04;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px; /* 116.667% */
    letter-spacing: -2px;
    max-width: 625px;
}
body .pokladka .pokladka_text p, html .pokladka .pokladka_text p, main .pokladka .pokladka_text p {
  font-family: "Satoshi regular";
  margin-top: 32px;
  color: var(--text-pismo);
  line-height: 32px;
  text-align: justify;
  max-width: 575px;
}
body .pokladka .pokladka_text strong {
    color: #920638;
}
body .pokladka .pokladka_obrazek, html .pokladka .pokladka_obrazek, main .pokladka .pokladka_obrazek {
  position: relative;
}
body .pokladka .pokladka_obrazek img, html .pokladka .pokladka_obrazek img, main .pokladka .pokladka_obrazek img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  border-radius: var(--zaobleni-velke);
}
body .pokladka .pokladka_obrazek .pokladka_prehrat, html .pokladka .pokladka_obrazek .pokladka_prehrat, main .pokladka .pokladka_obrazek .pokladka_prehrat {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: var(--primarni);
}
body .pokladka .pokladka_obrazek .pokladka_prehrat::before, html .pokladka .pokladka_obrazek .pokladka_prehrat::before, main .pokladka .pokladka_obrazek .pokladka_prehrat::before {
  content: "";
  width: 0;
  height: 0;
  margin-left: 4px;
  border-style: solid;
  border-width: 10px 0 10px 16px;
  border-color: transparent transparent transparent var(--bila);
}
body .pokladka .pokladka_obrazek .label, html .pokladka .pokladka_obrazek .label, main .pokladka .pokladka_obrazek .label {
  position: absolute;
  padding: 12px 24px;
  border-radius: 100px;
  background-color: var(--nadpis-pismo);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: -1px;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .pokladka .pokladka_obrazek .label_1, html .pokladka .pokladka_obrazek .label_1, main .pokladka .pokladka_obrazek .label_1 {
  top: 48px;
  left: 0;
}
body .pokladka .pokladka_obrazek .label_2, html .pokladka .pokladka_obrazek .label_2, main .pokladka .pokladka_obrazek .label_2 {
  top: 45%;
  right: 0;
}
body .pokladka .pokladka_obrazek .label_3, html .pokladka .pokladka_obrazek .label_3, main .pokladka .pokladka_obrazek .label_3 {
  bottom: 48px;
  left: 0;
}
@media (min-width: 1024px) {
  body .pokladka .pokladka_obrazek .label_1, html .pokladka .pokladka_obrazek .label_1, main .pokladka .pokladka_obrazek .label_1 {
    left: -10px;
  }
  body .pokladka .pokladka_obrazek .label_2, html .pokladka .pokladka_obrazek .label_2, main .pokladka .pokladka_obrazek .label_2 {
    right: -10px;
  }
  body .pokladka .pokladka_obrazek .label_3, html .pokladka .pokladka_obrazek .label_3, main .pokladka .pokladka_obrazek .label_3 {
    left: -10px;
  }
}
body .promena .sekce_info_produkty_stred h2, html .promena .sekce_info_produkty_stred h2, main .promena .sekce_info_produkty_stred h2 {
  font-family: "Satoshi medium";
  line-height: 52px;
}
body .promena .stitek .ikona_smer, html .promena .stitek .ikona_smer, main .promena .stitek .ikona_smer {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--primarni);
  color: var(--primarni);
}
body .promena .stitek .ikona_smer::before, html .promena .stitek .ikona_smer::before, main .promena .stitek .ikona_smer::before {
  content: "";
  width: 12px;
  height: 12px;
  background-color: currentColor;
  -webkit-mask: url("../img/arrow-right.svg") center/12px 12px no-repeat;
  mask: url("../img/arrow-right.svg") center/12px 12px no-repeat;
}
body .promena .promena_porovnani, html .promena .promena_porovnani, main .promena .promena_porovnani {
  position: relative;
  display: grid;
  gap: 4px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  body .promena .promena_porovnani, html .promena .promena_porovnani, main .promena .promena_porovnani {
    grid-template-columns: 1fr 1fr;
  }
}
body .promena .promena_snimek_wrap, html .promena .promena_snimek_wrap, main .promena .promena_snimek_wrap {
  position: relative;
  overflow: hidden;
}
body .promena .promena_snimek_wrap:first-of-type, html .promena .promena_snimek_wrap:first-of-type, main .promena .promena_snimek_wrap:first-of-type {
  border-radius: var(--zaobleni-velke) var(--zaobleni-velke) 0 0;
}
@media (min-width: 768px) {
  body .promena .promena_snimek_wrap:first-of-type, html .promena .promena_snimek_wrap:first-of-type, main .promena .promena_snimek_wrap:first-of-type {
    border-radius: var(--zaobleni-velke) 0 0 var(--zaobleni-velke);
  }
}
body .promena .promena_snimek_wrap:last-of-type, html .promena .promena_snimek_wrap:last-of-type, main .promena .promena_snimek_wrap:last-of-type {
  border-radius: 0 0 var(--zaobleni-velke) var(--zaobleni-velke);
}
@media (min-width: 768px) {
  body .promena .promena_snimek_wrap:last-of-type, html .promena .promena_snimek_wrap:last-of-type, main .promena .promena_snimek_wrap:last-of-type {
    border-radius: 0 var(--zaobleni-velke) var(--zaobleni-velke) 0;
  }
}
body .promena .promena_snimek, html .promena .promena_snimek, main .promena .promena_snimek {
  display: block;
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
}
@media (min-width: 768px) {
  body .promena .promena_snimek, html .promena .promena_snimek, main .promena .promena_snimek {
    height: 394px;
  }
}
body .promena .promena_stitek, html .promena .promena_stitek, main .promena .promena_stitek {
  position: absolute;
  top: 20px;
  display: inline-flex;
  align-items: center;
  padding: 10px 24px;
  border-radius: 100px;
  background-color: var(--primarni);
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--bila);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .promena .promena_stitek.promena_stitek_pred, html .promena .promena_stitek.promena_stitek_pred, main .promena .promena_stitek.promena_stitek_pred {
  left: 20px;
}
body .promena .promena_stitek.promena_stitek_po, html .promena .promena_stitek.promena_stitek_po, main .promena .promena_stitek.promena_stitek_po {
  right: 20px;
}
body .promena .promena_sipka, html .promena .promena_sipka, main .promena .promena_sipka {
  position: absolute;
  top: 50%;
  left: 44%;
  transform: translate(-50%, -50%);
  rotate: 90deg;
}
@media (min-width: 768px) {
  body .promena .promena_sipka, html .promena .promena_sipka, main .promena .promena_sipka {
    left: 50%;
    rotate: 0deg;
  }
}
body .promena .promena_sipka, html .promena .promena_sipka, main .promena .promena_sipka {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: var(--bila);
  box-shadow: 0 6px 18px var(--rgba-cerna01);
  color: var(--primarni);
}
body .promena .promena_sipka::before, html .promena .promena_sipka::before, main .promena .promena_sipka::before {
  content: "";
  width: 20px;
  height: 20px;
  background-color: currentColor;
  -webkit-mask: url("../img/arrow-right.svg") center/20px 20px no-repeat;
  mask: url("../img/arrow-right.svg") center/20px 20px no-repeat;
}
body .promena .promena_vyzva, html .promena .promena_vyzva, main .promena .promena_vyzva {
  text-align: center;
}
body .promena .promena_vyzva p, html .promena .promena_vyzva p, main .promena .promena_vyzva p {
  margin-bottom: 8px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 32px;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .promena .promena_vyzva p:last-of-type, html .promena .promena_vyzva p:last-of-type, main .promena .promena_vyzva p:last-of-type {
  margin-bottom: 28px;
}
body .promena .promena_vyzva .tlacitko, html .promena .promena_vyzva .tlacitko, main .promena .promena_vyzva .tlacitko {
  font-size: var(--pismo24);
}
body .promena .promena_vyzva .tlacitko img, html .promena .promena_vyzva .tlacitko img, main .promena .promena_vyzva .tlacitko img {
  width: 20px;
  height: 20px;
}
body .specifikace > .zarovnani > .stitek, html .specifikace > .zarovnani > .stitek, main .specifikace > .zarovnani > .stitek {
  margin-bottom: 24px;
}
body .specifikace .specifikace_nadpis, html .specifikace .specifikace_nadpis, main .specifikace .specifikace_nadpis {
  position: relative;
  font-family: "Satoshi medium";
  margin-bottom: 40px;
  padding-bottom: 24px;
  line-height: 52px;
}
body .specifikace .specifikace_nadpis::after, html .specifikace .specifikace_nadpis::after, main .specifikace .specifikace_nadpis::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 64px;
  height: 4px;
  border-radius: 100px;
  background-color: var(--primarni);
}
body .specifikace .specifikace_grid, html .specifikace .specifikace_grid, main .specifikace .specifikace_grid {
  display: grid;
  gap: 32px;
}
body .specifikace .specifikace_grid > *, html .specifikace .specifikace_grid > *, main .specifikace .specifikace_grid > * {
  min-width: 0;
}
@media (min-width: 1024px) {
  body .specifikace .specifikace_grid, html .specifikace .specifikace_grid, main .specifikace .specifikace_grid {
    grid-template-columns: 1fr 391px;
    gap: 56px;
  }
}
body .specifikace .specifikace_seznam, html .specifikace .specifikace_seznam, main .specifikace .specifikace_seznam {
  list-style: disc;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body .specifikace .specifikace_seznam li, html .specifikace .specifikace_seznam li, main .specifikace .specifikace_seznam li {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .specifikace .specifikace_seznam li strong, html .specifikace .specifikace_seznam li strong, main .specifikace .specifikace_seznam li strong {
  font-family: "Satoshi bold";
  font-weight: 500;
  color: var(--nadpis-pismo);
}
body .specifikace .specifikace_obrazek img, html .specifikace .specifikace_obrazek img, main .specifikace .specifikace_obrazek img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: var(--zaobleni-velke);
}
@media (max-width: 768px) {
  body .specifikace .specifikace_obrazek img, html .specifikace .specifikace_obrazek img, main .specifikace .specifikace_obrazek img {
    max-width: 100%;
  }
}
body .podobne .sekce_info_produkty h2, html .podobne .sekce_info_produkty h2, main .podobne .sekce_info_produkty h2 {
  font-family: "Satoshi medium";
  line-height: 52px;
}
body .podobne .podobne_carousel, html .podobne .podobne_carousel, main .podobne .podobne_carousel {
  position: relative;
}
body .podobne .podobne_track, html .podobne .podobne_track, main .podobne .podobne_track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
body .podobne .podobne_track::-webkit-scrollbar, html .podobne .podobne_track::-webkit-scrollbar, main .podobne .podobne_track::-webkit-scrollbar {
  display: none;
}
body .podobne .podobne_track .produkt, html .podobne .podobne_track .produkt, main .podobne .podobne_track .produkt {
  flex: 0 0 85%;
  scroll-snap-align: start;
}
@media (min-width: 600px) {
  body .podobne .podobne_track .produkt, html .podobne .podobne_track .produkt, main .podobne .podobne_track .produkt {
    flex-basis: calc(50% - 12px);
  }
}
@media (min-width: 1024px) {
  body .podobne .podobne_track .produkt, html .podobne .podobne_track .produkt, main .podobne .podobne_track .produkt {
    flex-basis: calc((100% - 48px) / 3);
  }
}
body .podobne .podobne_track .produkt.aktivni .sipka, html .podobne .podobne_track .produkt.aktivni .sipka, main .podobne .podobne_track .produkt.aktivni .sipka {
  background-color: var(--primarni);
  color: var(--bila);
  rotate: -45deg;
}
body .podobne .podobne_ovladani, html .podobne .podobne_ovladani, main .podobne .podobne_ovladani {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 32px;
}
body .podobne .sip, html .podobne .sip, main .podobne .sip {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--sipka-border);
  color: var(--primarni);
  background: none;
  cursor: pointer;
  font-size: var(--pismo24);
  transition: background-color 300ms, color 300ms;
}
body .podobne .sip:hover, html .podobne .sip:hover, main .podobne .sip:hover {
  background-color: var(--primarni);
  color: var(--bila);
}
body .sekce_info_produkty.sekce_info_produkty_stred h1, html .sekce_info_produkty.sekce_info_produkty_stred h1, main .sekce_info_produkty.sekce_info_produkty_stred h1 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo40);
  line-height: 110%;
  letter-spacing: -2px;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  body .sekce_info_produkty.sekce_info_produkty_stred h1, html .sekce_info_produkty.sekce_info_produkty_stred h1, main .sekce_info_produkty.sekce_info_produkty_stred h1 {
    font-size: var(--pismo54);
  }
}
body .nadpis_podstrany, html .nadpis_podstrany, main .nadpis_podstrany {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo28);
  line-height: 130%;
  letter-spacing: -1px;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  body .nadpis_podstrany, html .nadpis_podstrany, main .nadpis_podstrany {
    font-size: var(--pismo32);
    margin-bottom: 32px;
  }
}
body .tlacitko.tlacitko_siroke, html .tlacitko.tlacitko_siroke, main .tlacitko.tlacitko_siroke {
  justify-content: center;
  width: 100%;
  max-width: 375px;
  padding: 16px 28px;
  font-size: var(--pismo18);
}
body .kosik_tabulka + .tlacitko, body .vyber_skupina + .tlacitko, html .kosik_tabulka + .tlacitko, html .vyber_skupina + .tlacitko, main .kosik_tabulka + .tlacitko, main .vyber_skupina + .tlacitko {
  margin-top: 24px;
}
body .drobecky, html .drobecky, main .drobecky {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  body .drobecky, html .drobecky, main .drobecky {
    margin-bottom: 48px;
  }
}
body .drobecky a, body .drobecky > span, html .drobecky a, html .drobecky > span, main .drobecky a, main .drobecky > span {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo15);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--sedomodre-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
  transition: color 300ms ease;
}
body .drobecky a:hover, html .drobecky a:hover, main .drobecky a:hover {
  color: var(--primarni);
}
body .drobecky .aktivni, html .drobecky .aktivni, main .drobecky .aktivni {
  font-family: "Satoshi medium";
  color: var(--primarni);
}
body .drobecky .domu, body .drobecky .oddelovac, html .drobecky .domu, html .drobecky .oddelovac, main .drobecky .domu, main .drobecky .oddelovac {
  display: inline-flex;
  align-items: center;
}
body .drobecky .domu::before, html .drobecky .domu::before, main .drobecky .domu::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  flex: none;
  -webkit-mask: url("../img/ico_domu.svg") center/20px 20px no-repeat;
  mask: url("../img/ico_domu.svg") center/20px 20px no-repeat;
  background-color: var(--sedomodre-pismo);
  transition: background-color 300ms ease;
}
body .drobecky .domu:hover::before, html .drobecky .domu:hover::before, main .drobecky .domu:hover::before {
  background-color: var(--primarni);
}
body .drobecky .oddelovac::before, html .drobecky .oddelovac::before, main .drobecky .oddelovac::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  flex: none;
  -webkit-mask: url("../img/ico_chevron.svg") center/16px 16px no-repeat;
  mask: url("../img/ico_chevron.svg") center/16px 16px no-repeat;
  background-color: var(--sede-pismo-svetle);
}
body .posuvnik, html .posuvnik, main .posuvnik {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 6px;
  border-radius: 100px;
  background: linear-gradient(to right, var(--primarni) 0%, var(--primarni) var(--postup, 25%), var(--barva-slider-background) var(--postup, 25%), var(--barva-slider-background) 100%);
  cursor: pointer;
}
body .posuvnik::-webkit-slider-thumb, html .posuvnik::-webkit-slider-thumb, main .posuvnik::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--primarni);
  border: 3px solid var(--bila);
  box-shadow: 0 2px 6px var(--rgba-cerna01);
  cursor: pointer;
}
body .posuvnik::-moz-range-track, html .posuvnik::-moz-range-track, main .posuvnik::-moz-range-track {
  height: 6px;
  border-radius: 100px;
  background: var(--barva-slider-background);
}
body .posuvnik::-moz-range-progress, html .posuvnik::-moz-range-progress, main .posuvnik::-moz-range-progress {
  height: 6px;
  border-radius: 100px;
  background: var(--primarni);
}
body .posuvnik::-moz-range-thumb, html .posuvnik::-moz-range-thumb, main .posuvnik::-moz-range-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--primarni);
  border: 3px solid var(--bila);
  cursor: pointer;
}
body .pole_checkbox, html .pole_checkbox, main .pole_checkbox {
  -webkit-appearance: none;
  appearance: none;
  display: grid;
  place-items: center;
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid var(--barva-border-E0);
  background-color: var(--barva-cena-box);
  cursor: pointer;
  transition: background-color 200ms, border-color 200ms;
}
body .pole_checkbox::before, html .pole_checkbox::before, main .pole_checkbox::before {
  content: "";
  width: 10px;
  height: 6px;
  border-left: 2px solid var(--bila);
  border-bottom: 2px solid var(--bila);
  transform: rotate(-45deg) translateY(-1px);
  opacity: 0;
}
body .pole_checkbox:checked, html .pole_checkbox:checked, main .pole_checkbox:checked {
  background-color: var(--primarni);
  border-color: var(--primarni);
}
body .pole_checkbox:checked::before, html .pole_checkbox:checked::before, main .pole_checkbox:checked::before {
  opacity: 1;
}
body .pole_radio, html .pole_radio, main .pole_radio {
  -webkit-appearance: none;
  appearance: none;
  display: grid;
  place-items: center;
  flex: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid var(--barva-border-E0);
  background-color: var(--pole-pozadi);
  cursor: pointer;
  transition: border-color 200ms;
}
body .pole_radio::before, html .pole_radio::before, main .pole_radio::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--primarni);
  opacity: 0;
  transition: opacity 200ms;
}
body .pole_radio:checked, html .pole_radio:checked, main .pole_radio:checked {
  border-color: var(--primarni);
}
body .pole_radio:checked::before, html .pole_radio:checked::before, main .pole_radio:checked::before {
  opacity: 1;
}
body .pole_polozka, html .pole_polozka, main .pole_polozka {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  cursor: pointer;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .pole_polozka:last-child, html .pole_polozka:last-child, main .pole_polozka:last-child {
  margin-bottom: 0;
}
body .formular, html .formular, main .formular {
  max-width: 872px;
}
body .formular .formular_mrizka, html .formular .formular_mrizka, main .formular .formular_mrizka {
  display: grid;
  gap: 20px;
  margin-bottom: 28px;
}
body .formular .formular_radek, html .formular .formular_radek, main .formular .formular_radek {
  display: grid;
  gap: 20px;
}
@media (min-width: 600px) {
  body .formular .formular_radek, html .formular .formular_radek, main .formular .formular_radek {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 600px) {
  body .formular .formular_radek_mesto, html .formular .formular_radek_mesto, main .formular .formular_radek_mesto {
    grid-template-columns: 1fr 150px 120px;
  }
}
body .formular .formular_pole, html .formular .formular_pole, main .formular .formular_pole {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
body .formular label, html .formular label, main .formular label {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo15);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .formular input[type=text], body .formular input[type=email], body .formular input[type=tel], body .formular select, body .formular textarea, html .formular input[type=text], html .formular input[type=email], html .formular input[type=tel], html .formular select, html .formular textarea, main .formular input[type=text], main .formular input[type=email], main .formular input[type=tel], main .formular select, main .formular textarea {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  background-color: var(--pole-pozadi);
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: border-color 300ms ease;
}
body .formular input[type=text]::placeholder, body .formular input[type=email]::placeholder, body .formular input[type=tel]::placeholder, body .formular select::placeholder, body .formular textarea::placeholder, html .formular input[type=text]::placeholder, html .formular input[type=email]::placeholder, html .formular input[type=tel]::placeholder, html .formular select::placeholder, html .formular textarea::placeholder, main .formular input[type=text]::placeholder, main .formular input[type=email]::placeholder, main .formular input[type=tel]::placeholder, main .formular select::placeholder, main .formular textarea::placeholder {
  color: var(--pismo-seda-placeholder);
}
body .formular input[type=text]:focus, body .formular input[type=email]:focus, body .formular input[type=tel]:focus, body .formular select:focus, body .formular textarea:focus, html .formular input[type=text]:focus, html .formular input[type=email]:focus, html .formular input[type=tel]:focus, html .formular select:focus, html .formular textarea:focus, main .formular input[type=text]:focus, main .formular input[type=email]:focus, main .formular input[type=tel]:focus, main .formular select:focus, main .formular textarea:focus {
  border-color: var(--primarni);
}
body .formular textarea, html .formular textarea, main .formular textarea {
  min-height: 104px;
  line-height: 150%;
  resize: vertical;
}
body .formular .doplnkova_adresa, html .formular .doplnkova_adresa, main .formular .doplnkova_adresa {
  margin-top: 20px;
}
body .formular .tlacitko, html .formular .tlacitko, main .formular .tlacitko {
  margin-top: 24px;
}
body .formular select, html .formular select, main .formular select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 44px;
  cursor: pointer;
  background-image: url("../img/ico_chevron_dolu.svg");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 18px 18px;
}
body .kosik_grid, html .kosik_grid, main .kosik_grid {
  display: grid;
  gap: 24px;
  align-items: start;
}
@media (min-width: 1024px) {
  body .kosik_grid, html .kosik_grid, main .kosik_grid {
    grid-template-columns: 1fr 384px;
    gap: 28px;
  }
}
body .kosik_tabulka, html .kosik_tabulka, main .kosik_tabulka {
  background-color: var(--bila);
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  overflow: hidden;
}
body .kosik_tabulka .kosik_hlavicka, html .kosik_tabulka .kosik_hlavicka, main .kosik_tabulka .kosik_hlavicka {
  display: none;
}
@media (min-width: 768px) {
  body .kosik_tabulka .kosik_hlavicka, html .kosik_tabulka .kosik_hlavicka, main .kosik_tabulka .kosik_hlavicka {
    display: grid;
    grid-template-columns: 1fr 120px 170px 120px 40px;
    align-items: center;
    gap: 16px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--barva-border-E0);
  }
}
body .kosik_tabulka .kosik_hlavicka span, html .kosik_tabulka .kosik_hlavicka span, main .kosik_tabulka .kosik_hlavicka span {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo12);
  line-height: 100%;
  letter-spacing: 1px;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-transform: uppercase;
}
body .kosik_tabulka .kosik_hlavicka span:first-child, html .kosik_tabulka .kosik_hlavicka span:first-child, main .kosik_tabulka .kosik_hlavicka span:first-child {
  padding-left: 14px;
  border-left: 2px solid var(--primarni);
}
body .kosik_tabulka .kosik_polozka, html .kosik_tabulka .kosik_polozka, main .kosik_tabulka .kosik_polozka {
  display: grid;
  gap: 14px;
  padding: 20px;
}
@media (min-width: 768px) {
  body .kosik_tabulka .kosik_polozka, html .kosik_tabulka .kosik_polozka, main .kosik_tabulka .kosik_polozka {
    grid-template-columns: 1fr 120px 170px 120px 40px;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
  }
}
body .kosik_tabulka .kosik_polozka + .kosik_polozka, html .kosik_tabulka .kosik_polozka + .kosik_polozka, main .kosik_tabulka .kosik_polozka + .kosik_polozka {
  border-top: 1px solid var(--barva-border-E0);
}
body .kosik_tabulka .kosik_produkt, html .kosik_tabulka .kosik_produkt, main .kosik_tabulka .kosik_produkt {
  display: flex;
  align-items: center;
  gap: 16px;
}
body .kosik_tabulka .kosik_produkt img, html .kosik_tabulka .kosik_produkt img, main .kosik_tabulka .kosik_produkt img {
  flex: none;
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 10px;
}
body .kosik_tabulka .kosik_produkt h3, html .kosik_tabulka .kosik_produkt h3, main .kosik_tabulka .kosik_produkt h3 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 6px;
}
body .kosik_tabulka .kosik_produkt .skladem, html .kosik_tabulka .kosik_produkt .skladem, main .kosik_tabulka .kosik_produkt .skladem {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--zelena);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kosik_tabulka .kosik_popisek, html .kosik_tabulka .kosik_popisek, main .kosik_tabulka .kosik_popisek {
  display: inline-block;
  min-width: 96px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo12);
  line-height: 100%;
  letter-spacing: 1px;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  body .kosik_tabulka .kosik_popisek, html .kosik_tabulka .kosik_popisek, main .kosik_tabulka .kosik_popisek {
    display: none;
  }
}
body .kosik_tabulka .kosik_bunka, html .kosik_tabulka .kosik_bunka, main .kosik_tabulka .kosik_bunka {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .kosik_tabulka .kosik_celkem, html .kosik_tabulka .kosik_celkem, main .kosik_tabulka .kosik_celkem {
  font-family: "Satoshi medium";
}
body .pocet_stepper, html .pocet_stepper, main .pocet_stepper {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--barva-border-E0);
  border-radius: 100px;
  background-color: var(--bila);
}
body .pocet_stepper button, html .pocet_stepper button, main .pocet_stepper button {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: none;
  cursor: pointer;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color 300ms ease, color 300ms ease;
}
body .pocet_stepper button:hover, html .pocet_stepper button:hover, main .pocet_stepper button:hover {
  background-color: var(--badge-pozadi);
  color: var(--primarni);
}
body .pocet_stepper .hodnota, html .pocet_stepper .hodnota, main .pocet_stepper .hodnota {
  min-width: 56px;
  text-align: center;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .odebrat, html .odebrat, main .odebrat {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--primarni);
  background: none;
  color: var(--primarni);
  cursor: pointer;
  transition: background-color 300ms ease, color 300ms ease;
}
body .odebrat::before, html .odebrat::before, main .odebrat::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  flex: none;
  -webkit-mask: url("../img/ico_zavrit.svg") center/14px 14px no-repeat;
  mask: url("../img/ico_zavrit.svg") center/14px 14px no-repeat;
  background-color: currentColor;
}
body .odebrat:hover, html .odebrat:hover, main .odebrat:hover {
  background-color: var(--primarni);
  color: var(--bila);
}
body .postranni_panel, html .postranni_panel, main .postranni_panel {
  background-color: var(--bila);
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  padding: 24px;
}
body .postranni_panel > h2, html .postranni_panel > h2, main .postranni_panel > h2 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo22);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 8px;
}
body .postranni_panel .panel_polozka, html .postranni_panel .panel_polozka, main .postranni_panel .panel_polozka {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
}
body .postranni_panel .panel_polozka + .panel_polozka, html .postranni_panel .panel_polozka + .panel_polozka, main .postranni_panel .panel_polozka + .panel_polozka {
  border-top: 1px solid var(--bily-border);
}
body .postranni_panel .panel_polozka img, html .postranni_panel .panel_polozka img, main .postranni_panel .panel_polozka img {
  flex: none;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 10px;
}
body .postranni_panel .panel_polozka .panel_nazev, html .postranni_panel .panel_polozka .panel_nazev, main .postranni_panel .panel_polozka .panel_nazev {
  flex: 1;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel .panel_polozka .panel_pocet, html .postranni_panel .panel_polozka .panel_pocet, main .postranni_panel .panel_polozka .panel_pocet {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--sede-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel .panel_polozka .panel_cena, html .postranni_panel .panel_polozka .panel_cena, main .postranni_panel .panel_polozka .panel_cena {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel .panel_celkem, html .postranni_panel .panel_celkem, main .postranni_panel .panel_celkem {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-top: 18px;
  border-top: 1px solid var(--barva-border-E0);
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel .panel_celkem strong, html .postranni_panel .panel_celkem strong, main .postranni_panel .panel_celkem strong {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo20);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel.postranni_panel_svetly, html .postranni_panel.postranni_panel_svetly, main .postranni_panel.postranni_panel_svetly {
  background-color: var(--barva-svetla-hneda);
  border-color: var(--bily-border);
}
body .postranni_panel.postranni_panel_svetly > h2, html .postranni_panel.postranni_panel_svetly > h2, main .postranni_panel.postranni_panel_svetly > h2 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 4px;
}
body .postranni_panel .panel_clanek, html .postranni_panel .panel_clanek, main .postranni_panel .panel_clanek {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 0;
  text-decoration: none;
}
body .postranni_panel .panel_clanek + .panel_clanek, html .postranni_panel .panel_clanek + .panel_clanek, main .postranni_panel .panel_clanek + .panel_clanek {
  border-top: 1px solid var(--bily-border);
}
body .postranni_panel .panel_clanek img, html .postranni_panel .panel_clanek img, main .postranni_panel .panel_clanek img {
  flex: none;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 10px;
}
body .postranni_panel .panel_clanek h3, html .postranni_panel .panel_clanek h3, main .postranni_panel .panel_clanek h3 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo14);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 6px;
  transition: color 300ms ease;
}
body .postranni_panel .panel_clanek .datum, html .postranni_panel .panel_clanek .datum, main .postranni_panel .panel_clanek .datum {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo12);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .postranni_panel .panel_clanek:hover h3, html .postranni_panel .panel_clanek:hover h3, main .postranni_panel .panel_clanek:hover h3 {
  color: var(--primarni);
}
body .vyber_skupina, html .vyber_skupina, main .vyber_skupina {
  background-color: var(--bila);
  border-radius: var(--zaobleni);
  padding: 20px;
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  body .vyber_skupina, html .vyber_skupina, main .vyber_skupina {
    padding: 24px;
  }
}
body .vyber_skupina > h2, html .vyber_skupina > h2, main .vyber_skupina > h2 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo18);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 18px;
}
body .vyber_karta, html .vyber_karta, main .vyber_karta {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  cursor: pointer;
  transition: border-color 300ms ease, box-shadow 300ms ease;
}
body .vyber_karta + .vyber_karta, html .vyber_karta + .vyber_karta, main .vyber_karta + .vyber_karta {
  margin-top: 12px;
}
body .vyber_karta .nazev, html .vyber_karta .nazev, main .vyber_karta .nazev {
  flex: 1;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .vyber_karta .cena, html .vyber_karta .cena, main .vyber_karta .cena {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .vyber_karta:hover, html .vyber_karta:hover, main .vyber_karta:hover {
  border-color: var(--primarni);
}
body .vyber_karta.vybrana, html .vyber_karta.vybrana, main .vyber_karta.vybrana {
  border-color: var(--primarni);
  box-shadow: 0 0 0 1px var(--primarni);
}
body .vyber_list .listy_volby, html .vyber_list .listy_volby, main .vyber_list .listy_volby {
  margin-bottom: 32px;
}
body .vyber_list .rozmer_box, html .vyber_list .rozmer_box, main .vyber_list .rozmer_box {
  background-color: var(--bila);
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  padding: 20px;
  margin-bottom: 32px;
  max-width: 720px;
}
body .vyber_list .rozmer_box .rozmer_doporuceni, html .vyber_list .rozmer_box .rozmer_doporuceni, main .vyber_list .rozmer_box .rozmer_doporuceni {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 18px;
}
body .vyber_list .rozmer_box .rozmer_doporuceni strong, html .vyber_list .rozmer_box .rozmer_doporuceni strong, main .vyber_list .rozmer_box .rozmer_doporuceni strong {
  font-family: "Satoshi bold";
}
body .vyber_list .rozmer_box .rozmer_popisek, html .vyber_list .rozmer_box .rozmer_popisek, main .vyber_list .rozmer_box .rozmer_popisek {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--sede-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .vyber_list .rozmer_box .rozmer_popisek .hodnota, html .vyber_list .rozmer_box .rozmer_popisek .hodnota, main .vyber_list .rozmer_box .rozmer_popisek .hodnota {
  font-family: "Satoshi medium";
  color: var(--nadpis-pismo);
}
body .vyber_list .listy_mrizka, html .vyber_list .listy_mrizka, main .vyber_list .listy_mrizka {
  margin-bottom: 32px;
}
body .lista_karta, html .lista_karta, main .lista_karta {
  display: block;
  background-color: var(--bila);
  border: 1px solid var(--barva-border-E0);
  border-radius: var(--zaobleni-male);
  padding: 14px;
  cursor: pointer;
  transition: border-color 300ms ease, box-shadow 300ms ease;
}
body .lista_karta .pole_radio, html .lista_karta .pole_radio, main .lista_karta .pole_radio {
  margin-bottom: 12px;
}
body .lista_karta img, html .lista_karta img, main .lista_karta img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: 14px;
}
body .lista_karta h3, html .lista_karta h3, main .lista_karta h3 {
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo15);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 8px;
}
body .lista_karta .cena_dph, html .lista_karta .cena_dph, main .lista_karta .cena_dph {
  display: block;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .lista_karta .cena_bez, html .lista_karta .cena_bez, main .lista_karta .cena_bez {
  display: block;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo14);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .lista_karta:hover, html .lista_karta:hover, main .lista_karta:hover {
  border-color: var(--primarni);
}
body .lista_karta.vybrana, html .lista_karta.vybrana, main .lista_karta.vybrana {
  border-color: var(--primarni);
  box-shadow: 0 0 0 1px var(--primarni);
}
body .shrnuti_tabulka, html .shrnuti_tabulka, main .shrnuti_tabulka {
  max-width: 720px;
}
@media (min-width: 768px) {
  body .shrnuti_tabulka .kosik_polozka, html .shrnuti_tabulka .kosik_polozka, main .shrnuti_tabulka .kosik_polozka {
    grid-template-columns: 1fr 120px 120px 120px;
  }
}
@media (min-width: 768px) {
  body .shrnuti_tabulka .kosik_hlavicka, html .shrnuti_tabulka .kosik_hlavicka, main .shrnuti_tabulka .kosik_hlavicka {
    grid-template-columns: 1fr 120px 120px 120px;
  }
}
body .shrnuti_radek, html .shrnuti_radek, main .shrnuti_radek {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-top: 1px solid var(--barva-border-E0);
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (min-width: 768px) {
  body .shrnuti_radek, html .shrnuti_radek, main .shrnuti_radek {
    padding: 18px 24px;
  }
}
body .shrnuti_celkem, html .shrnuti_celkem, main .shrnuti_celkem {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 20px;
  border-top: 2px solid var(--nadpis-pismo);
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo22);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (min-width: 768px) {
  body .shrnuti_celkem, html .shrnuti_celkem, main .shrnuti_celkem {
    padding: 22px 24px;
  }
}
body .vybrane_produkty + .nadpis_podstrany, html .vybrane_produkty + .nadpis_podstrany, main .vybrane_produkty + .nadpis_podstrany {
  margin-top: 48px;
}
@media (min-width: 768px) {
  body .vybrane_produkty + .nadpis_podstrany, html .vybrane_produkty + .nadpis_podstrany, main .vybrane_produkty + .nadpis_podstrany {
    margin-top: 56px;
  }
}
body .vybrane_produkty, html .vybrane_produkty, main .vybrane_produkty {
  max-width: 872px;
}
@media (min-width: 768px) {
  body .vybrane_produkty .kosik_hlavicka, html .vybrane_produkty .kosik_hlavicka, main .vybrane_produkty .kosik_hlavicka {
    grid-template-columns: 1fr 152px 148px 143px;
    gap: 0;
  }
}
body .vybrane_produkty .kosik_hlavicka span:first-child, html .vybrane_produkty .kosik_hlavicka span:first-child, main .vybrane_produkty .kosik_hlavicka span:first-child {
  padding-left: 0;
  border-left: 0;
}
body .vybrane_produkty .kosik_polozka, html .vybrane_produkty .kosik_polozka, main .vybrane_produkty .kosik_polozka {
  position: relative;
}
@media (min-width: 768px) {
  body .vybrane_produkty .kosik_polozka, html .vybrane_produkty .kosik_polozka, main .vybrane_produkty .kosik_polozka {
    grid-template-columns: 1fr 152px 148px 143px;
    gap: 0;
    padding: 24px;
  }
}
body .vybrane_produkty .kosik_polozka h3, html .vybrane_produkty .kosik_polozka h3, main .vybrane_produkty .kosik_polozka h3 {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .vybrane_produkty .kosik_polozka .kosik_celkem, html .vybrane_produkty .kosik_polozka .kosik_celkem, main .vybrane_produkty .kosik_polozka .kosik_celkem {
  font-family: "Satoshi regular";
}
body .vybrane_produkty .shrnuti_celkem, html .vybrane_produkty .shrnuti_celkem, main .vybrane_produkty .shrnuti_celkem {
  position: relative;
}
body .vybrane_produkty .kosik_polozka + .kosik_polozka, body .vybrane_produkty .shrnuti_celkem, html .vybrane_produkty .kosik_polozka + .kosik_polozka, html .vybrane_produkty .shrnuti_celkem, main .vybrane_produkty .kosik_polozka + .kosik_polozka, main .vybrane_produkty .shrnuti_celkem {
  border-top: 0;
}
body .vybrane_produkty .kosik_polozka + .kosik_polozka::before, body .vybrane_produkty .shrnuti_celkem::before, html .vybrane_produkty .kosik_polozka + .kosik_polozka::before, html .vybrane_produkty .shrnuti_celkem::before, main .vybrane_produkty .kosik_polozka + .kosik_polozka::before, main .vybrane_produkty .shrnuti_celkem::before {
  content: "";
  position: absolute;
  top: 0;
  left: 20px;
  right: 20px;
  height: 1px;
  background-color: var(--barva-border-E0);
}
@media (min-width: 768px) {
  body .vybrane_produkty .kosik_polozka + .kosik_polozka::before, body .vybrane_produkty .shrnuti_celkem::before, html .vybrane_produkty .kosik_polozka + .kosik_polozka::before, html .vybrane_produkty .shrnuti_celkem::before, main .vybrane_produkty .kosik_polozka + .kosik_polozka::before, main .vybrane_produkty .shrnuti_celkem::before {
    left: 24px;
    right: 24px;
  }
}
body .potvrzeni, html .potvrzeni, main .potvrzeni {
  min-height: 62vh;
}
body .potvrzeni .potvrzeni_karta, html .potvrzeni .potvrzeni_karta, main .potvrzeni .potvrzeni_karta {
  max-width: 904px;
  margin: 0 auto;
  padding: 48px 24px;
  background-color: var(--bila);
  border-radius: var(--zaobleni-velke);
  text-align: center;
}
@media (min-width: 768px) {
  body .potvrzeni .potvrzeni_karta, html .potvrzeni .potvrzeni_karta, main .potvrzeni .potvrzeni_karta {
    padding: 64px 48px;
  }
}
body .potvrzeni .potvrzeni_ikona, html .potvrzeni .potvrzeni_ikona, main .potvrzeni .potvrzeni_ikona {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  margin: 0 auto 28px;
  border-radius: 50%;
  background-color: var(--badge-pozadi);
}
body .potvrzeni .potvrzeni_ikona::before, html .potvrzeni .potvrzeni_ikona::before, main .potvrzeni .potvrzeni_ikona::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  flex: none;
  -webkit-mask: url("../img/ico_potvrzeno.svg") center/32px 32px no-repeat;
  mask: url("../img/ico_potvrzeno.svg") center/32px 32px no-repeat;
  background-color: var(--primarni);
}
body .potvrzeni h1, html .potvrzeni h1, main .potvrzeni h1 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo24);
  line-height: 130%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 20px;
}
body .potvrzeni p, html .potvrzeni p, main .potvrzeni p {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo15);
  line-height: 175%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .potvrzeni p strong, html .potvrzeni p strong, main .potvrzeni p strong {
  font-size: var(--pismo15);
}
body .potvrzeni .potvrzeni_akce, html .potvrzeni .potvrzeni_akce, main .potvrzeni .potvrzeni_akce {
  display: flex;
  justify-content: center;
  margin-top: 32px;
}
body .blog_vypis .hledani_clanku, html .blog_vypis .hledani_clanku, main .blog_vypis .hledani_clanku {
  position: relative;
  max-width: 320px;
  margin: 32px auto 0;
}
body .blog_vypis .hledani_clanku input, html .blog_vypis .hledani_clanku input, main .blog_vypis .hledani_clanku input {
  width: 100%;
  padding: 12px 16px 12px 46px;
  border: 1px solid var(--barva-border-E0);
  border-radius: 100px;
  background-color: var(--bila);
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo15);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: border-color 300ms ease;
}
body .blog_vypis .hledani_clanku input::placeholder, html .blog_vypis .hledani_clanku input::placeholder, main .blog_vypis .hledani_clanku input::placeholder {
  color: var(--pismo-seda-placeholder);
}
body .blog_vypis .hledani_clanku input:focus, html .blog_vypis .hledani_clanku input:focus, main .blog_vypis .hledani_clanku input:focus {
  border-color: var(--primarni);
}
body .blog_vypis .hledani_clanku .lupa, html .blog_vypis .hledani_clanku .lupa, main .blog_vypis .hledani_clanku .lupa {
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
}
body .blog_vypis .hledani_clanku .lupa::before, html .blog_vypis .hledani_clanku .lupa::before, main .blog_vypis .hledani_clanku .lupa::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  flex: none;
  -webkit-mask: url("../img/ico_lupa.svg") center/18px 18px no-repeat;
  mask: url("../img/ico_lupa.svg") center/18px 18px no-repeat;
  background-color: var(--sede-pismo-svetle);
}
body .blog_vypis .clanek, html .blog_vypis .clanek, main .blog_vypis .clanek {
  display: flex;
  flex-direction: column;
  background-color: var(--barva-svetla-hneda);
  padding: 12px;
}
body .blog_vypis .clanek[hidden], html .blog_vypis .clanek[hidden], main .blog_vypis .clanek[hidden] {
  display: none;
}
body .blog_vypis .clanek_obrazek, html .blog_vypis .clanek_obrazek, main .blog_vypis .clanek_obrazek {
  border-radius: 20px;
  aspect-ratio: 4/3;
}
body .blog_vypis .clanek_info, html .blog_vypis .clanek_info, main .blog_vypis .clanek_info {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 18px 8px 8px;
}
body .blog_vypis .rubrika, html .blog_vypis .rubrika, main .blog_vypis .rubrika {
  display: block;
  margin-bottom: 10px;
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .blog_vypis .clanek_info h3, html .blog_vypis .clanek_info h3, main .blog_vypis .clanek_info h3 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo16);
  line-height: 140%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 0 10px;
}
body .blog_vypis .clanek_autor, html .blog_vypis .clanek_autor, main .blog_vypis .clanek_autor {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  padding-top: 24px;
}
body .blog_vypis .clanek_autor img, html .blog_vypis .clanek_autor img, main .blog_vypis .clanek_autor img {
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
body .blog_vypis .clanek_autor .jmeno, html .blog_vypis .clanek_autor .jmeno, main .blog_vypis .clanek_autor .jmeno {
  display: block;
  margin-bottom: 4px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo14);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .blog_vypis .clanek_autor .datum, html .blog_vypis .clanek_autor .datum, main .blog_vypis .clanek_autor .datum {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo13);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .blog_vypis .zadny_vysledek, html .blog_vypis .zadny_vysledek, main .blog_vypis .zadny_vysledek {
  display: none;
  text-align: center;
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo18);
  line-height: 150%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .blog_vypis .zadny_vysledek.zobrazeno, html .blog_vypis .zadny_vysledek.zobrazeno, main .blog_vypis .zadny_vysledek.zobrazeno {
  display: block;
}
body .clanek_detail .clanek_detail_grid, html .clanek_detail .clanek_detail_grid, main .clanek_detail .clanek_detail_grid {
  display: grid;
  gap: 32px;
  align-items: start;
}
@media (min-width: 1024px) {
  body .clanek_detail .clanek_detail_grid, html .clanek_detail .clanek_detail_grid, main .clanek_detail .clanek_detail_grid {
    grid-template-columns: 1fr 340px;
    gap: 40px;
  }
}
@media (min-width: 1024px) {
  body .clanek_detail .postranni_panel, html .clanek_detail .postranni_panel, main .clanek_detail .postranni_panel {
    position: sticky;
    top: 104px;
  }
}
body .clanek_detail .clanek_hero, html .clanek_detail .clanek_hero, main .clanek_detail .clanek_hero {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: var(--zaobleni);
  margin-bottom: 28px;
}
body .clanek_detail h1, html .clanek_detail h1, main .clanek_detail h1 {
  font-family: "Satoshi bold";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo28);
  line-height: 135%;
  letter-spacing: -1px;
  color: var(--primarni);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  body .clanek_detail h1, html .clanek_detail h1, main .clanek_detail h1 {
    font-size: var(--pismo32);
  }
}
body .clanek_detail .clanek_meta, html .clanek_detail .clanek_meta, main .clanek_detail .clanek_meta {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  margin-bottom: 32px;
  background-color: var(--bila);
  border: 1px solid var(--bily-border);
  border-radius: var(--zaobleni-male);
}
body .clanek_detail .clanek_meta .avatar, html .clanek_detail .clanek_meta .avatar, main .clanek_detail .clanek_meta .avatar {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
}
body .clanek_detail .clanek_meta .meta_text, html .clanek_detail .clanek_meta .meta_text, main .clanek_detail .clanek_meta .meta_text {
  flex: 1;
}
body .clanek_detail .clanek_meta .jmeno, html .clanek_detail .clanek_meta .jmeno, main .clanek_detail .clanek_meta .jmeno {
  display: block;
  margin-bottom: 4px;
  font-family: "Satoshi medium";
  font-style: normal;
  font-weight: 500;
  font-size: var(--pismo15);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--nadpis-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .clanek_detail .clanek_meta .doplnek, html .clanek_detail .clanek_meta .doplnek, main .clanek_detail .clanek_meta .doplnek {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo13);
  line-height: 100%;
  letter-spacing: 0;
  color: var(--sede-pismo-svetle);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body .clanek_detail .clanek_meta .sdileni, html .clanek_detail .clanek_meta .sdileni, main .clanek_detail .clanek_meta .sdileni {
  display: flex;
  gap: 14px;
}
body .clanek_detail .clanek_meta .sdileni a, html .clanek_detail .clanek_meta .sdileni a, main .clanek_detail .clanek_meta .sdileni a {
  display: grid;
  place-items: center;
  color: var(--nadpis-pismo);
  transition: color 300ms ease;
}
body .clanek_detail .clanek_meta .sdileni a:hover, html .clanek_detail .clanek_meta .sdileni a:hover, main .clanek_detail .clanek_meta .sdileni a:hover {
  color: var(--primarni);
}
body .clanek_detail .clanek_meta .sdileni a::before, html .clanek_detail .clanek_meta .sdileni a::before, main .clanek_detail .clanek_meta .sdileni a::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  flex: none;
  -webkit-mask: url("../img/ico_facebook.svg") center/20px 20px no-repeat;
  mask: url("../img/ico_facebook.svg") center/20px 20px no-repeat;
  background-color: currentColor;
}
body .clanek_detail .clanek_meta .sdileni a.instagram::before, html .clanek_detail .clanek_meta .sdileni a.instagram::before, main .clanek_detail .clanek_meta .sdileni a.instagram::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  flex: none;
  -webkit-mask: url("../img/ico_instagram.svg") center/20px 20px no-repeat;
  mask: url("../img/ico_instagram.svg") center/20px 20px no-repeat;
  background-color: currentColor;
}
body .clanek_detail .clanek_telo p, html .clanek_detail .clanek_telo p, main .clanek_detail .clanek_telo p {
  font-family: "Satoshi regular";
  font-style: normal;
  font-weight: 400;
  font-size: var(--pismo16);
  line-height: 175%;
  letter-spacing: 0;
  color: var(--text-pismo);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 22px;
}
body .clanek_detail .clanek_telo p:first-child, html .clanek_detail .clanek_telo p:first-child, main .clanek_detail .clanek_telo p:first-child {
  font-family: "Satoshi bold";
  color: var(--nadpis-pismo);
}
body .clanek_detail .clanek_galerie, html .clanek_detail .clanek_galerie, main .clanek_detail .clanek_galerie {
  display: grid;
  gap: 16px;
  margin: 4px 0 26px;
}
@media (min-width: 600px) {
  body .clanek_detail .clanek_galerie, html .clanek_detail .clanek_galerie, main .clanek_detail .clanek_galerie {
    grid-template-columns: 1fr 1fr;
  }
}
body .clanek_detail .clanek_galerie img, html .clanek_detail .clanek_galerie img, main .clanek_detail .clanek_galerie img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: var(--zaobleni-male);
}

/*# sourceMappingURL=style.css.map */

.katalog .produkt_obrazek.produkt_obrazek_bez_foto,
.podobne .produkt_obrazek.produkt_obrazek_bez_foto,
.blog .clanek_obrazek.clanek_obrazek_bez_foto {
  background-color: var(--cervena);
}
.produkt_hero .produkt_hero_obrazek .produkt_obrazek_bez_foto,
.specifikace .specifikace_obrazek.produkt_obrazek_bez_foto {
  width: 100%;
  min-height: 320px;
  border-radius: var(--zaobleni-velke);
  background-color: var(--cervena);
  display: flex;
  align-items: center;
  justify-content: center;
}
.produkt_obrazek_icon img,
.clanek_obrazek_icon img {
  width: 100px !important;
  height: 100px !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1);
}
.katalog_filtr {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 24px 0 32px;
}
.katalog_filtr a {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 22px;
  border: 1px solid var(--border-sedy);
  border-radius: 30px;
  color: var(--nadpis-pismo);
  font-size: var(--pismo15);
  text-decoration: none;
}
.katalog_filtr a:hover,
.katalog_filtr a.active {
  background: var(--primarni);
  color: var(--bila);
  border-color: var(--primarni);
}
.strankovani {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 40px;
  flex-wrap: wrap;
}
.strankovani a,
.strankovani span {
  min-width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-sedy);
  border-radius: 10px;
  color: var(--nadpis-pismo);
  text-decoration: none;
  padding: 0 10px;
}
.strankovani .active {
  background: var(--primarni);
  color: var(--bila);
  border-color: var(--primarni);
}
.pokladka .pokladka_video iframe {
  width: 100%;
  height: 100%;
  min-height: 360px;
  border: 0;
  border-radius: var(--zaobleni-velke);
}
.pokladka .pokladka_grid_bez_videa {
  grid-template-columns: 1fr;
}
main > section.nazev_nav,
main > section.obsah_stranek,
main > section.info_hlaska,
main > section.mobile_soc,
main > section.poptavka_formular {
  width: 100%;
  max-width: var(--hlavni-sirka);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}
main > section.nazev_nav {
  padding-top: 40px;
}
main > section.obsah_stranek,
main > section.poptavka_formular {
  padding-top: 24px;
  padding-bottom: 64px;
}
.breadnav p,
.breadnav_mobile {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.breadnav a {
  color: var(--sede-pismo);
  text-decoration: none;
}
.breadnav i {
  width: 6px;
  height: 6px;
  border-right: 2px solid var(--seda);
  border-bottom: 2px solid var(--seda);
  transform: rotate(-45deg);
}
.breadnav_mobile {
  display: none;
}
.grid_obsah {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}
.formatovani_textu {
  color: var(--text-pismo);
  font-size: var(--pismo18);
  line-height: 1.7;
}
.formatovani_textu > * + * {
  margin-top: 1em;
}
.formatovani_textu img,
.formatovani_textu iframe {
  max-width: 100%;
}
.formular_poptavka {
  max-width: 760px;
  margin: 0 auto;
}
.formular_poptavka_grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.formular_poptavka input[type="text"],
.formular_poptavka input[type="email"],
.formular_poptavka input[type="tel"],
.formular_poptavka textarea {
  width: 100%;
  border: 1px solid var(--border-sedy);
  border-radius: 10px;
  padding: 12px 16px;
  font: inherit;
}
.formular_poptavka_honeypot {
  position: absolute;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
@media (min-width: 768px) {
  .formular_poptavka_grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1024px) {
  .grid_obsah.grid_2 {
    grid-template-columns: minmax(0, 1fr) 360px;
  }
}
.video_y-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.9);
    z-index: 99999;
    align-items: center;
    justify-content: center;
}

.video_y-overlay.is-open {
    display: flex;
}

.video_y-box {
    position: relative;
}

.video_y-close {
    position: absolute;
    top: -42px;
    right: 0;
    color: #fff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.video_y-box {
    position: relative;
}

.video_y-frame-holder {
    width: 100%;
    height: 100%;
}

.video_y-box iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
.video_y::before {
    content: "";
    width: 62px;
    height: 62px;
    background-image: url('../img/play-arrow.svg');
    display: block;
    position: absolute;
    top: calc(50% - 31px);
    left: calc(50% - 31px);
    transition: 400ms;
}
.video_y:hover::before {
    transform: scale(1.1);
}

@media (max-width: 1300px) {
    body .banner .banner_box, html .banner .banner_box, main .banner .banner_box {
        grid-template-columns: 1fr;
    }
}
.breadnav {
    margin-bottom: 20px;
}

body .produkt_hero strong, body .kombinace strong {
    color: #920638;
}
.kalkulacka_cena {
    display: none;
}

.video_y.pokladka_obrazek.pokladka_video {
    background-image: url("../img/hero_pokladka_podlahy.png");
    width: 438px;
    height: 680px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 24px;
}
.flex_kalkulacka {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    gap: 53px;
    padding-top: 21px;
}
main .kalkulacka .kalkulacka_obrazek img {
    aspect-ratio: initial;
    height: 372px;
}
body .kalkulacka .kalkulacka_polozka, html .kalkulacka .kalkulacka_polozka, main .kalkulacka .kalkulacka_polozka {
    margin-bottom: 0px;
}
body .promena .sekce_info_produkty.sekce_info_produkty_stred h2 {
    color: #1B0E04;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px; /* 116.667% */
    letter-spacing: -2px;
}
body .promena .sekce_info_produkty.sekce_info_produkty_stred h2 .zvyrazneno {
    color: #920638;
}

/* ============================== MODAL — proměna: nahrát fotku ============================== */
.modal_overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 99999;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  .modal_overlay.is-open {
    display: flex;
  }
  
  .modal_box {
    position: relative;
    width: 100%;
    max-width: 460px;
    background-color: var(--bila);
    border-radius: var(--zaobleni-velke);
    padding: 40px 32px;
    text-align: center;
    animation: modal_nahoru 250ms ease;
  }
  
  @keyframes modal_nahoru {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  .modal_zavrit {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    background: none;
    cursor: pointer;
    border-radius: 50%;
    transition: background-color 200ms ease;
  }
  .modal_zavrit:hover {
    background-color: var(--badge-pozadi);
  }
  .modal_zavrit span {
    position: absolute;
    width: 16px;
    height: 2px;
    background-color: var(--nadpis-pismo);
    border-radius: 2px;
  }
  .modal_zavrit span:first-child { transform: rotate(45deg); }
  .modal_zavrit span:last-child { transform: rotate(-45deg); }
  
  .modal_ikona {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background-color: var(--primarni);
    display: grid;
    place-items: center;
  }
  .modal_ikona img {
    width: 28px;
    height: 28px;
  }
  #promena_modal_email_text {
    color: var(--primarni);
  }
  .modal_box h3 {
    font-family: "Satoshi bold";
    font-size: var(--pismo24);
    color: var(--nadpis-pismo);
    margin-bottom: 12px;
  }
  
  .modal_box p {
    font-family: "Satoshi regular";
    font-size: var(--pismo16);
    line-height: 160%;
    color: var(--text-pismo);
    margin-bottom: 24px;
  }
  
  .modal_email {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    background-color: var(--barva-svetla-hneda);
    border: 1px solid var(--bily-border);
    border-radius: var(--zaobleni-male);
    margin-bottom: 20px;
  }
  .modal_email span {
    font-family: "Satoshi medium";
    font-size: var(--pismo16);
    color: var(--nadpis-pismo);
    word-break: break-all;
    text-align: left;
  }
  .modal_kopirovat {
    flex: none;
    padding: 8px 14px;
    border-radius: 100px;
    background-color: var(--tlacitko-svetle);
    color: var(--primarni);
    font-family: "Satoshi medium";
    font-size: var(--pismo13);
    cursor: pointer;
    transition: background-color 300ms ease;
  }
  .modal_kopirovat:hover {
    background-color: var(--tlacitko-svetle-hover);
  }
  .modal_kopirovat.zkopirovano {
    background-color: var(--zelena);
    color: var(--bila);
  }
  
  .modal_tlacitko {
    width: 100%;
    justify-content: center;
  }
  @media (max-width: 480px) {
    .modal_email {
        display: block;
    }
  }
  .specifikace ul {
    margin-left: 20px;
    width: calc(100% - 20px);
    padding-top: 18px;
  }
  .specifikace ul li {
    color: #1B0E04;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
  }
  .specifikace_obrazek {
    margin-top: 20px;
  }

  .formatovani_textu ul {
    margin-left: 20px;
    width: calc(100% - 20px);
  }

  body.podstrana main section.nastaveni_cookies {
    max-width: var(--hlavni-sirka);
    width: var(--sirka-procenta);
    margin: 0 auto;
    padding: 2.5rem 0px;
  }
  body.podstrana main section.nastaveni_cookies .wrap_cookies {
    max-width: 860px;
  }
  body.podstrana main section.nastaveni_cookies h2 {
    font-family: "Satoshi medium";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo25);
    line-height: 185%;
    letter-spacing: 0px;
    color: var(--cerna);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 8px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 2rem;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .info-note {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo13);
    line-height: 100%;
    letter-spacing: 0px;
    color: var(--modrePismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: var(--svetleModra);
    border: 1px solid var(--modryBorder);
    padding: 12px 16px;
    margin-bottom: 1.5rem;
    display: flex;
    gap: 10px;
    align-items: center;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .info-note svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 1px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card {
    background: var(--bila);
    border: 1px solid var(--barva-border-top-e5);
    overflow: hidden;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    gap: 16px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head .cat-card-head-left {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 0;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head .cat-card-head-left .cat-icon {
    width: 36px;
    height: 36px;
    background: var(--barva-paticka-f8);
    border: 1px solid var(--barva-border-top-e5);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head .cat-card-head-left .cat-icon svg {
    width: 16px;
    height: 16px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head .cat-card-head-left .cat-name {
    font-family: "Satoshi medium";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo14);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerna);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-head .cat-card-head-left .cat-short {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo13);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-top: 2px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-card-body {
    padding: 0 20px 16px 70px;
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo13);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-top: 1px solid var(--border-sedy);
    padding-top: 12px;
    display: none;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card.open .cat-card-body {
    display: block;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card.open .expand-btn svg {
    transform: rotate(180deg);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-toggle-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .cat-status {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo13);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle {
    position: relative;
    width: 40px;
    height: 22px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle input:checked + .toggle-track {
    background: var(--zelena);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle input:checked + .toggle-track::before {
    transform: translateX(18px);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle input:disabled + .toggle-track {
    background: var(--zelena-background);
    cursor: not-allowed;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle input:disabled + .toggle-track::before {
    background: var(--zelena-disabled);
    transform: translateX(18px);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle .toggle-track {
    position: absolute;
    inset: 0;
    border-radius: 22px;
    background: var(--barva-paticka-f8);
    cursor: pointer;
    transition: background 0.2s;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .toggle .toggle-track::before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--bila);
    left: 3px;
    top: 3px;
    transition: transform 0.2s;
    box-shadow: 0 1px 3px var(--rgba-cerna01);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .badge {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo11);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding: 2px 8px;
    border-radius: 4px;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .badge.badge-required {
    background: var(--barva-tlacitko-seda);
    color: var(--modrePismo);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .badge.badge-optional {
    background: var(--bila);
    color: var(--tmave_pismo);
    border: 1px solid var(--border-sedy);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .expand-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--tmave_pismo);
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    transition: color 0.15s;
    flex-shrink: 0;
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .expand-btn:hover {
    color: var(--cerna);
  }
  body.podstrana main section.nastaveni_cookies .cookies_2022_form .cat-card .expand-btn svg {
    width: 14px;
    height: 14px;
    transition: transform 0.2s;
  }
  body.podstrana main section.nastaveni_cookies .form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 1.5rem;
    border-top: 1px solid var(--barva-tlacitko-seda);
    flex-wrap: wrap;
  }
  body.podstrana main section.nastaveni_cookies .form-footer form-footer-note {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo11);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body.podstrana main section.nastaveni_cookies .btn {
    display: inline-flex;
    align-items: center;
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo11);
    line-height: 150%;
    letter-spacing: 0px;
    color: var(--cerne-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding: 10px 22px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    text-decoration: none;
  }
  body.podstrana main section.nastaveni_cookies .btn-primary {
    background: var(--cerna);
    color: var(--bila);
  }
  body.podstrana main section.nastaveni_cookies .btn-primary:hover {
    background: var(--pismo-seda-placeholder);
  }
  body.podstrana main section.nastaveni_cookies .btn-ghost {
    background: var(--seda);
    color: var(--cerna);
  }
  body.podstrana main section.nastaveni_cookies .btn-ghost:hover {
    background: var(--barva-border-E0);
  }
  body.podstrana main section.nastaveni_cookies .btn-row {
    display: flex;
    gap: 8px;
  }



















  body .reference_detail .reference_detail_grid, html .reference_detail .reference_detail_grid, main .reference_detail .reference_detail_grid {
    display: grid;
    gap: 32px;
    align-items: start;
  }
  @media (min-width: 1024px) {
    body .reference_detail .reference_detail_grid, html .reference_detail .reference_detail_grid, main .reference_detail .reference_detail_grid {
      grid-template-columns: 1fr 340px;
      gap: 40px;
    }
  }
  @media (min-width: 1024px) {
    body .reference_detail .postranni_panel, html .reference_detail .postranni_panel, main .reference_detail .postranni_panel {
      position: sticky;
      top: 104px;
    }
  }
  body .reference_detail .reference_hero, html .reference_detail .reference_hero, main .reference_detail .reference_hero {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: var(--zaobleni);
    margin-bottom: 28px;
  }
  body .reference_detail h1, html .reference_detail h1, main .reference_detail h1 {
    font-family: "Satoshi bold";
    font-style: normal;
    font-weight: 500;
    font-size: var(--pismo28);
    line-height: 135%;
    letter-spacing: -1px;
    color: var(--primarni);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 24px;
  }
  @media (min-width: 768px) {
    body .reference_detail h1, html .reference_detail h1, main .reference_detail h1 {
      font-size: var(--pismo32);
    }
  }
  body .reference_detail .reference_meta, html .reference_detail .reference_meta, main .reference_detail .reference_meta {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    margin-bottom: 32px;
    background-color: var(--bila);
    border: 1px solid var(--bily-border);
    border-radius: var(--zaobleni-male);
  }
  body .reference_detail .reference_meta .avatar, html .reference_detail .reference_meta .avatar, main .reference_detail .reference_meta .avatar {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
  }
  body .reference_detail .reference_meta .meta_text, html .reference_detail .reference_meta .meta_text, main .reference_detail .reference_meta .meta_text {
    flex: 1;
  }
  body .reference_detail .reference_meta .jmeno, html .reference_detail .reference_meta .jmeno, main .reference_detail .reference_meta .jmeno {
    display: block;
    margin-bottom: 4px;
    font-family: "Satoshi medium";
    font-style: normal;
    font-weight: 500;
    font-size: var(--pismo15);
    line-height: 100%;
    letter-spacing: 0;
    color: var(--nadpis-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body .reference_detail .reference_meta .doplnek, html .reference_detail .reference_meta .doplnek, main .reference_detail .reference_meta .doplnek {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo13);
    line-height: 100%;
    letter-spacing: 0;
    color: var(--sede-pismo-svetle);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body .reference_detail .reference_meta .sdileni, html .reference_detail .reference_meta .sdileni, main .reference_detail .reference_meta .sdileni {
    display: flex;
    gap: 14px;
  }
  body .reference_detail .reference_meta .sdileni a, html .reference_detail .reference_meta .sdileni a, main .reference_detail .reference_meta .sdileni a {
    display: grid;
    place-items: center;
    color: var(--nadpis-pismo);
    transition: color 300ms ease;
  }
  body .reference_detail .reference_meta .sdileni a:hover, html .reference_detail .reference_meta .sdileni a:hover, main .reference_detail .reference_meta .sdileni a:hover {
    color: var(--primarni);
  }
  body .reference_detail .reference_meta .sdileni a::before, html .reference_detail .reference_meta .sdileni a::before, main .reference_detail .reference_meta .sdileni a::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    flex: none;
    -webkit-mask: url("../img/ico_facebook.svg") center/20px 20px no-repeat;
    mask: url("../img/ico_facebook.svg") center/20px 20px no-repeat;
    background-color: currentColor;
  }
  body .reference_detail .reference_meta .sdileni a.instagram::before, html .reference_detail .reference_meta .sdileni a.instagram::before, main .reference_detail .reference_meta .sdileni a.instagram::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    flex: none;
    -webkit-mask: url("../img/ico_instagram.svg") center/20px 20px no-repeat;
    mask: url("../img/ico_instagram.svg") center/20px 20px no-repeat;
    background-color: currentColor;
  }
  body .reference_detail .reference_telo p, html .reference_detail .reference_telo p, main .reference_detail .reference_telo p {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo16);
    line-height: 175%;
    letter-spacing: 0;
    color: var(--text-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 22px;
  }
  body .reference_detail .reference_telo p:first-child, html .reference_detail .reference_telo p:first-child, main .reference_detail .reference_telo p:first-child {
    font-family: "Satoshi bold";
    color: var(--nadpis-pismo);
  }
  body .reference_detail .reference_galerie, html .reference_detail .reference_galerie, main .reference_detail .reference_galerie {
    display: grid;
    gap: 16px;
    margin: 4px 0 26px;
  }
  @media (min-width: 600px) {
    body .reference_detail .reference_galerie, html .reference_detail .reference_galerie, main .reference_detail .reference_galerie {
      grid-template-columns: 1fr 1fr;
    }
  }
  body .reference_detail .reference_galerie img, html .reference_detail .reference_galerie img, main .reference_detail .reference_galerie img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: var(--zaobleni-male);
  }
  body .postranni_panel .panel_reference, html .postranni_panel .panel_reference, main .postranni_panel .panel_reference {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 0;
    text-decoration: none;
  }
  body .postranni_panel .panel_reference + .panel_reference, html .postranni_panel .panel_reference + .panel_reference, main .postranni_panel .panel_reference + .panel_reference {
    border-top: 1px solid var(--bily-border);
  }
  body .postranni_panel .panel_reference img, html .postranni_panel .panel_reference img, main .postranni_panel .panel_reference img {
    flex: none;
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 10px;
  }
  body .postranni_panel .panel_reference h3, html .postranni_panel .panel_reference h3, main .postranni_panel .panel_reference h3 {
    font-family: "Satoshi medium";
    font-style: normal;
    font-weight: 500;
    font-size: var(--pismo14);
    line-height: 140%;
    letter-spacing: 0;
    color: var(--nadpis-pismo);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-bottom: 6px;
    transition: color 300ms ease;
  }
  body .postranni_panel .panel_reference .datum, html .postranni_panel .panel_reference .datum, main .postranni_panel .panel_reference .datum {
    font-family: "Satoshi regular";
    font-style: normal;
    font-weight: 400;
    font-size: var(--pismo12);
    line-height: 100%;
    letter-spacing: 0;
    color: var(--sede-pismo-svetle);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  body .postranni_panel .panel_reference:hover h3, html .postranni_panel .panel_reference:hover h3, main .postranni_panel .panel_reference:hover h3 {
    color: var(--primarni);
  }