/*
Theme Name: Zoodiak
Author: KGL - Web & Design
Version: 2024.06
*/

@font-face {
  font-family: "AllRoundGothicBook";
  src: url('inc/fonts/AllRoundGothicBook/font.woff2') format('woff2'), url('inc/fonts/AllRoundGothicBook/font.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: "AllRoundGothicDemi";
  src: url('inc/fonts/AllRoundGothicDemi/font.woff2') format('woff2'), url('inc/fonts/AllRoundGothicDemi/font.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: "AllRoundGothicMedium";
  src: url('inc/fonts/AllRoundGothicMedium/font.woff2') format('woff2'), url('inc/fonts/AllRoundGothicMedium/font.woff') format('woff');
  font-display: swap;
}


:root{
  font-size:20px;
  --color-prime:#000;
  --color-sec:rgb(246,241,239);
  --color-accent:rgb(160,110,54);
  --color-gray:#999;

  --font-book:AllRoundGothicBook,sans-serif;
  --font-medium:AllRoundGothicMedium,sans-serif;
  --font-demi:AllRoundGothicDemi,sans-serif;
}

@media (max-width:767px){
  :root{font-size:15px;}
}

body{
  font-family: var(--font-demi);
  font-weight:400;
  letter-spacing: 0.015em;
  color:var(--color-prime);
  background-color: var(--color-sec);
  overflow-anchor:none;
}

.wrapper{overflow: hidden;}

@media (min-width:768px){
  .wrapper{padding:0 2rem;}
}

.outline{outline:1px solid;}
.fh-row{min-height: 100vh;}

img{
  width:100%;
  max-width:100%;
  height:auto;
  transition: opacity .4s ease-in-out .4s;
}

.container{max-width:1440px;}

/*-----------*/

b,strong{ font-family: var(--font-demi); font-weight:400; }
.italic{font-style:italic;}
.book,.regular{ font-family: var(--font-book); font-weight:400;}
.medium{ font-family: var(--font-medium); font-weight:400; }
.demi,.semi,.bold,.fett{ font-family: var(--font-demi); font-weight:400; }

.smoothed {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {background-color:var(--color-accent); color:#fff;}
::-moz-selection {background-color:var(--color-accent); color:#fff;}


/*-----------*/

a, a:hover, a:focus{color:var(--color-prime);}

a:hover{
  text-decoration-color: var(--color-accent);
  text-underline-offset: .1em;
}

/*-----------*/

h1,h2,h3,h4,h5,h6{
  font-family: var(--font-demi);
  font-weight: 400;
}

h1{
  font-size:3rem;
  margin-bottom:1em;
}

h3{
  font-size:2.25rem;
  line-height:1.15;
  margin-bottom:1.5em;
}

h4{
  font-size:1.45rem;
  line-height:1.15;
  margin-bottom:.25em;
}

p{margin-bottom: 0;}
p + p{margin-top: 1em;}

.dz{
  font-size:1.15rem;
  line-height:1.25;
  color:var(--color-accent);
  text-decoration: underline;
  margin-bottom:1.75em;
}

.copy-text{
  font-size:1.2rem;
  font-family: var(--font-medium);
}

.quote{
  font-size:1.7rem;
  line-height:1.35;
  font-family: var(--font-book);
  hanging-punctuation: last;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.quote:has(+ .quote-src){margin-bottom: .5em;}

@media (min-width:768px) and (max-width:1024px){
  .quote{font-size:1.7rem;}
}

.quote::before{content:'„';}
.quote::after{content:'“';}

.quote-src{font-size:.85rem;}

.quote-img{
  margin-bottom:1.5rem;
  max-width:250px;
  object-fit: contain;
  object-position: top;
}

@media (max-width:575px){
  .quote-img{max-width:100%;}
}


/* --- Sticky Logo Bar --- */

.logo-sticky-bar{
  background:var(--color-sec);
  padding:1.2rem 0;
  position:fixed;
  width:100%;
  left:0;
  z-index:2;
  transition: translate .6s ease-in-out, opacity .6s ease-in-out, visibility .6s;
}

@media (min-width:768px){
  .logo-sticky-bar{ padding:1.2rem 2rem; }
}

.logo-sticky-bar:not(.active){
  translate:0 -100%;
  opacity: 0;
  visibility: hidden;
}

.logo-sticky{
  cursor: pointer;
  background-color: var(--color-prime);
  aspect-ratio:40/8.2;
  -webkit-mask:var(--logo) no-repeat center/contain;
  mask:var(--logo) no-repeat center/contain;
  --logo:url('inc/assets/zdk-logo-3.svg');
  transition: background-color .5s ease-in-out;
  max-width: 8rem;
}

@media (max-width:767px){
  .logo-sticky{ max-width: 10rem; }
}


.lang-switch{
  font-size:1.15rem;
  line-height: 1;
  translate:0 3px;
}

.lang-switch ul{
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.lang-switch li{position: relative;}

.lang-switch li:not(.wpml-ls-current-language) a{color:var(--color-accent);}
.lang-switch li.wpml-ls-current-language a:hover{text-decoration: none;}
.lang-switch li.wpml-ls-current-language a{pointer-events: none;}

.lang-switch li:last-child{padding-left:1.75ch;}
.lang-switch li:last-child::after{
  content:'|';
  position: absolute;
  top:0;
  left:0;
  padding:0 .5ch;
  color:var(--color-accent);
}

.logo-sticky-bar.active + #header .lang-switch{
  opacity:0;
}

/*--------*/

#header{ padding-top:2rem; }
@media (max-width:600px){ #header{ padding-top:1.5rem; } }

#header .row{position: relative;}

#header .lang-switch{
  position: absolute;
  top:-6px;
  right:15px;
  z-index: 1;
  transition: opacity .3s linear;
}

@media (max-width:600px){
  #header .lang-switch{
    top:auto;
    bottom:-3rem;
  }
  .page-template-imprint #header .lang-switch{ bottom:-4rem; }
}

.logo{
  cursor:pointer;
  background-color: var(--color-prime);
  aspect-ratio:52/9;
  width:100%;
  -webkit-mask:var(--logo) no-repeat center/contain;
  mask:var(--logo) no-repeat center/contain;
  --logo:url('inc/assets/zdk-logo-1.svg');
  transition: background-color .5s ease-in-out;
}

@media (max-width:600px){
  .logo{
    aspect-ratio:4;
    --logo:url('inc/assets/zdk-logo-2.svg');
  }
}


.intro-desc{
  margin:4rem 0 6rem 0;
}

/* Only if FP Intro has Image */
.intro-desc:has(img){ margin-bottom:4rem; }

@media (max-width:991px){
.intro-img{
  aspect-ratio:2.15;
  object-fit:cover;
  object-position:right;
}
}

.intro-desc h1{
  font-size:2rem;
  line-height: 1.25;
  max-width:42ch;
}

[lang="en-US"] .intro-desc h1{ max-width:47ch; }

#intro{
  padding-bottom:var(--pb);
  transition:padding-bottom .5s linear;
}


/* --- Akkordeon ---- */

.panel{
  --tl: .5s;
  --tt: linear;
}

.panel:last-of-type{
  border-bottom:1px solid;
}


/* Panel Head*/

.panel-head{
  padding:1rem 0;
  border-top:1px solid;
  cursor: pointer;
}

h2.panel-heading{
  font-size:2.25rem;
  line-height:1;
  text-transform: lowercase;
  margin-bottom:0;
  margin-block:0 !important;
  max-width: 30ch;
  transition: all var(--tl) ease-in-out;
  translate:0 -1px;
}

.panel.active h2.panel-heading{
  font-size:5rem;
}

@media (max-width:768px) {
  h2.panel-heading{
    font-size:2rem;
    width:calc(100% - 4rem);
  }
  .panel.active h2.panel-heading{font-size:3rem;}
}

.panel-icon{
  width:6rem;
  padding:0 0 0 2rem;
}

@media (max-width:768px) {
  .panel-icon{ width:4rem; }
}

.panel-icon span{
  display: block;
  position: relative;
}

.panel-icon span::before,
.panel-icon span::after{
  content:'';
  width:1.6rem;
  height:3px;
  background-color:var(--color-prime);
  position: absolute;
  top:1rem;
  left:50%;
  translate:-50% 0;
  transition: rotate var(--tl) ease-in-out var(--tl);
}

@media (max-width:768px) {
  .panel-icon span::before,
  .panel-icon span::after{ width:1.4rem;}
}

.panel-icon span::after{rotate:90deg;}

.panel.active .panel-icon span::after{
  rotate:135deg;
  transition-delay:calc(var(--tl) * .5);
}
.panel.active .panel-icon span::before{
  rotate:-135deg;
  transition-delay:calc(var(--tl) * .5);
}


/* Panel Content */

.panel-content{
  display: grid;
  grid-template-rows: 0fr;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  overflow: hidden;
  transition: grid-template-rows var(--tl) var(--tt);
}

.panel.active .panel-content{
  grid-template-rows: 1fr;
  overflow: visible;
}

.panel-content-inner{
  min-height:0;
  visibility: hidden;
  opacity: 0;
  transition: margin, visibility, opacity, transform;
  transition-duration: var(--tl);
  transition-timing-function: var(--tt);
  transition-delay: .2s;
}


.panel.active .panel-content-inner{
  margin:1.25rem 0 4rem 0;
  visibility: visible;
  opacity: 1;
  transition-delay: .4s;
}

.panel.spacer-top.active .panel-content-inner{
  margin-top:3rem;
}

.panel:not(.active) img{opacity:0;}


/* ------- Content Sections ---------- */

.gap-row{ gap:5rem 0; }
.gap-row-medium{ gap:3rem 0; }
.gap-row-narrow{ gap:2rem 0; }

@media (min-width:992px){
.content-left-inner{
  max-width:635px;
  padding-right:30px;
}
}

.content-right-quote{
  max-width:635px;
  margin-top: 5rem;
}

@media (min-width:576px) and (max-width:991px){
.content-right-quote{ max-width:100%;}
.quote-wrapper{ gap:0 2rem; }
}


/* --- Verlag ---- */

.verlag-img{
  margin-bottom:2.5rem;
}

@media (min-width:768px){
.verlag-main .content-left-inner{
  max-width: 100%;
  padding-right:0;
}
}

@media (min-width:768px){
.verlag-main .content-left h3{
  font-size:2.5rem;
  line-height:1.1;
}
}

@media (min-width:992px){
  .verlag-main .content-left h3{ max-width:20ch; }
  [lang="en-US"] .verlag-main .content-left h3{ max-width:16ch; }
}

.verlag-main .content-left h3{ margin-bottom:2rem; }

@media (min-width:992px){
.verlag-main .content-right .copy-text{ max-width: 46ch; }
}


/*--- Ansprechpartner --- */

  .cta-kontakt{
    margin-top:4rem;
    padding-top:4rem;
    position: relative;
  }

  .cta-kontakt::before{
    content:'';
    position: absolute;
    top:0;
    left:15px;
    right:15px;
    border-top:1px solid var(--color-accent);
  }

  .cta-kontakt-inner{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:0 40px;
  }

  @media (max-width:768px) {
  .cta-kontakt-inner{display:block;}
  }

  .cta-kontakt-inner h3{ max-width:22ch; }

@media (max-width:1023px) {
  .cta-kontakt-inner h3{
    margin-bottom: 1em;
    grid-column: span 2;
    max-width:32ch;
  }
  [lang="en-US"] .cta-kontakt-inner h3{ max-width:30ch; }
}

.cta-kontakt-inner img{ object-fit:cover; }

  @media (max-width:1023px) {
    .cta-kontakt-inner img{ aspect-ratio:1.5; }
  }

  @media (min-width:1024px) {
    .cta-kontakt-inner .contact-img{
      grid-row:span 2;
      grid-column:2/3;
    }
  }

  .cta-kontakt-info h4{
    font-size:1.75rem;
    margin-bottom:0;
    margin-top:.75em;
  }

  .cta-kontakt-info h4:not(:has(+ .role)){
    color:var(--color-accent);
  }

  .cta-kontakt-info .role{
    color:var(--color-accent);
    text-transform:uppercase;
    font-family: var(--font-medium);
    font-size:.85rem;
    margin-top:.25em;
  }

  .cta-kontakt-info .contact-data{
    font-family: var(--font-book);
    font-size:1.1rem;
    margin-top:.58em;
  }


/*--- Team ---- */

.team-item-row{ margin-bottom:3.5rem; }

.team-item-row picture{width:100%;}

.team-item-row img{
  object-fit:cover;
  display:block;
}

@media (min-width:992px){
  .team-item-row picture{ max-width:calc(100% - 4vw); }
  .team-item-row.flex-lg-row-reverse picture{ margin-left:auto; }
}

.team-item-row .cta-kontakt-info{ max-width:70ch; }

@media (min-width:992px){
  .team-item-row .cta-kontakt-info{
    max-width:44ch;
    margin-bottom:1.25rem;
  }

  [lang="en-US"] .team-item-row .cta-kontakt-info{max-width:45ch;}

  .team-item-row.flex-lg-row-reverse .cta-kontakt-info{
    margin-left:auto;
  }
}

.team-item-row .cta-kontakt-info h4{
  font-size:2rem;
  line-height:1;
  color:var(--color-accent);
  margin-bottom:.5em;
}

@media (min-width:992px){
  .team-item-row .cta-kontakt-info h4{
    margin-bottom:.7em;
    margin-top:1.5em;
  }
}

.team-quote{
  max-width:95ch;
  margin-top:.5rem;
}

/*--- Listen ---- */

ul, ol{
 list-style: none;
 margin:0;
 padding:0;
}

ol.step-list{counter-reset:item;}

@media (min-width:992px) {
.list-wrapper{
  max-width:500px;
  margin:0 auto;
}
.list-wrapper:has(ol){
  max-width:580px;
}
}


.step-list li{
  font-size:1.15rem;
  line-height:1.4;
  font-family: var(--font-medium);
  margin-bottom:1.5rem;
  padding-left:3.2rem;
  position: relative;
}

ol.step-list li{
  margin-bottom: 2.2rem;
  padding-left:3.7rem;
}

.step-list li:last-child{margin-bottom:0;}

ul.step-list li::before{
  content:'';
  position: absolute;
  top:-.15em;
  left:0;
  width:2rem;
  height:2rem;
  background-color:var(--color-accent);
  -webkit-mask:var(--icon) no-repeat center/cover;
  mask:var(--icon) no-repeat center/cover;
  --icon:url('inc/assets/icon-arr.svg');
}

ol.step-list li::before{
  content: counter(item) " ";
  counter-increment: item;
  text-align: center;
  line-height: 2.25rem;
  font-family: var(--font-demi);
  font-size:1.45rem;
  position: absolute;
  top:-.3em;
  left:0;
  width:2.5rem;
  height:2.5rem;
  color:var(--color-accent);
  border:3px solid;
  border-radius:50%;
}

ol.step-list li:not(:last-child)::after{
  content:'';
  position: absolute;
  left:1.05em;
  top:2rem;
  bottom:-1.9rem;
  width:3px;
  background-color: var(--color-accent);
}

.step-list li h4{
  margin-bottom: .35em;
}

.step-list li ul,
.step-list li ol{
  display: grid;
  gap:.35em 0;
}

.step-list li li{
  margin:0;
  padding:0 0 0 1.75ch;
}

.step-list li li::after{display: none;}
.step-list li li::before{
  content:'–';
  counter-increment: none;
  text-align: inherit;
  line-height: inherit;
  font-family: var(--font-book);
  font-size: inherit;
  top: 0;
  left: .25ch;
  width: auto;
  height: auto;
  color: inherit;
  border: none;
  border-radius: none;
}


@media (min-width:992px) {
 .list-wrapper:has(ol) .dz{ padding-left:3.7rem; }
}

/* ---- Dialog Modal (Referenzen) ---- */

#dialog-modal{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index: 10000;
  padding:15px 15px 60px 15px;
  overflow: scroll;
  -ms-scroll-chaining: none;
  overscroll-behavior: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(100vh);
  transition: opacity, visibility, transform;
  transition-duration: .5s;
  transition-timing-function: ease-in-out;
  transition-delay: .5s;
}

@media (max-width:575px){
  #dialog-modal{padding:0;}
}


body.modal-active #dialog-modal{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity, visibility, transform;
  transition-duration: .5s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
}

body.modal-active{overflow:hidden;}

.dialog-backdrop{
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index: 9999;
  background:rgba(0,0,0,0.8);
  opacity: 0;
  visibility: hidden;
  transition: opacity, visibility, transform;
  transition-duration: .5s;
  transition-timing-function: ease-in-out;
  transition-delay: .5s;
}

body.modal-active .dialog-backdrop{
  opacity: 1;
  visibility: visible;
  transition: opacity, visibility, transform;
  transition-duration: .5s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
}


.dialog-inner{
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width:1024px;
  min-height:50vh;
  padding:1rem 2rem 2rem 2rem;
  transform: scale(.85);
  opacity: 0;
  background-color: var(--color-sec);
  position: relative;
  transition: opacity .5s ease-in-out 0s, transform .5s ease-in-out 0s;
}

@media (max-width:767px){
  .dialog-inner{padding:1rem 1rem 2rem 1rem;}
}

body.modal-active .dialog-inner{
  transform: scale(1);
  opacity: 1;
  transition: opacity .5s ease-in-out 0.4s, transform .5s ease-in-out 0.4s;
}

/* Close Button */
.close-dialog{
  display: table;
  margin: 0 0 .5rem auto;
  cursor: pointer;
}

@media (min-width:768px){
.close-dialog{translate:1rem 0;}
}

.close-dialog span{
  position: relative;
  display: block;
  width:2rem;
  height:2rem;
}

.close-dialog span::before,
.close-dialog span::after{
  content:'';
  position: absolute;
  width:1.4rem;
  height:3px;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  background-color:var(--color-prime);
}

.close-dialog span::before{rotate:45deg;}
.close-dialog span::after{rotate:-45deg;}

/* Inner Content */

@media (max-width:767px) {
  #dialog-item > .row{ gap:1.5rem 0;}
  .dialog-content-video .dialog-head{margin-bottom:0;}
}

@media (min-width:768px){
  .dialog-content-image .dialog-img{max-width:95%;}
  .dialog-content-video .dialog-head{margin-top:1.5rem; margin-bottom:1.2rem;}
}


.dialog-content-image .dialog-head{margin-bottom:1.35rem;}

@media (min-width:768px){
  .dialog-content-image .dialog-head{margin-top:1.25rem;}
}

.dialog-head{line-height:1.05;}
.dialog-head .dz{margin-bottom:1rem;}
.dialog-head span{color:var(--color-accent); display:block;}

.dialog-desc{font-family: var(--font-book);}

.dialog-desc li{line-height: 1.3;}
.dialog-desc li:not(:last-child){margin-bottom:.75rem;}

@media (min-width:768px){
.dialog-desc{padding-bottom:15px;}
.dialog-content-image .dialog-desc{padding-bottom:2rem;}
.dialog-desc li{font-size:.9rem;}
}

.dialog-desc li > a{
  font-family: var(--font-demi);
  position: relative;
  padding-left: 1.25em;
  margin-top: 1.25em;
  display: table;
}

.dialog-desc li > div + a{
  font-family: var(--font-medium);
  margin-top:0;
}

.dialog-desc li:not(:has(div)):has(a) + li a{
  margin-top:0;
}


@media(min-width:600px){
  .dialog-desc li > a{padding-left: 1.1em;}
}

.dialog-desc li > a::before{
  content:'\25BA';
  font-family: arial,sans-serif;
  color:var(--color-accent);
  position: absolute;
  top:1px;
  left:0;
}

@media(min-width:600px){
  .dialog-desc li > a::before{
    font-size: .8em;
    top:3px;
  }
}


.embed-container{
  position: relative;
  aspect-ratio:16/9;
  overflow: hidden;
  max-width: 100%;
  height: auto;
}

.embed-container iframe, .embed-container object, .embed-container embed{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* -- Dialog Navigation ---*/

.dialog-nav-wrap{ margin-top:3rem; }

@media (min-width:768px){
  .dialog-nav-wrap{
    opacity: 0;
    visibility: hidden;
    height:0;
    margin-top:calc(1.5rem - 25px);
  }
}

.dialog-nav{
  position: relative;
  cursor: pointer;
  width:2.5rem;
  height:2.5rem;
  background-color: var(--color-prime);
  -webkit-mask:var(--_icon) no-repeat center/contain;
  mask:var(--_icon) no-repeat center/contain;
  --_icon: url('inc/assets/icon-arr.svg');
  transition: background-color .2s linear;
}

.dialog-nav-prev{rotate:180deg;}

.dialog-nav.inactive{background-color:var(--color-gray);}

@media (min-width:769px){
.dialog-nav:not(.inactive):hover{background-color:var(--color-accent);}
}

.dialog-nav-wrap-xl .dialog-nav-prev{ margin-right:30px;}


#dialog-preloader{
  background-color: rgba(255,255,255,.7);
  background-image:url('./inc/assets/preloader.gif');
  background-repeat:no-repeat;
  background-position: center;
  background-size: 3rem;
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition:all .35s ease-in-out;
}

#dialog-preloader.active{
  opacity:1;
  visibility: visible;
}


#dialog-preloader.active + #dialog-item{
  scale:.9 .9;
  opacity: 0;
  transition-delay: 0s;
}

#dialog-item{
  transition: all .4s ease-in-out ;
  transition-delay: 0.1s;
}


/* ---- Slick Slider ---- */

.ref-slider-col{ margin-bottom:3rem; }
.ref-slider-col:last-child { margin-bottom:1rem; }

@media (max-width:767px){
  .ref-slider-col{
    padding-right:0;
    margin-bottom:4rem;
  }
}

.ref-slider-col h3{
  font-size:2.75rem;
  margin:0 0 1.5rem 0;
}

.ref-slider img{
  width: 100%;
  aspect-ratio:16/9;
  object-fit:cover;
  transition: scale .3s ease-in-out;
  font-size:.7rem;
}

.ref-slider-h img{
  aspect-ratio:2/3;
}

@media (max-width:575px){
  .ref-slider-q img{aspect-ratio:1.25;}
}

.slick-slide > div{margin-right:1rem; overflow:hidden;}
@media (max-width:767px){.slick-slide > div{margin-right:10px;}}


.ref-slider .slick-slide{opacity:1; transition: opacity .4s ease-in-out;}
.ref-slider .slick-active + .slick-slide:not(.slick-active){opacity:.5;}


.ref-slider .slick-active{cursor: pointer;}

@media (min-width:768px){
  .ref-slider .slick-active:hover img{scale:1.035;}
}

.ref-slider-q div.slick-list{padding-right:28%;}
.ref-slider-h div.slick-list{padding-right:10.5%;}

@media (max-width:767px){
  .ref-slider-q div.slick-list{padding-right:14%;}
}

@media (max-width:991px){
  .ref-slider-h div.slick-list{padding-right:14%;}
}

.slider-nav{
  margin:1.25rem 0 0 0;
  gap:1rem;
}

@media (max-width:767px){
  .slider-nav{margin:1.25rem 15px 0 0;}
  .slider-nav > * {width:100%;}
}

.slider-arrows{gap:1.25rem;}
@media (max-width:767px){.slider-arrows{gap:2rem;}}

.slick-arrow{
  font-size:0;
  line-height:0;
  color: transparent;
  border: none;
  outline: none;
  width:var(--_size);
  height:var(--_size);
  --_size:2.25rem;
  cursor: pointer;
  background-color: var(--color-prime);
  -webkit-mask:var(--_icon) no-repeat center/contain;
  mask:var(--_icon) no-repeat center/contain;
  --_icon: url('inc/assets/icon-arr.svg');
  transition: background-color .2s linear;
}

@media (max-width:767px){.slick-arrow{--_size:3rem;}}

.slick-prev{rotate:180deg;}

.slick-arrow.slick-disabled{background-color: var(--color-gray);}

@media (min-width:769px){
.slick-arrow:hover{background-color:var(--color-accent);}
}


/* --- Logo Wall ---- */

.referenzen-kunden{
  margin-top:.5rem;
  margin-bottom:2.5rem;
}

.referenzen-kunden h3{
  font-size:2.75rem;
  margin-bottom: 1rem;
}

.referenzen-kunden .copy-text{
  max-width:54ch;
  margin-bottom:2rem;
}


.logo-wall{
  display:grid;
  grid-template-columns:repeat(var(--columns,8),1fr);
  gap:.5rem;
  --columns:8;
}


@media (max-width:991px){
.logo-wall{ --columns:5; }
.logo-wall div:nth-child(n+16){display:none;}
}

@media (max-width:500px){
.logo-wall{ --columns:3; }
}


.logo-wall > div{
  outline: 1px solid var(--color-gray);
  padding:.5rem;
  background-color: var(--color-sec);
  display: grid;
}

.logo-wall img{
  filter:grayscale(1);
  width:100%;
  aspect-ratio:1.5;
  object-fit:contain;
  max-width: 140px;
  margin:auto;
  display: block;
  mix-blend-mode: multiply;
  transform: translateZ(0);
}



/* --- Gutachten ----- */


@media (min-width:992px){

.gutachten-img{
  max-width:660px;
  padding-right:30px;
}

.gutachten-heading{
  max-width:53ch;
  padding-top:1rem;
}

[lang="en-US"] .gutachten-heading{ max-width:49ch; }

}

@media (min-width:1240px){
  .gutachten-img img{
    aspect-ratio:1.25;
    object-fit:cover;
    object-position: top;
  }
}


.gutachten-heading h3{ margin-bottom:1.25em; }

.gutachten-heading .copy-text{max-width:35ch;}

.gutachten-heading a{
  text-decoration: underline;
  text-decoration-color: var(--color-accent);
  text-underline-offset: .1em;
}

.panel-gutachten .row + .row{ margin-top:3.5rem; }

.gutachten-quote{ max-width:80ch; }
[lang="en-US"] .gutachten-quote{ max-width:84ch; }

/* --- SYNC ----- */

.content-sync-inner h3{
  margin-bottom: .75em;
  max-width:38ch;
}

[lang="en-US"] .content-sync-inner h3{max-width:36ch;}

.content-sync-inner .copy-text{ max-width:66ch; }
[lang="en-US"] .content-sync-inner .copy-text{ max-width:54ch; }

/* --- Media Maonitoring / Service ----- */

.content-service-inner h3{ margin-bottom:1em; }

@media (min-width:992px){
[lang="en-US"] .content-service-inner h3{ max-width: 23ch; }
.content-service-inner .copy-text{ max-width: 44ch; }
}

.content-img{
  aspect-ratio:1.5;
  object-fit: cover;
  display: block;
  margin-top: 2rem;
}

@media (min-width:992px) {
  .list-service li div{ max-width:35ch; }
}

/*--- Kontakt ----*/

.kontakt-heading{ max-width:28ch; }
[lang="en-US"] .kontakt-heading{ max-width:35ch; }

.kontakt-left p{
  font-family: var(--font-book);
  font-size:1.1rem;
}

@media (min-width:992px){
  .kontakt-right{ max-width:650px; }
}

@media (min-width:576px) and (max-width:991px){
  .kontakt-left{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    gap:0 4rem;
  }
  .kontakt-left p + p{margin-top:0;}
}

/* ---- Contact Form 7 ------- */

.cf-row{gap:.5rem 0;}

.cf-row > *,
.cf-row input,.cf-row textarea{
  width:100%;
  display: block;
}

.cf-row input::placeholder,.cf-row textarea::placeholder{
  color:var(--color-prime);
  opacity:.6;
}

.cf-row input,.cf-row textarea{
  border-width: 0 0 2px 0;
  border-style: solid;
  border-color: var(--color-sec);
  background-color: #fff;
  border-radius: 10px;
  padding:1em 1.25em .9em 1.25em;
  font-size:1rem;
  font-family: var(--font-book);
  caret-color: var(--color-accent);
  transition: all .3s ease-in-out;
}

.cf-row input:not(.btn):focus,.cf-row input:not(.btn):focus-visible,
.cf-row textarea:focus,.cf-row textarea:focus-visible{
  outline:none;
  border-color:var(--color-accent);
  border-radius:10px 10px 0 0;
}

.cf-row textarea{height:300px;}

.cf-row input.btn{
  border:none;
  display: block;
  padding:1em 1.25em .9em 1.25em;
  margin-top:.5em;
  background-color: var(--color-prime);
  color:#fff;
  font-family: var(--font-medium);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (min-width:768px){
.cf-row input.btn:hover{
  background-color: var(--color-accent);
}
}


/* Validation */
.cf-row input.wpcf7-not-valid,
.cf-row textarea.wpcf7-not-valid{
  border-color:var(--color-accent);
  border-style: dotted;
  border-radius:10px 10px 0 0;
}

.wpcf7-not-valid-tip{
  font-family: var(--font-book);
  color:var(--color-accent) !important;
  font-size:.75em !important;
  padding:.25em 0 .25em 3px;
}

.wpcf7 form .wpcf7-response-output{
  font-size:.9rem;
  line-height: 1.25;
  font-family: var(--font-medium);
  border-color: var(--color-accent) !important;
  border-style: dotted !important;
  border-radius: 10px;
  padding: 1em 1.25em !important;
  margin:0 0 2em 0 !important;
}

/* Spinner */
.wpcf7-spinner{
  margin:.2em auto !important;
  background-color:var(--color-accent) !important;
  opacity: 1 !important;
}

form.invalid .wpcf7-spinner{ height:0 !important; }


/* Footnote */
.cf-note{ padding-left:3px; }

.cf-note span{
  font-family: var(--font-medium);
  font-size:.7rem;
  line-height: 1.2;
  display: block;
  max-width:54ch;
}

.cf-note span + span{  margin-top:.75em; }

.cf-note a{
  text-decoration: underline;
  text-underline-offset:.1em;
}
.cf-note a:hover{ color:var(--color-accent); }


/* --- Impressum --- */

.page-template-imprint #intro{ padding:2.5rem 0; }

.imprint-content p{
  font-family: var(--font-book);
  max-width:64ch;
}

.dse-content .imprint-left p{max-width:40ch;}

.imprint-left h4{margin-bottom:1em;}
.imprint-left hr{
  max-width:20%;
  background-color: var(--color-gray);
  margin:2rem 0;
}

.imprint-right h4{margin-bottom:.35em; max-width: 36ch;}
.imprint-right p{font-size:.95rem;}
.imprint-right p:not(:last-child){margin-bottom:1.4rem;}
.imprint-right p:not(:last-child):has(+ h4){margin-bottom:1.75rem;}

.imprint-right a{font-family: var(--font-medium);}

.imprint-right ul{
  margin-bottom:1.45rem;
  list-style: disc;
  padding-left:1.5rem;
  max-width:64ch;
  font-size:.95rem;
}
.imprint-right ul:has(+ h4){margin-bottom:1.75rem;}

.imprint-right li{font-family: var(--font-book);}
.imprint-right li:not(:last-child){margin-bottom:.55em}
.imprint-right li::marker{color:var(--color-accent);}

/* ---- Footer ---- */

footer{
  margin-top:15rem;
  margin-bottom:1rem;
}

footer .row{ gap:15px 0; }

footer ul{
 gap:1em 1.5em;
 display: -webkit-box;
 display: -moz-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}

@media (min-width:768px){
  footer ul{
  -ms-flex-pack: end!important;
  justify-content: flex-end!important;
  }
}