/* devmode: pflegeeltern.net overrides */

/* disable demo style selector (kept in codebase for later reactivation) */
#switcher, #style-switcher, .style-switcher, .styleswitcher, .styles-selector, .style_selector, .switcher {
  display: none !important;
}

/* hero image: cover + keep motif on the RIGHT */
.page_mainslider .flexslider .slides > li > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: right center;
}

/* hero text: very dark grey */
.page_mainslider, .page_mainslider h1, .page_mainslider h2, .page_mainslider h3,
.page_mainslider p, .page_mainslider a, .page_mainslider .theme_button {
  color: #1a1a1a !important;
}

/* if template applies dark overlay, neutralize it a bit */
.page_mainslider.ds:before,
.page_mainslider.ds:after {
  opacity: 0 !important;
}
/* unify fonts: use the menu font everywhere (Roboto) */
body, h1, h2, h3, h4, h5, h6, .playfair, .logo_text, .small-text {
  font-family: 'Roboto', sans-serif !important;
}

/* header: remove extra spacing from removed BetterLife text and make logo more prominent */
a.logo.top_logo img { height: 54px; width: auto; }
a.logo.top_logo .logo_tagline {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.2;
  color: #222;
  letter-spacing: 0.2px;
}

/* hero: left aligned, gently indented, readable */
.penet-hero .slide_description { text-align: left; }
.penet-hero .slide_description h2 { color: #111; }
.penet-hero .slide_description_wrapper { padding-left: 48px; }
@media (max-width: 767px) {
  .penet-hero .slide_description_wrapper { padding-left: 18px; padding-right: 18px; }
  a.logo.top_logo img { height: 46px; }
  a.logo.top_logo .logo_tagline { font-size: 11px; }
}

/* v3 tweaks */

/* header logo area: allow full logo width without distortion */
.header_left_logo { min-width: 380px; }
a.logo.top_logo img { height: 54px; width: auto; max-width: none; }

/* hero title: 25% smaller vs template defaults, no indent */
.penet-hero .slide_description_wrapper { padding-left: 0 !important; padding-right: 0 !important; }
.penet-hero .slide_description { text-align: left; }
.penet-hero .slide_description h2 { color: #111; }

/* responsive sizes (template: 48/60/90px -> 36/45/67px) */
.penet-hero .slide_description h2 { font-size: 32px !important; }
@media (min-width: 768px)  { .penet-hero .slide_description h2 { font-size: 36px !important; } }
@media (min-width: 992px)  { .penet-hero .slide_description h2 { font-size: 45px !important; } }
@media (min-width: 1200px) { .penet-hero .slide_description h2 { font-size: 67px !important; } }

/* center the CTA button */
.penet-hero .slide_description .intro-layer:last-child { text-align: center; }
.penet-hero .slide_description .intro-layer:last-child a { display: inline-block; }

@media (max-width: 767px) {
  .penet-hero .slide_description_wrapper { padding-left: 18px !important; padding-right: 18px !important; }
}


/* penet patch m1_header_definitive (20260110) */

/* unify header height across all pages */
.page_header,
.page_header a.header-button{
  line-height: 80px !important;
}
.page_header .logo{
  height: 80px !important;
  line-height: 80px !important;
}
.page_header .logo img{
  max-height: 60px !important;
}
.page_header .sf-menu > li > a{
  line-height: 80px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* home only: header transparent over hero (index has intro_section directly before header) */
.intro_section + header.page_header.header_white{
  background-color: transparent !important;
  box-shadow: none !important;
}
.intro_section + header.page_header.header_white .sf-menu > li > a,
.intro_section + header.page_header.header_white a.logo,
.intro_section + header.page_header.header_white .logo_text{
  color: #ffffff !important;
}
.intro_section + header.page_header.header_white .sf-menu > li.active > a{
  color: #ffffff !important;
}
.intro_section + header.page_header.header_white .sf-menu > li > a:hover,
.intro_section + header.page_header.header_white .sf-menu > li > a:focus{
  color: #b21f00 !important;
}

/* when sticky (affix): back to normal white header + dark menu */
header.page_header.affix.header_white{
  background-color: #ffffff !important;
  box-shadow: 0px 1px 15px 0 rgba(0,0,0,0.07) !important;
}
header.page_header.affix.header_white .sf-menu > li > a{
  color: #323232 !important;
}


/* penet patch m1_home_transparent_by_body (20260110) */

/* startseite: oben transparent */
body.penet-home header.page_header.header_white:not(.affix){
  background-color: transparent !important;
  box-shadow: none !important;
}

/* startseite: menu + logo text weiß */
body.penet-home header.page_header.header_white:not(.affix) .sf-menu > li > a,
body.penet-home header.page_header.header_white:not(.affix) a.logo,
body.penet-home header.page_header.header_white:not(.affix) .logo_text{
  color: #ffffff !important;
}

/* kein invert/filter */
body.penet-home header.page_header.header_white:not(.affix) a.logo img{
  -webkit-filter: none !important;
  filter: none !important;
}


/* penet patch m1_home_transparent_force (20260110) */

/* startseite: wrapper + header transparent (top state) */
body.penet-home .page_header_wrapper,
body.penet-home .page_header_wrapper.affix-top-wrapper .page_header,
body.penet-home header.page_header.header_white:not(.affix){
  background-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* startseite: links sichtbar */
body.penet-home header.page_header.header_white:not(.affix) .sf-menu > li > a{
  color: #ffffff !important;
}

/* startseite: active NICHT rot, sondern weiß; hover rot */
body.penet-home header.page_header.header_white:not(.affix) .sf-menu > li.active > a{
  color: #ffffff !important;
}
body.penet-home header.page_header.header_white:not(.affix) .sf-menu > li > a:hover,
body.penet-home header.page_header.header_white:not(.affix) .sf-menu > li > a:focus{
  color: #b21f00 !important;
}

/* startseite: toggle/hamburger sichtbar */
body.penet-home header.page_header.header_white:not(.affix) .toggle_menu,
body.penet-home header.page_header.header_white:not(.affix) .toggle_menu span,
body.penet-home header.page_header.header_white:not(.affix) .toggle_menu span:before,
body.penet-home header.page_header.header_white:not(.affix) .toggle_menu span:after{
  background-color: #ffffff !important;
  color: #ffffff !important;
}


/* penet: hide old header claim (tagline) */
.logo_tagline{display:none !important; height:0 !important; margin:0 !important; padding:0 !important; line-height:0 !important;}

/* pp_penet_header_tweaks_v1 20260113_185541 */
/* 2) logo a little lower */
.page_header .header_logo,
.page_header .logo,
.top_logo {
  padding-top: 10px !important;
}

/* 3) menu hover color = logo red */
:root { --penet-logo-red: #b21f00; }

.mainmenu a:hover,
.mainmenu li.active > a,
.sf-menu > li > a:hover,
.sf-menu > li.active > a,
.sf-menu > li > a:focus {
  color: var(--penet-logo-red) !important;
}

/* 4) hero title 10% smaller */
.intro_section h1,
.intro_section h2,
.intro_section .intro_featured_word,
.intro_section .big,
.intro_section .hero-title {
  font-size: 0.9em !important;
}
/* end pp_penet_header_tweaks_v1 */

/* pp_penet_home_header_tune_v1 20260113_191554 */

/* menu hover + active -> logo red */
.mainmenu a:hover,
.mainmenu li.active > a,
.sf-menu li.active > a,
.sf-menu a:hover,
.sf-menu > li > a:hover {
  color: #b21f00 !important;
}

/* underline / border indicators (theme dependent) */
.sf-menu > li > a:before,
.sf-menu > li > a:after,
.mainmenu a:before,
.mainmenu a:after {
  background-color: #b21f00 !important;
  border-color: #b21f00 !important;
}

/* logo a bit lower (desktop) */
.page_header .logo,
.header_logo_center .logo,
.header_logo_left .logo {
  margin-top: 10px !important;
}

@media (max-width: 767px){
  .page_header .logo,
  .header_logo_center .logo,
  .header_logo_left .logo {
    margin-top: 6px !important;
  }
}

/* hero title smaller + much higher */
.penet_hero_title {
  font-size: 85% !important;
  line-height: 1.05 !important;
}

.penet_hero_title,
.penet_hero_title * {
  transform: translateY(-80px) !important;
}

/* intro under title */
.penet_hero_intro {
  margin-top: 18px !important;
  font-size: 18px !important;
  line-height: 1.35 !important;
  color: rgba(0,0,0,0.70) !important;
  transform: translateY(-80px) !important;
}

@media (max-width: 767px){
  .penet_hero_title,
  .penet_hero_title * { transform: translateY(-40px) !important; }
  .penet_hero_intro { transform: translateY(-40px) !important; font-size: 16px !important; }
}

/* penet patch 20260113_193107: hero sizing/alignment + menu hover color */
.penet_hero_title{
  font-size:0.72em !important;
  line-height:1.05 !important;
}
.penet_hero_intro{
  margin-top:18px !important;
}

/* left edge: hero title + intro align to container left (like header/logo inset) */
.intro_section .container{
  text-align:left !important;
  padding-left:15px !important;
  padding-right:15px !important;
}
.intro_section .penet_hero_title,
.intro_section .penet_hero_intro{
  margin-left:0 !important;
  margin-right:auto !important;
}

/* menu: do NOT force base color; only hover / active in logo red */
.sf-menu > li > a:hover,
.sf-menu > li.active > a,
.sf-menu > li.sfHover > a{
  color:#b21f00 !important;
}

/* penet fix: disable logo invert filter */
.intro_section + .page_header_wrapper .affix.header_white a.logo img{
  -webkit-filter: none !important;
  filter: none !important;
}

/* =========================================================
   penet patch: hero aligns to global left container edge
   + hero title ~25% smaller
   scope: home only
   ========================================================= */

/* 1) bring hero content back onto the same grid as the rest */
body.penet-home .intro_section .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body.penet-home .intro_section [class*="col-"]{
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* 2) hero title size -25% */
body.penet-home .intro_section h1{
  font-size: 0.75em !important;
  line-height: 1.05 !important;
}

/* (optional but usually right): remove extra left offsets if any */
body.penet-home .intro_section h1,
body.penet-home .intro_section p{
  margin-left: 0 !important;
}


/* =========================================================
   pp_penet_hero_align_v2 (20260114)
   goal: hero left edge aligns to site container (logo)
         hero title ~25% smaller
         remove breakpoint "jumping" (no translate transforms)
   ========================================================= */

body.penet-home .intro_section .penet_hero_title,
body.penet-home .intro_section .penet_hero_intro,
body.penet-home .penet-hero .slide_description,
body.penet-home .penet-hero .slide_description_wrapper{
  transform: none !important;
}

/* bring hero content back onto the same bootstrap grid */
body.penet-home .intro_section .row{
  margin-left: -15px !important;
  margin-right: -15px !important;
}
body.penet-home .intro_section [class*="col-"]{
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* align hero text block exactly like the rest of the site */
body.penet-home .penet-hero .slide_description{
  text-align: left !important;
}
body.penet-home .penet-hero .slide_description_wrapper{
  padding-left: 0 !important;   /* column padding does the job now */
  padding-right: 0 !important;
}

/* hero title: ~25% smaller, responsive but stable (no breakpoint jumps) */
body.penet-home .intro_section h1,
body.penet-home .penet-hero .slide_description h2,
body.penet-home .penet_hero_title{
  font-size: clamp(28px, 4vw, 52px) !important;
  line-height: 1.06 !important;
}

/* intro text stays aligned with title */
body.penet-home .penet_hero_intro,
body.penet-home .penet-hero .slide_description p{
  margin-left: 0 !important;
}


/* pp_penet_hero_mobile_contrast_v1 20260114 */
/* ziel: auf small screens kein "schwarz auf dunkel" + hamburger sichtbar */

@media (max-width: 991px){

  /* 1) hero overlay-fläche hell machen (template nutzt oft :before fürs overlay) */
  body.penet-home .intro_section .slide_description_wrapper:before{
    background-color: rgba(255,255,255,0.78) !important;
  }

  /* falls das template statt :before ein echtes bg auf wrapper setzt */
  body.penet-home .intro_section .slide_description_wrapper{
    background: rgba(255,255,255,0.78) !important;
  }

  /* 2) text bleibt dunkel und lesbar */
  body.penet-home .intro_section .slide_description h1,
  body.penet-home .intro_section .slide_description h2,
  body.penet-home .intro_section .slide_description p{
    color: #111 !important;
  }

  /* 3) hamburger (toggle) auf mobile dunkel, damit er auf hellen flächen sichtbar ist */
  body.penet-home header.page_header .toggle_menu span,
  body.penet-home header.page_header .toggle_menu span:before,
  body.penet-home header.page_header .toggle_menu span:after{
    background-color: #323232 !important;
  }
}


/* pp_penet_hero_mobile_v1 20260114
   goals:
   - remove side "mourning" bars on small widths
   - keep hero title/text inside the first (image) section
   - use light grey-blue overlay instead of dark block
*/
@media (max-width: 991px){

  /* 1) remove dark outer background / side bars */
  html, body { background: #cbd5d9 !important; } /* soft grey-blue like hands area */
  #box_wrapper { background: transparent !important; }

  /* full-bleed intro section */
  body.penet-home .intro_section .container,
  body.penet-home .intro_section .container-fluid{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 2) keep content over the image (no separate dark block below) */
  body.penet-home .intro_section .slide_description_wrapper{
    width: 100% !important;
    max-width: none !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;

    /* 3) light overlay instead of dark */
    background: rgba(203, 213, 217, 0.92) !important; /* matches #cbd5d9 */
    padding: 18px 18px 22px 18px !important;
  }

  /* kill template's dark overlay layer */
  body.penet-home .intro_section .slide_description_wrapper:before{
    display: none !important;
    content: none !important;
  }

  /* ensure text stays readable on light overlay */
  body.penet-home .intro_section .slide_description h2,
  body.penet-home .intro_section .slide_description p{
    color: #111 !important;
  }
}

/* pp_penet_fix_home_hero_minheight_v3 start */
/*
goal:
- fullscreen hero only on desktop-ish widths
- switch to content-first (no forced 100vh) at <= 991px
*/

/* desktop-ish: allow fullscreen hero */
@media (min-width: 992px) and (orientation: landscape) {
  .intro_section.page_mainslider { min-height: 100vh; }
  .intro_section.page_mainslider .flexslider { min-height: 100vh; }
  .intro_section.page_mainslider .flexslider .slides > li { min-height: 100vh; }
  .intro_section.page_mainslider .flexslider .slides > li img {
    min-height: 100vh;
    height: 100vh;
    width: 100%;
    object-fit: cover;
  }
}

/* <= 991px: reset forced fullscreen constraints (content-first) */
@media (max-width: 991px) {
  .intro_section.page_mainslider {
    min-height: auto !important;
    height: auto !important;
  }
  .intro_section.page_mainslider .flexslider {
    min-height: auto !important;
    height: auto !important;
  }
  .intro_section.page_mainslider .flexslider .slides > li {
    min-height: auto !important;
    height: auto !important;
  }
  .intro_section.page_mainslider .flexslider .slides > li img {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    width: 100% !important;
    object-fit: cover;
  }
}
/* pp_penet_fix_home_hero_minheight_v3 end */