@font-face {
    font-family: 'Vogun Med';
    src: url('../../fonts/Vogun-Medium.eot');
    src: url('../../fonts/Vogun-Medium.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Vogun-Medium.woff2') format('woff2'),
        url('../../fonts/Vogun-Medium.woff') format('woff'),
        url('../../fonts/Vogun-Medium.ttf') format('truetype'),
        url('../../fonts/Vogun-Medium.svg#Vogun-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../../fonts/Satoshi-Bold.eot');
    src: url('../../fonts/Satoshi-Bold.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Satoshi-Bold.woff2') format('woff2'),
        url('../../fonts/Satoshi-Bold.woff') format('woff'),
        url('../../fonts/Satoshi-Bold.ttf') format('truetype'),
        url('../../fonts/Satoshi-Bold.svg#Satoshi-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../../fonts/Satoshi-Light.eot');
    src: url('../../fonts/Satoshi-Light.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Satoshi-Light.woff2') format('woff2'),
        url('../../fonts/Satoshi-Light.woff') format('woff'),
        url('../../fonts/Satoshi-Light.ttf') format('truetype'),
        url('../../fonts/Satoshi-Light.svg#Satoshi-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../../fonts/Satoshi-Medium.eot');
    src: url('../../fonts/Satoshi-Medium.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Satoshi-Medium.woff2') format('woff2'),
        url('../../fonts/Satoshi-Medium.woff') format('woff'),
        url('../../fonts/Satoshi-Medium.ttf') format('truetype'),
        url('../../fonts/Satoshi-Medium.svg#Satoshi-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../../fonts/Satoshi-Regular.eot');
    src: url('../../fonts/Satoshi-Regular.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Satoshi-Regular.woff2') format('woff2'),
        url('../../fonts/Satoshi-Regular.woff') format('woff'),
        url('../../fonts/Satoshi-Regular.ttf') format('truetype'),
        url('../../fonts/Satoshi-Regular.svg#Satoshi-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: 'Vogun Med';
    font-weight: 500;
    text-transform: inherit;
}


body {
    font-family: 'Satoshi';
}

.btn {
    font-family: 'Vogun Med';
}

section.header:before {
    content: '';
    background: linear-gradient(0deg, rgba(48, 52, 45, 1) 0%, rgba(48, 52, 45, 0) 100%);
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: calc(var(--largehuge) * 2);
    z-index: 1;
}


section.header:has(+ section.downloads):before {
    background: linear-gradient(0deg, rgba(245, 233, 217, 1) 0%, rgba(245, 233, 217, 0) 100%);
}

section.header:after {
    content: url(https://nieuwbouwtypisch22.nl/wp-content/uploads/2025/10/sticker.svg);
    width: 180px;
    position: absolute;
    right: var(--mediumlarge);
    top: var(--mediumlarge);
    line-height: 0;
}


section.cards .card .card-image:before {
    content: '';
    background: linear-gradient(0deg, rgba(245, 233, 217, 1) 0%, rgba(245, 233, 217, 0) 100%);
    background: linear-gradient(0deg, rgba(48, 52, 45, 1) 0%, rgba(48, 52, 45, 0) 100%);
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: calc(var(--largehuge) * 2);
    z-index: 1;
}

section.cards .card .card-content {
    padding-top: var(--small);
}

@media (max-width: 992px) {

    section.header:after {
        width: 120px;
        position: absolute;
        right: var(--small);
        top: var(--small);
    }
}