/* ========== City CSS ============== */

/* Logo */
.nav-logo-wrap .logo img {
    width: auto;
    max-height: 150%;
    padding-bottom: 15px;
    padding-top: 15px;
}

img:not([draggable]), embed, object, video {
    max-width: 150%;
    height: auto;
}

/* ============================ Bild im Slider - kein rand */
.parallax-2 {
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
}


/* =========================== Menu ================================== */
/* Mobile Menu Red Col */
body {
   /*  color: #d12420; */
    font-size: 14px;
    font-family: "Open Sans", arial, sans-serif;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* Menu active color */
.inner-nav ul li a:hover, .inner-nav ul li a.active {
    color: #d12420 !important;
    text-decoration: none;
}
    

/* Menu Font Size */
.inner-nav ul {
    font-size: 13px !important;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.3;
}


/* Menu Unter 1200px kleinere Schrift */
@media (max-width: 1220px) {
    .inner-nav ul {
        font-size: 10px !important;
    }
}


/* Menu Unter 1020px wieder größere Schrift */
@media (max-width: 1020px) {
    .inner-nav ul {
        font-size: 12px !important;
    }
}








/* H1 */
.section-title {
    margin-bottom: 1em;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    line-height: 1.6;
    text-transform: uppercase;
    text-align: center;
}



/* Überschriften in Gilda Display */
h1 {
  font-family: 'Gilda Display', serif !important;
  font-weight: 400 !important;;
  margin-bottom: 0.5em !important;;
  color: #fff !important;
}

h2, h3 {
  font-family: 'Gilda Display', serif !important;
  font-weight: 400 !important;;
  margin-bottom: 0.5em !important;;
  color: #fff !important;
}

/* zB home 4 bilder */
h3.darkH {
    font-family: 'Gilda Display', serif !important;
    font-weight: 400 !important;
    font-size: 18px;  
    margin-bottom: 0.5em !important;
    color: #555 !important;
    text-transform: uppercase; 
    text-align: center;    
}

/* natur h3 in grünr */
h3.darkG {
    font-family: 'Gilda Display', serif !important;
    font-weight: 400 !important;
    font-size: 18px;  
    margin-bottom: 0.5em !important;
    color: #89ac41 !important;
    text-transform: uppercase; 
    text-align: center;    
}

/* Behandlungen h3 in lila */
h3.darkB {
    font-family: 'Gilda Display', serif !important;
    font-weight: 400 !important;
    font-size: 22px;  
    margin-bottom: 0.5em !important;
    color: #f18fbc !important;
    text-transform: uppercase; 
    text-align: left;    
}


/* Behandlungen Pricing - Euro */
.pricing-num {
    font-size: 20px !important;
    font-weight: 300;
    line-height: 1;
}


/* Hero-Section */
.hero {
  text-align: center;
  padding: 80px 20px;
  background: linear-gradient(135deg, #fdfdfd, #f3e8f9);
}

.hero h1 {
  font-size: 3rem;
}

.hero p {
  font-size: 1.2rem;
  margin-bottom: 20px;
}

/* Call-to-action Button */
.cta-button {
  display: inline-block;
  padding: 12px 24px;
  font-size: 1rem;
  background: #d6b3f5;
  color: white;
  text-decoration: none;
  border-radius: 8px;
  transition: background 0.3s ease;
}

.cta-button:hover {
  background: #b487e5;
}

/* Content */
.content {
  max-width: 800px;
  margin: 60px auto;
  padding: 0 20px;
  text-align: center;
}

.section-text {
    font-size: 17px !important;
    font-weight: 300;
    color: rgb(119, 119, 119);
    line-height: 1.7;
}


/* =========================================== Background ============================== */
#bgHome {
    background-image: url('../images/bg/1.png');
    background-size: cover;       /* Bild wird auf gesamte Fläche gestreckt */
    background-position: center;  /* Bild wird zentriert */
    background-repeat: no-repeat; /* kein wiederholtes Kacheln */
    background-attachment: scroll; /* Bild bewegt sich normal mit */    
}


#bgKontakt {
    background-image: url('../images/bg/bgKontakt.png');
    background-size: cover;       /* Bild wird auf gesamte Fläche gestreckt */
    background-position: center;  /* Bild wird zentriert */
    background-repeat: no-repeat; /* kein wiederholtes Kacheln */
    background-attachment: scroll; /* Bild bewegt sich normal mit */    
}


#ton {
    background-image: url('../images/bg/ton.png');
    background-size: cover;       /* Bild wird auf gesamte Fläche gestreckt */
    background-position: center;  /* Bild wird zentriert */
    background-repeat: no-repeat; /* kein wiederholtes Kacheln */
    background-attachment: scroll; /* Bild bewegt sich normal mit */    
}


#ton p {
  background: transparent !important;
}


#natur {
    background-image: url('../images/bg/natur.png');
    background-size: cover;       /* Bild wird auf gesamte Fläche gestreckt */
    background-position: center;  /* Bild wird zentriert */
    background-repeat: no-repeat; /* kein wiederholtes Kacheln */
    background-attachment: scroll; /* Bild bewegt sich normal mit */    
}


#natur p {
  background: transparent !important;
}




/* Dark Alpha Overlay Slider */
.bg-dark-alfa-30:before, .bg-dark-alfa-30 .YTPOverlay:before {
    background: rgba(34,34,34, .15);
}


.hs-line-11 {
    margin-top: 0;
    position: relative;
    font-size: 22px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.5em;
    line-height: 1.8;
    opacity: .9;
}



/* ================== Home Parallax ================ */
/* h */
.banner-heading {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 26px;
    font-weight: 300;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #fff !important;
}


/* p */
.banner-decription {
    margin-bottom: 35px;
    font-size: 16px;
    font-weight: 300;
    color: #fff !important;
}


/* ====== List less padding left ==== */
.ulNoPad {
    padding-left: 1rem !important;
})


/* =============== Padding Top ================== */

.padTop50 {
    padding-top: 50px;
}

.padTop100 {
    padding-top: 100px;
}

.padTop120 {
    padding-top: 120px;
}

.padTop150 {
    padding-top: 150px;
}


/* =============== Padding Bot ================== */

.padBot50 {
    padding-bottom: 50px;
}

.padBot100 {
    padding-bottom: 100px;
}

.padBot120 {
    padding-bottom: 120px;
}

.padBot150 {
    padding-bottom: 150px;
}


/* padtopbot home */
.pTB {
    padding-top: 50px !important;    
    padding-bottom: 100px !important;
}


.pTB100200 {
    padding-bottom: 100px !important;
    padding-top: 200px !important;
}





/* =============== Margin ================== */
.margTop50 {
    margin-top: 50px; 
}

.margTop100 {
    margin-top: 100px; 
}






/* ============== Kontakt - Icons  ================ */

/* lila */
.ci-icon:before {
    width: 100%;
    height: 100%;
    background: #dcbad8;
}





/* Anschrift mittig auf Mobil */
@media only screen and (max-width: 575px) {
.pad-Kontakt {
    padding-left: 100px !important;
    }}


.ci-title {
    margin-bottom: 1px;
    color: rgb(119, 119, 119);
    font-size: 18px !important;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.4em;
    line-height: 1.8 !important;    
}





/* =================== Schrift im Slider ============================= */
.hs-line-14 { 
    margin-top: 0px;
    position: relative;
    font-size: 90px;
    font-weight: 1000 !important;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}

/* Bis 1000px Breite  */
@media (max-width: 1409px) {
    .hs-line-14 {
        font-size: 70px;
    }
}

/* Bis 993px Breite  */
@media (max-width: 993px) {
    .hs-line-14 {
        font-size: 36px;
    }
}

/* Unter 486px Breite */
@media (max-width: 486px) {
    .hs-line-14 {
        font-size: 26px;
    }
}



/* =============================== FONTS ============================================ */

/* ============ Gilda ============== */
@font-face {
  font-family: 'Gilda Display';
  src: url('../fonts/Gilda/gildadisplay-regular.woff2') format('woff2'),
       url('../fonts/Gilda/GildaDisplay-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

/* Klasse zum gezielten Einsatz */
.gilda {
  font-family: 'Gilda Display', serif;
  font-weight: 400;
}



/* ========== Poppins =========== */
/* Regular */
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins/Poppins-Regular.woff2') format('woff2'),
       url('../fonts/Poppins/Poppins-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

/* Bold */
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins/Poppins-Bold.woff2') format('woff2'),
       url('../fonts/Poppins/Poppins-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

/* Klasse zum Zuweisen */
.poppins {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
}

.poppins.bold {
  font-weight: 700;
}



/* ============== Montserrat ==== */

/* Regulär */
@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/Montserrat/Montserrat-Regular.woff2') format('woff2'),
       url('../fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
  font-weight: 400 !important;
  font-style: normal;
}

/* Fett */
@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/Montserrat/Montserrat-Bold.woff2') format('woff2'),
       url('../fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
  font-weight: 700 !important;
  font-style: normal;
}


/* Klasse für Montserrat */
.mont {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400; /* Standard regular */
}

/* Falls du gezielt Bold über Klasse willst */
.mont.bold {
  font-weight: 800 !important;
}



/* ========================= Schriftarten setzen =============================== */
body {
  font-family: 'Poppins', sans-serif !important;;
  font-size: 16px !important;
  line-height: 1.6;
  color: #333;
  margin: 0;
  padding: 0;
  background: #fff;
}

p {
  font-family: 'Poppins', sans-serif !important;;
  font-size: 16px !important;
  line-height: 1.8;
  color: #777;
  margin: 0;
  padding: 0;
  background: #fff;
font-weight: 300 !important;
}

blockquote p {
   font-family: 'Gilda Display', serif !important;    
    margin-bottom: 1em;
    font-size: 28px !important;
    font-weight: 300 !important;
    font-style: normal;
    line-height: 1.6;
}