/************************************ Start: Fake Headings ************************************/
.h1 { font-weight: 300; font-size: 78px; line-height: 94px; }
.h2 { font-weight: 300; font-size: 42px; line-height: 50px; }
.h3 { font-weight: 600; font-size: 24px; line-height: 31px; }
.h4 { font-weight: 600; font-size: 20px; line-height: 26px; }
@media screen and (max-width: 959px) {
    .h1 { font-size: 30px; line-height: 36px; }
    .h2 { font-size: 24px; line-height: 29px; }
    .h3 { font-size: 19px; line-height: 23px; }
    .h4 { font-size: 16px; line-height: 19px; }
}
/************************************ Ende: Fake Headings ************************************/

/************************************ Start: Quadrat ************************************/
h2 > .quadrat,
h3 > .quadrat,
h4 > .quadrat { position: relative; display: block; }
h2 > .quadrat:before,
h3 > .quadrat:before,
h4 > .quadrat:before { content: ""; position: absolute; left: 0; background: var(--primary); }
h2 > .quadrat { padding: 0 0 0 42px; }
h2 > .quadrat:before { top: 14px; width: 22px; height: 22px; }
h3 > .quadrat { padding: 0 0 0 27px; }
h3 > .quadrat:before { top: 9.5px; width: 12px; height: 12px; }
h4 > .quadrat { padding: 0 0 0 20px; }
h4 > .quadrat:before { top: 8px; width: 10px; height: 10px; }
@media screen and (max-width: 959px) {
    h1 > .quadrat { position: relative; display: block; padding: 0 0 0 31px; }
    h1 > .quadrat:before { content: ""; position: absolute; top: 10px; left: 0; width: 16px; height: 16px; background: var(--primary); }
    h2 > .quadrat { padding: 0 0 0 28px; }
    h2 > .quadrat:before { top: 8px; width: 13px; height: 13px; }
    h3 > .quadrat { padding: 0 0 0 22px; }
    h3 > .quadrat:before { top: 5.5px; width: 12px; height: 12px; }
    h4 > .quadrat { padding: 0 0 0 19px; }
    h4 > .quadrat:before { top: 5px; width: 9px; height: 9px; }
}
/************************************ Ende: Quadrat ************************************/

/************************************ Start: Intro ************************************/
.intro { font-weight: 300; font-size: 30px; line-height: 45px; }
@media screen and (max-width: 959px) { .intro { font-weight: 400; font-size: 18px; line-height: 27px; } }
/************************************ Ende: Intro ************************************/

/************************************ Start: Lead ************************************/
.lead { font-size: 23px; line-height: 35px; }
@media screen and (max-width: 959px) { .lead { font-size: 18px; line-height: 27px; } }
/************************************ Ende: Lead ************************************/

/************************************ Start: Kleiner Text ************************************/
.small-text { font-size: 14px; line-height: 21px; }
@media screen and (max-width: 959px) { .small-text { font-size: 13px; line-height: 20px; } }
/************************************ Ende: Kleiner Text ************************************/