body 
{ width: 100%; height: 100%; background: #ffffff; margin: 0px; padding: 0px; overflow-x: hidden; overflow-y: scroll; }
html 
{ font-size: 16px; box-sizing: border-box; }
.container 
{ width: 100%; height: auto; margin: 0px; padding: 0px; box-sizing: border-box; position: relative; z-index: 900; }
.wrapper 
{ width: min( 1200px, 100% - clamp(32px, 6vw, 180px) ); margin-inline: auto; }
@media (min-width: 1980px) { .wrapper { width: min( 1480px, 100% - clamp(32px, 6vw, 200px) ); }}

img { vertical-align: middle; }
a { text-decoration: none; }
*,
*::before,
*::after {
  box-sizing: border-box;
}

::-webkit-scrollbar 
{ width: 8px; }
::-webkit-scrollbar-track 
{ background: #e6e6e6; }
::-webkit-scrollbar-thumb 
{ background: #737373; border-radius: 8px; }


@view-transition {
   navigation: auto;
}

::view-transition-old(root) {
   animation: fade-out .99s ease;
}

::view-transition-new(root) {
   animation: fade-in .99s ease;
}

@keyframes fade-in {
   from {
      opacity: 0;
   }

   to {
      opacity: 1;
   }
}

@keyframes fade-out {
   from {
      opacity: 1;
   }

   to {
      opacity: 0;
   }
}

/***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** HEADER *************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
body.menu-open 
{ overflow: hidden; }

.header 
{ width: 100%; height: auto; margin: 0; padding: 0; position: absolute; top: 0; left: 0; z-index: 1000; background-color: transparent; backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px); }
.header-top-panel 
{ width: 100%; height: auto; margin: 0; padding: 18px 60px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #cccccc; }
.header-top-logo-box 
{ height: 40px; margin: 0; padding: 0; position: relative; display: flex; align-items: center; flex: 1 1 auto; min-width: 0; }
.header-top-logo-box a 
{ display: inline-flex; align-items: center; text-decoration: none; }
.header-top-logo 
{ width: auto; max-width: 100%; height: 38px; margin: 0; padding: 0; display: block; }
.header-top-right 
{ height: 40px; margin: 0; padding: 0; position: relative; z-index: 1001; flex: 0 0 auto; min-width: 0; }
.header-top-right-box 
{ width: auto; height: 40px; margin: 0; padding: 0; display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: nowrap; }

.header-shop 
{ width: 40px; height: 40px; margin: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 40px; cursor: pointer; border-radius: 999px; border: 0; background: transparent; text-decoration: none; transition: background-color 0.25s ease; appearance: none; -webkit-appearance: none; }
.header-shop:hover 
{ background: rgba(0, 0, 0, 0.05); }
.header-shop-ico 
{ width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; }
.header-shop-ico img 
{ width: 20px; height: 20px; display: block; }
.header-shop-divider 
{ width: 1px; height: 40px; margin: 0; padding: 0; flex: 0 0 1px; background: #cccccc; }
.header-phone 
{ width: auto; height: 40px; margin: 0; padding: 0 4px; display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; white-space: nowrap; font-family: "Poppins", sans-serif; font-size: 0.875rem; font-weight: 400; font-style: normal; letter-spacing: 0.03em; text-decoration: none; color: #452c29; transition: color 0.25s ease; }
.header-phone:hover 
{ color: #000000; }
.header-phone-ico 
{ width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; flex: 0 0 20px; }
.header-phone-ico img 
{ width: 20px; height: 20px; display: block; }
.header-phone-text 
{ display: inline-block; white-space: nowrap; }
.header-top-btn 
{ margin: 0; padding: 0; flex: 0 0 auto; }
.header-top-btn a 
{ height: 40px; margin: 0; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 0.875rem; color: #ffffff; text-align: center; text-decoration: none; text-transform: uppercase; letter-spacing: 0.06em; line-height: 1; background: #e84e4b; border-radius: 999px;
  transition: background-color 0.25s ease; white-space: nowrap; }
.header-top-btn a:hover 
{ background: #f66260; }


.header-bottom-panel 
{ width: 100%; height: auto; margin: 0; padding: 14px 20px; }
.header-bottom-box 
{ width: 100%; height: auto; margin: 0 auto; padding: 0; position: relative; z-index: 1002; display: flex; justify-content: center; }
.header-menu 
{ min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: nowrap; z-index: 1002; }
.menu-link 
{ height: 40px; line-height: 40px; margin: 0; padding: 0; display: inline-flex; align-items: center; font-family: "Poppins", sans-serif; font-size: 0.88rem; font-weight: 400; font-style: normal; color: #000000; text-transform: uppercase; text-decoration: none; letter-spacing: 0.04em; white-space: nowrap; }
.menu-underline 
{ position: relative; }
.menu-underline::after 
{ content: ''; position: absolute; left: 0; bottom: 4px; height: 2px; background-color: #452c29; width: 0; transition: width 0.3s ease; }
.menu-underline:hover::after 
{ width: 100%; }
.menu-underline:hover 
{ cursor: pointer; }

/** MOBILE MENU BOX **/
#box 
{ display: none; }
.mobile-menu-inner 
{ display: flex; flex-direction: column; gap: 0; }
.mobile-menu-link 
{ display: block; padding: 16px 0; border-bottom: 1px solid rgba(69, 44, 41, 0.12); font-family: "Poppins", sans-serif; font-size: 1rem; font-weight: 400; color: #452c29; text-decoration: none; letter-spacing: 0.03em; text-transform: uppercase; }
.mobile-menu-btn 
{ margin-top: 20px; min-height: 44px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; font-family: "Poppins", sans-serif; font-size: 0.9rem; font-weight: 500; color: #ffffff; text-decoration: none; text-transform: uppercase; letter-spacing: 0.06em; background: #e84e4b; border-radius: 999px; }

/** HEADER SLIDE **/
.header-slide-panel 
{ width: 100%; height: auto; top: 0; left: 0; padding: 14px 0; transform: translateY(-72px); opacity: 0; transition: transform 0.6s ease, opacity 0.6s ease; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); background-color: rgba(255, 255, 255, 0.6); position: fixed; z-index: 1001; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); }
.header-slide-panel.is-visible 
{ transform: translateY(0); opacity: 1; }
.header-slide-panel .wrapper 
{ display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.header-slide-menu-box 
{ height: 48px; margin: 0; padding: 0; position: relative; display: flex; align-items: center; z-index: 1002; min-width: 0; }
.header-slide-btn-box 
{ width: auto; height: 44px; margin: 0; padding: 0; position: relative; display: flex; align-items: center; z-index: 1002; flex: 0 0 auto; }
.header-slide-btn a 
{ min-width: 190px; height: 44px; margin: 0; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 0.875rem; color: #ffffff; text-align: center; text-decoration: none; text-transform: uppercase; letter-spacing: 0.06em; background: #e84e4b; border-radius: 999px; 
  transition: background-color 0.25s ease; white-space: nowrap; }
.header-slide-btn a:hover 
{ background: #f66260; }

/** HAMBURGER **/
#btn 
{ width: 40px; height: 40px; margin: 0 0 0 4px; padding: 0; display: none; position: relative; cursor: pointer; flex: 0 0 40px; border-radius: 999px; }
#top, #middle, #bottom 
{ position: absolute; left: 10px; width: 20px; height: 2px; display: block; background: #452c29; border-radius: 2px; transform-origin: center center; transition: transform 0.3s ease, opacity 0.2s ease, top 0.3s ease; }
#top 
{ top: 14px; }
#middle 
{ top: 19px; }
#bottom 
{ top: 24px; }
#btn.active #top 
{ top: 19px; transform: rotate(45deg); }
#btn.active #middle 
{ opacity: 0; }
#btn.active #bottom 
{ top: 19px; transform: rotate(-45deg); }

/** DESKTOP **/
@media only screen and (max-width: 1680px) { 
.header-top-panel 
{ padding: 16px 40px; }
.header-top-logo 
{ height: 36px; }
.header-bottom-panel 
{ padding: 12px 20px; }
.header-menu 
{ gap: 32px; }

}


@media only screen and (max-width: 1360px) {
.header-top-panel 
{ padding: 14px 24px; gap: 16px; }
.header-top-logo 
{ height: 34px; }
.header-phone 
{ font-size: 0.82rem; }
.header-top-btn a 
{ font-size: 0.82rem; padding: 0 12px; }
.header-menu 
{ gap: 24px; }
.menu-link 
{ font-size: 0.82rem; }

}


/** TABLET + MOBILE **/
@media only screen and (max-width: 1024px) {
.header 
{ position: fixed; background-color: rgba(255, 255, 255, 0.96); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.header-top-panel 
{ padding: 12px 16px; gap: 12px; position: relative; z-index: 1003; }
.header-top-logo-box 
{ flex: 1 1 auto; min-width: 0; }
.header-top-logo 
{ height: 32px; max-width: 170px; object-fit: contain; }
.header-top-right 
{ flex: 0 0 auto; }
.header-top-right-box 
{ gap: 4px; flex-wrap: nowrap; align-items: center; }
.header-phone-text, .header-top-btn, .header-bottom-panel, .header-slide-panel, .header-shop-divider 
{ display: none; }
.header-phone 
{ width: 40px; min-width: 40px; height: 40px; padding: 0; justify-content: center; gap: 0; flex: 0 0 40px; }
.header-phone-ico 
{ width: 20px; height: 20px; }
.header-shop 
{ width: 40px; min-width: 40px; height: 40px; flex: 0 0 40px; }
#btn 
{ display: block; }
#box 
{ display: block; position: fixed; top: 64px; right: 0; width: min(360px, 100%); height: calc(100vh - 64px); padding: 24px 20px 32px 20px; background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: -10px 0 30px rgba(0, 0, 0, 0.08); overflow-y: auto; transform: translateX(100%); opacity: 0; visibility: hidden; pointer-events: none;
  transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease; z-index: 1002; }
#box.active 
{ transform: translateX(0); opacity: 1; visibility: visible; pointer-events: auto; }

}


@media only screen and (max-width: 575px) {
.header-top-panel 
{ padding: 10px 12px; }
.header-top-logo 
{ height: 28px; max-width: 150px; }
.header-shop, .header-phone, #btn 
{ width: 36px; min-width: 36px; height: 36px; flex-basis: 36px; }
.header-shop-ico, .header-phone-ico 
{ width: 18px; height: 18px; }
.header-shop-ico img, .header-phone-ico img 
{ width: 18px; height: 18px; }
 #top, #middle, #bottom 
{ left: 9px; width: 18px; }
#top 
{ top: 13px; }
#middle 
{ top: 17px; }
#bottom 
{ top: 21px; }
#btn.active #top, #btn.active #bottom 
{ top: 17px; }
#box 
{ top: 56px; height: calc(100vh - 56px); padding: 20px 16px 28px 16px; }
.mobile-menu-link 
{ padding: 14px 0; font-size: 0.95rem;
   }
}



/****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** SLIDER ******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.hp-slider-panel 
{ width: 100%; min-height: 100dvh; display: grid; place-items: center; padding: 0; box-sizing: border-box; background: radial-gradient(ellipse at top center, rgba(255,255,255,0.6), rgba(255,255,255,0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248,209,189,0.4)); }
.hp-slider-wrapper 
{ width: min(2280px, 100% - clamp(0px, 6vw, 180px)); margin-inline: auto; }

.hp-slider 
{ --shadow: 0 10px 24px rgba(0,0,0,.08); --duration: 10000ms; --text: #452c29; --accent: #ee6852; position: relative; min-height: 100vh; }

.hp-slider__stage 
{ position: absolute; inset: 150px 20px 20px 20px; display: grid; grid-template-columns: minmax(420px, 1fr) minmax(420px, 1.2fr); align-items: stretch; overflow: hidden; border-radius: 0rem; background: none; /**background: #fbf1ec; box-shadow: var(--shadow);**/ }

.hp-slider__content 
{ display: flex; align-items: center; justify-content: center; padding: clamp(32px, 4vw, 80px); /** background: rgba(255,255,255,0.82); **/ }
.hp-slider__content-inner 
{ max-width: 680px; text-align: center; }

.hp-slider__eyebrow 
{ margin-bottom: 14px; font-family: "Poppins", sans-serif; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #b87463; }
.hp-slider__title 
{ margin: 0; font-family: "Poppins", sans-serif; font-weight: 600; font-size: clamp(2rem, 3vw, 3.2rem); line-height: 120%; color: #452c29; }
.hp-slider__desc 
{ width: 100%; margin: 22px 0 0; font-family: "Poppins", sans-serif; font-weight: 400; font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: 1.6; color: rgba(69,44,41,.88); }

.hp-slider__button 
{ display: inline-flex; align-items: center; justify-content: center; margin-top: 30px; min-width: 180px; padding: 14px 26px; color: #ffffff; text-decoration: none; font-family: "Poppins", sans-serif; font-size: 0.95rem; font-weight: 600; background: #e84e4b; border-radius: 999px; transition: transform .3s ease, opacity .3s ease; }
.hp-slider__button:hover 
{ background: #f66260; }

.hp-slider__media 
{ min-height: 100%; overflow: hidden; background: #fbf1ec; border-radius: 2rem; overflow: hidden; position: relative; }
.hp-slider__media::before 
{ content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(0deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,0) 28%); }
.hp-slider__img 
{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; }
.hp-slider__img.is-current 
{ opacity: 1; transform: translateX(0); }
.hp-slider__img.is-next 
{ opacity: 0; transform: translateX(18px); }

.hp-slider__media.is-animating .hp-slider__img.is-current 
{ opacity: 0; transform: translateX(-18px); transition: opacity .45s ease, transform .45s ease; }
.hp-slider__media.is-animating .hp-slider__img.is-next 
{ opacity: 1; transform: translateX(0); transition: opacity .45s ease, transform .45s ease; }

/** POCET SLIDERU **/
.hp-slider__nav 
{ position: absolute; left: 24px; right: 24px; bottom: 20px; z-index: 2; display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.hp-slider__dot 
{ position: relative; height: 6px; padding: 0; border: none; border-radius: 999px; background: rgba(255,255,255,.35); overflow: hidden; cursor: pointer; }

.hp-slider__progress 
{ position: absolute; inset: 0; }
.hp-slider__progress::before 
{ content: ""; position: absolute; inset: 0; background: #ffffff; transform: scaleX(0); transform-origin: left center; opacity: 0; }
.hp-slider__dot.is-active .hp-slider__progress::before 
{ opacity: 1; animation: hpSliderProgress var(--duration) linear forwards; }

@keyframes hpSliderProgress { from { transform: scaleX(0); } to { transform: scaleX(1); }}

@media (prefers-reduced-motion: reduce) {
.hp-slider__media.is-animating .hp-slider__img.is-current, .hp-slider__media.is-animating .hp-slider__img.is-next 
{ transition: opacity .2s ease; transform: none; }
}

/** MOBILE **/
@media (max-width: 1180px) {
.hp-slider-panel 
{ width: 100%; min-height: auto; display: block; }
.hp-slider-wrapper 
{ width: 100%; margin: 0; padding: 140px 20px 20px 20px; box-sizing: border-box; }
.hp-slider 
{ min-height: auto; }
.hp-slider__stage 
{ position: relative; inset: 0; display: flex; flex-direction: column; border-radius: 0px; }
.hp-slider__media 
{ width: 100%; aspect-ratio: 7 / 9; min-height: auto; border-radius: 1rem; }
.hp-slider__media::before 
{ display: none; }
.hp-slider__content 
{ order: 2; padding: 24px 20px 28px 20px; }
.hp-slider__content-inner 
{ max-width: 100%; text-align: center; }
.hp-slider__title 
{ font-size: 1.7rem; line-height: 1.2; }
.hp-slider__desc 
{ margin-top: 14px; font-size: 0.95rem; line-height: 1.5; }
.hp-slider__button 
{ margin: 22px 0px 0px 0px; }
.hp-slider__nav 
{ left: 16px; right: 16px; bottom: 14px; gap: 8px; }
}

@media (max-width: 980px) {
.hp-slider-wrapper 
{ width: 100%; margin: 0; padding: 66px 0px 20px 0px; box-sizing: border-box; }
.hp-slider__media 
{ width: 100%; aspect-ratio: 7 / 9; min-height: auto; border-radius: 0rem; }
}





/***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** NEW SLIDER *****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.hero-slider 
{ position: relative; margin-top: 144px; height: calc(100vh - 144px); overflow: hidden; background: radial-gradient(ellipse at top center, rgba(255,255,255,0.6), rgba(255,255,255,0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248,209,189,0.4)); touch-action: pan-y; }
.hero-slider__slides 
{ position: relative; width: 100%; height: 100%; }
.hero-slide 
{ position: absolute; inset: 0; display: flex; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.9s ease, visibility 0.9s ease; }

.hero-slide.active 
{ opacity: 1; visibility: visible; pointer-events: auto; z-index: 2; }
.hero-slide__content, .hero-slide__media 
{ width: 50%; height: 100%; }

.hero-slide__content 
{ display: flex; align-items: center; justify-content: center; background: var(--bgColor, var(--color-bg)); padding: 60px 70px; }
.hero-slide__inner 
{ width: 100%; max-width: 90%; text-align: center; transform: translateY(28px); opacity: 0; transition: opacity 0.9s ease 0.15s, transform 0.9s ease 0.15s;  }
.hero-slide.active .hero-slide__inner 
{ opacity: 1; transform: translateY(0); }
.hero-slide__eyebrow 
{ margin: 0px 0px 10px 0px; font-family: "Poppins", sans-serif; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: #b87463; }
.hero-slide__title 
{ max-width: 100%; margin: 0px; padding: 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-size: clamp(2rem, 3vw, 3.2rem); line-height: 120%; color: #452c29; letter-spacing: 0.04em; }
.hero-slide__text 
{ max-width: 100%; margin-top: 20px; font-family: "Poppins", sans-serif; font-weight: 400; color: rgba(69, 44, 41, .88); font-size: clamp(1rem, 1.25vw, 1.15rem); line-height: 1.6; }

.hero-slide__button 
{ display: inline-flex; align-items: center; justify-content: center; margin-top: 34px; min-width: 190px; min-height: 56px; padding: 14px 28px; font-family: "Poppins", sans-serif; color: #ffffff; font-size: 0.875rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; border-radius: 999px; background: #e84e4b; transition: transform .3s ease, opacity .3s ease; }
.hero-slide__button:hover 
{ background: #f66260; box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18); }

.hero-slide__media 
{ position: relative; overflow: hidden; background: #ddd; }
.hero-slide__media img 
{ width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.06); opacity: 0; transition: opacity 1s ease, transform 5.5s ease; }
.hero-slide.active .hero-slide__media img 
{ opacity: 1; transform: scale(1); }

.slider-arrow 
{ width: 64px; height: 64px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 20; width: 64px; height: 64px; border-radius: 50%; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(12px); box-shadow: 0 10px 30px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.15); transition: all 0.3s ease; }
.slider-arrow svg 
{ width: 26px; height: 26px; stroke: #452c29; stroke-width: 2.5; fill: none; transition: transform 0.3s ease; }
.slider-arrow--prev 
{ left: 28px; }
.slider-arrow--next 
{ right: 28px; }
.slider-arrow:hover 
{ background: rgba(255,255,255,0.16); transform: translateY(-50%) scale(1.08); }
.slider-arrow:active 
{ transform: translateY(-50%) scale(0.96); }

.hero-slider__progress 
{ position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: rgba(255, 255, 255, 0.18); z-index: 12; }
.hero-slider__progress-bar 
{ width: 0%; height: 100%; background: #e84e4b; }
.hero-slider__progress-bar.animate 
{ animation: sliderProgress 10000ms linear forwards; }
@keyframes sliderProgress 
{ from { width: 0%; } to { width: 100%; }}


@media (max-width: 1680px) {
.hero-slider 
{ margin-top: 136px; height: calc(100vh - 136px); }
}

@media (max-width: 1360px) {
.hero-slider 
{ margin-top: 132px; height: calc(100vh - 132px); }
}


@media (max-width: 1024px) {
.hero-slider 
{ height: auto; min-height: unset; margin-top: 64px; }
.hero-slider__slides 
{ height: auto; }
.hero-slide 
{ flex-direction: column; position: absolute; inset: 0; }
.hero-slide.active 
{ position: relative; }
.hero-slide__content, .hero-slide__media 
{ width: 100%; height: auto; }
.hero-slide__media 
{ order: 1; aspect-ratio: 7 / 8; overflow: hidden; }
.hero-slide__content 
{ order: 2; padding: 32px 20px 36px; min-height: unset; justify-content: flex-start; }
.hero-slide__inner 
{ max-width: 100%; }
.hero-slide__eyebrow 
{ margin: 0px 0px 10px 0px; text-align: center; }
.hero-slide__title 
{ width: 100%; text-align: center; }
.hero-slide__text 
{ max-width: 100%; width: 100%; text-align: center; }
.hero-slide__button 
{ width: 100%; }
.hero-slide__media img 
{ width: 100%; height: 100%; object-fit: cover; }
.slider-arrow 
{ display: none; }
.hero-slider__progress 
{ height: 4px; }

}

@media (max-width: 575px) {
.hero-slider 
{ height: auto; min-height: unset; margin-top: 60px; }
}









/**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** HP ********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.hp-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 60px 0px 60px 0px; }
.hp-color-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 60px 0px 60px 0px; background: radial-gradient(ellipse at top center, rgba(255,255,255,0.6), rgba(255,255,255,0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248, 209, 189,0.4)); }

/** HP HERO **/
.hp-hero-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 40px 0px; background: radial-gradient(ellipse at top center, rgba(255,255,255,0.6), rgba(255,255,255,0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248, 209, 189,0.4)); }
.hp-hero
{ max-width: 1200px; margin: 0 auto; padding: 40px 20px 0px 20px; }

.hp-hero-video-panel
{ width: 100%; height: auto; float: left; margin: 0px 40px 30px 0px; padding: 0px; }
.hp-hero__videoCard
{ width: min(100%, 980px); margin: 0px auto 0; border-radius: 1rem; overflow: hidden; border: 0px solid rgba(140,90,60,.18); box-shadow: 0 18px 44px rgba(0,0,0,.18); background: #ffffff; position: relative; z-index: 2; aspect-ratio: 16 / 9; }
.hp-hero-video-box 
{ width: 100%; aspect-ratio: 16 / 9; border-radius: 0.75rem; overflow: hidden; cursor: pointer; position: relative; }
.hp-hero-video-box video 
{ width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 768px){
.hp-hero
{ padding: 28px 0 8px; }
.hp-hero__wrap
{ padding: 0px 16px 0px 16px; }
.hp-hero__claim
{ padding: 32px 18px 96px; }
.hp-hero__videoCard, .hp-hero-video-box 
{ border-radius: 0rem; }

}

/** HP NUMBER PANEL **/
.hp-number
{ width: 100%; height: auto; float: left; margin: 0px; padding: 40px 0px 40px 0px; }
.hp-number-panel
{ max-width: 980px; height: auto; margin: 0px auto; padding: 0px; position: relative; }
.hpNumberContainer 
{ display: grid; grid-template-columns: repeat(2, 1fr); }
.hp-number-box 
{ padding: 20px 10px 20px 10px; }
.hp-number-box:nth-child(1), .hp-number-box:nth-child(2) 
{ border-bottom: 1px solid #e0e0e0; }
.hp-number-box:nth-child(1), .hp-number-box:nth-child(3) 
{ border-right: 1px solid #e0e0e0; }
.counter-box 
{ width: 90%; height: auto; margin: 0px auto; top: 0px; padding: 0px; position: relative; text-align: center; }
.counter-value 
{ font-family: "Poppins", sans-serif; font-weight: 700; font-style: normal; font-size: clamp(2rem, 4vw, 3rem); color: #ffddd8; line-height: 100%; letter-spacing: 0.04em; text-shadow: 0 2px 2px rgba(197, 64, 42, 1) }
.counter-popis p 
{ width: 100%; height: auto; margin: 0; padding-top: 10px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: clamp(0.8125rem, 2vw, 0.9375rem); color: #452c29; text-align: center; line-height: 150%; letter-spacing: 0.04em; }

/** HP CATEGORY PANEL **/
.hpCategoryBox 
{ position: relative; display: block; border-radius: 0.75rem; overflow: hidden; text-decoration: none; }
.hpCategoryBox__img 
{ width: 100%; aspect-ratio: 9/12; object-fit: cover; display: block; transition: transform .4s ease; }
.hpCategoryBox__overlay 
{ position: absolute; inset: 0; background: linear-gradient( to top,rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.50) 10%, rgba(0,0,0,0.15) 60%,  rgba(0,0,0,0.1) 100% ); transition: background .3s ease; }
.hpCategoryBox__content 
{ position: absolute; right: 20px; bottom: 15px; z-index: 2; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; color: #ffffff; }
.hpCategoryBox__title 
{ font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-size: 1.125rem; letter-spacing: 0.05em; text-shadow: 0 2px 4px rgba(0,0,0,0); }
.hpCategoryBox__arrow 
{ width: 60px; transition: transform .3s ease; }
/**
.hpCategoryBox:hover .hpCategoryBox__overlay 
{ background: linear-gradient( to top,rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0.5) 100% ); transition: background .3s ease; }
**/
.hpCategoryBox:hover .hpCategoryBox__arrow 
{ transform: translateX(12px); }
.hpCategoryBox:hover .hpCategoryBox__img 
{ transform: scale(1.05); }



/*******************/
/** TICKER *********/
/*******************/
.ticker
{ --gap: 20px; --visible-desktop: 6; --visible-laptop: 4; --visible-ipad: 3; --visible-mobile: 1.4; --duration-top: 40s; --duration-bottom: 48s; width: 100%; overflow: hidden; }
.ticker__row
{ width: 100%; overflow: hidden; touch-action: pan-y; }
.ticker__row + .ticker__row
{ margin-top: 20px; }

.ticker__track
{ display: flex; gap: var(--gap); width: max-content; will-change: transform; animation-timing-function: linear; animation-iteration-count: infinite; animation-play-state: running; }
.ticker__item
{ flex: 0 0 auto; text-decoration: none; color: inherit; width: calc((100vw - (var(--gap) * (var(--visible-desktop) - 1))) / var(--visible-desktop)); padding: 0px; display: grid; place-items: center; }

/* horní řada doleva */
.ticker__row--top .ticker__track{
  animation-name: ticker-left;
  animation-duration: var(--duration-top);
}

/* spodní řada doprava */
.ticker__row--bottom .ticker__track{
  animation-name: ticker-right;
  animation-duration: var(--duration-bottom);
}

/* nekonečný posuv – track je zdvojený (sada1+sada2) */
@keyframes ticker-left{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes ticker-right{
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

/* pause na hover (desktop) */
.ticker__row:hover .ticker__track{
  animation-play-state: paused;
}

/* pause když JS přidá třídu (dotyk / pointerdown) */
.ticker__row.is-paused .ticker__track{
  animation-play-state: paused;
}

/* responsive */
@media (max-width: 1680px) {
.ticker__item
{ width: calc((100vw - (var(--gap) * (var(--visible-laptop) - 1))) / var(--visible-laptop));}}

@media (max-width: 1380px) {
.ticker__item
{ width: calc((100vw - (var(--gap) * (var(--visible-laptop) - 1))) / var(--visible-ipad));}}

@media (max-width: 980px){
  .ticker__item{
    width: calc(
      (100vw - (var(--gap) * (var(--visible-mobile) - 1)))
      / var(--visible-mobile)
    );
  }
}


/** REFERENCE PANEL **/
.testimonial-grid 
{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.testimonial-card 
{ width: 100%; height: 100%; padding: 16px 16px; border-radius: 0.75rem; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.8), rgba(249, 224, 212, 0.7)); border: 1px solid #efe3dc; cursor: grab; cursor: -webkit-grab; box-sizing: border-box; display: flex; flex-direction: column; }
.stars 
{ color: #ffb400; margin: 0px auto; font-size: 1.375rem; position: relative; }
.testimonial-card p 
{ margin: 15px 0px 15px 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 0.9375rem; color: #452c29; text-align: center; text-decoration: none; line-height: 160%; flex: 0 1 auto; letter-spacing: 0.04em; }
.testimonial-footer 
{ width: 100%; height: auto; margin-top: auto; padding: 0px; border-top: 1px solid #d9cfc7; }
.testimonial-footer-name p
{ width: 100%; height: auto; margin: 16px 0px 8px 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1rem; color: #452c29; text-align: center; line-height: 100%; letter-spacing: 0.04em; }
.testimonial-footer-zakrok a
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #e17b54; text-align: center; text-decoration: none; line-height: 100%; letter-spacing: 0.04em; }
.testimonial-footer-zakrok a:hover
{ color: #e17b54; text-decoration: underline; }












.hp-testimonials {
  padding: 100px 20px;
  background: linear-gradient(180deg,#fbfaf8,#fff);
}

.hp-testimonials__inner {
  max-width: 1200px;
  margin: auto;
}

.hp-testimonials__head {
  text-align: center;
  margin-bottom: 50px;
}

.hp-testimonials__title {
  font-family: Georgia, serif;
  font-size: clamp(32px,5vw,56px);
}

.hp-testimonials__viewport {
  overflow: hidden;
}

.hp-testimonials__track {
  display: flex;
  gap: 20px;
  transition: transform .6s ease;
}

/* RESPONSIVE COUNT */
.hp-testimonials__track { --per-view: 3; }
@media (max-width: 980px){ .hp-testimonials__track{ --per-view: 2; } }
@media (max-width: 600px){ .hp-testimonials__track{ --per-view: 1; } }

.hp-review-card {
  flex: 0 0 calc((100% - (20px * (var(--per-view) - 1))) / var(--per-view));

  min-height: 380px;
  padding: 16px;
  border-radius: 12px;
  border: 1px solid #efe3dc;

  background:
    radial-gradient(ellipse at bottom center, rgba(255,255,255,.2), rgba(255,255,255,.8) 70%),
    linear-gradient(to bottom, rgba(249,224,212,.8), rgba(249,224,212,.7));

  display: flex;
  flex-direction: column;
  text-align: center;

  opacity: .4;
  transform: translateY(20px);
  transition: .5s;
}

.hp-review-card.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* CONTENT */
.hp-review-card__stars {
  color: #ffb400;
  font-size: 22px;
  margin: 0 auto;
}

.hp-review-card__text {
  margin: 15px 0;
  font-family: Poppins;
  font-size: 15px;
  color: #452c29;
  line-height: 160%;
}

.hp-review-card__name {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid #d9cfc7;
  font-family: Poppins;
  font-weight: 600;
}

.hp-review-card__tag {
  font-size: 14px;
  color: #e17b54;
  text-decoration: none;
}

.hp-review-card__tag:hover {
  text-decoration: underline;
}

/* DOTS */
.hp-review-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 30px;
}

.hp-review-dot {
  width: 8px;
  height: 8px;
  border-radius: 20px;
  background: #ccc;
  border: none;
  cursor: pointer;
  transition: .3s;
}

.hp-review-dot.active {
  width: 28px;
  background: #e17b54;
}
























/** BLOG CARD **/
.blogCardGrid
{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; padding: 0px; margin: 0; align-items: stretch; }
@media (max-width: 980px) {
.blogCardGrid
{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
.blogCardGrid
{ grid-template-columns: 1fr; }
}

.blogCard
{ display: flex; flex-direction: column; text-decoration: none; color: inherit; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.9), rgba(249, 224, 212, 0.8)); border: 1px solid #efe3dc; border-radius: 0.75rem; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.blogCard:hover
{ transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.1); }
.blogCard__image img
{ width: 100%; aspect-ratio: 9 / 7; overflow: hidden; object-fit: cover; display: block; }
.blogCard__content
{ padding: 15px 15px 30px 15px; }
.blogCard__content p
{ margin: 0; padding: 0px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #fd8482; text-align: left; line-height: 100%; letter-spacing: 0.04em; }
.blogCard__content h3
{ margin: 0px; padding: 15px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 1rem; color: #452c29; text-align: left; line-height: 130%; letter-spacing: 0.04em; }



/*=========================
  UNIVERSAL CAROUSEL
  ========================= */
.carousel-panel
{ width: 100%; margin: 0px auto; padding: 20px 0px 20px 0px; }

.carousel 
{ --perViewDesktop: 4; --perViewLaptop: 3; --perViewTablet: 2; --perViewMobile: 1; --perView: var(--perViewDesktop); --gap: 22px; --radius: 0.75rem; padding: 0px 0px 0px 0px; overflow: hidden; }
@media (max-width: 1380px) { .carousel { --perView: var(--perViewLaptop); --gap: 20px; } }
@media (max-width: 1024px) { .carousel { --perView: var(--perViewTablet); --gap: 18px; } }
@media (max-width: 768px)  { .carousel { --perView: var(--perViewMobile); --gap: 16px; padding: 0px; }}


.carousel-header
{ min-height: 36px; display: flex; align-items: center; justify-content: center; margin-bottom: 24px; position: relative; }
.carousel-header h2
{ margin: 0; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: clamp(1.25rem, 4vw, 1.75rem); color: #452c29; line-height: 100%; text-transform: none; text-decoration: none; text-align: left; letter-spacing: 0.04em; }

.carousel-arrows
{ position: absolute; right: 0; display: flex; gap: 8px; }
@media (max-width: 980px) { .carousel-arrows { display: none; }}
.carousel-arrow 
{ width: 36px; height: 36px; border-radius: 999px; border: 1px solid rgba(0,0,0,.16); background: rgba(255,255,255,.85); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); display: grid; place-items: center; cursor: pointer; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.carousel-arrow svg 
{ width: 18px; height: 18px; }
.carousel-arrow:hover 
{ transform: translateY(0px); border-color: rgba(0,0,0,.28); background: rgba(255,255,255,.95); }
.carousel-arrow:active 
{ transform: translateY(0); }
.carousel-arrow:focus-visible 
{ outline: none; box-shadow: 0 0 0 3px rgba(0,0,0,.12); }

.carousel-viewport 
{ width: 100%; margin: 0 auto; overflow: hidden; }
.carousel-track 
{ display: flex; gap: var(--gap); transition: transform .6s ease; will-change: transform; touch-action: pan-y; align-items: stretch; /*user-select: none;*/ }
.carousel-item 
{ flex: 0 0 calc( (100% - (var(--gap) * (var(--perView) - 1))) / var(--perView) ); box-sizing: border-box; display: flex; }
.box 
{ width: 100%; height: 100%; background: none; border-radius: var(--radius); padding: 0px; }

.carousel-dots 
{ display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.carousel-dots button 
{ width: 8px; height: 8px; border-radius: 999px; border: none; padding: 0; background: rgba(0,0,0,.30); cursor: pointer; }
.carousel-dots button.active 
{ background: rgba(0,0,0,.85); }

.carousel-bottom-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 30px 0px 0px 0px; }
.carousel-bottom-box
{ width: max-content; height: auto; margin: 0px auto 0px auto; padding: 0px; }
.carouselMoreBox
{ height: auto; margin: 0px; padding: 0px; display: block; text-decoration: none; }
.carouselMoreBtn
{ height: 40px; display: flex; justify-content: center; align-items: center; gap: 6px; padding: 0px 12px 0px 12px; font-family: "Poppins", sans-serif; font-weight: 400; color: #452c29; font-size: 1rem; text-decoration: none !important; background: none; border: 2px solid #452c29; border-radius: 0.75rem; cursor: pointer; }
.carouselMoreBtn .carouselArrow svg 
{ transition: transform 0.35s ease; display: block; color: #452c29  }
.carouselMoreBtn:hover .carouselArrow svg 
{ transform: translateX(3px); }


/*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PAGE *************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.page 
{ width: 100%; height: auto; float: left; margin: 0px; padding: 60px 0px 60px 0px; position: relative;  }

/** HEAD **/
.head-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 170px 0px 40px 0px; background: radial-gradient(ellipse at top center, rgba(255,255,255,0.6), rgba(255,255,255,0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248, 209, 189,0.4)); border-radius: 0rem 0rem 2rem 2rem; }
.head-page-txt
{ width: 100%; height: auto; margin: 0px; padding: 0px; position: relative;  }
.head-page-txt h1
{ width: 100%; height: auto; margin: 0px; padding: 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: 2.375rem; color: #452c29; text-align: center; line-height: 150%; letter-spacing: 0.04em; }
.head-page-txt h2
{ width: 100%; height: auto; margin: 0; padding: 10px 0px 10px 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: 1.3rem; color: #452c29; text-align: center; line-height: 130%; letter-spacing: 0.04em; }
.head-page-txt p
{ max-width: 64%; height: auto; margin: 0px auto; padding: 20px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 1rem; color: #452c29; text-align: center; line-height: 160%; letter-spacing: 0.04em; }
.head-page-txt a
{ color: #e84e4b; text-decoration: none; }
.head-page-txt a:hover
{ color: #e84e4b; text-decoration: none; }


/** HEAD BTN **********/
.head-btn-box 
{ width: 100%; height: 50px; margin: 30px 0 0 0; padding: 0; display: flex; justify-content: center; }
.head-btn a
{ height: 50px; padding: 0 60px 0 24px; box-sizing: border-box; font-family: "Poppins", sans-serif; font-weight: 400; font-size: 0.9375rem; color: #ffffff; text-decoration: none; text-transform: none; letter-spacing: 0.04em; background: #e84e4b; display: inline-flex; align-items: center; justify-content: center; line-height: 1; position: relative; border-radius: 999px; transition: background .3s ease; }
.head-btn a::after
{ content: ""; position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; background: #8e2e2c; border-radius: 50%; transition: background .3s ease; z-index: 1; }
.head-btn a svg
{ position: absolute; right: 16px; top: 50%; width: 20px; height: 20px; color: #ffffff; z-index: 2; transform: translateY(-50%) rotate(-45deg); transform-origin: 50% 50%; transition: transform .4s ease; }
.head-btn a:hover svg
{ transform: translateY(-50%) rotate(0deg); color: #ffffff; }
.head-btn a:hover
{ color: #ffffff; background: #f66260; }


/***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** CATEGORY ***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.category-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 0px 0px; }
.categoryWrapper 
{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 0; }
.categoryBox 
{ padding: 0; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.9), rgba(249, 224, 212, 0.8)); border: 1px solid #efe3dc; container-type: inline-size; box-sizing: border-box; border-radius: 0.75rem; }
.categoryBoxInner 
{ display: grid; grid-template-columns: 3.2fr 1.8fr; gap: 0px; box-sizing: border-box; }
.categoryBoxInnerLeft, .categoryBoxInnerRight
{ padding: 30px 20px 30px 20px; box-sizing: border-box; }
.categoryBoxNapis h2
{ width: 100%; height: auto; margin: 0; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1.125rem; color: #452c29; text-align: left; line-height: 130%; letter-spacing: 0.02em; }
.categoryBoxNapis p
{ width: 100%; height: auto; margin: 0; padding: 15px 0px 20px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: clamp(0.8125rem, 4.5vw, 0.840rem); color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.02em; }
.categoryBoxOdkaz 
{ margin-bottom: 10px; padding-left: 30px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.9375rem; color: #452c29; text-decoration: none; background: url("/images/bckg/zakroky/ico-arrow-right.svg") no-repeat left center; background-size: 1.2em; display: block; }
.categoryBoxOdkaz:hover
{ text-decoration: underline; }
.categoryBoxImg img
{ width: 100%; height: auto; margin: 0px; padding: 0px; border-radius: 0.75rem; overflow: hidden; position: relative; }
.categoryMoreBox
{ height: 20px; margin: 0px; padding: 20px 0px 0px 0px; display: block; text-decoration: none; }
.categoryMoreBtn
{ width: 100%; height: 20px; display: flex; justify-content: flex-end; align-items: center; gap: 6px; padding: 0; font-family: "Poppins", sans-serif; font-weight: 400; color: #e17b54; font-size: 0.9375rem; text-decoration: none !important; background: none; border: none; cursor: pointer; }
.categoryMoreBtn .categoryArrow svg 
{ transition: transform 0.35s ease; display: block; color: #e17b54  }
.categoryMoreBtn:hover .categoryArrow svg 
{ transform: translateX(3px); }


@media only screen and (max-width: 880px) {
/** PRODUCT CATEGORY **/
.categoryBoxInner 
{ grid-template-columns: 1fr; }
.categoryBoxInnerLeft, .categoryBoxInnerRight
{ padding: 20px 20px 10px 20px; }
}


/***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PERSON CARD *****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.personCardGrid
{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; padding: 0px; margin: 0; align-items: stretch; }
@media (max-width: 1980px) { .personCardGrid { grid-template-columns: repeat(3, 1fr); }}
@media (max-width: 980px) { .personCardGrid { grid-template-columns: repeat(2, 1fr); }}
@media (max-width: 640px) { .personCardGrid { grid-template-columns: 1fr; }}

.personCard
{ display: flex; flex-direction: column; text-decoration: none; color: inherit; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.9), rgba(249, 224, 212, 0.8)); border: 1px solid #efe3dc; border-radius: 0.75rem; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.personCard:hover
{ transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.1); }
.personCard__image img
{ width: 100%; aspect-ratio: 5 / 7; overflow: hidden; object-fit: cover; display: block; }
.personCard__content
{ padding: 20px 16px 20px 16px; }
.personCard__content h3
{ margin: 0px; padding: 0px 0px; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1.125rem; color: #452c29; text-align: left; line-height: 130%; letter-spacing: 0.02em; }
.personCard__content p
{ margin: 0; padding: 15px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.04em; }


/***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PROCEDURE CARD *****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.procedureCardGrid
{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; padding: 0px; margin: 0; align-items: stretch; }
@media (max-width: 980px) {
.procedureCardGrid
{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
.procedureCardGrid
{ grid-template-columns: 1fr; }
}

.procedureCard
{ display: flex; flex-direction: column; text-decoration: none; color: inherit; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.9), rgba(249, 224, 212, 0.8)); border: 1px solid #efe3dc; border-radius: 0.75rem; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.procedureCard:hover
{ transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.1); }
.procedureCard__image img
{ width: 100%; aspect-ratio: 9 / 6; overflow: hidden; object-fit: cover; display: block; }
.procedureCard__content
{ padding: 20px 16px 20px 16px; }
.procedureCard__content h3
{ margin: 0px; padding: 0px 0px; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1.125rem; color: #452c29; text-align: left; line-height: 130%; letter-spacing: 0.02em; }
.procedureCard__content p
{ margin: 0; padding: 15px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.04em; }


/***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PROCEDURE INTO *****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.procedure-page 
{ width: 100%; height: auto; float: left; margin: 0px; padding-top: 60px; padding-bottom: 60px; position: relative; }
.procedure-left
{ width: 30%; height: auto; float: left; margin: 0px; padding: 0px; }
.procedure-right
{ width: 66%; height: auto; float: right; margin: 0px; padding: 0px; }
.procedure-left-img
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.procedure-left-img img
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; border-radius: 0.75rem; overflow: hidden; }
.procedure-numbox-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding-top: 20px; padding-bottom: 40px; }
.procedure-numbox
{ width: 100%; height: auto; margin: 0px; padding-top: 30px; padding-bottom: 20px; text-align: left; }
.procedure-numbox-center
{ width: 100%; height: auto; margin: 0px; padding-top: 30px; padding-bottom: 20px; border-top: 1px solid #efe3dc; border-bottom: 1px solid #efe3dc; text-align: left; }
.procedure-numbox-number p
{ width: 100%; height: auto; margin: 0; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 700; font-style: normal; font-size: clamp(1.125rem, 3vw, 1.5rem); color: #452c29; line-height: 140%; letter-spacing: 0.04em; }
.procedure-numbox-popis p
{ width: 100%; height: auto; margin: 0; padding: 12px 0px 0px 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 300; font-style: normal; font-size: 1.125rem; color: #452c29; line-height: 100%; letter-spacing: 0.04em; }

.procedure-right-top-box
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 20px 0px; }
.procedure-right-top-box p
{ width: 100%; height: auto; margin: 0; padding: 0px 0px 20px 0px; font-family: "Poppins", sans-serif; font-style: normal; font-weight: 400; font-size: 1.125rem; color: #452c29; text-align: left; line-height: 150%; letter-spacing: 0.04em; }
.procedure-right-top-box-popis p
{ width: 100%; height: auto; margin: 0; padding: 0px 0px 20px 0px; font-family: "Poppins", sans-serif; font-style: normal; font-weight: 300; font-size: 17px; color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.04em; }

/** PROCEDURE BENEFIT PANEL **/
.procedure-benefit-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.procedure-benefit-panel h2
{ width: 100%; height: auto; margin: 0; padding: 10px 0px 20px 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 700; font-size: 1.25rem; color: #452c29; text-align: left; line-height: 100%; letter-spacing: 0.04em; }
.procedure-benefit-box
{ width: 100%; height: auto; float: left; margin: 0px; padding: 20px 16px 20px 16px; box-sizing: border-box; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.9), rgba(249, 224, 212, 0.8)); border: 1px solid #efe3dc; border-radius: 0.75rem; overflow: hidden;  }
.procedure-benefit-box-left
{ width: 65%; height: auto; float: left; margin: 0px; padding: 0px; }
.procedure-benefit-box-txt
{ width: 100%; height: auto; float: left; margin: 0px 0px 10px 0px; padding: 14px; box-sizing: border-box; background: #ffffff; border: 1px solid #efe3dc; border-radius: 0.75rem; overflow: hidden;  }
.procedure-benefit-box-txt h3
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-style: normal; font-weight: 500; font-size: 1rem; text-align: left; letter-spacing: 0.04em; line-height: 130%; color: #452c29; }
.procedure-benefit-box-txt p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 10px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 0.9125rem; text-align: left; line-height: 130%; color: #452c29; letter-spacing: 0.04em; }
.procedure-benefit-box-right
{ width: 33%; height: auto; float: right; margin: 0px; padding: 0px; }
.procedure-benefit-box-right img
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; border-radius: 0.75rem; overflow: hidden; }

/** PROCEDURE BOTTOM PANEL **/
.procedure-bottom-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 60px 0px 0px 0px; }
.procedure-bottom-box
{ width: 100%; height: auto; float: left; margin: 0px; padding: 40px 0px 40px 0px; }
.procedure-bottom-box-txt h3
{ width: 100%; height: auto; margin: 0; padding-top: 0px; padding-bottom: 15px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 700; font-style: normal; font-size: 1.3125rem; color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.04em; border-bottom: 1px solid #efe3dc; }
.procedure-bottom-box-txt p
{ width: 70%; height: auto; margin: 0; padding-top: 20px; padding-bottom: 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 16px; color: #452c29; text-align: left; line-height: 160%; letter-spacing: 0.04em; }
.procedureOdkazBox
{ width: 100%; height: auto; float: left; margin: 0px; padding: 20px 0px 0px 0px; color: #452c29 !important;  }
.procedureOdkaz 
{ margin-bottom: 10px; padding-left: 30px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.925rem; color: #452c29 !important; text-decoration: none; background: url("/images/bckg/zakroky/ico-arrow-right.svg") no-repeat left center; background-size: 1.2em; display: block; }
.procedureOdkaz:hover
{ text-decoration: underline; }

.procedure-bottom-odstv-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding-top: 10px; padding-bottom: 5px; }
.procedure-bottom-odstv::before 
{ width: 24px; height: 24px; padding: 0px; content: ""; display: inline-block; background-image: url("../images/bckg/ico-bottom-odstv.svg"); background-repeat: no-repeat; background-position: center; background-size: 50% 50%; vertical-align: middle; }
.procedure-bottom-odstv
{ margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 1rem; letter-spacing: 0.03em; line-height: 24px; color: #452c29; display: flex; gap: 5px; }
.procedure-bottom-price-box-left
{ width: 30%; height: 60px; float: left; margin: 0px; padding: 0px; }
.procedure-bottom-price-box-left p
{ width: 100%; height: 60px; margin: 0; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; color: #452c29; text-align: left; line-height: 60px; letter-spacing: 0.04em; }
.procedure-bottom-price-box-right
{ width: 35%; height: 60px; float: right; margin: 0px; padding: 0px; }
.procedure-bottom-price-box-right p
{ width: 100%; height: 60px; margin: 0; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; color: #452c29; text-align: right; line-height: 60px; letter-spacing: 0.04em; }
.price-widget
{ width: 100%; height: 22px !important; float: left; margin-bottom: -15px; padding: 0px; position: relative; }
.price-widget-red
{ height: 22px; right: 0px; top: 0px; padding-left: 8px; padding-right: 8px; font-family: "Poppins", sans-serif; font-size: 11px !important; font-style: normal; font-weight: 400; color: #ffffff; text-transform: uppercase; text-align: center; text-decoration: none; line-height: 22px !important; letter-spacing: 0.03em; background: #ff395c; border-radius: 6px 0px 6px 0px; position: absolute; display: block; }


/** ODKAZY **/
.procedure-bottom-box-txt a, .procedure-right-top-box a, .procedure-right-top-box-popis a
{ color: #e84e4b; text-decoration: none; }
.procedure-bottom-box-txt a:hover, .procedure-right-top-box a:hover, .procedure-right-top-box-popis a:hover
{ color: #f66260; text-decoration: underline; }

/** PROCEDURE VIDEO **/
.procedure-stream-panel 
{ width: 100%; height: auto; float: left; margin: 0; padding: 60px 0px 0px 0px; }
.procedure-video-bg 
{ margin: 0; display: flex; flex-wrap: wrap; justify-content: center; padding: 0; gap: 20px; }
.procedure-video-box 
{ width: 800px; max-width: 100%; border-radius: 20px; overflow: hidden; cursor: pointer; position: relative; }

/* Náhled MP4 videa */
.procedure-video-box video 
{ width: 100%; display: block; transition: transform 0.3s; }

/* Náhled YouTube obrázku */
.procedure-video-box img 
{ width: 100%; display: block; transition: transform 0.3s; }

/* Hover efekt pro oba typy náhledu */
.procedure-video-box:hover video, .procedure-video-box:hover img 
{ transform: scale(1.03); }

/* Play ikonka pro YouTube náhled */
.procedure-video-box .play-icon, .hp-video-box .play-icon 
{ width: 50px; height: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; font-size: 28px; color: #ffffff; border: 2px solid #ffffff; border-radius: 50%; pointer-events: none; }

/** MODAL **/
.modal
{ position: fixed; inset: 0; width: 100vw; height: 100vh; display: none; align-items: center; justify-content: center; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); background: rgba(0, 0, 0, 0.7); z-index: 9999; }
.modal.active
{ display: flex; }
.modal-close
{ position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; border-radius: 999px; border: none; background: none; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; display: grid; place-items: center; z-index: 10000; }
.modal-media
{ --gap: 20px; --topReserve: 80px; max-width: calc(100vw - (var(--gap) * 2)); max-height: calc(100vh - (var(--gap) * 2) - var(--topReserve)); width: min(calc(100vw - (var(--gap) * 2)), calc((100vh - (var(--gap) * 2) - var(--topReserve)) * (16 / 9))); aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; box-shadow: 0 18px 44px rgba(0,0,0,.35); }
.modal video, .modal iframe
{ width: 100%; height: 100%; border: 0; display: none; object-fit: contain; }

@media (max-width: 768px)
{ .modal-close { top: 16px; right: 16px; width: 40px; height: 40px; font-size: 26px; }
  .modal-media { --gap: 20px; --topReserve: 70px; }
}

/** TAB PANEL **/
.tab-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; border-bottom: 1px solid #e8d6cb; position: relative; }
.tab input 
{ position: absolute; opacity: 0; z-index: -1;}
.tab input:checked ~ .tab__content 
{ max-height: 1000px; }
.accordion 
{ color: #45382f; overflow: hidden; }
.tab__label, .tab__close 
{ display: flex; color: white; background: #ffffff; cursor: pointer; }
.tab__label 
{ justify-content: space-between; padding-left: 0px; padding-right: 0px; padding-top: 30px; padding-bottom: 30px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 1.0625rem; color: #452c29; text-transform: none; letter-spacing: 0.04em; line-height: 100%; backgroundtop: 1px solid #e8d6cb; transition: all .3s ease; }
.tab__label:hover
{ color: #f66260; }
.tab__label::after 
{ content: "+"; font-family: "Poppins", sans-serif; font-size: 24px; font-weight: 500; background-size: 1.2em; text-align: center; transform: rotate(0deg); transition: transform 0.3s; transform-origin: 50% 50%; }
.tab input:checked + .tab__label 
{ color: #f66260; }
.tab input:checked + .tab__label::after 
{ transform: rotate(45deg); }
.tab input:checked + .tab__label
{ background: none; }
.tab__content 
{ max-height: 0; padding: 0px; overflow: hidden; transition: all 1.40s; background: none; }
.tab__content p 
{ margin: 0; }

/************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** CENIK ***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.cenik-cream-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 15px 0px 15px 0px; background: #f6e6d5;  }
.cenik-cream-panel-other
{ width: 100%; height: auto; float: left; margin: 30px 0px 0px 0px; padding: 15px 0px 15px 0px; background: #f6e6d5;  }
.cenik-cream-napis h3
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 20px 0px 20px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 1rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 18px; letter-spacing: 0.04em; box-sizing: border-box; }

.cenik-line-light
{ width: 100%; height: auto; float: left; margin: 0px; padding-top: 10px; padding-bottom: 10px; background: #ffffff;  }
.cenik-line-dark
{ width: 100%; height: auto; float: left; margin: 0px; padding-top: 10px; padding-bottom: 10px; background: #f6f6f6;  }

.cenik-procedure-napis-40 p
{ width: 40%; height: auto; float: left; margin: 0px; padding: 4px 20px 4px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 15px; letter-spacing: 0.04em; box-sizing: border-box; }
.cenik-procedure-napis-70 p
{ width: 70%; height: auto; float: left; margin: 0px; padding: 4px 20px 4px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 15px; letter-spacing: 0.04em; box-sizing: border-box; }
.cenik-procedure-popis-30 p
{ width: 30%; height: auto; float: left; margin: 0px; padding: 4px 20px 4px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-transform: none; text-align: right; text-decoration: none; line-height: 15px; letter-spacing: 0.04em; box-sizing: border-box; }
.cenik-procedure-popis-70 p
{ width: 70%; height: auto; float: left; margin: 0px; padding: 4px 20px 4px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-transform: none; text-align: right; text-decoration: none; line-height: 15px; letter-spacing: 0.04em; box-sizing: border-box; }
.cenik-info-100 p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 4px 20px 4px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 15px; letter-spacing: 0.04em; box-sizing: border-box; }
.cenik-info-odstavec p 
{ width: 96%; height: auto; float: left; margin-left: 0px; margin-top: 3px; margin-bottom: 3px; padding-left: 18px; padding-top: 0px; padding-bottom: 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 0.875rem; color: #452c29; text-align: left; text-transform: none; text-decoration: none; line-height: 16px; letter-spacing: 0.04em;
  background: url(../images/bckg/blog-odstavec.png) no-repeat 0px 4px; }


@media only screen and (max-width: 980px) {
.cenik-cream-panel
{ padding: 10px 0px 10px 0px; }
.cenik-cream-panel-other
{ width: 100%; height: auto; float: left; margin: 20px 0px 0px 0px; padding: 15px 0px 15px 0px }
.cenik-cream-napis h3
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 10px 0px 10px; font-size: 0.8125rem; line-height: 18px; text-align: left; }
.cenik-procedure-napis-40 p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 3px 10px 3px 10px; font-size: 0.8125rem; line-height: 15px; text-align: left; }
.cenik-procedure-napis-70 p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 3px 10px 3px 10px; font-size: 0.8125rem; line-height: 15px; text-align: left; }
.cenik-procedure-popis-30 p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 3px 10px 3px 10px; font-size: 0.8125rem; line-height: 15px; text-align: left; }
.cenik-procedure-popis-70 p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 3px 10px 3px 10px; font-size: 0.8125rem; line-height: 15px; text-align: left; }

}


/*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PERSON ***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.personContainer 
{ width: 100%; margin: 0px 0px 30px 0px; display: grid; grid-template-columns: calc(35% - 30px) calc(65% - 30px); gap: 60px; }
.personBox 
{ padding: 0px; box-sizing: border-box; }


/** LEFT ********************/
.person-top-img
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.person-top-img img
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; border-radius: 1rem; overflow: hidden; }

.personPromenaBox
{ width: 100%; height: auto; float: left; margin: 0px; padding: 40px 0px 20px 0px; border-bottom: 1px solid #efe3dc; }
.personPromenaBox h2
{ width: 100%; height: auto; margin: 0; padding: 0px 0px 20px 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: 1.25rem; color: #452c29; text-align: left; line-height: 100%; letter-spacing: 0.04em; }
.personZakrok 
{ margin-bottom: 10px; padding-left: 30px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.925rem; color: #452c29; text-decoration: none; background: url("/images/bckg/zakroky/ico-arrow-right.svg") no-repeat left center; background-size: 1.2em; display: block; }
.personZakrok:hover
{ text-decoration: underline; }

/** RIGHT ********************/
.person-top-txt p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 20px 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 1.125rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 150%; letter-spacing: 0.04em; }
.person-txt p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 10px 0px 10px 0px; font-family: "Poppins", sans-serif; font-weight: 300; font-style: normal; font-size: 1rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 150%; letter-spacing: 0.04em; }
.person-top-txt a, .person-txt a
{ color: #ee6852; text-decoration: none; }
.person-top-txt a:hover, .person-txt a:hover
{ color: #ee6852; text-decoration: underline; }


/*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PRED - PO ************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.before-after-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.beforeafter 
{ width: 100%; margin: 0; border-radius: 0.75rem; overflow: hidden; background: radial-gradient(ellipse at bottom center, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.8) 70%), linear-gradient(to bottom, rgba(249, 224, 212, 0.8), rgba(249, 224, 212, 0.7)); border: 1px solid #efe3dc; box-sizing: border-box; }
.beforeafter__imgWrap 
{ position: relative; }
.beforeafter__img 
{ width: 100%; aspect-ratio: 1 / 1; display: block; transition: opacity .25s ease; cursor: pointer; border-radius: 0.75rem 0.75rem 0rem 0rem; object-fit: cover; }
.beforeafter__controls 
{ display: flex; gap: 12px; padding: 10px; justify-content: center; }
.beforeafter__btn 
{ width: 80px; appearance: none; border: 1px solid rgba(0, 0, 0, .15); background: #ffffff; padding: 5px 0px 5px 0px; border-radius: 0.75rem; cursor: pointer; font-family: "Poppins", sans-serif; font-size: 0.875rem; transition: transform .15s ease, background .2s ease, border-color .2s ease; }
.beforeafter__btn:hover 
{ transform: translateY(0px); }
.beforeafter__btn.is-active 
{ background: #f66260; border-color: #ee6852; color: #ffffff; }
.beforeafter__btn:focus-visible 
{ outline: 2px solid #ff395c; outline-offset: 3px; }
.beforeafter__info 
{ padding: 14px 16px 16px; text-align: center; border-top: 1px solid #efe3dc; }
.beforeafter__info-text 
{ margin: 0px; font-family: "Poppins", sans-serif; font-size: 0.875rem; font-weight: 400; color: #452c29; }
.beforeafter__info-link 
{ font-family: "Poppins", sans-serif; font-size: 0.85rem; font-weight: 500; color: #ff395c; text-decoration: none; transition: color .3s ease; }
.beforeafter__info-link:hover 
{ color: #e62f50; text-decoration: underline; }

/*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** CONTACT ***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.contact-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.contact-panel-l
{ width: 44%; height: auto; float: left; margin: 0px; padding: 0px; }
.contact-panel-r
{ width: 50%; height: auto; float: right; margin: 0px; padding: 0px; }

.contact-address-napis h2
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 1.875rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 100%; letter-spacing: 0.04em; }
.contact-address-popis
{ width: 100%; height: auto; float: left; margin: 0px; padding: 40px 0px 0px 0px; }
.contact-address-popis p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 1rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 150%; letter-spacing: 0.04em; }

.contact-action-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 30px 0px 0px 0px; }
.contact-action-box
{ width: 100%; height: auto; float: left; margin: 0px; padding: 8px 0px 8px 0px; }
.contact-action 
{ width: max-content; height: 40px; margin: 0px 0px 0px 0px; display: inline-flex; align-items: center; gap: 12px; font-family: "Poppins", sans-serif; font-size: 0.9375rem; font-weight: 400; font-style: normal; letter-spacing: 0.04em; text-decoration: none; color: #452c29; transition: color 0.3s ease; }
.contact-action-ico 
{ width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; }
.contact-action-ico img 
{ width: 100%; height: auto; display: block; }
.contact-action:hover 
{ color: #ee6852; }

.contact-panel-r-box
{ width: 100%; height: auto; float: left; margin: 0px 0px 50px 0px; padding: 0px; }
.contact-panel-r-box h3
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 1.5rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 100%; letter-spacing: 0.04em; }
.contact-open-panel
{ width: 80%; height: auto; float: left; margin: 0px; padding: 20px 0px 0px 0px; }
.contact-open-line
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; }
.contact-open-l
{ width: 30%; height: 34px; float: left; margin: 0px; padding: 0px; }
.contact-open-l p
{ width: 100%; height: 34px; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 0.9375rem; color: #452c29; text-transform: uppercase; text-align: left; text-decoration: none; line-height: 34px; letter-spacing: 0.04em; }
.contact-open-r
{ width: 70%; height: 34px; float: left; margin: 0px; padding: 0px; }
.contact-open-r p
{ width: 100%; height: 34px; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.9375rem; color: #452c29; text-transform: none; text-align: left; text-decoration: none; line-height: 34px; letter-spacing: 0.04em; }

.contact-traffic-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 10px 0px 0px 0px; }
.contact-traffic-box
{ width: 100%; height: auto; float: left; margin: 0px; padding: 10px 0px 10px 0px; }
.contact-traffic 
{ width: max-content; height: 32px; margin: 0px 0px 0px 0px; display: inline-flex; align-items: center; gap: 12px; font-family: "Poppins", sans-serif; font-size: 1rem; font-weight: 500; font-style: normal; letter-spacing: 0.04em; text-decoration: none; color: #452c29; }
.contact-traffic-popis
{ width: 94%; height: auto; margin: 0px; padding: 0px 0px 0px 34px; font-family: "Poppins", sans-serif; font-size: 0.875rem; font-weight: 300; font-style: normal; letter-spacing: 0.04em; line-height: 130%; text-decoration: none; color: #452c29; }
.contact-traffic-popis a
{ color: #452c29; text-decoration: underline; }
.contact-traffic-popis a:hover
{ color: #452c29; text-decoration: none; }
.contact-traffic-ico 
{ width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; }
.contact-traffic-ico img 
{ width: 100%; height: auto; display: block; }
.contact-action:hover 
{ color: #ee6852; }

.contact-address-map-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 80px 0px 0px 0px; }
.contact-address-map
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 0px 0px; }


/************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** PETRA SHOW **********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.showCardGrid
{ display: grid; grid-template-columns: repeat(6, 1fr); gap: 26px; padding: 0 20px; margin: 0; align-items: stretch; }

@media (max-width: 1680px) {.showCardGrid { grid-template-columns: repeat(5, 1fr); gap: 24px; }}
@media (max-width: 1480px) {.showCardGrid { grid-template-columns: repeat(4, 1fr); gap: 22px; }}
@media (max-width: 1280px) {.showCardGrid { grid-template-columns: repeat(3, 1fr); gap: 20px; }}
@media (max-width: 980px) {.showCardGrid { grid-template-columns: repeat(2, 1fr); gap: 18px; }}
@media (max-width: 640px) {.showCardGrid { grid-template-columns: 1fr; }}

.showCard
{ display: flex; flex-direction: column; text-decoration: none; color: inherit; border-radius: 1rem; overflow: hidden; }

.show-video-box 
{ width: 800px; max-width: 100%; border-radius: 1rem; overflow: hidden; cursor: pointer; position: relative; }
.show-video-box video 
{ width: 100%; display: block; transition: transform 0.3s; }
.show-video-box img 
{ width: 100%; display: block; transition: transform 0.3s; }
.show-video-box:hover video, .show-video-box:hover img 
{ transform: scale(1.03); }


/*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/** FOOTER ***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.footer
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px; background: #f8d1bd; background: radial-gradient(ellipse at top center, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.2) 70%), linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(248, 209, 189, 0.8)); position: relative; z-index: 1000; }
.footer-claim-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 30px 0px 30px 0px; }
.footer-claim-box
{ max-width: 1080px; height: auto; margin: 0px auto; padding: 40px 0px 30px 0px; background: #fbf1ec; position: relative; border-radius: 1rem; overflow: hidden; border: 1px solid #efe3dc; }
.footer-claim-txt
{ width: 80%; height: auto; margin: 0px auto; padding: 0px; position: relative; }
.footer-claim-txt h3
{ width: 100%; height: auto; margin: 0px; padding: 0px; font-family: "Playfair Display", serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: 1.75rem; color: #452c29; text-align: center; line-height: 150%; letter-spacing: 0.04em; }
.footer-claim-txt p
{ width: 100%; height: auto; margin: 0px; padding: 20px 0px 0px 0px; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1.875rem; color: #f66260; text-align: center; line-height: 150%; letter-spacing: 0.04em; }

.footer-claim-contact-panel
{ width: 100%; height: auto; float: left; margin: 30px 0px 0px 0px; padding: 30px 0px 0px 0px; border-top: 1px solid #efe3dc; }
.footer-claim-contact-box
{ width: 33.33333%; height: auto; float: left; margin: 0px; padding: 0px; }
.footer-claim-contact 
{ width: max-content; height: 48px; margin: 0px auto; display: flex; align-items: center; justify-content: center; gap: 12px; font-family: "Poppins", sans-serif; font-size: 1rem; font-weight: 400; font-style: normal; letter-spacing: 0.04em; text-decoration: none; color: #452c29; transition: color 0.3s ease; }
.footer-claim-contact-ico 
{ width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; }
.footer-claim-contact-ico img 
{ width: 100%; height: auto; display: block; }
.footer-claim-contact:hover 
{ color: #f66260; }
.footer-claim-btn a
{ width: max-content; height: 48px; margin: 0px auto 0px auto; padding: 0px 20px; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; font-size: 0.875rem; color: #ffffff; text-decoration: none; text-transform: uppercase; letter-spacing: 0.06em; background: #e84e4b; display: block; line-height: 48px; border-radius: 999px; position: relative; transition: all .4s ease; }
.footer-claim-btn a:hover
{ background: #f66260; color: #ffffff; }


.footer-panel
{ max-width: 1080px; height: auto; margin: 0px auto; padding: 0px; position: relative; }
.footer-logo-box
{ height: 34px; margin: 0px auto; padding: 0px; position: relative; }
.footer-logo
{ width: 100%; height: 34px; float: left; margin: 0px; padding: 0px; }

.footer-social-panel
{ width: 100%; height: auto; float: left; margin: 0px; padding: 20px 0px 20px 0px; }
.footer-social-grid
{ display: flex; align-items: center; justify-content: center; }
.footer-social-wrap
{ height: 44px; display: inline-flex; align-items: center; gap: 14px; }
.footer-social-btn
{ width: 40px; height: 40px; background: #452c29; display: grid; place-items: center; border-radius: 6px; transition: background .2s ease, transform .2s ease; }
.footer-social-btn:hover
{ background: #ee6852; }
.footer-social-btn img
{ width: 22px; height: 22px; display: block; }

.footer-boxes
{ width: 100%; height: auto; float: left; margin: 0px; padding: 40px 0px 0px 0px; border-top: 1px solid #efe3dc; }
.footer-box-grid 
{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }

.footer-box-odkaz
{ margin: 0px; padding: 0px; }
.footer-box-odkaz p
{ width: 100%; height: auto; float: left; margin: 0px; padding: 0px 0px 12px 0px; font-family: "Poppins", sans-serif; font-size: 0.875rem; font-weight: 500; font-style: normal; color: #452c29; letter-spacing: 0.04em; text-decoration: none; text-align: left; text-transform: uppercase; }
.footer-box-odkaz a
{ width: 100%; height: 34px; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-size: 0.8125rem; font-weight: 400; font-style: normal; color: #452c29; letter-spacing: 0.04em; text-decoration: none; text-align: left; text-transform: none; line-height: 34px; transition: color 0.3s ease; }

.footer-box-contact 
{ width: max-content; height: 34px; margin: 0px auto; display: flex; align-items: center; justify-content: flex-start; gap: 12px; font-family: "Poppins", sans-serif; font-size: 0.8125rem; font-weight: 300; font-style: normal; letter-spacing: 0.04em; text-decoration: none; color: #452c29; transition: color 0.3s ease; }
.footer-box-contact-ico 
{ width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; }
.footer-box-contact-ico img 
{ width: 100%; height: auto; display: block; }

.footer-box-odkaz a:hover, .footer-box-contact:hover 
{ color: #ee6852; }

.copyright
{ width: 100%; height: auto; float: left; margin: 30px 0px 0px 0px; padding: 20px 0px 20px 0px; border-top: 1px solid #efe3dc; }
.copyright-left p
{ width: 50%; height: 30px; float: left; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-size: 0.8725rem; font-weight: 400; font-style: normal; color: #452c29; letter-spacing: 0.04em; text-decoration: none; text-align: left; text-transform: none; line-height: 30px; }
.copyright-right p
{ width: 50%; height: 30px; float: right; margin: 0px; padding: 0px; font-family: "Poppins", sans-serif; font-size: 0.8725rem; font-weight: 400; font-style: normal; color: #452c29; letter-spacing: 0.04em; text-decoration: none; text-align: right; text-transform: none; line-height: 30px; }
.copyright-right a
{ color: #f66260; text-decoration: none; }
.copyright-right a:hover
{ color: #f66260; text-decoration: underline; }




/** PROMO **/
.pc-promo-box 
{ position: fixed; right: 16px; bottom: 16px; left: auto; transform: translateY(40px); width: calc(100% - 32px); max-width: 380px; background: rgba(255, 106, 71, 0.74); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, 0.4); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16); border-radius: 1.5rem; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16); padding: 24px 24px 22px; z-index: 9999; font-family: inherit; opacity: 0; pointer-events: none; transition: all 0.45s ease; }
.pc-promo-box.is-visible 
{ opacity: 1; pointer-events: auto; transform: translateY(0); }
.pc-promo-box.is-hidden 
{ opacity: 0; transform: translateY(140%); pointer-events: none; }
.pc-promo-close 
{ position: absolute; top: 10px; right: 14px; border: none; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; color: #f2f2f2; }
.pc-promo-close:hover 
{ color: #ffffff; }

.pc-promo-label {
  display: inline-block;
  margin-bottom: 8px;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b48a5a;
  font-weight: 600;
}
.pc-promo-content
{ text-align: center; }
.pc-promo-content h3 
{ margin: 8px 0px 8px 0px; font-family: "Poppins", sans-serif; font-size: 1.2rem; font-weight: 600; font-style: normal; line-height: 1.3; color: #52002D; }
.pc-promo-content p 
{ margin: 0 0 18px; font-family: "Poppins", sans-serif; font-size: 0.9rem; font-weight: 400; font-style: normal; line-height: 1.3; color: #52002D; }
.pc-promo-countdown 
{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 18px 0; }

.pc-promo-countdown div 
{ padding: 9px 6px; border-radius: 12px; background: rgba(234, 92, 59, 0.2); text-align: center; }

.pc-promo-countdown strong 
{ font-family: "Poppins", sans-serif; font-size: 1.25rem; font-weight: 600; font-style: normal; display: block; font-size: 20px; line-height: 1; color: #f6f6f6; }

.pc-promo-countdown span 
{ font-family: "Poppins", sans-serif; display: block; margin-top: 5px; font-size: 11px; color: #464646; }

.pc-promo-btn 
{ display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px 10px 16px; border-radius: 0.9375rem; background: #ae2100; font-family: "Poppins", sans-serif; font-style: normal; color: #ffffff; text-decoration: none; text-transform: uppercase; font-size: 0.875rem; font-weight: 500; transition: background 0.3s ease, transform 0.25s ease; }
.pc-promo-btn:hover 
{ background: #991f02; }

@media (max-width: 600px) {
  .pc-promo-box {
    left: 50%;
    right: auto;
    transform: translateX(-50%) translateY(40px);
    width: calc(100% - 24px);
    bottom: 12px;
  }

  .pc-promo-box.is-visible {
    transform: translateX(-50%) translateY(0);
  }

  .pc-promo-box.is-hidden {
    transform: translateX(-50%) translateY(140%);
  }
}

}