@charset "UTF-8";
/*
@include max($tablet) {
	height: 60px;
}
*/
/*
Beispiel:
@include default_text_specs(
    $css-variable-prepend: "kc-teaser-title",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include default_h1_specs(
    $css-variable-prepend: "",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include default_h2_specs(
    $css-variable-prepend: "",
    $font-weight: 700,
    $line-height: 1,
    $text-align: "center"
);
*/
/*
Beispiel:
@include css_variable_prepend(
    $property: "font-size",
    $prepend-string: 'kc-teaser-title',
    $default-value: 20px
);
*/
/*
@extend %transition;
*/
/*
@extend %transition-timing;
*/
/* ================================================================
   ACCORDION (FAQ-Look)
   Schlankes List-Layout: keine umlaufenden Borders, nur eine
   feine Trennlinie zwischen den Items, Plus-Icon rechts, das
   beim Öffnen zum X rotiert.

   Alle Werte über die im Parent vorhandenen CSS-Variablen
   gesetzt — keine Property-Overrides.
================================================================ */
body .accordion-container,
html .accordion-container {
  --accordion-width: 740px;
  margin-left: auto;
  margin-right: auto;
}
body .accordion,
html .accordion {
  border-bottom: 1px solid var(--grey-lightest);
  --accordion-title-padding: 22px 0;
  --accordion-title-border: none;
  --accordion-title-inner-font-family: var(--secondary-font);
  --accordion-title-inner-font-size: 16px;
  --accordion-title-inner-font-weight: 600;
  --accordion-title-inner-color: var(--primary-color);
  --accordion-title-inner-line-height: 1.4;
  --accordion-title-after-width: 28px;
  --accordion-title-after-height: 28px;
  --accordion-title-after-right: 0;
  --accordion-title-after-background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b365d' stroke-width='2.5' stroke-linecap='round'><line x1='12' y1='5' x2='12' y2='19'/><line x1='5' y1='12' x2='19' y2='12'/></svg>");
  --accordion-content-padding: 0 0 22px;
  --accordion-content-border: none;
}
body .accordion .accordion-title-container,
html .accordion .accordion-title-container {
  transition: color 0.2s ease;
}
body .accordion .accordion-title-container:after,
html .accordion .accordion-title-container:after {
  background-color: rgba(27, 54, 93, 0.06);
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transition: transform 0.3s ease;
}
body .accordion .accordion-title-container:hover,
html .accordion .accordion-title-container:hover {
  --accordion-title-inner-color: var(--primary-color-light);
}
body .accordion.open .accordion-title-container,
html .accordion.open .accordion-title-container {
  --accordion-title-inner-color: var(--primary-color-light);
}
body .accordion.open .accordion-title-container:after,
html .accordion.open .accordion-title-container:after {
  transform: translateY(-50%) rotate(45deg);
}
body .accordion .accordion-content,
html .accordion .accordion-content {
  --p-font-size: 14px;
  --p-line-height: 1.7;
  --p-color: var(--text-color);
}
body .accordion .accordion-content > *,
html .accordion .accordion-content > * {
  --block-default-padding-left: 0;
  --block-default-padding-right: 0;
  --paragraph-padding-left: 0;
  --paragraph-padding-right: 0;
}