@charset "UTF-8";
/*
 Theme Name:   Henning? Kenn ich.
 Description:  Child Theme for CDU Stolberg
 Author:       POWER+RADACH werbeagentur gmbh
 Author URI:   https://www.power-radach.de/
 Template:     pr-master-theme
 Version:      1.0
*/
html,
body {
  --global-padding: 30px;
  --global-padding-vertical: 70px;
  --global-padding-top: var(--global-padding-vertical);
  --global-padding-bottom: var(--global-padding-vertical);
  --content-max-width: 1380px;
  --textcolor: #000;
  --text-color: #000;
  --primary-font: var(--wp--custom--primary-font);
  --secondary-font: var(--wp--custom--secondary-font);
  --primary-color: var(--wp--custom--primary-color);
  --primary-color-dark: var(--wp--custom--primary-dark);
  --primary-color-light: var(--wp--custom--primary-light);
  --secondary-color: var(--wp--custom--secondary-color);
  --secondary-color-dark: var(--wp--custom--secondary-dark);
  --grey-light: var(--wp--custom--grey-light);
  /* Fix für falsche Wide-Width aus Global Styles */
}
html .force-white-color .has-secondary-color,
body .force-white-color .has-secondary-color {
  --force-white-color: var(--secondary-color) !important;
}
@media (max-width: 580px) {
  :root {
    --content-width: calc(100vw - 60px);
  }
}
/*
@include breakpoint(tablet) {
}
*/
@media (max-width: 580px) {
  html,
  body {
    --global-padding: 20px;
  }
}

/*
@extend %paleri;
*/
/*
@extend %transition;
*/
/*
@extend %button;
*/
html,
body {
  --p-margin-bottom: 30px;
  --h2-margin-bottom: 0px;
  --h3-margin-bottom: 30px;
}
html .heading-outer-wrapper.text-align-left,
body .heading-outer-wrapper.text-align-left {
  margin-left: 0;
}
html h2, html h3,
body h2,
body h3 {
  display: inline-block !important;
  padding: 5px 20px 10px 10px !important;
}
html p,
html h1, html h2, html h3, html h4, html h5, html h6,
body p,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  -webkit-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
  word-wrap: break-word;
}

html,
body {
  --columns-gap: 50px !important;
  --columns-phablet-breakpoint: 768px;
  --columns-mobile-breakpoint: 768px;
}
html .column-outer-wrapper.vertical-center,
body .column-outer-wrapper.vertical-center {
  display: flex;
  align-items: center;
}
html .column-outer-wrapper.vertical-bottom,
body .column-outer-wrapper.vertical-bottom {
  display: flex;
  align-items: flex-end;
}
@media (max-width: 768px) {
  html .columns-outer-wrapper > .inner-wrapper > .wp-block-columns.is-not-stacked-on-mobile,
  body .columns-outer-wrapper > .inner-wrapper > .wp-block-columns.is-not-stacked-on-mobile {
    flex-wrap: wrap !important;
  }
  html .column-outer-wrapper.outer-wrapper,
  body .column-outer-wrapper.outer-wrapper {
    width: 100% !important;
  }
}

html .wp-block-cover,
body .wp-block-cover {
  padding: 0;
  padding-top: var(--global-padding-top);
  padding-bottom: var(--global-padding-bottom);
}
html .wp-block-cover:has(h1),
body .wp-block-cover:has(h1) {
  --global-padding-top: 120px;
}
@media (max-width: 1480px) and (min-width: 1281px) {
  html .wp-block-cover.hero,
  body .wp-block-cover.hero {
    --global-padding-top: 160px;
  }
}
@media (max-width: 1281px) and (min-width: 580px) {
  html .wp-block-cover.hero,
  body .wp-block-cover.hero {
    --global-padding-top: 200px;
  }
}
@media (max-width: 580px) {
  html .wp-block-cover.hero,
  body .wp-block-cover.hero {
    --global-padding-top: 116px ;
  }
}

html,
body {
  --arrow-color: #fff;
  --tileswrapper-dot-width: 18px;
  --tileswrapper-dot-height: 18px;
  --tileswrapper-dot-active-background: #fff;
  /* Hide carousel until fully initialized */
  /* Keep the stage-outer contained */
}
html .owl-prev.owl-prev span,
body .owl-prev.owl-prev span {
  transform: rotate(136deg);
}
html .owl-prev.owl-prev span,
html .owl-next.owl-next span,
body .owl-prev.owl-prev span,
body .owl-next.owl-next span {
  width: 25px;
  height: 25px;
}
html .video-play-button img,
body .video-play-button img {
  width: 64px;
  /* or whatever size you need */
  height: 64px;
  transition: opacity 0.3s ease;
}
html .video-play-button:hover img,
body .video-play-button:hover img {
  opacity: 0.8;
}
html .owl-carousel,
body .owl-carousel {
  transition: opacity 0.3s ease;
  overflow: visible !important;
  /* Changed from hidden to visible */
  position: relative;
  /* Add this */
  padding-bottom: 40px;
  /* Add space for dots */
}
html .owl-carousel .owl-stage-outer,
body .owl-carousel .owl-stage-outer {
  overflow: hidden;
  /* Ensure no overflow */
}
html .owl-carousel .owl-item,
body .owl-carousel .owl-item {
  transition: opacity 0.3s ease;
  /* Only transition opacity */
  opacity: 0;
  /* Start hidden */
}
html .owl-carousel .owl-item.active,
body .owl-carousel .owl-item.active {
  opacity: 1;
  /* Show only active */
}
html .owl-carousel .owl-stage,
body .owl-carousel .owl-stage {
  transition: all 0.75s ease !important;
}
html .owl-carousel.owl-drag .owl-item,
body .owl-carousel.owl-drag .owl-item {
  touch-action: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
}
html .owl-carousel:not(.owl-loaded),
body .owl-carousel:not(.owl-loaded) {
  opacity: 0;
  visibility: hidden;
  /* Add this */
}
html .owl-carousel figure,
body .owl-carousel figure {
  margin: 0;
  /* Remove default margin */
  padding: 0;
  /* Remove default padding */
  width: 100%;
  height: 100%;
}
@media (max-width: 768px) {
  html,
  body {
    /* Update dots positioning */
  }
  html .tileswrapper-outer-wrapper .tileswrapper-inner-wrapper .tileswrapper.show-as-carousel.show-arrows,
  body .tileswrapper-outer-wrapper .tileswrapper-inner-wrapper .tileswrapper.show-as-carousel.show-arrows {
    padding: 0;
  }
  html .owl-nav,
  body .owl-nav {
    display: none !important;
  }
  html .owl-dots,
  body .owl-dots {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    position: absolute !important;
    bottom: -40px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 2 !important;
  }
  html .owl-dot,
  body .owl-dot {
    display: inline-block !important;
    margin: 0 5px !important;
    position: relative !important;
    z-index: 3 !important;
  }
  html button.owl-dot span,
  body button.owl-dot span {
    display: none !important;
    visibility: hidden !important;
  }
}
html .owl-carousel .owl-stage-outer,
body .owl-carousel .owl-stage-outer {
  overflow: hidden;
  position: relative;
}

html .wp-block-group.is-layout-grid,
body .wp-block-group.is-layout-grid {
  --p-margin-bottom: 0px;
  --image-noalignment-margin-top: 0;
  --image-noalignment-margin-right: 0;
  --image-noalignment-margin-bottom: 1em;
  --image-noalignment-margin-left: 0;
}
@media (max-width: 980px) {
  html .wp-block-group.is-layout-grid,
  body .wp-block-group.is-layout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  html .wp-block-group.is-layout-grid,
  body .wp-block-group.is-layout-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

html .wp-block-media-text > .wp-block-media-text__content,
body .wp-block-media-text > .wp-block-media-text__content {
  padding: 0 var(--global-padding);
}
html .wp-block-media-text__media,
body .wp-block-media-text__media {
  background-repeat: no-repeat;
  background-size: contain !important;
}
@media (min-width: 980px) and (max-width: 1480px) {
  html .wp-block-media-text__media,
  body .wp-block-media-text__media {
    background-size: cover !important;
    max-height: 85%;
  }
}
@media (max-width: 980px) {
  html .wp-block-media-text,
  body .wp-block-media-text {
    display: flex;
    flex-direction: column-reverse;
  }
  html .wp-block-media-text__media,
  body .wp-block-media-text__media {
    height: 88vh !important;
    width: 100%;
    background-size: cover !important;
  }
}
@media (max-width: 580px) {
  html .wp-block-media-text__media,
  body .wp-block-media-text__media {
    height: 65vh !important;
  }
}
@media (min-width: 1600px) {
  html .wp-block-media-text.martin .wp-block-media-text__media img,
  body .wp-block-media-text.martin .wp-block-media-text__media img {
    -o-object-fit: contain;
       object-fit: contain;
  }
}

body {
  --streifen-width: 80px;
  padding-left: var(--streifen-width);
  background: var(--primary-color);
}
@media (max-width: 1025px) {
  body {
    --streifen-width: 60px;
  }
}
@media (max-width: 580px) {
  body {
    --streifen-width: 40px;
  }
}
@media (max-width: 480px) {
  body {
    --streifen-width: 20px;
  }
}
body .streifen {
  position: fixed;
  left: 0;
}
body .site-header {
  position: fixed;
  z-index: 2;
  width: clamp(164px, 26%, 320px);
  top: clamp(10px, 2vw, 60px);
  left: 0;
}
@media (max-width: 580px) {
  body .site-header {
    position: absolute;
  }
}
body .site-header img {
  -webkit-filter: drop-shadow(9px 6px 46px rgba(0, 0, 0, 0.4509803922));
          filter: drop-shadow(9px 6px 46px rgba(0, 0, 0, 0.4509803922));
}
body .site-branding a,
body .custom-logo {
  display: block;
  will-change: width, height;
}
body .site-branding a img,
body .custom-logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

footer {
  background-color: var(--grey-light);
  padding: var(--global-padding);
  position: relative;
}
footer .footer-navigation .footer-menu {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (max-width: 768px) {
  footer .footer-navigation .footer-menu {
    flex-direction: column;
    gap: 1rem;
  }
}
footer .footer-navigation .footer-menu li:not(:last-child) {
  margin-right: 2rem;
}
@media (max-width: 980px) {
  footer .footer-navigation .footer-menu li:not(:last-child) {
    margin-right: 0rem;
  }
}
footer .footer-navigation .footer-menu li a {
  color: #707070;
  text-decoration: none;
  padding: 0.5rem 1rem;
}
@media (max-width: 980px) {
  footer .footer-navigation .footer-menu li a {
    padding: 0.5rem 0.5rem;
  }
}
footer .footer-navigation .footer-menu li a:hover {
  color: #444444;
}