/* ==============================================================
   Self-hosted Montserrat v31 - exalab.cz
   Location: templates/ja_coach/fonts/montserrat/
   
   Files combine latin + latin-ext charsets (supports c,s,z,r,u etc.)
   font-display: swap - eliminates FOIT, shows system font immediately
   
   Place this block at the TOP of custom.css
   
   Expected PSI improvement:
   - Eliminate render-blocking: -410 to -2910ms
   - LCP: -0.5 to -1.5s
   ============================================================== */

/* 300 - Light */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-300.woff2') format('woff2');
}

/* 400 - Regular */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-regular.woff2') format('woff2');
}

/* 400 Italic */
@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-italic.woff2') format('woff2');
}

/* 500 - Medium */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-500.woff2') format('woff2');
}

/* 600 - SemiBold */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-600.woff2') format('woff2');
}

/* 700 - Bold */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/montserrat/montserrat-v31-latin_latin-ext-700.woff2') format('woff2');
}


/* ===== HEADINGS — single source of truth (part 1: generic via :root) =====
   Overrides compiled T4 fixed-px vars (--hN-font-size), which had no mobile
   scaling. clamp(MIN, PREF, MAX): MAX = current desktop px (preserved, reached
   below desktop widths -> desktop pixel-identical). Root font-size = 16px.
   !important mirrors the proven font-family override; does not block the
   per-class hero/section sizes below (those set font-size directly). */
:root {
  --body-font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  --t4-body-font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
 
  --h1-font-size: clamp(1.5rem, 1.05rem + 2.2vw, 2rem) !important;      /* ~25 -> 32px. Body H1 (pillars) + category/blog H1 headers */
  --h2-font-size: clamp(1.25rem, 0.95rem + 1.4vw, 1.75rem) !important;   /* ~20 -> 24px. Generic body H2 (section titles in pillars/articles) */
  --h3-font-size: clamp(1.15rem, 0.95rem + 0.9vw, 1.375rem) !important; /* DRIVES category/blog article-list titles (.page-header h2 reads --h3-font-size) — NOT unused, do not remove */
  --h4-font-size: clamp(1rem, 0.9rem + 0.6vw, 1.25rem) !important;      /* ~16.5 -> 20px */
  --heading-line-height: 1.25 !important;                              /* was 1.333. Delete to keep 1.333 */
}

/*main body hack*/


.t4-main-body {
  padding-top: 0;
  padding-bottom: 0;
}

/*
@media screen and (max-width: 780px) {}*/
.row {
  --t4-gutter-x: 10px;
  --t4-gutter-y: 0;
}

/*header and back to top hack*/
.t4-header .header-block {
  background-color: #000000;
  }
.top-away #back-to-top {
  z-index: 999;
}
  
@media screen and (min-height: 500px){
  .t4-header .header-block {
  position: fixed;
  z-index: 999 !important;
  }
  .top-away #back-to-top {
  display: none;
  }
}

@media (min-width: 1100px) /*and (max-width: 1300px)*/{
.col-lg-3 {width: 20%;}
.col-lg-3:lang(en) {width: 16%;}
.col-lg-6 {width: 60%;}
.col-lg-6:lang(en) {width: 64%;}
}


@media (min-width: 985px) and (max-width: 1099px){
.col-lg-3 {width: 17%;}
.col-lg-6 {width: 66%;}
}
 
/*H1 - H4 hack*/
h1, .h1, h1 {
    margin-top: 22px;
    margin-bottom: 14px;
    text-transform: uppercase;
    }

h2, .h2, .h2, h3, .h3, .h3 {
    margin-top: 54px;
    margin-bottom: 14px;
    text-transform: uppercase;
    font-weight: 600 !important;
    }

body h4, body .h4, body .h4 {
  margin-top: 20px;
  margin-bottom: 14px;
  font-weight: 600;
}    

/*links hack*/
a {
  font-weight: 500;
}

/*strong font hack*/
b, strong {
  font-weight: 600;
}


/*offcanvas - mobile menu header hack*/

.t4-offcanvas .t4-off-canvas-header {display: none;}
.t4-offcanvas .t4-off-canvas-body {padding: 15px 0;}
.t4-offcanvas .t4-off-canvas-body {height: 100%;} 

/*top menu hack*/
.t4-megamenu .dropdown-menu {
  background: #052242;
  border: none;
 }
 
@media screen and (max-width: 780px) {
    .navbar-brand {padding-top: 8px;}
    .mod-languages {margin-top: 8px;}
    .t4-offcanvas-toggle {margin-top: 9px;} 
}

 
/*.item-caret, .item-caret:hover, .item-caret:active {color: #E86400 !important;}*/
.t4-megamenu .navbar-nav > li > .nav-link .item-caret.item-caret {
  border-top-color: #E86400 !important;
}
.t4-megamenu .navbar-nav > li.show > .nav-link .item-caret.item-caret {
  border-top-color: #E86400;
}

@media screen and (min-width: 990px) and (max-width: 1230px){
  .topMenuHome {display: none;}
} 
@media screen and (min-width: 990px) and (max-width: 1300px){
  .topMenuHome:lang(en) {display: none;}
}

 
/* -- topmenu active hack */

@media screen and (min-width: 992px){
.navbar-nav > li > a:hover, .navbar-nav > li > a:active, .navbar-nav > li:hover a {
  background: #052242;
}
}  

.t4-megamenu .dropdown-menu {
  border-radius: 0 !important;
 }
/*burger menu hack*/
.t4-offcanvas-toggle {
  background: #052242;
}

/*category hack*/
.category-desc {
   margin-top: 0;
   padding: 0;
   border: none;
}

/*logo position hack*/
/*.navbar-brand {margin: -64px 0 0 0;} */

/*main body hack*/
 
.container, .t4-masthead .t4-masthead-detail, .container-sm, .container-md, .container-lg, .container-xl {
  max-width: 1250px;
  }

/*Articles Hack*/

#MediaPageHeader, #MediaPageHeaderEmbeded {
  background-color: #f3f3f3;
  width: 100%;
  display: flex;
  position: sticky;
  z-index: 100;
  margin-top: -30px;
  margin-bottom: -22px;
}
/*
#MediaPageHeader:before {
  content: "";
  background-color: #f3f3f3;
  position: absolute;
  height: 100%;
  width: 4000px;
  left: -2000px;
  z-index: -1;
} */

#MediaPageHeader h1, #MediaPageHeaderEmbeded h1 .MediaPageBody h1 {text-transform: uppercase; font-weight: bold !important;}
.MediaPageHeaderText, .WhatIsDrPageHeaderText {width: 800px; margin: 3px 0 0 0;}

.MediaPageHeaderIcoHDD, .MediaPageHeaderIco2HDD { background-image: url("/images/svg/zachrana/hdd.svg"); }
.MediaPageHeaderIcoRAID, .MediaPageHeaderIco2RAID { background-image: url("/images/svg/zachrana/raid.svg"); }
.MediaPageHeaderIcoSSD, .MediaPageHeaderIco2SSD { background-image: url("/images/svg/zachrana/ssd.svg"); }
.MediaPageHeaderIcoApple, .MediaPageHeaderIco2Apple { background-image: url("/images/svg/zachrana/apple.svg"); }
.MediaPageHeaderIcoNAS, .MediaPageHeaderIco2NAS { background-image: url("/images/svg/zachrana/nas.svg"); }
.MediaPageHeaderIcoUSB, .MediaPageHeaderIco2USB { background-image: url("/images/svg/zachrana/usb.svg"); }
.MediaPageHeaderIcoSDc, .MediaPageHeaderIco2SDc { background-image: url("/images/svg/zachrana/sd.svg"); }
.MediaPageHeaderIcoMT, .MediaPageHeaderIco2MT { background-image: url("/images/svg/zachrana/mobil.svg"); }

/*icon on the right side from the text*/

.MediaPageHeaderIcoHDD, .MediaPageHeaderIcoRAID, .MediaPageHeaderIcoSSD, .MediaPageHeaderIcoApple, .MediaPageHeaderIcoNAS, .MediaPageHeaderIcoUSB, .MediaPageHeaderIcoSDc, .MediaPageHeaderIcoMT {
background-repeat: no-repeat;
width: 300px;
height: auto;
background-size: 150px 150px;
background-position: bottom;
margin-bottom: -25px;}

@media screen and (max-width: 900px) {
  .MediaPageHeaderIcoHDD, .MediaPageHeaderIcoRAID, .MediaPageHeaderIcoSSD, .MediaPageHeaderIcoApple, .MediaPageHeaderIcoNAS, .MediaPageHeaderIcoUSB, .MediaPageHeaderIcoSDc, .MediaPageHeaderIcoMT {
  background-size: 100px 100px; margin-bottom: -25px;}
}
@media screen and (max-width: 589px) {
  .MediaPageHeaderIcoHDD, .MediaPageHeaderIcoRAID, .MediaPageHeaderIcoSSD, .MediaPageHeaderIcoApple, .MediaPageHeaderIcoNAS, .MediaPageHeaderIcoUSB, .MediaPageHeaderIcoSDc, .MediaPageHeaderIcoMT {
  display: none;}
}

/*icon under text in smaller displays*/

.MediaPageHeaderIco2HDD, .MediaPageHeaderIco2RAID, .MediaPageHeaderIco2SSD, .MediaPageHeaderIco2Apple, .MediaPageHeaderIco2NAS, .MediaPageHeaderIco2USB, .MediaPageHeaderIco2SDc, .MediaPageHeaderIco2MT {
  background-repeat: no-repeat;
  height: 75px;
  background-size: 75px 75px;
  background-position: bottom;
  margin-bottom: -24px;
}

@media screen and (min-width: 590px) {
  .MediaPageHeaderIco2HDD, .MediaPageHeaderIco2RAID, .MediaPageHeaderIco2SSD, .MediaPageHeaderIco2Apple, .MediaPageHeaderIco2NAS, .MediaPageHeaderIco2USB, .MediaPageHeaderIco2SDc, .MediaPageHeaderIco2MT {
  display: none;}
}



.ArticleStructureMenu {}
/*.ArtStrMenuHunder {margin-bottom: -34px;}*/
.ArticleStructureMenu li {}
.ArticleStructureMenu ul, ul {margin-left: -14px;}
.ArticleStructureMenu ul li::marker, ul li::marker {color: var(--brand-orange) !important;}
.ArticleStructureMenu a {color: var(--brand-orange); font-weight: 600;}
.ArticleStructureMenu a:hover {color: var(--body-link-hover-color); font-weight: 600;}

.MediaPageBody ul li::marker {color: var(--brand-orange);}
.MediaPageBody ul {}

/* top margin when Article menu is without Hx*/
.makeTopSpace {margin-top: 57px;}
.MarginUpFirstP {margin-top: 53px;}


/*grey headers*/
.page-header, .article-aside, .homeTopMain, #howItWorks, #PartnersProgramPageHeader, #WhatIsDrPageHeader, #FirstAidPageHeader, #FAQPageHeader, #PricingPageHeader, #BlogPageHeader,
#ContactPageHeader, #AboutUsPageHeader, #ReferencePageHeader, #TermsAndConditionsPageHeader, #GeneralArticlePageHeader, #CategoryMenuPageHeader, #MediaCategoryHeader, #GlosarPageHeader { 
  background-color: #f3f3f3;
  width: 100%;
  max-width: 1300px;
  display: flex;
  position: sticky;
  z-index: 100;
  margin: -30px auto -22px auto;
  }
  
.page-header, #BlogPageHeader, #ReferencePageHeader, #CategoryMenuPageHeader, #MediaCategoryHeader, #GlosarPageHeader, .FAQPageHeaderCategory {margin: 0 auto !important;}

.FAQPageBodyCategory {margin-top: 22px;}

.article-aside {
  margin: 0 auto !important;
  /**padding-bottom: 20px;**/
  display: block;
}

/*Hompage, contact form etc - extended width from min 1200px */

@media screen and (min-width: 360px) {
.page-header:before, .article-aside:before, .homeTopMain:before, #howItWorks:before, .ContacFormTitle:before, #MediaPageHeader:before, #PartnersProgramPageHeader:before, #WhatIsDrPageHeader:before, 
#FirstAidPageHeader:before, #FAQPageHeader:before, #PricingPageHeader:before, #BlogPageHeader:before, #ContactPageHeader:before, #AboutUsPageHeader:before, #ReferencePageHeader:before, #TermsAndConditionsPageHeader:before,
#GeneralArticlePageHeader:before, #CategoryMenuPageHeader:before, #MediaCategoryHeader:before, #MediaPageHeaderEmbeded:before,#GlosarPageHeader:before {
    content:"";
    background-color: #f3f3f3;
    position: absolute;
    height: 100%;
    width: 100vw;
    left: calc(((-100vw + 100%) / 2) + -0px);
    overflow: hidden;
    z-index: -100;
    }
}
@media (max-width: 1199px) {
/*.homeTopMain:before, #howItWorks:before, .ContacFormTitle:before, #MediaPageHeader:before {
   content: "";
    background-color: #f3f3f3;
    position: absolute;
    height: 100%;
    width: 108%;
    z-index: -1;
    left: -16px;}*/
.homeTopMain:after, #howItWorks:after, .ContacFormTitle:after, #MediaPageHeader:after, #MediaPageHeaderEmbeded:after {}
}

@media (max-width: 480px) {
#howItWorks {display: block;}
}

/*pagebody hack*/

.TermsAndConditionsPageBody, .GeneralArticlePageBody {margin-top: 52px;}

/*pagebody EN lang hack*/
.MediaPageBody:lang(en), .FirstAidPageBody:lang(en), .PricingPageBody:lang(en) {margin-top: 52px;}
.MediaPageBody:lang(en) h3 {margin-top: 29px;font-size: 18px;}


.homeTopMain {}
.homeTopMainCont {padding: 66px 0; margin: 0 auto;}
@media only screen and (max-width: 1200px) {
  .homeTopMainCont {padding: 25px 0 60px 0;}
}

@media only screen and (max-width: 768px) {
  .homeTopMainCont {padding: 25px 0 55px 0;}
}

@media only screen and (max-width: 550px) {
  .homeTopMainCont {padding: 25px 0 48px 0;}
}

@media (max-width: 480px) {
.homeTopMainCont {padding-top: 14px; padding-bottom: 30px;}
}
.homeTopLeft {
  width: 580px;
  float: left;
  padding-left: 10px;
  }
@media only screen and (max-width: 1100px) {
  .homeTopLeft {width: 510px;}
  }
@media only screen and (max-width: 590px) {
  .homeTopLeft {width: unset;}
}

/* ===== HEADINGS (part 2: homepage hero — own size, NOT generic) =====
   Fluid 28px (mobile) -> 58px (>=1100px desktop parity).
   Replaces former 58 / 50(<=1100) / 45(<=550) px steps. */
.homeTopLeftH1 h1 {text-transform: uppercase; font-size: clamp(1.75rem, 0.8375rem + 4.05vw, 3.625rem); font-weight: normal; line-height: 1.2;}

@media (max-width: 815px) {
.homeTopLeftH1 h1 {text-align: center;}
}

.homeTopLeft2ndRow {margin-top: 43px; width: 415x;}
@media only screen and (max-width: 1150px) {
  .homeTopLeft2ndRow {max-width: 495px;}
}

.homeTopRight {width: 50%; float:right;}

.homeTopRight img {
  width: 80%;
  margin: 0 0 0 20%;
  display: block;
  }

@media only screen and (max-width: 1200px) {
   .homeTopRight {
    width: 400px;
    float: right;
    }
    .homeTopRight img {
    width: 90%;
    margin-top: 40px;
    display: block;
    }
}
@media only screen and (max-width: 1100px) {
  .homeTopRight img {width: 80%;}
}

@media only screen and (max-width: 950px) {
   .homeTopRight {
      width: 200px;
      margin-left: 65px;  
    }
   .homeTopRight img {
      width: 100%;
      margin-top: 100px;
      margin-left: unset;
      }
}

@media only screen and (max-width: 815px) {
   .homeTopRight {
    width: 150px;
    float: none;
    margin: auto;
    }
    .homeTopRight img {
 
    margin-top: 0;
    padding-top: 48px;
    }
}
@media only screen and (max-width: 550px) {
  .homeTopRight img {display: none;}
} 

/*@media (max-width: 760px) {
.homeTopLeft {}
.homeTopRight {right: 20px;}
.homeTopRight img {width: 120px;}
.homeTopMainCont {}
}
@media (min-width: 611px) and (max-width: 710px) {
.homeTopRight {right: 5px;}
.homeTopRight img {width: 120px; right: 0; position: absolute;}
}
@media (max-width: 610px) {
.homeTopRight {display: none;}
.homeTopLeft {width: 96%;}
}

@media (max-width: 480px) {
.homeTopRight {display: none;}
.homeTopLeft {width: 96%;}
}

/*@media (max-width: 900px) {
.homeTopLeft {width: 440px;}
.homeTopRight {width: 260px;}
.homeTopRight img {width: 210px;}

} */


/* ===== HEADINGS (part 3: homepage section H2 — own size, NOT generic) =====
   These are intentionally larger than body H2 (a distinct display role).
   Fluid 22px (mobile) -> 40px (>=~900px desktop parity). One rule = all five
   groups; previously only .homeDRMediaTitleText had a 36/34 step-down. */
.homeDRMediaTitleText h2, .howItWorksTitle h2, .homeReferenceText h2, .fromOurBlogText h2, .contactText h2 {
  text-transform: uppercase;
  font-size: clamp(1.375rem, 0.625rem + 3.33vw, 1.75rem);
}

.homeDRMedia {display: inline-block; width: 100%; margin-top: 0; margin-bottom: 32px;}
.homeDRMediaTitle {margin-bottom: 32px;}
.homeDRMediaTitleText {text-align: center;}
.homeDRMediaIcons {
  margin: 0 auto;
  width: 1300px;
  }


.homeDRMediaIcons a {display: inline; float: none;}
.homeDRMediaIcons span {
  /*position: absolute;
  bottom: 0;*/
  font-weight: bold;
  font-size: var(--h2-font-size);   /* was 26px; now tracks body H2 (24px desktop -> ~20px mobile): scales on mobile and stays below the "ZÁCHRANA DAT Z" section title */
  color: #092445;
  }

.whichDataHDD {}
.whichDataHDDicon {background-image: url("/images/svg/zachrana/hdd.svg"); background-repeat: no-repeat;}
.whichDataHDDtext {}
.whichDataSSD {}
.whichDataSSDicon {background-image: url("/images/svg/zachrana/ssd.svg"); background-repeat: no-repeat;}
.whichDataSSDtext {}
.whichDataApple {}
.whichDataAppleicon {background-image: url("/images/svg/zachrana/apple.svg"); background-repeat: no-repeat;}
.whichDataAppletext {}
.whichDataRAID {}
.whichDataRAIDicon {background-image: url("/images/svg/zachrana/raid.svg"); background-repeat: no-repeat;}
.whichDataRAIDtext {}
.whichDataNAS {}
.whichDataNASicon {background-image: url("/images/svg/zachrana/nas.svg"); background-repeat: no-repeat;}
.whichDataNAStext {}
.whichDataSD {}
.whichDataSDicon {background-image: url("/images/svg/zachrana/sd.svg"); background-repeat: no-repeat;}
.whichDataSDtext {}
.whichDataMT {margin-right: 5px;}
.whichDataMTicon {background-image: url("/images/svg/zachrana/mobil.svg"); background-repeat: no-repeat;}
.whichDataMTtext {}
.whichDataUSB {}
.whichDataUSBicon {background-image: url("/images/svg/zachrana/usb.svg"); background-repeat: no-repeat;}
.whichDataUSBtext {}

.whichDataHDDicon, .whichDataSSDicon, .whichDataAppleicon, .whichDataRAIDicon, .whichDataNASicon, .whichDataSDicon, .whichDataMTicon, .whichDataUSBicon {
  width: 145px;
  height: 145px;
}
.whichDataHDD:hover span, .whichDataSSD:hover span, .whichDataApple:hover span, .whichDataRAID:hover span, .whichDataNAS:hover span, .whichDataSD:hover span, .whichDataMT:hover span, .whichDataUSB:hover span {
    color: var(--body-link-hover-color);
    }

.whichDataHDDtext, .whichDataSSDtext, .whichDataAppletext, .whichDataRAIDtext, .whichDataNAStext, .whichDataSDtext, .whichDataMTtext, .whichDataUSBtext {
/*width: 130px;
position: absolute;*/
margin: 12px auto;
text-align: center;
}

.whichDataHDD, .whichDataSSD, .whichDataApple, .whichDataRAID, .whichDataNAS, .whichDataSD, .whichDataMT, .whichDataUSB {
  float: left;
  /*position: relative;*/
  margin: 12px 74px;
}

/*@media (max-width: 700px) {
    .whichDataHDD, .whichDataSSD, .whichDataApple, .whichDataRAID, .whichDataNAS, .whichDataSD, .whichDataMT, .whichDataUSB {
  margin: 5px 30px;
}
}*/

@media screen and (max-width: 1180px) {
  .homeDRMediaTitle {margin: 0 auto 30px auto; max-width: 880px;}
  .homeDRMediaIcons {width: 100%; max-width: 880px;}
  .whichDataHDD, .whichDataSSD, .whichDataApple, .whichDataRAID, .whichDataNAS, .whichDataSD, .whichDataMT, .whichDataUSB {
  margin: 10px 40px;}
  .whichDataHDDicon, .whichDataSSDicon, .whichDataAppleicon, .whichDataRAIDicon, .whichDataNASicon, .whichDataSDicon, .whichDataMTicon, .whichDataUSBicon {
  width: 130px;
  height: 130px;}
  
}

@media screen and (max-width: 950px) {
  .homeDRMediaTitle {margin: 0 auto 30px auto; max-width: 660px;}
  .homeDRMediaIcons {width: 100%; max-width: 660px;}
  .whichDataHDD, .whichDataSSD, .whichDataApple, .whichDataRAID, .whichDataNAS, .whichDataSD, .whichDataMT, .whichDataUSB {
  margin: 5px 25px;}
  .whichDataHDDicon, .whichDataSSDicon, .whichDataAppleicon, .whichDataRAIDicon, .whichDataNASicon, .whichDataSDicon, .whichDataMTicon, .whichDataUSBicon {
  width: 110px;
  height: 110px;}
  
}

@media (max-width: 690px) {
.homeDRMediaIcons {max-width: 480px;}
}

@media (max-width: 520px) {
.whichDataHDD, .whichDataSSD, .whichDataApple, .whichDataRAID, .whichDataNAS, .whichDataSD, .whichDataMT, .whichDataUSB {
  margin: 5px 18px;}
}
@media (max-width: 480px) {
/*.whichDataHDDicon, .whichDataSSDicon, .whichDataAppleicon, .whichDataRAIDicon, .whichDataNASicon, .whichDataSDicon, .whichDataMTicon, .whichDataUSBicon {
  width: 73px;
  height: 73px;}*/
.homeDRMediaIcons {max-width: 300px;}
}

@media (max-width: 380px) {
/*.whichDataHDDicon, .whichDataSSDicon, .whichDataAppleicon, .whichDataRAIDicon, .whichDataNASicon, .whichDataSDicon, .whichDataMTicon, .whichDataUSBicon {
  width: 68px;
  height: 68px;}*/
}




.homeDRMediaLearnMore {margin-bottom: 66px;}

#howItWorks {}
.howItWorksCont {padding-top: 23px; padding-bottom: 150px; margin: 0 auto;}
.howItWorksTitle {text-align: center; margin-bottom: 38px; margin-top: -24px;}
.howItWorksIcons {display: flex; margin: 0 auto;}
.howItWorksIcons1stR {display: flex; margin: 0 auto;}
.howItWorksIcons2ndR {display: flex; margin: 0 auto;}
.howItWorksIconsContact {}
.howItWorksIconsContactIcon {background-image: url("/images/svg/proces/kontakt.svg"); background-repeat: no-repeat;}
.howItWorksIconsContactText {}
.howItWorksIconsDelivery {}
.howItWorksIconsDeliveryIcon {background-image: url("/images/svg/proces/doprava.svg"); background-repeat: no-repeat;}
.howItWorksIconsDeliveryText {}
.howItWorksIconsDiag {}
.howItWorksIconsDiagIcon {background-image: url("/images/svg/proces/diagnostika.svg"); background-repeat: no-repeat;}
.howItWorksIconsDiagText {}
.howItWorksIconsRecovery {}
.howItWorksIconsRecoveryIcon {background-image: url("/images/svg/proces/obnova.svg"); background-repeat: no-repeat;}
.howItWorksIconsRecoveryText {}
.howItWorksIconsPickup {}
.howItWorksIconsPickupIcon {background-image: url("/images/svg/proces/vyzvednuti.svg"); background-repeat: no-repeat;}
.howItWorksIconsPickupText {}

.howItWorksIconsSpace {margin: auto 0; padding: 0 27px 50px 27px;}
.howItWorksIconsSpace:before {content: "- - - -";}
.howItWorksIconsSpaceHide {}

.howItWorksIconsContact, .howItWorksIconsDelivery, .howItWorksIconsDiag, .howItWorksIconsRecovery, .howItWorksIconsPickup {
  /*width: 18%;
  float: left;*/}
.howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {  
  width: 145px;
  height: 145px;
}
@media screen and (max-width: 1180px) {
  .howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {  
  width: 110px;
  height: 110px;
  }
}
@media screen and (max-width: 990px) {
 .howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {  
  width: 95px;
  height: 95px;
  }
}

.howItWorksIconsContactText, .howItWorksIconsDeliveryText, .howItWorksIconsDiagText, .howItWorksIconsRecoveryText, .howItWorksIconsPickupText {
  text-align: center;
  font-size: 26px;
  color: #092445;
  font-weight: bold;
  margin-top: 10px;
  }

@media screen and (max-width: 1140px) {
  .howItWorksIconsContactText, .howItWorksIconsDeliveryText, .howItWorksIconsDiagText, .howItWorksIconsRecoveryText, .howItWorksIconsPickupText {
  font-size: 20px;
  }
}

.howItWorksIconsContact:hover span, .howItWorksIconsDelivery:hover span, .howItWorksIconsDiag:hover span, .howItWorksIconsRecovery:hover span, .howItWorksIconsPickup:hover span {
    color: var(--body-link-hover-color);
    }


/*    color: var(--body-link-hover-color);*/
    

@media (max-width: 980px) {
.howItWorksIconsSpace::before {content: "- - -";}
.howItWorksIconsSpace {padding: 0 18px 29px 18px;}
}

@media (max-width: 850px) {
.howItWorksIconsSpace::before {content: "- -";}
.howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {
  width: 85px;
  height: 85px;
  margin: auto;
  }

}
@media (max-width: 790px) {
.howItWorksIconsSpace::before {content: "-";}
.howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {
  width: 70px;
  height: 70px;}
}
@media (max-width: 620px) {
.howItWorksIconsContactIcon, .howItWorksIconsDeliveryIcon, .howItWorksIconsDiagIcon, .howItWorksIconsRecoveryIcon, .howItWorksIconsPickupIcon {
  width: 60px;
  height: 60px;
}
.howItWorksIconsSpace {padding: 0 9px 29px 9px;}

}
@media (max-width: 750px) {
.howItWorksIcons {display: grid;}
.howItWorksIconsSpaceHide {display: none;}
}

  

.homeHelp {display: flex; text-align: left; width: 1300px; margin: auto;}
.homeHelp h2 {text-transform: uppercase; margin-bottom: 18px; font-weight: bold;}
.homeHelpFirstAid {}
.homeHelpFirstAidText {height: 370px;}
.homeHelpFirstAidTextP1 {margin-bottom: 16px;}
.homeHelpWhatIs {right: 60px;}
.homeHelpFirstAid, .homeHelpWhatIs {
    border: 1px solid #E9E9E9;
    border-radius: 0 22px 0 22px;
    box-shadow: 5px 8px 9px #E9E9E9;
    margin: -77px auto 0 auto;
    position: relative;
    background-color: white;
    padding: 5px 25px 66px 25px;
    z-index: 100;
    width: 512px;

}

@media (max-width: 1260px) {
  .homeHelp {width: 1100px;}
  .homeHelpFirstAid, .homeHelpWhatIs {width: 460px;}
  .homeHelpFirstAidText:lang(en) {height: 460px;}
  
}

@media (max-width: 1050px) {
.homeHelp {display: inherit; width: 100%;}
.homeHelpFirstAid, .homeHelpWhatIs {width: 512px;}
.homeHelpFirstAid {position: sticky; margin: -100px auto 0 auto;}
.homeHelpWhatIs {position: inherit; margin: 0 auto 0 auto;}
.homeHelpFirstAid {margin: -100px auto 42px auto;}
.homeHelpFirstAidText {height: unset !important; margin-bottom: 54px;}
}

@media (max-width: 560px) {
.homeHelpFirstAid, .homeHelpWhatIs {
  padding: 5px 10px 66px 14px;
  width: 420px;}
}

@media (max-width: 480px) {
.homeHelpFirstAid, .homeHelpWhatIs {width: 328px;}
/*.homeHelpFirstAidText {height: 299px;}*/
/*.homeHelpWhatIsText {height: 170px !important;}*/
}



.homeReference {margin-top: 60px;}
.homeReferenceText {text-align: center;}
.homeReferenceCarousel {margin-top: 0;}
.homeReferenceIcons {width: auto; max-width: 1009px; display: flex;   margin: 44px auto 0 auto;}
.homeReferenceIco1 {}
.homeReferenceIco1img {background-image: url("/images/svg/reference/zalozeno.svg"); background-repeat: no-repeat;}
.homeReferenceIco1txt {}
.homeReferenceIco1txtBold {}
.homeReferenceIco2 {}
.homeReferenceIco2img {background-image: url("/images/svg/reference/spokojenost.svg"); background-repeat: no-repeat;}
.homeReferenceIco2txt {}
.homeReferenceIco2txtBold {}
.homeReferenceIco3 {}
.homeReferenceIco3img {background-image: url("/images/svg/reference/hodiny.svg"); background-repeat: no-repeat;}
.homeReferenceIco3txt {}
.homeReferenceIco3txtBold {}

.homeReferenceIco1, .homeReferenceIco2, .homeReferenceIco3 {width: 33%;}
.homeReferenceIco1img, .homeReferenceIco2img, .homeReferenceIco3img {
  width: 85px;
  height: 85px;
  margin: 0 auto 13px auto;
}
.homeReferenceIco1txt, .homeReferenceIco2txt, .homeReferenceIco3txt {text-align: center; text-transform: uppercase;}
.homeReferenceIco1txt span, .homeReferenceIco2txt span, .homeReferenceIco3txt span {display: block;}

.homeReferenceIco1txtBold, .homeReferenceIco2txtBold, .homeReferenceIco3txtBold {font-weight: bold; font-size: 28px;}

/*reference carousel / slider hack*/
.refSldMain > div > div > div > div > div > div > div > div > div > div > div > div {
    border: 1px solid #E9E9E9;
    /*border-radius: 0 22px 0 22px;*/
    box-shadow: 5px 8px 9px #E9E9E9;
    
    }
.refSldRow  {}
.refSldTxt {}
.refSldTxtBox {}
.refSldHuman {}
.refSldName {margin-top: -23px !important;}

@media (max-width: 1100px) {
.homeReferenceIcons {width: 100%;}

}

@media (max-width: 900px) {
.homeReferenceCarousel {margin-top: 0;}
.homeReferenceIco1img, .homeReferenceIco2img, .homeReferenceIco3img {
    width: 70px;
  height: 70px;
  margin: 0 auto 18px auto;}
}

@media (max-width: 750px) {
.homeReferenceIco1txt, .homeReferenceIco2txt, .homeReferenceIco3txt {text-transform: unset;}
.homeReferenceIco1, .homeReferenceIco2 {width: 50%; float: left;}
.homeReferenceIco3 {width: 100%; margin: 48px auto 0 auto; width: 100%; float: right;}
.homeReferenceIcons {display: block;}
  }

@media (max-width: 480px) {
 .homeReferenceIco1img, .homeReferenceIco2img, .homeReferenceIco3img {
  width: 50px;
  height: 50px;}
  .homeReferenceIco1, .homeReferenceIco2 {}
  .homeReferenceIco3 {margin: -8px auto 0 auto;}
  .homeReferenceIco1txt1, .homeReferenceIco1txt2, .homeReferenceIco1txt3 {display: none !important;}
  .homeReferenceIco1, .homeReferenceIco2, .homeReferenceIco3 {margin-bottom: 29px;}  
}

.fromOurBlog {text-align: center; margin-top: 44px;}
.fromOurBlogText {}
.fromOurBlogCarousel {margin-top: 25px;}

.contact {background-color: #f3f3f3; text-align: center; width: 100%; min-width: 1000px; display: inline-block; margin: 22px 0 0 0; }
.contactText {margin-bottom: 30px;}
.contactBlocks {width: 100%}
.contactBlocksCont {width: 100%}
.contactBlocksCont div p {text-align: left;}
.contact1 {float:left; width:220px; margin-left: 5%;}
.contact3 {float:right; width:220px; margin-right: 2%;}
.contact2 {margin:0 auto; width:240px; padding-left: 24px;}

@media (min-width: 1001px) {
.contact-mt {display: none;}
}
@media (max-width: 1000px) {
.contact {display: none;}
.contact-mt {background-color: #f3f3f3; text-align: center; width: 600px; margin: 0 auto -15px auto;
padding-top: 15px;}
.contactText-mt {}
.contactText-mt h2 {text-transform: uppercase; font-weight: bold;}
.contactBlocks-mt {width: 100%}
.contactBlocksCont-mt {width: 100%}
.contactBlocksCont-mt {}
.contactBlocks1stR-mt {}
.contactBlocks1stR-mt div {}
.contact1-mt {float: left; width: 50%;   margin-top: 16px;}
.contact2-mt {float: right; width: 50%;}
.contactBlocks2ndR-mt {width: 100%; display: flow-root;}
.contact3-mt {margin-top: 5px;}
.contactBlocksCont-mt div p {text-align: left;}
}
@media (max-width: 600px) {
.contact-mt {width: 460px;}
.contact1-mt {margin-left: -20px;}
.contact2-mt {margin-right: -20px;}
}

@media (max-width: 480px) {
  .contact-mt {width: auto;}
  .contact1-mt {float: unset; width: 100%; margin-left: 0;}
  .contact2-mt {float: unset; width: 100%;}
}


/*buttons / tlacika*/

.ButMarginDown {margin-bottom: 44px;}
.ButMarginUp {}
.ButMarginUpDown {margin-top: 30px; margin-bottom: 44px;}

.orderDiag {float:left;}
#orderDiagInArt {}
#orderDiagInArt .diagButtonOrange, .DRbuttonAllMedia {margin: 25px auto;}
.nonstopHotline, .nonstopHotlineDR {float:right;}
.learnMoreOrange {}
.learnMoreWhite {}
.OrderDiagBig {margin: 25px auto;}

@media (max-width: 550px) {
.orderDiag {float: unset; margin: auto; width: max-content;}
.nonstopHotline, .nonstopHotlineDR {float: unset; width: 186px; margin: 8px auto 0 auto;}
.nonstopHotline img, .nonstopHotlineDR img {margin-left: -5px;}
.homeTopLeft2ndRow {margin-top: 36px;}
}
            
/*module order diag / learn more orange*/
.diagButtonOrange, .learnMoreButtonOrange, .learnMoreButtonWhite, .OrderDiagBig, .DRbuttonAllMedia {
  padding: 5px 10px;
  border-radius: 32px;
  font-size: 17px;
  text-align: center;
}

.diagButtonOrange, .learnMoreButtonOrange, .learnMoreButtonWhite {
  width: fit-content;
  height: 44px;
  }
  
.OrderDiagBig {
  width: 289px;
  height: 44px;
  }
/*Oderr Diag Big End of article*/
.OrderDiagBigEndOfArt {margin: 56px 0 -18px 0;} 


.DRbuttonAllMedia {width: 418px; height: 44px;}

@media (max-width: 480px) {
.DRbuttonAllMedia {width: 325px; height: 76px;}
}

/*DR budtton all media in the end of an article*/
.DRbuttonAllMediaEndOfArt {margin: 56px 0 30px 0;}
  

.diagButtonOrange, .learnMoreButtonOrange, .OrderDiagBig, .DRbuttonAllMedia {
  background-color: var(--brand-orange);
  color: #ffffff !important;
  border: 2px solid var(--brand-orange);
}

.diagButtonOrange:hover, .learnMoreButtonOrange:hover, .OrderDiagBig:hover, .DRbuttonAllMedia:hover  {
  background-color: #ffffff;
  color: var(--brand-orange) !important;
  border: 2px solid var(--brand-orange);
}

.learnMoreButtonWhite {
  background-color: #ffffff;
  color: var(--brand-orange) !important;
  border: 2px solid var(--brand-orange);
  margin: 0 auto;
}

.learnMoreButtonWhite:hover {
  color: #ffffff !important;
  background-color: var(--brand-orange);
  border: 2px solid var(--brand-orange);
  margin: 0 auto;
}


.diagButtonOrange:lang(cs) {}
/*.diagButtonOrange:lang(en) {}*/

.learnMoreButtonOrange {margin: 0 auto;}

.diagButtonOrange span, .learnMoreButtonOrange span, .learnMoreButtonWhite span {
  font-weight: 600;
  }

.diagButtonOrange span, .learnMoreButtonOrange span, .OrderDiagBig span, .DRbuttonAllMedia span {
  color: #ffffff !important;
  font-weight: 600;
}
.diagButtonOrange:hover span, .learnMoreButtonOrange:hover span, .OrderDiagBig:hover span, .DRbuttonAllMedia:hover span {
  color: var(--brand-orange) !important;
  }
  
/*Tlacitka upgrade 2025-09*/

.ctaTop3butModule {padding-top: 1px !important;}

@media (max-width:589px){
.ctaTop3butModule {padding: 32px 0 0 0 !important;}
}


/* ===== Exalab CTA - sjednocene chovani, fix kolizi s headerem ===== */
:root{
	--brand-orange:#ED8012; /* Canonical brand orange - single source of truth; re-tune / rollback = edit this one line. #ED8012 = harmonized with HDD illustration gradient (hue 30deg, L 50%, inside 27-37deg range, dE 8.6 to gradient center, contrast 2.73:1). History: #EE6A1E (logo re-tune) -> #EE861E -> #ED8012 (deeper). Former literals folded in: #F16521 (2025-09 CTA system) + #f7941d (legacy buttons/TOC/markers/form/hotline). */
  --cta-orange:var(--brand-orange);        /* oranzova Exalab */
  --cta-orange-dk:#D45414;     /* tmavsi oranzova (nepouzita, ale nechavam pro pripad) */
  --cta-ink:#0F1A24;           /* tmava */
  --cta-ghost-bg:#F9FBFE;      /* neaktivni svetlejsi pozadi pro Cenik */
  --cta-ghost-bg-h:#F2F7FD;    /* hover/focus pro Cenik */
  --cta-ghost-br:#B9C8D5;      /* zvyrazneny ramecek Cenik */

  /* Hover barvy textu */
  --cta-hover-on-orange:#0F1A24;  /* tmavy text na oranzove */
  --cta-hover-on-dark:var(--brand-orange);    /* oranzovy text na tmavem */
  --cta-hover-on-ghost:var(--brand-orange);   /* oranzovy text na ghost */

  --cta-radius:12px;
  --cta-fw:700;
}

/* Kontejner - bezpecne mezery vuci header grafice */
.ctaTopBar{
  display:flex; flex-wrap:wrap; gap:.75rem .75rem; align-items:center;
  justify-content:center;                  /* mobily: stred */
  margin: clamp(16px, 3vw, 36px) 0 clamp(18px, 3vw, 32px);
  padding-top: clamp(4px, 1.2vw, 12px);
  position: relative; z-index: 1; clear: both;
}
@media (min-width:590px){
  .ctaTopBar{ justify-content:flex-start; } /* od 590 px vlevo */
}

/* Zaklad tlacitek (vysoka specifita, aby neprebila sablona) */
.ctaTopBar > a{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.9rem 1.15rem;
  border-radius:var(--cta-radius);
  font-weight:var(--cta-fw); line-height:1; text-decoration:none;
  border:1px solid transparent;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
  -webkit-tap-highlight-color:transparent;
  white-space:nowrap; text-align:center;
}

/* Mobilni rozpad - kompaktni, nekoliduje s header ilustraci */
@media (max-width:589px){
  .ctaTopBar > a{
    width:100%;
    max-width:480px;
    margin-inline:auto;      /* buttony na stred */
    
  }
}

/* --- Neaktivni (default) vzhled --- */
.ctaTopBar .ctaBtnTopOrrange{
  background:var(--cta-orange) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.ctaTopBar .ctaBtnTopDark{
  background:var(--cta-ink) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.ctaTopBar .ctaBtnTopGhost{
  background:var(--cta-ghost-bg) !important;
  color:var(--cta-ink) !important;
  border:1px solid var(--cta-ghost-br) !important; /* lehce zvyrazneny ramecek */
}

/* --- Hover efekty tlacitek --- */
.ctaTopBar .ctaBtnTopOrrange:hover,
.ctaTopBar .ctaBtnTopOrrange:focus-visible{
  color:var(--cta-hover-on-orange) !important;
}

.ctaTopBar .ctaBtnTopDark:hover,
.ctaTopBar .ctaBtnTopDark:focus-visible{
  color:var(--cta-hover-on-dark) !important;
}

.ctaTopBar .ctaBtnTopGhost:hover,
.ctaTopBar .ctaBtnTopGhost:focus-visible{
  color:var(--cta-hover-on-ghost) !important;
  background:var(--cta-ghost-bg-h) !important;
  border-color:var(--cta-ghost-br) !important;
}

/* --- Aktivni stav (klik / zvyrazneni aktualni stranky) - jen barva pisma --- */
.ctaTopBar > a.is-active{ color:var(--cta-hover-on-ghost) !important; }

/* Pristupnost - outline jen pri klavesove navigaci */
.ctaTopBar > a:focus-visible{ outline:2px solid currentColor; outline-offset:2px; }




/* ===== 1) Blog CTA link (inline) ===== */
.blogCta-link{
  color: var(--cta-orange);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed var(--cta-orange);
  transition: color .18s ease, border-color .18s ease, background-color .18s ease;
  padding: 0 2px;
  border-radius: 4px;
}
.blogCta-link:hover,
.blogCta-link:focus-visible{
  color: var(--cta-ink);
  border-color: var(--cta-ink);
  background-color: var(--cta-ghost-bg-h);
  text-decoration: none;
  outline: none;
}

/* ===== 2) Blog CTA box (uprostred clanku) ===== */
.blogCta-box{
  background: #FCFDFE;
  border: 1px solid var(--cta-ghost-br);
  border-radius: var(--cta-radius);
  padding: clamp(14px, 2.6vw, 22px);
  margin: clamp(16px, 3.2vw, 28px) 0;
}
.blogCta-title{
  margin: 0 0 .35rem 0;
  font-size: clamp(1.02rem, 1.2vw, 1.12rem);
  font-weight: 700;
  color: var(--cta-ink);
}
.blogCta-text{
  margin: 0 0 .9rem 0;
  color: #34465A;
  line-height: 1.55;
}
.blogCta-actions{
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
}
.blogCta-btn{
  padding: .72rem 1rem;
  border-radius: var(--cta-radius);
  font-weight: var(--cta-fw);
  line-height: 1;
  text-align: center;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
  white-space: nowrap;
}

/* Box - oranzove tlacitko */
.blogCta-btn.ctaBtnTopOrrange{
  background: var(--cta-orange);
  color: #fff;
  border: 1px solid transparent;
}
.blogCta-btn.ctaBtnTopOrrange:hover,
.blogCta-btn.ctaBtnTopOrrange:focus-visible{
  color: var(--cta-hover-on-orange);
}

/* Box - ghost tlacitko (pokud bys pouzil i zde) */
.blogCta-btn.ctaBtnTopGhost{
  background: var(--cta-ghost-bg);
  color: var(--cta-ink);
  border: 1px solid var(--cta-ghost-br);
}
.blogCta-btn.ctaBtnTopGhost:hover,
.blogCta-btn.ctaBtnTopGhost:focus-visible{
  color: var(--cta-hover-on-ghost);
  background: var(--cta-ghost-bg-h);
  border-color: var(--cta-ghost-br);
}

/* Box - tmave tlacitko (volitelne) */
.blogCta-btn.ctaBtnTopDark{
  background: var(--cta-ink);
  color: #fff;
  border: 1px solid transparent;
}
.blogCta-btn.ctaBtnTopDark:hover,
.blogCta-btn.ctaBtnTopDark:focus-visible{
  color: var(--cta-hover-on-dark);
}

/* ===== 3) Blog CTA lista (na konci clanku) ===== */
.blogCta-footer{
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
  justify-content: center;
  margin: clamp(18px, 3.2vw, 32px) 0 0;
  padding-top: .2rem;
  /*border-top: 1px solid #EBF1F6;*/
}
.blogCta-footer .blogCta-btn{
  padding: .72rem 1rem;
}

/* ===== Responzivita ===== */
@media (max-width: 680px){
  .blogCta-actions,
  .blogCta-footer{ justify-content: center; }
  .blogCta-btn{
    width: 100%;
    max-width: 460px;
    margin-inline: auto;
  }
}

/* ===== Pristupnost ===== */
.blogCta-btn:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Pristupnost - vypnuti animaci pri prefer-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .ctaTopBar > a,
  .blogCta-btn,
  .blogCta-link{ transition: none; }
}

/* Vetsi klikaci plocha (touch) */
.ctaTopBar > a,
.blogCta-btn{ min-height: 44px; }



/* Konec Tlacitka upgrade 2025-09*/

/* Snippet-ready answer box po CTA modulu - drzi 16/32/64 vertikalni rytmus */
.snippetAnswer {
    margin-top: 48px;
}


/*CTA TOP Ikony*/

/* lehka typografie + zarovnani s CTA */
.ex-mini-benefits--clean{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:60px
}
@media (max-width:980px){.ex-mini-benefits--clean{grid-template-columns:repeat(2,1fr)}}
.ex-mini-item{display:flex;gap:10px;align-items:flex-start}
.ex-mini-item img{display:block;flex:0 0 22px}
.ex-mini-item strong{display:block;font-weight:700;color:#1e3b52;font-size:15px;line-height:1.2}
.ex-mini-item span{display:block;color:#6b7683;font-size:13px;margin-top:2px}

/* drobna opticka linka mezi CTA a benefity (volitelne) */
.ctaRow + .ex-mini-benefits--clean{border-top:1px solid #eef2f6;padding-top:12px}

/* konec CTA TOP Ikony*/

/*CTA mobil/dekstop*/

/* Vychozi stav - zobrazit mobilni, skryt desktop */
.cta-desktop { display: none !important; }
.cta-mobile  { display: inline-flex !important; }

/* Od 990 px - desktop */
@media (min-width: 990px) {
    .cta-desktop { display: inline-flex !important; }
    .cta-mobile  { display: none !important; }
}

/*konec CTA mobil/dekstop*/

/* ============================================================
   Pillar-backlink - visual emphasis for navigation links to 
   deeper per-type pages or related pillars.
   Subtle highlight, ne dominantni element.
   ============================================================ */
.pillar-backlink {
    background-color: #f5f7fa;
    border-left: 4px solid #4a90c2;
    padding: 12px 16px;
    margin: 16px 0;
    border-radius: 0 4px 4px 0;
}

.pillar-backlink a {
    text-decoration: none;
    font-weight: 600;
}

.pillar-backlink a:hover {
    text-decoration: underline;
}

/* ===== Kontakty - layout (bez zasahu do typografie) ===== */
.ContactPageBody { margin-top: 10px; }

/* Dvousloupcovy grid (desktop), na mobilu pod sebou */
.ContactPageBody .contact-grid { display: block; }
@media (min-width: 980px) {
  .ContactPageBody .contact-grid {
    display: grid;
    grid-template-columns: 60% 40%;
    gap: 2rem;
    align-items: start;
  }
}
.ContactPageBody .contact-grid > div { margin-bottom: 24px; }
@media (min-width: 980px) {
  .ContactPageBody .contact-grid > div { margin-bottom: 0; }
}

/* Rychly kontakt - robustni proti starym pravidlum .u-contact */
.ContactPageBody .quick-contact {
  display: block;
  margin: 6px 0 0;
  padding: 0;
  color: inherit;              /* jistota proti kolizim */
}
.ContactPageBody .quick-contact .qc-row {
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin: 0 0 8px;
}
.ContactPageBody .quick-contact dt {
  min-width: 120px;
  font-weight: 700;
  color: inherit;
}
.ContactPageBody .quick-contact dd {
  margin: 0;
  color: inherit;
}
.ContactPageBody .quick-contact a {
  color: var(--cta-orange);
  font-weight: 600;
  text-decoration: none;
}
.ContactPageBody .quick-contact a:hover { text-decoration: underline; }

/* Cislovany proces - badge 1..5 */
.ContactPageBody .ex-process { counter-reset: step; list-style: none; padding: 0; margin: 4px 0 0; }
.ContactPageBody .ex-process li {
  counter-increment: step;
  position: relative;
  padding-left: 2.6rem;
  margin: 0 0 16px;
}
.ContactPageBody .ex-process li::before {
  content: counter(step);
  position: absolute; left: 0; top: .15rem;
  width: 1.8rem; height: 1.8rem;
  background: var(--cta-orange); color: #fff;
  border-radius: 999px; display: flex; align-items: center; justify-content: center;
  font-weight: 800; line-height: 1;
}
@media (max-width: 589px) {
  .ContactPageBody .ex-process li { padding-left: 2.2rem; }
  .ContactPageBody .ex-process li::before { width: 1.6rem; height: 1.6rem; }
}

/* Mapa - responsivni */
.ContactPageBody .ex-map iframe {
  width: 100%;
  height: 320px;
  border: 0;
  border-radius: 10px;
  background: #eee;
}
@media (min-width: 1200px) {
  .ContactPageBody .ex-map iframe { height: 340px; }
}

/* Kotva formulare a fixni header */
#contactform { /*scroll-margin-top: 100px; */}

/*kontakty hack for page */

/* ===== Kontakty - pevna mezera CTA pod headerem ===== */

/* Nuluj potencialni zaporne okraje headeru na teto strance */
#ContactPageHeader { margin-bottom: 0 !important; }

/* CTA hned za headerem - fixni rozestup */
#ContactPageHeader + .ctaTopBar {
  margin-top: 50px !important;   /* desktop default */
  padding-top: 0 !important;     /* at do toho nepromlouva puvodni padding */
}

/* stejne na vetsich tabletech, at drzime 64 px */
@media (max-width: 980px) {
  #ContactPageHeader + .ctaTopBar { margin-top: 48px !important; }
}

/* na mobilech dejme minimalne 32 px, ne mene */
@media (max-width: 589px) {
  #ContactPageHeader + .ctaTopBar { margin-top: 32px !important; }
}

/* (nepovinne) jednotna mezera i pod CTA, aby se benefity nelepily na tlacitka */
/* #ContactPageHeader + .ctaTopBar + .ex-mini-benefits--clean {
  margin-top: 64px;
}*/

/* ===== Widgety Firmy.cz + Mapy.com pod mapou ===== */
.ContactPageBody .ext-badges {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 24px;
}

.ContactPageBody .ext-badges .ext-badge img {
  display: block;
  height: 60px;          /* zvetseno pro lepsi citelnost */
  width: auto;
  max-width: 260px;      /* limit, aby to nepretekalo na mensich monitorech */
  transition: transform 0.2s ease;
}

.ContactPageBody .ext-badges .ext-badge img:hover {
  transform: scale(1.05);
}

@media (max-width: 589px) {
  .ContactPageBody .ext-badges {
    gap: 16px;
    margin-top: 20px;
  }
  .ContactPageBody .ext-badges .ext-badge img {
    height: 52px;
    max-width: 220px;
  }
}



/*konec CTA kontakty*/

/*module contact form, rating form */
.ContacFormTitle {
  background-color: #f3f3f3;
  width: 100%;
  display: flex;
  position: sticky;
  z-index: 100;
  margin-top: 60px;
}
/*.ContacFormTitle:before {
  content: "";
  background-color: #f3f3f3;
  position: absolute;
  height: 100%;
  width: 4000px;
  left: -2000px;
  z-index: -1;
} */
.ContacFormTitle h2 {text-transform: uppercase; margin-top: 23px; margin-bottom: 90px;}
#ContacFormMain, #RatingFormMain {
    border: 1px solid #E9E9E9;
    border-radius: 0 22px 0 22px;
    box-shadow: 5px 8px 9px #E9E9E9;
    position: relative;
    margin: -60px auto 0 auto;
    background-color: white;
    padding: 5px 25px 28px 25px;
    z-index: 100;
    width: 950px;
    }
#RatingFormMain {padding-top: 30px !important;}

/*Contact form RS form hack*/
 /*form layout*/
.formRed {color: #cd6a00;}
.formRow1 {width: 100%; display: flex; margin-top: 25px; margin-bottom: 28px;
}
#formRow1 {}
.formRow1Left, .formRow2Left  {width: 362px; float: left;}
.formRow1Right, .formRow2Right {width: 490px; float: left;}
#formRow1Right {margin-left: 17px;}
.formRow2 {width: 100%;}
.formRow3 {width: 100%;}
#formRow3 {}
#formRow3 a {color: inherit;}
#formRow3 a:hover {color: var(--body-link-hover-color);}
#formRow3 .rsform-checkbox {
  margin-right: 10px;
  margin-top: 5px;
  border: 2px solid var(--brand-orange);
  box-shadow: 0px 0px 5px 5px white;
  width: 18px;
  height: 18px;
  }

.form-check-input:checked[type="checkbox"], .contact .email-copy > input:checked[type="checkbox"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
.form-check-input:checked, .contact .email-copy > input:checked[type="checkbox"] {
  background-color: #F3F3F3;
  border-color: var(--brand-orange);
}
 

.formRow4 {width: 100%; display: flex;}
#formRow4 {}
#formRow4 .rsform-block.rsform-block-submit{
  margin: 0 auto;
  }
#formRow4 .btn.btn-primary, #ratingFormRow3 .btn.btn-primary {
  background-color: #ffffff;
  color: var(--brand-orange);
  border: 2px solid var(--brand-orange);
  border-radius: 43px 43px;
  width: 205px;
  height: 49px;
  padding: 0;
  font-weight: bold;
  }
#ratingFormRow3 .btn.btn-primary {margin-top: 47px;}

@media screen and (max-width: 730px) {
  #ratingFormRow3 .btn.btn-primary {margin-top: 6px;}
 }

#formRow4 .btn.btn-primary:hover, #ratingFormRow3 .btn.btn-primary:hover {
  color: #ffffff;
  background-color: var(--brand-orange);
  }

.formNameLab {}
.formNameBod {}
.formEmailLab {}
.formEmailBod {}
.formPhoneLab {}
.formPhoneBod {}
.formMessLab {}
.formMessBod {}
.formStreetLab {}
.formStreetBod {}
.formCityLab {}
.formCityBod {}
.formInfo1 {}


.formNameLab, .formEmailLab, .formPhoneLab, .formMessLab, .formStreetLab {width: 103px; margin-top: 6px;}
.formCityLab, .formCompanytLab {width: 103px; margin-top: 6px;}

.formNameBod, .formEmailBod, .formPhoneBod, .formMessBod, .formStreetBod, .formCityBod, .formCompanyBod {
  float: right; 
  width: 100%;   
  margin-bottom: 12px;
  }

.formNameBod input, .formEmailBod input, .formPhoneBod input, .formStreetBod input, .formCityBod input, .formCompanyBod input, .rateFormNameBod input, .rateFormEmailBod input {
  width: 250px;
  max-width: 250px;
  height: 44px;
  border: 1px solid #6B6B6B;
  }
  
.formMessBod input {
  width: 400px;
  max-width: 400px;
  }  
  
#formRow1 .rsform-block, #formRow2 .rsform-block {display: flex;}
#formRow1 .formRequired, #ratingFormRow .formRequired {font-weight: normal; margin-left: 0; margin-right: 1px;}
#formRow1Right textarea.form-control, #ratingFormRow2 textarea.form-control {
  min-height: 155px;
  min-width: 427px;
  border: 1px solid #6B6B6B;
}

#formRow1Right textarea.form-control {
  margin-left: 25px;
}

/*RSform hack spatneho zalomeni GDPR na mobilu*/

/*contact form responsivness*/

@media screen and (max-width: 1025px) {
#ContacFormMain, #RatingFormMain {width: 650px;}
.formRow1 {display: block;}
.formRow1Left, .formRow2Left {float: none;}
.formRow1Right, .formRow2Right {float: none; margin-left: 0 !important;}
#formRow1Right textarea.form-control {margin-left: 40px;}
.formCityLab {margin-top: -7px;}
}

@media screen and (max-width: 730px) {
 #ContacFormMain, #RatingFormMain {width: 420px;}
 #formRow1Right textarea.form-control, #ratingFormRow2 textarea.form-control {min-width: 252px;}
 .formControls {width: 100%;}
 #formRow3 label {display: initial; margin-right: 0.25rem;}
 .formRow3 {margin-top: 19px;}
 .formRow1Left, .formRow2Left {width: unset;}
 .formRow1Right, .formRow2Right {width: unset;}
}

#exalab-contact #formRow3 > .rsform-block-terms-and-conditions > label {
  display: inline-block;
  margin-right: 0.5rem;
  vertical-align: top;
}

@media screen and (max-width: 575px) {
  .formNameBod input, .formEmailBod input, .formPhoneBod input, .formStreetBod input, .formCityBod input {margin-left: 19px;}
  .formCompanyBod input {margin-left: 8px;}
  .formMessBod input {margin-left: 8px;}
  #formRow1Right textarea.form-control {margin-left: 20px;}
}

@media screen and (max-width: 470px) {
  #ContacFormMain, #RatingFormMain {width: 330px;}
  #formRow1 .rsform-block, #formRow2 .rsform-block {display: block;  }
  .formNameBod input, .formEmailBod input, .formPhoneBod input, .formStreetBod input, .formCityBod input {margin-left: 0;}
  #formRow1Right textarea.form-control {margin-left: 0px;}
  .formCityLab {width: 125px; margin-top: 0;}
  .formNameBod input, .formEmailBod input, .formPhoneBod input, .formStreetBod input, .formCityBod input, .formCompanyBod input {width: 265px; max-width: 265px;} 
  #formRow1Right textarea.form-control {min-width: 265px;}
  .formRow1Left, .formRow2Left {width: unset;}
  .formRow1Right, .formRow2Right {width: unset;}
  .formCompanyBod input {margin-left: 0;}
}

/*moduletable hack*/ 

.moduletable {
    border: none;
    padding: unset;
    border-radius: unset;
    margin: unset;
}


/*module learn more white*/


/*module nonstop hotline*/
.nonstopHotline {width: 220px;}
#nonstopHotlineDRCenter .nonstopHotline {width: 190px;}
#nonstopHotlineDRCenter .nonstopHotline:lang(en) {width: 195px;}
.nonstopHotlineDR {width: 198px;}
.nonstopHotline img, .nonstopHotlineDR img {height: 50px; width: auto;}
#nonstopHotlineDRCenter .nonstopHotline img {margin-left: -5px;}
.nonstopHotline div, .nonstopHotlineDR div {float: right;}
.nonstopHotline div {line-height: 26px;}
.nonstopHotlineSpan1 {}
.nonstopHotlineSpan2 {color: var(--brand-orange) !important; font-weight: bold;}

/*module nonstop hotline in article - centered*/
#nonstopHotlineCenter {width: 100%; display: flex; margin-top: 50px;}
#nonstopHotlineDRCenter {width: 100%; display: flex;}
#nonstopHotlineCenter .nonstopHotline, .nonstopHotlineDR, #nonstopHotlineDRCenter .nonstopHotline {margin: auto;}
#nonstopHotlineDRCenter .nonstopHotlineSpan1 {margin-left: 7px}


/*module nonstop hotline in article between two P*/
.dataRecoveryMiniBetweenPs {margin-top: -33px; margin-bottom: 18px;}
.dataRecoveryMiniEndOfArt {margin-bottom: -18px;}


/*disable internal articles structures from old version*/

#Top2ndMenu {display: none;}
#iBarUnder2ndMenu {display: none;}
#sideBarRightPos {display: none;}
#iBarAboveHeader {display: none;}
#articleBottomPos {display: none;}

/*carousel hack*/
.n2-bullet, .n2-active {padding: 1px 24px 5px 20px !important;} 
.n2-active {background: var(--brand-orange) !important;}


/*T4 sections hack*/
#t4-section-3 {background-color: #f3f3f3;}
.pt-0 {padding-bottom: 28px !important;}
 .t4-footer a {border-bottom: none !important;}

/* T4 section footer*/
.t4-footer {padding-top: 2px; padding-bottom: 10px;}
.footerAll {width: 100%; display: flow-root; margin-bottom: 14px;}
.footerALL1stRow {}
.footerMenu {text-align: center;}
.footerMenu a {}
.footerMenu a:after {content:" | "; font-weight: bold; padding: 0 4px 0 4px;}
.footerALL2ndRow { margin-top: 16px;}
.footerText {float: left;}
.footerCopy {right: 19px; position: absolute;}

@media (max-width: 840px) {
.footerCopy {width: 304px; margin: -20px auto 0 auto; float: unset; position: unset;}
.footerText {width: 415px; margin: auto; float: unset;}
.copyright {margin-top: 0;}
.footerAll {margin-top: 30px;}
}

@media (max-width: 470px) {
 .footerText {width: 312px; text-align: center;}
}

/*inText SVG icons definitions*/

.iconPrice {
  background-image: url("/images/svg/dollar.svg");
  height: 17px;
  width: 22px;
  background-size: 14px 14px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}

.iconDiag {
  background-image: url("/images/svg/diag.svg");
  height: 17px;
  width: 22px;
  background-size: 14px 14px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}

.iconMoreInfo {
  background-image: url("/images/svg/info.svg");
  height: 17px;
  width: 22px;
  background-size: 14px 14px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}

/*recaptcha hack*/
.grecaptcha-badge {display: none;}

/*pages header hack*/
#PartnersProgramPageHeader h2, #WhatIsDrPageHeader h2, #FirstAidPageHeader h2, #FAQPageHeader h2, #PricingPageHeader h2, #BlogPageHeader h2,
#ContactPageHeader h2, #MediaPageHeader h2, #MediaPageHeaderEmbeded h2, #GlosarPageHeader h2 {
  /*font-size: 18px !important;
  text-transform: none !important;
  font-weight: inherit !important;*/
  } 
  
.PartnersProgramPageHeaderText, .WhatIsDrPageHeaderText, .FirstAidPageHeaderText, .FAQPageHeaderText, .PricingPageHeaderText, .BlogPageHeaderText,
.ContactPageHeaderText, .MediaPageHeadertext, .CategoryMenuPageHeaderText, .MediaCategoryHeaderText, .GlosarPageHeaderText {
  margin: 0;
  }  
  
.WhatIsDrPageHeaderText, .FirstAidPageHeaderText, .PartnersProgramPageHeaderText, .FAQPageHeaderText, .PricingPageHeaderText, .AboutUsPageHeaderText, .ContactPageHeaderText, .MediaPageHeaderText, .BlogPageHeaderText, .DocsPageHeaderText, .GeneralArticlePageHeaderText, .TermsAndConditionsPageHeaderText, .ReferencesPageHeaderText, .GlosarPageHeaderText {
 
}

/*MestaPageHeader hack*/
#CategoryMenuPageHeader {display: none !important;}

/*Samostatne kategorie jako menu hack / category like a menu alone hack*/

#CategoryMenuPageHeaderBorder {margin-top: 0px;}


/*Blog page hack*/

#lnee_158 .head_left .newshead {
  margin: 0 32px 32px 0;
}
#BlogPageHeader, #CategoryMenuPageHeader, #MediaCategoryHeader {margin-bottom: 64px;}

    /*this hack needs to add id="catBlogHack" in com_content/category/blog.php v template overrides*/


.page-header {}
.page-header h2 {margin-top: 25px; /**margin-bottom: 8px**/ !important;}
#catBlogHack .page-header, #catBlogHack .article-aside {background-color: inherit;}
#catBlogHack .page-header h2 {margin-top: 0;}
#catBlogHack .page-header:before, #catBlogHack .article-aside:before {
  width: inherit;
  left: inherit;
  background-color: inherit;
  }
#catBlogHack .article-aside {}

.blogArticleShow {}

    /*-25px is good for an article with an image, but article without an image has 2 first P close together*/
.intro-text {/*margin-bottom: -25px;*/ margin-top: 30px;}

.item-image {margin: -5px 0 23px 0;}

/*pricelist hack*/
.priceListTab {list-style-type: none; padding-left: 15px;}
.priceListTab li {
    border-bottom: dotted #bababa 2px;
    /*width: 100%;*/
    width: 100%;
    max-width: 900px;
    min-width: 650px;
    }    
.priceListTab span {
    float: right;
    text-align: left;
    width: 220px;
    white-space: nowrap;
    }
    
#pricingDivArrountPricingList {margin-top: 56px;}

/*Falang hack*/
@media (min-width: 360px) {
  .d-md-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
}

.langChoose {background-color: inherit !important; border-radius: 0;}
div.advanced-dropdown a.langChoose img {border: 0px;}

/*scroll margin top hack for all anchors sicen 2026-02*/


/* Scroll offset for all empty anchor elements with id attribute */
a[id]:empty {
    display: block;
    position: relative;
    top: -108px;
    visibility: hidden;
}
    
/*Sourcecoast JFBconnect hack*/

.sourcecoast.facebook, .sourcecoast.linkedin, .sourcecoast.twitter, .sourcecoast.google, .sourcecoast.pinterest, .sourcecoast.instagram, .sourcecoast .facebook, .sourcecoast .linkedin, .sourcecoast .twitter, .sourcecoast .google, .sourcecoast .pinterest, .sourcecoast .instagram {
  float: left;
  display: flex;
  margin-right: 10px;
}

/*top social icons*/
.socialIconTop {margin-right: 23px; position: relative; bottom: -5px;}
@media (max-width: 1050px) {
  .socialIconTop {display: none;}
  }


.iconFacebook {
  background-image: url("/images/svg/facebook.svg");
  height: 19px;
  width: 26px;
  background-size: 15px 15px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}
.iconTwitter {
  background-image: url("/images/svg/twitter.svg");
  height: 19px;
  width: 26px;
  background-size: 15px 15px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}
.iconLinkedin {
  background-image: url("/images/svg/linkedin.svg");
  height: 19px;
  width: 26px;
  background-size: 15px 15px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}
.iconInstagram {
  background-image: url("/images/svg/instagram.svg");
  height: 19px;
  width: 26px;
  background-size: 15px 15px;
  background-position: 0px 3px;
  display: inline-block;
  background-repeat: no-repeat;
  fill: #f26522;
}

/*znacky a typy datovamedia clanky / brands and types data media articles */

#MediaEmbededText .MediaPageHideInsideEmbeded {display: none;}
#MediaEmbededText .article-info {display: none;}

/*warning in an article /varovani v clanku*/

.warning {
    background-color: #ffdddd;
    border-left: 4px solid #f44336;
    padding: 10px;
    margin: 10px 0;
    font-weight: bold;
    font-family: Arial, sans-serif;
    font-size: 14px;
}

.warning a {
    color: #b71c1c;
    text-decoration: underline;
}

.warning a:hover {
    color: #7f0000;
}

/*hiden element, skryty element*/
.HiddenElement {display: none;}

/*AA module Goolge Reviews Hack*/
.aa-google-places-reviews-badge {
    box-shadow: none;
    margin-bottom: 0;
    border-top: none;
}
.aa-header .aa-prara-title {
  color: inherit;
}     

/*vysvetlivka v clanku, definition in an article*/

p.vysvetlivka {
  background: #f7f8fa;
  border-left: 4px solid #d0d3d6;
  padding: 0.75rem 1rem;
  margin: 1.25rem 0;
  border-radius: 6px;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #222;
}

p.vysvetlivka strong {
  color: #000;
}

/*Ignite Gallery Hack*/

/* ============================================
   Ignite Gallery - Description Styling
   Profile-3: inline fotky v clanku
   Profile-1: galerie dole (mobilni slideshow)
   ============================================ */
/* --- PROFILE-3: Inline fotky v clanku --- */
.profile-3 .ig-image-descriptions {
    height: auto !important;
    overflow: visible !important;
    background: #f8f8f8;
    border-left: 3px solid #e8740c;
    padding: 10px 14px !important;
    margin-top: 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: #666 !important;
    font-style: italic;
    max-width: 600px;
}
.profile-3 .ig-image-descriptions .ig-image-description {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: #666 !important;
}
.profile-3 .ig-image-descriptions .ig-description-scroll {
    display: none !important;
}
.profile-3 .ig-gallery-wrapper {
    max-width: 600px;
    margin-bottom: 1.5em;
}
/* --- PROFILE-1: Galerie dole (description na mobilu) --- */
@media (max-width: 767px) {
    .profile-1 .ig-slideshow-item .ig-lightbox-description-content {
        background: #f8f8f8 !important;
        border-left: 3px solid #e8740c !important;
        padding: 10px 14px !important;
        margin-top: 0 !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: #666 !important;
        font-style: italic;
        text-align: left !important;
    }
    .profile-1 .ig-image-descriptions {
        height: auto !important;
        overflow: visible !important;
        background: #f8f8f8 !important;
        border-left: 3px solid #e8740c !important;
        padding: 10px 14px !important;
        margin-top: 0 !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: #666 !important;
        font-style: italic;
        text-align: left !important;
    }
    .profile-1 .ig-image-descriptions .ig-image-description {
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: #666 !important;
    }
    .profile-1 .ig-image-descriptions .ig-description-scroll {
        display: none !important;
    }
}

/* S.M.A.R.T. atribut tabulka na HDD piliri */
.smartTable {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0;
    font-size: 0.92em;
}
.smartTable thead {
    background-color: #f0f4f8;
    border-bottom: 2px solid #d0d8e0;
}
.smartTable th {
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
}
.smartTable td {
    padding: 8px 12px;
    border-bottom: 1px solid #e8ecf0;
    vertical-align: top;
}
.smartTable td:first-child {
    font-family: 'Courier New', monospace;
    text-align: center;
    width: 50px;
}
.smartTable tbody tr:hover {
    background-color: #f8fafb;
}
.smartTable td:last-child strong {
    color: #c44;
}
@media (max-width: 768px) {
    .smartTable {
        font-size: 0.85em;
    }
    .smartTable th,
    .smartTable td {
        padding: 6px 8px;
    }
    .smartTable td:first-child {
        width: 40px;
    }
}

/* Pending link - odkazy na stranky v priprave (brand mini-pilire) */
.pending-link {
    color: #999;
    pointer-events: none;
    text-decoration: line-through;
    cursor: default;
}

/*update info k aktualizovanemu clanku*/
p.updated {
    background-color: #f5f5f5;
    border-left: 3px solid #999;
    padding: 10px 14px;
    margin-bottom: 1.4em;
    font-size: 0.92em;
    color: #555;
}
/* =============================================================
   EXALAB(R) Brand Mark - CSS rules for (R) rendering
   Created: 17.5.2026 | Add to templates/ja_coach/css/custom.css
   ============================================================= */

/*
 * Markup pattern:
 *   EXALAB<span class="brand-rmark">(R)</span>
 *
 * Why span over <sup>:
 *   - Avoids fighting browser default <sup> styles (vertical-align: super
 *     pushes line-height inconsistently across browsers)
 *   - Semanticky (R) neni superscript, je to brand mark notice
 *   - Cleaner control via `position: relative` + `top: -0.45em`
 *
 * Tested in: Chrome 124, Firefox 125, Safari 17, Edge 124 (desktop + mobile)
 * Tested fonts: Montserrat (web), Arial fallback (email/plain text)
 */

.brand-rmark {
  /* Size relative to parent - scales with surrounding text */
  font-size: 0.55em;

  /* Superscript positioning without browser-default `vertical-align: super`,
     which causes line-height inflation in multi-line paragraphs */
  position: relative;
  top: -0.45em;
  vertical-align: baseline;

  /* Prevent line-height impact in dense paragraphs */
  line-height: 1;

  /* Inherit weight so <strong>EXALAB<span class="brand-rmark">(R)</span></strong>
     renders (R) bold too */
  font-weight: inherit;

  /* Microspacing - small kern between EXALAB and (R) for readability,
     without making (R) look detached */
  margin-left: 0.02em;

  /* Inherit color so links and headings retain their color */
  color: inherit;

  /* Prevent any accidental letter-spacing impact from parent */
  letter-spacing: 0;

  /* Prevent (R) from being affected by text-transform: uppercase
     ((R) has no case, but be explicit) */
  text-transform: none;

  /* Disable user selection separately from EXALAB - usability tweak,
     prevents accidental copy of "EXALAB(R)" when user wanted just "EXALAB" */
  /* DISABLED - accessibility: keep user selection enabled.
     If desired later: user-select: none; */

  /* Disable cursor change so it doesn't break linkability of parent */
  cursor: inherit;
}

/* Within links - inherit text decoration so (R) doesn't get underlined
   separately, and color matches link */
a .brand-rmark,
a:hover .brand-rmark,
a:focus .brand-rmark,
a:active .brand-rmark {
  color: inherit;
  text-decoration: inherit;
}

/* Within H1, H2, H4 - slightly smaller to prevent (R) from looking oversized
   relative to large heading text */
h1 .brand-rmark,
h2 .brand-rmark,
h3 .brand-rmark,
h4 .brand-rmark,
h5 .brand-rmark,
h6 .brand-rmark {
  font-size: 0.45em;
  top: -0.55em;
}

/* Within bold text - keep consistent weight (already inherited, but explicit
   override here makes it bulletproof against parent styles) */
strong .brand-rmark,
b .brand-rmark,
.brand-rmark strong {
  font-weight: inherit;
}

/* Print stylesheet - keep (R) visible but conservative size */
@media print {
  .brand-rmark {
    font-size: 0.5em;
    top: -0.4em;
  }
}

/* High contrast mode (Windows accessibility) - keep (R) visible */
@media (forced-colors: active) {
  .brand-rmark {
    forced-color-adjust: auto;
  }
}

/* RTL languages (FR/DE/EN don't apply, but futureproof for AR/HE if ever) */
[dir="rtl"] .brand-rmark {
  margin-left: 0;
  margin-right: 0.02em;
}

/* =============================================================
   EDGE CASES / DEBUGGING
   ============================================================= */

/*
 * Known issue 1: If parent has line-height: 0 (e.g., display: flex centering hack),
 * the .brand-rmark might overflow. Solution: set line-height: 1 on parent
 * specifically, or move (R) outside such constructs.
 *
 * Known issue 2: In tooltips with overflow: hidden + text-overflow: ellipsis,
 * (R) may be truncated awkwardly. Solution: don't put EXALAB(R) in single-line
 * tooltips - it's a compact UI elementpattern, per policy section 2.2.
 *
 * Known issue 3: Joomla MCE editor sometimes strips empty <span> on save if the
 * inline content is non-text (just an entity). Workaround: paste markup directly
 * in source view (HTML tab in JCE), not via WYSIWYG.
 *
 * Known issue 4: Some email clients (Outlook 365 desktop) ignore CSS positioning.
 * For email templates, fall back to native superscript or plain inline (R).
 */
 
 /* ============================================================
   .techNote – callout pro technicky náročné pasáže
   ============================================================ */

.techNote {
  background: #f4f6f8;
  border-left: 4px solid #ED8012;   /* brand orange */
  padding: 12px 16px;
  margin: 16px 0;
  border-radius: 0 4px 4px 0;
}

.techNote .techNoteLabel {
  font-size: 0.8em;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #092445;                   /* dark blue */
  margin: 0 0 6px;
  opacity: 0.75;
}

/* volitelný malý indikátor před štítkem */
.techNote .techNoteLabel::before {
  content: "⚙ ";
  opacity: 0.9;
}

.techNote p:last-child {
  margin-bottom: 0;
}