@import url("https://use.typekit.net/fjg0pao.css");
:root {
  /* Font */
  --serif: "source-serif-4", serif;
  --copy-size: 20px;
  --sans-serif: "source-sans-3", sans-serif;
  --light: 300;
  --regular: 400;
  --medium: 500;
  --bold: 600;
  /* Colors */
  --faz-grey: #E8EDEE;
  --faz-darkblue: #110A35;
  --faz-darkblue-50: rgba(17, 10, 53, 0.5);
  --mg-dark: #212529;
  --mg-dark-20: rgba(33, 37, 41, 0.2);
  --mg-dark-50: rgba(33, 37, 41, 0.5);
  --mg-dark-80: rgba(33, 37, 41, 0.8);
  --mg-dark-80-permanent: rgba(33, 37, 41, 0.8);
  --white: #ffffff;
  --white-20: rgba(255, 255, 255, 0.2);
  --white-50: rgba(255, 255, 255, 0.5);
  --white-80: rgba(255, 255, 255, 0.8);
  /* Video */
  --black: #212529;
  --grey-200: #555555;
  --grey-300: #717171;
  --grey-400: #8e8e8e;
  --grey-500: #aaaaaa;
  --grey-600: #c6c6c6;
  /* Trenner, Outlines */
  --grey-700: #e3e3e3;
  /* Anzeigen */
  --grey-900:#f7f7f7;
  --topic-color-01: #E7F3EE;
  --topic-color-02: #FBF2E9;
  --topic-color-03: #EBEBE5;
  --topic-color-04: #E7EFF5;
  --mg-chart-negativ: #c60000;
  --faz-error: #C56207;
  /* Colors Permanent */
  --mg-chart-positiv-permanent: #569824;
  --mg-red-permanent: #C60000;
  --faz-stoerer-permanent: #967D28;
  --faz-grey-permanent: #E8EDEE;
  --faz-grey-permanent-50: rgba(232, 237, 238, 0.5);
  --mg-dark-permanent: #212529;
  --mg-dark-permanent-50: rgba(33, 37, 4, 0.5);
  --white-permanent: #ffffff;
  --faz-darkblue-permanent: #110A35;
  --faz-darkblue-permanent-50: rgba(17, 10, 53, 0.5);
  --space: 16px;
  --space-2: 20px;
  --asv: 111px;
  --swiper-navigation-color: var(--mg-dark);
  --swiper-pagination-color: var(--mg-dark);
  font-size: 100% !important;
}

/* Font */
/* Reset */
body .doc-container {
  font-family: SourceSansVariable, SourceSans, Arial, Helvetica, sans-serif;
}
body .doc-container .doc-content {
  padding-bottom: 0 !important;
}
body .doc-container .footer-asv-disclaimer {
  background: var(--faz-grey);
  padding: 20px 40px;
}

.stage, .format, .background {
  color: var(--mg-dark);
  background: var(--white);
}

.format h1, .stage h1 {
  font-weight: var(--regular);
}
.format h2, .format h3, .format h4, .format h5, .format h6, .stage h2, .stage h3, .stage h4, .stage h5, .stage h6 {
  margin-bottom: var(--space-2);
  font-weight: var(--bold);
  font-family: var(--sans-serif);
}
.format h2, .stage h2 {
  font-size: 22px;
}
.format h3, .stage h3 {
  font-size: 19px;
}
.format h4, .format h5, .format h6, .stage h4, .stage h5, .stage h6 {
  font-size: 17px;
}
.format hr, .stage hr {
  background: var(--grey-700);
  height: 3px;
  width: 50px;
}
.format p, .stage p {
  line-height: 160%;
}

.progress-container {
  top: 58px;
}
.progress-container .progress-bar {
  background: var(--faz-darkblue);
}

/* Images */
.format figure .image-source, .stage figure .image-source {
  background: var(--mg-dark-80-permanent);
  color: var(--white-permanent);
  font-family: var(--sans-serif);
}
.format figure .image-source.dark, .stage figure .image-source.dark {
  background: var(--mg-dark-80-permanent);
  color: var(--white-permanent);
}
.format figure .image-source.light, .stage figure .image-source.light {
  background: var(--white-permanent);
  color: var(--mg-dark-80-permanent);
}
.format figure figcaption, .stage figure figcaption {
  font-size: 14px;
  margin: 0.5rem 0;
  font-family: var(--sans-serif);
  line-height: 140%;
}

/* Content Stage */
.stage {
  /* Teaser */
}
.stage > main {
  max-width: 920px;
  margin: calc(var(--space) * 4) calc(var(--space) * 2);
  gap: calc(var(--space) * 4);
}
.stage > main .intro {
  max-width: 750px;
}
.stage > main .intro h1 {
  font-size: 46px;
  font-weight: var(--regular);
  margin-bottom: calc(var(--space) * 2);
}

.teaser article {
  font-size: 14px;
  line-height: 19.6px;
  font-weight: var(--light);
}
.teaser article h2 {
  font-family: var(--serif);
  font-weight: var(--medium);
  margin-bottom: 10px;
  line-height: 1.2;
}

.teaser-1 article {
  padding: 15px 80px;
}
.teaser-1 article h2 {
  font-size: 32px;
}

.teaser-2, .teaser-3 {
  gap: calc(var(--space) * 2);
}
.teaser-2 article, .teaser-3 article {
  padding: 15px 0;
}
.teaser-2 article h2, .teaser-3 article h2 {
  font-size: 22px;
}

.teaser-image-right figure, .teaser-image-left figure {
  width: 60%;
}
.teaser-image-right article, .teaser-image-left article {
  width: 40%;
  padding: 40px;
  text-align: center;
  border: 1px solid var(--grey-700);
}

.teaser-image-left a article {
  border-left: 0;
}

.teaser-image-right a article {
  border-right: 0;
}

/* CTA */
.format p > a, .stage p > a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid;
}
.format p > a:hover, .stage p > a:hover {
  opacity: 0.5;
}

.cta {
  display: block;
  margin: calc(2 * var(--space-2)) 0;
}
.cta button {
  padding: calc(var(--space-2) / 2) var(--space-2);
  font-size: 14px;
  border-radius: 2px;
}
.cta.primary button {
  background: var(--faz-grey-permanent);
  color: var(--faz-darkblue-permanent);
}
.cta.primary button:hover {
  background: var(--faz-grey-permanent-50);
}
.cta.secondary button {
  background: transparent;
  border: 1px solid var(--mg-dark);
  color: var(--mg-dark);
}
.cta.secondary:hover button {
  border-color: var(--mg-dark-50);
}

/* Format */
.format .background {
  padding: calc(2 * var(--space-2)) 0;
  gap: calc(2 * var(--space-2));
  z-index: 1;
}
.format header {
  color: var(--white);
}
.format header a {
  position: absolute;
  top: calc(var(--space) * 4);
  right: calc(var(--space) * 4);
}
.format header h1 {
  font-size: 50px;
}
.format header .subheadline {
  font-size: 14px;
  font-family: var(--sans-serif);
}
.format header article .header-title {
  gap: 32px;
}
.format header article .arrow path {
  fill: var(--white);
}
.format header.gradient {
  color: var(--white-permanent);
}
.format header.gradient .arrow path {
  fill: var(--white-permanent);
}
.format header.gradient::after {
  content: "";
  width: 100%;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
  min-height: 40vh;
  position: absolute;
  bottom: 0;
  z-index: 1;
}
.format header.gradient article .header-title, .format header.textbox-bottom article .header-title {
  padding: var(--copy-size) 0;
}
.format header.textbox-bottom article {
  background: var(--mg-dark-80);
}
.format header.textbox-bottom .header-title {
  padding: calc(2 * var(--space)) 0;
}
.format header.textbox-center article .header-content {
  background: var(--mg-dark-20);
  padding: calc(2 * var(--space)) calc(4 * var(--space));
}
.format header.textbox-center article .arrow {
  bottom: calc(2 * var(--space));
  fill: var(--white-permanent);
}
.format header.small {
  color: var(--mg-dark);
  gap: calc(2 * var(--space));
}
.format header.small .arrow {
  display: none;
}
.format section.copy.intro {
  font-family: var(--sans-serif);
  font-weight: var(--bold);
}
.format section.copy.initial p:first-of-type:first-letter {
  float: left;
  font-size: 3.4rem;
  margin-right: 0.5rem;
  text-transform: uppercase;
  margin-top: 1rem;
}
.format section.copy p:not(:last-of-type), .format section.infobox p:not(:last-of-type), .format section .textbox p:not(:last-of-type) {
  margin-bottom: var(--space-2);
}
.format section.quote {
  max-width: 500px;
}
.format section.quote blockquote {
  font-size: calc(2 * var(--space));
  text-align: center;
  display: flex;
  flex-flow: column;
  gap: calc(2 * var(--space));
}
.format section.quote blockquote::before, .format section.quote blockquote::after {
  content: "";
  height: 3px;
  background: var(--grey-700);
  width: 60%;
  max-width: 280px;
  display: block;
  margin: auto;
}
.format section.quote blockquote span {
  font-family: var(--sans-serif);
  font-size: 14px;
}
.format section.image-2 {
  gap: calc(2 * var(--space-2));
}
.format section.image-2 > * {
  min-width: calc(50% - var(--space-2));
}
.format section.parallax .wrapper {
  padding: calc(2 * var(--space));
}
.format section.parallax .wrapper .textbox {
  background: var(--white-80);
  color: var(--mg-dark);
  padding: calc(2 * var(--space));
}
.format section.parallax .wrapper .textbox .cta.primary button {
  background: var(--mg-dark);
  color: var(--white);
}
.format section.parallax .wrapper .textbox .cta.primary:hover button {
  background: var(--mg-dark-50);
}
.format section.parallax .wrapper .textbox *:last-of-type {
  margin-bottom: 0;
}
.format .fader-wrapper::after {
  background: var(--white);
}
.format .overtext {
  padding: calc(2 * var(--space));
}
.format .overtext .textbox {
  background: var(--white-80);
  color: var(--mg-dark);
  padding: calc(2 * var(--space));
}
.format .overtext .textbox .cta.primary button {
  background: var(--mg-dark);
  color: var(--white);
}
.format .overtext .textbox .cta.primary:hover button {
  background: var(--mg-dark-50);
}
.format .overtext .textbox *:not(h3):last-of-type {
  margin-bottom: 0;
}

/* Slider */
.slider swiper-slide figcaption {
  margin-bottom: calc(2 * var(--space));
}

/* Video */
.video [id^=play-button-] .circle {
  fill: var(--mg-dark);
}
.video [id^=play-button-] .arrow {
  fill: var(--white);
}

.social .social-buttons {
  gap: calc(2 * var(--space));
}
.social .social-buttons a {
  width: calc(2 * var(--space-2));
}
.social .social-buttons a svg {
  fill: var(--mg-dark);
}

.infobox {
  padding: calc(2 * var(--space));
  background: var(--faz-grey-permanent);
  color: var(--mg-dark-permanent);
}
.infobox h2:not(:first-of-type) {
  margin-top: calc(2 * var(--space));
}
.infobox.border {
  border: 1px solid var(--mg-dark);
  background: transparent;
  color: var(--mg-dark);
}
.infobox.dark {
  background: var(--mg-dark);
  color: var(--white);
}
.infobox.dark .cta.secondary button {
  border-color: var(--white);
  color: var(--white);
}
.infobox.dark .cta.secondary button:hover {
  border-color: var(--white-50);
}
.infobox:not(.border, .dark) .cta.primary button {
  background: var(--faz-darkblue-permanent);
  color: var(--white-permanent);
}
.infobox:not(.border, .dark) .cta.primary button:hover {
  background: var(--faz-darkblue-permanent-50);
}
.infobox:not(.border, .dark) .cta.secondary button {
  border-color: var(--mg-dark-permanent);
  color: var(--mg-dark-permanent);
}
.infobox:not(.border, .dark) .cta.secondary button:hover {
  border-color: var(--mg-dark-permanent-50);
}

.format footer, .stage footer {
  background: var(--faz-grey);
  padding: 55px 40px;
}
.format footer > main, .stage footer > main {
  max-width: 750px;
  gap: calc(var(--space) * 1.5);
}
.format footer > main h2, .stage footer > main h2 {
  font-family: var(--sans-serif);
  font-weight: bold;
  margin-bottom: 0;
}
.format footer > main .footer-copyright, .stage footer > main .footer-copyright {
  margin-top: calc(var(--space) * 4);
}
.format footer > main .footer-copyright hr, .stage footer > main .footer-copyright hr {
  background: var(--mg-dark);
  height: 1px;
}
.format footer > main .footer-copyright .copyright, .stage footer > main .footer-copyright .copyright {
  font-family: var(--sans-serif);
  font-size: 12px;
}
.format footer > main .cta.primary button, .stage footer > main .cta.primary button {
  background: var(--faz-darkblue);
  color: var(--white);
}
.format footer > main .cta.primary button:hover, .stage footer > main .cta.primary button:hover {
  background: var(--faz-darkblue-50);
}

/* Desktop */
@media screen and (min-width: 768px) {
  .format .copy, .format .teaser-2 {
    margin-left: var(--space-2);
    margin-right: var(--space-2);
  }
}
/* Tablet */
@media screen and (max-width: 1060px) {
  .stage > main {
    margin: 40px;
    gap: calc(var(--space-2) * 3);
  }
  .teaser.teaser-image-left a, .teaser.teaser-image-right a {
    flex-flow: column;
  }
  .teaser.teaser-image-left a > *, .teaser.teaser-image-right a > * {
    width: 100%;
  }
  .teaser.teaser-image-left a article, .teaser.teaser-image-right a article {
    border: 0;
  }
  .format header:not(.small) article {
    padding: 0 var(--space-2);
  }
  .format .image-2, .format .teaser-3 {
    padding: 0 var(--space-2);
  }
  .format section.parallax .wrapper, .format .overtext {
    padding: var(--space-2);
  }
}
/* Tablet */
@media screen and (max-width: 999px) and (min-width: 768px) {
  .teaser.teaser-3 a:nth-of-type(3n) article {
    padding: calc(2 * var(--space-2));
    text-align: center;
    border: 1px solid var(--grey-700);
    border-left: 0;
  }
}
/* Mobil */
@media screen and (max-width: 767px) {
  :root {
    --copy-size: 17px;
    --asv: 106px;
  }
  .progress-container {
    top: 52px;
  }
  .stage > main {
    margin: calc(2 * var(--space-2)) 0;
  }
  .stage > main .intro {
    margin: 0 var(--space-2);
  }
  .teaser.teaser-1 article, .teaser.teaser-image-left article, .teaser.teaser-image-right article {
    padding: var(--space-2);
  }
  .teaser.teaser-1 article h2, .teaser.teaser-image-left article h2, .teaser.teaser-image-right article h2 {
    font-size: 22px;
  }
  .teaser.teaser-2, .teaser.teaser-3 {
    padding: 0 var(--space-2);
  }
  .teaser.teaser-3 figure {
    max-width: 67%;
  }
  .format {
    gap: calc(1.5 * var(--space));
  }
  .format .background {
    padding: 0;
  }
  .format header .header-content {
    gap: 15px;
  }
  .format header h1 {
    font-size: 24px;
  }
  .format header.textbox-bottom {
    background: blue;
  }
  .format header.gradient article .header-title, .format header.textbox-bottom article .header-title {
    padding: var(--copy-size) var(--space);
  }
  .format header.textbox-center article .header-content {
    padding: calc(2 * var(--space)) var(--space);
    max-height: none;
  }
  .format header.textbox-center article .arrow {
    bottom: var(--space);
  }
  .format header.small article {
    padding: 0 var(--space-2);
  }
  .format section:not(.parallax, .parallax-group, .fixed-image, .fader-wrapper, .width-full, .infobox, .social-buttons) {
    padding: 0 var(--space);
  }
  .format section.quote blockquote {
    font-size: 24px;
  }
  .format section.quote blockquote::before, .format section.quote blockquote::after {
    width: 100%;
    max-width: calc(100% - 4 * (var(--space)));
  }
  .format section.social {
    gap: var(--space);
  }
  .format section.social .social-buttons {
    gap: var(--space);
  }
  .format .video.width-text {
    width: calc(650px - 2 * var(--space));
  }
  .format footer {
    padding: calc(2 * var(--space-2)) var(--space-2);
  }
}
/* Mobil */
@media screen and (max-width: 700px) {
  .format header.gradient article, .format header.textbox-bottom article {
    padding: 0;
  }
  section.infobox {
    width: calc(100% - 2 * var(--space));
    margin-left: var(--space);
    margin-right: var(--space);
  }
}
@media screen and (max-width: 670px) {
  .format .video.width-text {
    width: calc(100% - 2 * var(--space));
  }
}
.dark-mode {
  --faz-grey: #323D46;
  --faz-darkblue: #E8EDEE;
  --faz-darkblue-50: rgba(232, 237, 238, 0.5);
  --mg-dark: #ffffff;
  --mg-dark-20: rgba(255, 255, 255, 0.2);
  --mg-dark-50: rgba(255, 255, 255, 0.5);
  --mg-dark-80: rgba(255, 255, 255, 0.8);
  --white: #212529;
  --white-20: rgba(33, 37, 41, 0.2);
  --white-50: rgba(33, 37, 41, 0.5);
  --white-80: rgba(33, 37, 41, 0.8);
  --black: #000;
  --grey-200: #e3e3e3;
  --grey-300: #c6c6c6;
  --grey-400: #aaaaaa;
  --grey-500: #8e8e8e;
  --grey-600: #717171;
  --grey-700: #555555;
  --grey-900:#393939;
  --topic-color-01: #264038;
  --topic-color-02: #561E1E;
  --topic-color-03: #5D4D19;
  --topic-color-04: #183950;
  --mg-chart-negativ: #FF4242;
  --faz-error: ##F89A44;
}

/* Colors Darkmode */
@media (prefers-color-scheme: dark) {
  :root {
    --faz-grey: #323D46;
    --faz-darkblue: #E8EDEE;
    --faz-darkblue-50: rgba(232, 237, 238, 0.5);
    --mg-dark: #ffffff;
    --mg-dark-20: rgba(255, 255, 255, 0.2);
    --mg-dark-50: rgba(255, 255, 255, 0.5);
    --mg-dark-80: rgba(255, 255, 255, 0.8);
    --white: #212529;
    --white-20: rgba(33, 37, 41, 0.2);
    --white-50: rgba(33, 37, 41, 0.5);
    --white-80: rgba(33, 37, 41, 0.8);
    --black: #000000;
    --grey-200: #e3e3e3;
    --grey-300: #c6c6c6;
    --grey-400: #aaaaaa;
    --grey-500: #8e8e8e;
    --grey-600: #717171;
    --grey-700: #555555;
    --grey-900:#393939;
    --topic-color-01: #264038;
    --topic-color-02: #561E1E;
    --topic-color-03: #5D4D19;
    --topic-color-04: #183950;
    --mg-chart-negativ: #FF4242;
    --faz-error: #F89A44;
  }
}