/*
Theme Name: Zereau 2025
Theme URI: https://www.zereau.com/
Author: Bitwave
Author URI: https://www.bitwave.nl/
Description: Maatwerk WordPress-thema voor Zereau
Version: 1.0
License: Proprietary
Text Domain: zereau
*/


/*** Init variables ***/
:root {
    --zereau-blue:  #1f5174;
    --zereau-blue2: #20608D;
    --zereau-green: #87C489; 
}
/*** / Init variables ***/


/*** Zereau helpers ***/
.bg-drop-blue {
    background: url(gfx/bg-drop-blue-10p.png) 50% 50% repeat;
    background-size: 40px 50px;
}

.bg-drop-green {
    background: url(gfx/bg-drop-green-10p.svg) 50% 50% repeat;
    background-size: 40px 50px;
}

.bg-gradient-gray-white {
    background: linear-gradient(0deg, rgba(217,217,217,0) 0%, rgba(217,217,217,0) 88.42%,rgba(217,217,217,.32) 100%);
}

.bg-gradient-white-gray {
    background: linear-gradient(180deg, rgba(217,217,217,0) 0%, rgba(217,217,217,0) 87.5%,rgba(217,217,217,.5) 100%)
}

.container {
    max-width: 1000px;
}

.list-inline li {
    display: inline-block;
}

.list-inline li:not(:last-child) {
    margin-right: .5rem;
}

.list-drops {
    position: relative;
}

ol.list-drops {
    padding-left: 3rem;
}

ul.list-drops {
    padding-left: 2rem;
}

.list-drops li {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

ol.list-drops li {
    counter-increment: list;
}

.list-drops li::marker {
    color: white;
}

.list-drops li::before {
    background: url('gfx/list-item-drop.svg') 50% 50% no-repeat;
    position: absolute;
    left: 0rem;
    padding-top: .5rem;
    color: white;
    font-size: .875rem;
    font-weight: 700;
    text-align: center;
}

ol.list-drops li::before {
    content: counter(list);
    width: 1.5rem;
    height: 2rem;
}

ul.list-drops li::before {
    content: '';
    width: 1rem;
    height: 1rem;
}


.list-drops-inline {
    position: relative;
}

.list-drops-inline li {
    position: relative;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

ol.list-drops-inline li {
    counter-increment: list;
}

.list-drops-inline li::marker {
    color: white;
}

.list-drops-inline li::before {
    background: url('gfx/list-item-drop.svg') 50% 50% no-repeat;
    position: absolute;
    left: 0rem;
    top: .5rem;
    padding-top: .5rem;
    color: white;
    font-size: .875rem;
    font-weight: 700;
    text-align: center;
}

ol.list-drops-inline li::before {
    content: counter(list);
    width: 1.5rem;
    height: 2rem;
}

ul.list-drops-inline li::before {
    content: '';
    width: 1rem;
    height: 1rem;
}

.aspect-1x1 {
    aspect-ratio: 1/1;
    object-fit: cover;
}

.aspect-3x2 {
    aspect-ratio: 3 / 2;
    object-fit: cover;
}



.text-balance {
    text-wrap: balance;
}
/*** / Zereau helpers ***/


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

@font-face {
    font-family: 'Corbel';
    font-style: normal;
    font-weight: normal;
    font-display: auto;
    src: url(fonts/corbel/Corbel.eot);
    src: url(fonts/corbel/Corbel.eot?#iefix) format('embedded-opentype'), url(fonts/corbel/Corbel.woff2) format('woff2'), url(fonts/corbel/Corbel.woff) format('woff'), url(fonts/corbel/Corbel.svg#Corbel) format('svg')
}
/*** / Init font ***/

@media (max-width: 991px) {
    body.admin-bar .navbar.fixed-top {
        top: 46px;
    }

    body {
        padding-top: 46px;
    }
}

@media (min-width: 992px) {
    body.admin-bar .navbar.fixed-top {
        top: 2rem;
    }

    body {
        padding-top: 3.5rem;
    }
}

.navbar {
    padding-top: .625rem;
    padding-bottom: .625rem;
}

.navbar-brand img {
    transition: transform .2s ease-in-out;
}

.navbar-brand:hover img {
    transform: scale(1.05);
}

.navbar-nav-zereau .nav-link {
    font-size: 1.125rem;
    font-weight: bold;
    line-height: 1.5rem;
}

@media (max-width: 991px) {
    .navbar .list-inline .list-inline-item:not(:last-child) {
        margin-right: 1.5rem;
    }
}

@media (min-width: 992px) {
    .navbar-nav-zereau .nav-link {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .navbar .list-inline .list-inline-item:not(:last-child) {
        margin-right: .75rem;
    }
}

.navbar-nav-zereau .active > .nav-link,
.navbar-nav-zereau .nav-link:active,
.navbar-nav-zereau .nav-link:hover {
    color: var(--zereau-green);
}


/*** Header ***/
.header-default,
.header-page,
.header-single {
    display: flex;
    align-items: center;
    clip-path: ellipse(120vw 100% at 50vw 0%);
    background: url(gfx/bg-drop-blue-10p.png) 50% 50% repeat;
    background-size: 40px 50px;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.header-front-page {
    position: relative;
    display: flex;
    align-items: center;
    clip-path: ellipse(120vw 100% at 50vw 0%);
    background: url('gfx/leader-1.jpg') 50% 50% repeat;
    background-size: cover;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.header-front-page::before {
    background: linear-gradient(179deg,#1f5174 4.44%,rgba(42,89,123,.95) 15.53%,rgba(59,103,133,.87) 25.67%,rgba(69,110,140,.83) 37.09%,rgba(96,131,156,.71) 53.88%,rgba(125,154,175,.58) 65.94%,rgba(172,190,203,.37) 85.59%,rgba(255,255,255,.00) 100.42%);
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.header-front-page > .container {
    position: relative;
    z-index: 2;
}

@media (max-width: 991px) {
    .header-default,
    .header-page,
    .header-single {
        min-height: 12.5rem;
    }

    .header-front-page {
        min-height: 20rem;
    }
}

@media (min-width: 992px) {
    .header-default,
    .header-page,
    .header-single {
        min-height: 20rem;
    }

    .header-front-page {
        min-height: 40rem;
    }
}
/*** / Header ***/


/*** Search ***/
mark {
    color: #212529;
    background: #fe0;
    border-radius: .25rem;
}

.si-title {
    color: #0056b3;
}




/*** Rommelhoekje ***/
.archive-post {
    position: relative;
}

.archive-post figure {
    overflow: hidden;
}

.archive-post figure img {
    transition: all .3s ease-in-out;
}

.archive-post:hover figure img {
    transform: scale(1.05);
}

.bg-before-white {
    position: relative;
}

.bg-before-white .container {
    position: relative;
    z-index: 2;
}

.bg-before-white::before {
    content: '';
    width: 100vw;
    height: clamp(10rem, 15rem, 50vw);
    top:0;
    left: 0;
    background: #fff;
    position: absolute;
}

.logo-ellipse-bottom {
    background-color: var(--zereau-blue2);
    padding: 16px;
    clip-path: ellipse(60vw 100% at 50% 100%);
}

.wp-block-gallery,
.wp-block-image {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.wp-block-image img {
    border-radius: var(--bs-border-radius-xxl);
}

.readmore {
    color: var(--zereau-green);
    font-size: 1.125rem;
    text-underline-offset: 3px;
    transition: all .1s ease;
}

.readmore:hover {
    text-underline-offset: 6px;
    text-decoration-thickness: 2px;
}

a {
    text-underline-offset: 3px;
}