@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Semibold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Extralight.ttf') format("truetype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Clashdisplay;
  src: url('../fonts/ClashDisplay-Light.ttf') format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root {
  --hlavní-barva: #52150a;
  --odkaz: #c93547;
  --světlá: #f9e0ce;
}

body {
  color: var(--hlavní-barva);
  background-color: #f3e1e3;
  font-family: Poppins, sans-serif;
  font-size: 16px;
  line-height: 150%;
}

h1 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 100px;
  font-weight: 400;
  line-height: 100px;
}

h2 {
  margin-top: 0;
  margin-bottom: 40px;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 120%;
}

h3 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 120%;
}

h4 {
  margin-top: 10px;
  margin-bottom: 10px;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 120%;
}

a {
  color: var(--odkaz);
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

.header {
  padding: 10px;
}

.header-inner {
  color: var(--světlá);
  background-color: #5c2213;
  background-image: linear-gradient(135deg, #52150a, #52150a00), url('../images/header-bg.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  border-radius: 20px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 100px;
  min-height: 1000px;
  padding: 60px;
  display: flex;
  position: relative;
}

.navigace {
  background-color: #0000;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.logo {
  order: -1;
}

.nav-link {
  color: var(--světlá);
  font-weight: 400;
}

.nav-link:hover, .nav-link.w--current {
  color: #fff;
}

.cta-button {
  background-color: #000204;
  border-radius: 30px;
  order: 1;
  justify-content: center;
  align-items: center;
  height: 52px;
  padding: 0 40px;
  font-weight: 200;
  line-height: 52px;
  transition: all .2s;
  display: inline-block;
}

.cta-button:hover {
  background-color: var(--odkaz);
}

.cta-button.bottom-cta-margin {
  margin-top: 40px;
}

.cta-button.bottom-cta-margin:hover {
  background-color: var(--odkaz);
}

.cta-button.mobil-show {
  display: none;
}

.cta-button.bigger-button {
  border-radius: 40px;
  height: 64px;
  padding-left: 60px;
  padding-right: 60px;
  line-height: 64px;
}

.nav-menu {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.header-content-inner {
  width: 100%;
  max-width: 1420px;
  margin-left: auto;
  margin-right: auto;
  font-weight: 200;
  position: relative;
}

.header-sub-claim {
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 120%;
}

.header-quote {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 60px;
  margin-bottom: 60px;
  display: flex;
}

.header-star {
  width: 30px;
  height: 30px;
}

.leaf-1 {
  position: absolute;
  top: 200px;
}

.leaf-2 {
  position: absolute;
  top: 300px;
  right: 300px;
}

.leaf-3 {
  position: absolute;
  bottom: -40px;
  right: 300px;
}

.content {
  padding-top: 180px;
  padding-bottom: 180px;
  position: relative;
}

.content.white-bg {
  background-color: #fff;
}

.content.blue-bg {
  color: #000204;
  background-color: #c7dcf5;
}

.content.blue-bg.machine {
  padding-top: 80px;
  padding-bottom: 80px;
}

.content-inner {
  z-index: 100;
  max-width: 1420px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.services-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 60px;
  display: grid;
}

.service-item {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-color: var(--hlavní-barva);
  color: var(--světlá);
  cursor: pointer;
  border-radius: 20px;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  height: 610px;
  padding: 60px;
  font-weight: 200;
  text-decoration: none;
  display: flex;
  position: relative;
  overflow: hidden;
}

.service-item:hover {
  color: #fff;
  text-decoration: none;
}

.service-item.relaxacni-masaze {
  transition: all .2s;
  position: relative;
  overflow: hidden;
}

.service-item.relaxacni-masaze:hover {
  background-size: auto, 120%;
}

.service-item.lymfaticka-masaz {
  background-image: linear-gradient(0deg, #431016bf, #43101600), url('../images/lymfaticka-masaz-main.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.service-item.emsculp {
  background-image: linear-gradient(0deg, #431016bf, #43101600), url('../images/emsculp-main.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, 460px;
}

.service-arrow {
  color: var(--odkaz);
  height: 18px;
}

.service-item-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.service-item-bg.relaxacni-masaz {
  z-index: 10;
  background-image: linear-gradient(0deg, #431016bf, #43101600), url('../images/relaxacni-masaze-main.jpg');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  inset: 0;
}

.service-item-bg.emsculp {
  z-index: 10;
  background-image: linear-gradient(0deg, #431016bf, #43101600), url('../images/emsculp-main.jpg');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  inset: 0;
}

.service-item-bg.lymfaticka-masaz {
  z-index: 10;
  background-image: linear-gradient(0deg, #431016bf, #43101600), url('../images/lymfaticka-masaz-main_1.jpg');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  inset: 0;
}

.service-item-content {
  z-index: 100;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  display: flex;
  position: relative;
}

.benefits {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 1000px;
  margin-top: 120px;
  margin-left: auto;
  margin-right: auto;
  display: grid;
}

.benefit-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  text-align: center;
  flex-flow: column;
  display: flex;
}

.referencer-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  display: grid;
}

.bas-wrapper {
  aspect-ratio: 1;
  border: 8px #fff;
  border-radius: 20px;
  max-width: 946px;
  display: none;
  position: relative;
  overflow: hidden;
}

.bas-image-before {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.bas-image-after-h {
  z-index: 1;
  object-fit: cover;
  width: 50%;
  height: 100%;
  margin-left: auto;
  display: block;
  position: absolute;
  inset: 0;
}

.bas-handle-h {
  z-index: 2;
  background-color: #fff;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  width: 42px;
  height: 42px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.bas-icon-regular {
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  display: flex;
}

.bas-line-h {
  z-index: 1;
  background-color: #fff;
  width: 2px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translate(-50%);
}

.bas-label-before-h {
  z-index: 3;
  color: var(--hlavní-barva);
  cursor: pointer;
  background-color: #fff6;
  border-radius: 20px;
  padding: 2px 20px;
  font-size: 14px;
  position: absolute;
  top: 24px;
  left: 24px;
}

.bas-label-after-h {
  z-index: 3;
  color: var(--hlavní-barva);
  cursor: pointer;
  background-color: #fff6;
  border-radius: 20px;
  padding: 2px 20px;
  font-size: 14px;
  position: absolute;
  top: 24px;
  right: 24px;
}

.reference-text {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  color: #000204;
  flex-flow: column;
  font-size: 24px;
  font-style: italic;
  font-weight: 200;
  line-height: 180%;
  display: flex;
}

.reference-stars {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 12px;
  display: flex;
}

.reference-star-item {
  height: 26px;
  display: flex;
}

.reference-name {
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 180%;
}

.mask {
  height: 100%;
  padding-bottom: 120px;
}

.slider {
  background-color: #0000;
  height: 100%;
}

.slider-left-arrow {
  border: 1px solid #52150a33;
  border-radius: 30px;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  display: flex;
  inset: auto 390px 0 auto;
}

.slider-left-arrow:hover {
  color: var(--odkaz);
}

.slider-left-arrow.ba {
  color: var(--hlavní-barva);
  margin-right: 80px;
  right: 50%;
}

.slider-left-arrow.ba:hover {
  color: var(--odkaz);
}

.slide-nav {
  justify-content: center;
  align-items: center;
  width: 580px;
  height: 60px;
  display: flex;
  inset: auto 0% 0% auto;
}

.slide-nav.ba {
  width: auto;
  inset: auto 0% 0%;
}

.right-arrow {
  width: 60px;
  height: 60px;
}

.slider-right-arrow {
  color: var(--hlavní-barva);
  border: 1px solid #52150a33;
  border-radius: 30px;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  display: flex;
  inset: auto 130px 0 auto;
}

.slider-right-arrow:hover {
  color: var(--odkaz);
}

.slider-right-arrow.ba {
  margin-left: 80px;
  left: 50%;
  right: auto;
}

.left-arrow-item, .right-arrow-item {
  display: flex;
}

.about-salon {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  line-height: 180%;
  display: grid;
}

.about-salon-text {
  position: relative;
}

.about-salon-photo {
  background-color: var(--světlá);
  background-image: url('../images/about-main-photo.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 45%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.about-salon-main-text {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-bottom: 1px solid #8aafdd;
  flex-flow: column;
  margin-bottom: 60px;
  padding-bottom: 60px;
  display: flex;
}

.about-salon-jana {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 75%;
  display: flex;
}

.about-salon-title {
  color: #00020480;
  font-size: 14px;
}

.about-salon-jana-quote {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: flex-start;
  font-style: italic;
  display: flex;
}

.about-salon-jana-quote-symbol {
  color: #00020480;
  font-size: 40px;
  line-height: 40px;
}

.about-salon-jana-photo {
  position: absolute;
  bottom: -180px;
  right: -100px;
}

.text-align-center {
  text-align: center;
}

.footer {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  color: var(--světlá);
  text-align: center;
  background-color: #300c06;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
  display: flex;
  position: relative;
}

.footer.white-bg {
  background-color: #fff;
}

.footer.blue-bg {
  color: #000204;
  background-color: #c7dcf5;
}

.footer-inner {
  border: 1px solid #ffffff1a;
  padding: 20px 40px;
}

.footer-social-icons {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.footer-social-icon-item {
  width: 20px;
  height: 20px;
  transition: all .2s;
}

.footer-social-icon-item:hover {
  color: var(--světlá);
}

.footer-bottom-text {
  color: #b77b71;
  font-size: 13px;
}

.header-social-icons {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  display: flex;
  position: absolute;
  inset: 0% 80px 0% auto;
}

.header-social-icon-item {
  color: var(--světlá);
  width: 20px;
  height: 20px;
  transition: all .2s;
}

.header-social-icon-item:hover {
  color: var(--hlavní-barva);
}

.leaf-4 {
  margin-left: -1000px;
  position: absolute;
  top: 400px;
  left: 50%;
}

.header-inner-subpage {
  color: var(--světlá);
  text-align: center;
  background-color: #5c2213;
  background-image: linear-gradient(135deg, #52150a, #52150a00), url('../images/header-bg.jpg');
  background-position: 0 0, 50% 20%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  border-radius: 20px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 60px 60px 120px;
  display: flex;
  position: relative;
}

.header-subpage-content-inner {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1420px;
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  font-weight: 200;
  display: flex;
  position: relative;
}

.white-tiles-list {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.white-tile-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #fff;
  border-radius: 20px;
  flex-flow: column;
  width: 100%;
  padding: 60px;
  line-height: 180%;
  display: flex;
}

.service-benefit-list {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: wrap;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.service-benefit-list.pod-sebou {
  grid-template-columns: 1fr;
}

.benefit-list-item {
  background-image: url('../images/benefit-list-item.png');
  background-position: 0 5px;
  background-repeat: no-repeat;
  background-size: 22px;
  padding-left: 38px;
  font-weight: 700;
  line-height: 200%;
}

.service-price {
  border-top: 1px solid #f3e1e3;
  padding-top: 40px;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
}

.slider-only-text {
  background-color: #0000;
  justify-content: center;
  align-items: flex-start;
  max-width: 740px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.faq {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  text-align: center;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  line-height: 180%;
  display: flex;
}

.section {
  width: 500px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.drp {
  line-height: 0;
  transition: all .2s;
  display: block;
}

.drop {
  color: #fff;
  border-bottom: 1px solid #ffffff1a;
  width: 500px;
  transition: all .2s;
  display: block;
}

.drop:hover {
  background-color: #ffffff1a;
}

.drop.w--open {
  color: #fff;
}

.text-block {
  line-height: 20px;
}

.drp-list {
  background-color: #fff;
  height: 0;
  line-height: 23px;
  transition: all .5s;
  display: block;
  position: static;
  overflow: hidden;
}

.drp-list.w--open {
  line-height: 23px;
  position: static;
  overflow: hidden;
}

.text-wrapper {
  padding: 30px 25px;
}

.dropdown-list, .dropdown-list-2 {
  position: static;
}

.faq1_question {
  cursor: pointer;
  border-top: 1px #000;
  justify-content: space-between;
  align-items: center;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  font-weight: 600;
  display: flex;
}

.text-size-medium {
  font-size: 1.125rem;
}

.text-size-medium.text-weight-bold {
  font-weight: 700;
}

.margin-bottom, .margin-bottom.margin-small {
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
}

.icon-embed-small {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
}

.faq1_answer {
  padding-bottom: 0;
  overflow: hidden;
}

.faq1_icon-wrapper {
  align-self: flex-start;
  width: 2rem;
  margin-left: 1.5rem;
  display: flex;
}

.faq1_accordion {
  text-align: left;
  background-color: #fff;
  border-radius: 8px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: 10px;
  padding-left: 32px;
  padding-right: 32px;
}

.faq-answer-text {
  padding-bottom: 16px;
}

.center-content {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 100%;
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.body {
  line-height: 200%;
}

.massage-columns {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 10px;
  margin-bottom: 10px;
  display: grid;
}

.massage-column-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  border: 1px solid #c9354766;
  border-radius: 20px;
  flex-flow: column;
  padding: 40px;
  display: flex;
}

.massage-column-image {
  border-radius: 12px;
}

.split-line {
  background-color: #c9354766;
  width: 100%;
  height: 1px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.arrow-list-item {
  background-image: url('../images/arrow-list-item.png');
  background-position: 0 10px;
  background-repeat: no-repeat;
  padding-left: 38px;
  font-weight: 400;
  line-height: 200%;
}

.price-list {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 40px;
  display: flex;
}

.price-list-item {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  border: 1px solid #f3e1e3;
  border-radius: 20px;
  flex-flow: column;
  width: 268px;
  padding: 40px 20px;
  font-weight: 700;
  display: flex;
}

.price-list-price {
  color: var(--odkaz);
  border-top: 1px solid #f3e1e3;
  margin-top: 20px;
  padding-top: 20px;
  font-size: 20px;
  font-weight: 700;
  line-height: 200%;
}

.blue-bg-flare {
  z-index: 1;
  filter: blur(200px);
  background-color: #fff;
  border-radius: 460px;
  width: 920px;
  height: 920px;
  position: absolute;
  inset: 0% auto 0% 10%;
}

.blue-bg-flare.right {
  left: auto;
  right: 10%;
}

.about-machine {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  line-height: 180%;
  display: flex;
}

.about-machine-text {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  width: 50%;
  display: flex;
  position: relative;
}

.no-margin {
  margin-bottom: 0;
}

.about-machine-image {
  justify-content: center;
  align-items: center;
  width: 50%;
  display: flex;
}

.about-machine-big-text {
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 24px;
  line-height: 180%;
}

.price-list-info {
  font-size: 14px;
  font-weight: 400;
}

.before-after-slide {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.before-after-slide-item {
  background-color: #fff;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 30px;
  display: flex;
}

.ba-slider {
  background-color: #0000;
  max-width: 1300px;
  height: 100%;
}

.big-reference-tile {
  background-color: #fff;
  border-radius: 20px;
  padding: 60px;
}

.big-reference-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #fff;
  border-radius: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  padding: 60px;
  display: grid;
}

.contact-content {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 940px;
  margin-bottom: 60px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.contact-text {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 100%;
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.contact-photo {
  border-radius: 20px;
  flex: none;
  max-width: 460px;
  overflow: hidden;
}

.half-reference-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #fff;
  border-radius: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  padding: 60px;
  display: flex;
}

.content-in-image {
  border-radius: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.header-contact {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.header-contact-item {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: flex-start;
  align-items: center;
  font-size: 16px;
  line-height: 150%;
  display: flex;
}

.header-contact-text {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.header-contact-link {
  color: var(--světlá);
  white-space: nowrap;
  word-break: keep-all;
  font-family: Clashdisplay, Arial, sans-serif;
  font-size: 40px;
  line-height: 120%;
  text-decoration: none;
}

.code-embed {
  transform-style: preserve-3d;
}

@media screen and (max-width: 991px) {
  .nav-link {
    color: var(--hlavní-barva);
  }

  .nav-link.w--current {
    color: var(--odkaz);
  }

  .cta-button {
    display: none;
  }

  .cta-button.bottom-cta-margin {
    display: flex;
  }

  .cta-button.mobil-show {
    display: block;
  }

  .nav-menu {
    background-color: #fff;
    border-radius: 30px;
    padding: 10px;
  }

  .content {
    padding: 120px 10px;
  }

  .content.blue-bg.machine {
    padding-left: 10px;
    padding-right: 10px;
  }

  .content.blue-bg.no-bottom-padding {
    padding-bottom: 0;
  }

  .content-inner {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .content-inner.text-align-center {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }

  .services-grid {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    grid-template-rows: auto;
    grid-template-columns: 2.5fr;
    grid-auto-columns: 1fr;
    max-width: 100%;
    display: grid;
  }

  .service-item {
    height: 300px;
  }

  .service-item-bg.relaxacni-masaz {
    background-image: linear-gradient(0deg, #431016, #43101600), url('../images/relaxacni-masaze-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .service-item-bg.emsculp {
    background-image: linear-gradient(0deg, #431016, #43101600), url('../images/emsculp-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .service-item-bg.lymfaticka-masaz {
    background-image: linear-gradient(0deg, #431016, #43101600), url('../images/lymfaticka-masaz-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .slider-left-arrow {
    left: 0;
    right: auto;
  }

  .slide-nav {
    width: 100%;
  }

  .slider-right-arrow {
    right: 0;
  }

  .about-salon {
    margin-bottom: 80px;
    display: flex;
  }

  .about-salon-photo {
    aspect-ratio: 16 / 9;
    width: 100%;
    position: relative;
  }

  .about-salon-jana-photo {
    max-width: 25%;
    bottom: -80px;
    right: 0;
  }

  .header-social-icons {
    right: 60px;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .price-list._4 {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .price-list-item {
    width: auto;
  }

  .about-machine {
    flex-flow: row;
  }

  .about-machine-text {
    width: 100%;
  }

  .before-after-slide-item {
    padding: 20px;
  }

  .contact-photo {
    max-width: 50%;
  }

  .menu-button {
    flex: 0 auto;
    justify-content: flex-start;
    align-self: center;
    align-items: center;
    font-size: 16px;
    font-weight: 200;
    display: none;
  }

  .menu-icon {
    flex: 0 auto;
    width: 16px;
  }

  .menu-button {
    color: var(--hlavní-barva);
    background-color: #fff;
    border-radius: 40px;
    flex-flow: row;
    flex: none;
    align-self: center;
    padding-left: 30px;
    padding-right: 30px;
    font-size: 16px;
    display: flex;
    position: absolute;
    right: 0;
  }

  .menu-button.w--open {
    background-color: var(--odkaz);
  }

  .header-contact-link {
    font-size: 30px;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 60px;
    line-height: 80px;
  }

  h2 {
    font-size: 40px;
  }

  h3 {
    font-size: 32px;
  }

  .header-inner {
    min-height: 700px;
  }

  .leaf-1 {
    max-width: 50%;
    right: -100px;
  }

  .leaf-2 {
    left: -100px;
    right: auto;
  }

  .leaf-3 {
    right: 120px;
  }

  .content {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .content.blue-bg.machine {
    overflow: hidden;
  }

  .services-grid {
    margin-top: 0;
  }

  .service-item {
    padding: 40px;
  }

  .benefits {
    flex-flow: column;
    display: flex;
  }

  .reference-text {
    font-size: 20px;
  }

  .mask {
    flex: 1;
    height: auto;
  }

  .header-social-icons {
    flex-flow: row;
    position: absolute;
    top: auto;
    bottom: 40px;
    right: auto;
  }

  .white-tile-item {
    padding: 40px;
  }

  .service-benefit-list {
    grid-template-columns: 1fr;
  }

  .slider-only-text {
    max-width: 100%;
    height: auto;
  }

  .faq1_question {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .text-size-medium {
    font-size: 1rem;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .faq1_icon-wrapper {
    width: 1.75rem;
  }

  .massage-columns {
    grid-template-columns: 1fr;
  }

  .price-list {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .price-list-item {
    min-width: 300px;
  }

  .about-machine {
    flex-flow: column;
  }

  .before-after-slide {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .before-after-slide-item {
    padding: 10px;
  }

  .contact-content {
    flex-flow: column;
  }

  .contact-photo {
    max-width: 100%;
  }

  .half-reference-item {
    padding: 40px;
  }

  .menu-button {
    font-weight: 400;
  }

  .header-contact {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
  }

  .header-contact-link {
    font-size: 36px;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 48px;
    line-height: 60px;
  }

  h2 {
    font-size: 32px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 20px;
  }

  .header-inner {
    min-height: 600px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .navigace {
    flex-flow: row;
  }

  .logo {
    max-width: 160px;
    padding-left: 0;
  }

  .leaf-1 {
    display: none;
  }

  .content {
    padding: 60px 20px;
  }

  .service-item-bg.relaxacni-masaz {
    background-image: linear-gradient(#431016b3, #431016b3), url('../images/relaxacni-masaze-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .service-item-bg.emsculp {
    background-image: linear-gradient(#431016a6, #431016a6), url('../images/emsculp-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .service-item-bg.lymfaticka-masaz {
    background-image: linear-gradient(#431016b3, #431016b3), url('../images/lymfaticka-masaz-main.jpg');
    background-position: 0 0, 50%;
    background-size: auto, cover;
  }

  .slider-left-arrow {
    left: 0;
  }

  .slide-nav {
    width: 100%;
  }

  .slider-right-arrow {
    right: 0;
  }

  .header-social-icons {
    flex-flow: row;
    top: auto;
    bottom: 40px;
    right: auto;
  }

  .header-inner-subpage {
    padding: 40px 20px 60px;
  }

  .white-tile-item {
    padding: 20px;
  }

  .margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .faq1_accordion {
    padding-left: 20px;
    padding-right: 20px;
  }

  .massage-column-item {
    padding: 20px;
  }

  .price-list {
    flex-flow: column;
  }

  .price-list._4 {
    grid-template-columns: 1fr;
  }

  .price-list-item {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .half-reference-item {
    padding: 24px;
  }

  .menu-button {
    padding-left: 20px;
    padding-right: 20px;
    position: absolute;
  }

  .header-contact-item {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    font-size: 14px;
  }

  .header-contact-link {
    font-size: 24px;
  }

  .code-embed {
    transform: scale3d(1none, 1none, 1none);
  }
}

#w-node-_8289d8a4-c2ba-6c1e-322e-c9c7eef27028-0ce1289d {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-dae62fce-3b5a-581c-c653-73d7f713e098-f713e093, #w-node-dae62fce-3b5a-581c-c653-73d7f713e0a4-f713e093, #w-node-dae62fce-3b5a-581c-c653-73d7f713e0b0-f713e093, #w-node-dae62fce-3b5a-581c-c653-73d7f713e0bc-f713e093 {
  grid-area: 1 / 1 / 2 / 7;
}

#w-node-_3a6935c0-d142-c51a-ff2a-21cb744b28cc-80303baa, #w-node-_3a6935c0-d142-c51a-ff2a-21cb744b28cc-93fb9e8c {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-ec63bd9a-3725-8792-9ea1-f8146ff63775-a6714b6b {
  grid-area: 1 / 1 / 2 / 7;
}

#w-node-ec63bd9a-3725-8792-9ea1-f8146ff63788-a6714b6b {
  grid-area: 1 / 8 / 2 / 13;
}

#w-node-_8911e65d-6556-2de5-539b-5f36e2ae76e9-a6714b6b {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-_8911e65d-6556-2de5-539b-5f36e2ae76fc-a6714b6b {
  grid-area: 1 / 1 / 2 / 6;
}

#w-node-f0b152db-80b2-946d-d541-96b11c9521d0-a6714b6b {
  grid-area: 1 / 1 / 2 / 7;
}

#w-node-f0b152db-80b2-946d-d541-96b11c9521e3-a6714b6b {
  grid-area: 1 / 8 / 2 / 13;
}

#w-node-_47d969db-7f46-bec7-db90-c4900f82bd32-a6714b6b {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-_47d969db-7f46-bec7-db90-c4900f82bd45-a6714b6b {
  grid-area: 1 / 1 / 2 / 6;
}

#w-node-_15e44974-d034-1029-69ae-3137bd632fd3-a6714b6b {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-_15e44974-d034-1029-69ae-3137bd632fe1-a6714b6b {
  grid-area: 1 / 1 / 2 / 6;
}

#w-node-_19f4d808-0d8d-ebf1-8d62-31bd22e8ec9b-5e14ffcc {
  grid-area: 1 / 7 / 2 / 13;
}

@media screen and (max-width: 991px) {
  #w-node-a73989a2-5d80-f0aa-f934-2b95a280a406-0ce1289d, #w-node-_72f1e43e-2d9c-af27-4967-a062d05ae690-0ce1289d, #w-node-_6efd337c-4c54-393a-49b4-80e79f3bbf84-0ce1289d {
    order: 0;
  }
}


@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Extralight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('../fonts/ClashDisplay-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}