@import url("https://cdn.beasy.nl/assets/fonts/roboto-condensed/roboto-condensed.css");
@import url("https://cdn.beasy.nl/assets/fonts/roboto/roboto.css");

/* ============ TOKENS ============ */
:root {
    --jsf-accent: #F47B20;
    --jsf-accent-dark: #D85F0A;
    --jsf-header-bg: #FAFAF7;
    --jsf-text: #14141A;
    --jsf-hairline: rgba(0, 0, 0, 0.08);
    --jsf-hairline-strong: rgba(0, 0, 0, 0.16);
}

::selection {
    background: var(--jsf-accent);
    color: #111;
}

body {
    font-family: "Roboto", sans-serif;
    font-size: 16px !important;
}

ul,
ol,
ul li,
ol li {
    font-size: inherit !important;
}

a,
a:link,
a:visited {
    color: var(--jsf-accent);
}

a:hover,
a:focus,
a:focus-visible,
a:active {
    color: var(--jsf-text);
}

/* ============ BUTTONS ============ */
.btn-primary {
    background: var(--jsf-accent) !important;
    border-color: var(--jsf-accent) !important;
    color: #111 !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 14px 24px !important;
    border-radius: 2px !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}
.btn-primary:hover,
.btn-primary:focus {
    background: var(--jsf-accent-dark) !important;
    border-color: var(--jsf-accent-dark) !important;
    color: #fff !important;
}
body .btn-primary:active,
body .btn-primary:active:focus {
    background: #BF5409 !important;
    border-color: #BF5409 !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* ============ SCROLL-TO-TOP ============ */
.scroll-to-top {
    background: var(--jsf-text) !important;
    color: #fff !important;
    border-radius: 2px !important;
    border: none !important;
    box-shadow: none !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    position: fixed !important;
    transition: background 0.2s ease !important;
}

.scroll-to-top i {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
}

.scroll-to-top:hover {
    background: #000 !important;
    color: #fff !important;
}

.scroll-to-top:visited,
.scroll-to-top:focus,
.scroll-to-top:active {
    color: #fff !important;
}

/* ============ HEADER ============ */
#header .header-logo {
    display: flex !important;
    align-items: center !important;
}

#header .header-logo img {
    height: 64px !important;
    width: auto !important;
    display: block !important;
}

.sticky-header-active #header .header-logo img {
    height: 50px !important;
    width: auto !important;
}

#header .header-body {
    background: var(--jsf-header-bg) !important;
    border-bottom: 1px solid var(--jsf-hairline) !important;
    box-shadow: none !important;
}

.sticky-header-active #header .header-body {
    background: rgba(250, 250, 247, 0.95) !important;
    backdrop-filter: saturate(140%) blur(8px);
    -webkit-backdrop-filter: saturate(140%) blur(8px);
    border-bottom-color: var(--jsf-hairline-strong) !important;
}

#header .header-container {
    transition: height 0.3s ease !important;
}

.sticky-header-active #header .header-container {
    height: 66px !important;
}

/* ============ NAV LINKS ============ */

#header .header-nav-main nav>ul>li>a {
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: var(--jsf-text) !important;
    padding: 12px 16px !important;
    position: relative !important;
    background: transparent !important;
    border-radius: 0 !important;
    transition: color 0.2s ease !important;
}

#header .header-nav-main nav>ul>li>a:hover {
    color: var(--jsf-accent) !important;
    background: transparent !important;
}

/* Porto effect-1 voegt ::after/::before animaties toe — generiek uitzetten */
#header .header-nav-main nav>ul>li>a::after,
#header .header-nav-main nav>ul>li>a::before {
    display: none !important;
    content: none !important;
}

/* Active: donkere tekst, geen pill-achtergrond, geen text-decoration */
#header .header-nav-main nav>ul>li>a.active,
#header .header-nav-main nav>ul>li.active>a,
#header .header-nav-main nav .nav-pills .nav-link.active {
    color: var(--jsf-text) !important;
    background: transparent !important;
    text-decoration: none !important;
}

/* Oranje streepje onderaan de actieve link (specifiekere selector wint van de reset hierboven) */
#header .header-nav-main nav>ul>li>a.active::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 0 !important;
    top: auto !important;
    width: auto !important;
    height: 2px !important;
    background: var(--jsf-accent) !important;
    border-radius: 0 !important;
}

/* ============ HAMBURGER KNOP ============ */

.header-btn-collapse-nav {
    background: transparent !important;
    border: 1px solid var(--jsf-hairline-strong) !important;
    color: var(--jsf-text) !important;
    padding: 10px 12px !important;
    border-radius: 2px !important;
    transition: border-color 0.2s ease, color 0.2s ease !important;
}

.header-btn-collapse-nav:hover {
    background: transparent !important;
    border-color: var(--jsf-accent) !important;
    color: var(--jsf-accent) !important;
}

/* ============ HERO / OWL CAROUSEL ============ */

/* Donkere gradient overlay bovenop de achtergrondafbeelding */
.beasy_header_owl_carousel .owl-item .background-image-wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.55) 55%,
            rgba(0, 0, 0, 0.82) 100%);
}

/* Tekst links-onderaan uitlijnen (niet gecentreerd) */
.beasy_header_owl_carousel .owl-item .d-flex.flex-column {
    align-items: flex-start !important;
    justify-content: flex-end !important;
    padding-bottom: clamp(40px, 6vw, 80px) !important;
}

/* Overtollige top-padding van de geneste container verwijderen */
.beasy_header_owl_carousel .owl-item .container>.container {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Eyebrow (h3): klein, uppercase, oranje, met liggend streepje ervoor */
.beasy_header_owl_carousel .owl-item h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    line-height: 1.4 !important;
    text-align: left !important;
    padding: 0 !important;
    margin-bottom: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.beasy_header_owl_carousel .owl-item h3::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}

/* Hoofdtitel (h1): groot, vet, wit, links */
.beasy_header_owl_carousel .owl-item h1 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(48px, 7.5vw, 112px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    line-height: 0.92 !important;
    color: #fff !important;
    text-align: left !important;
    text-transform: none !important;
    margin-bottom: 24px !important;
    max-width: 16ch !important;
}

/* Beschrijvingstekst */
.beasy_header_owl_carousel .owl-item p:not(.mt-4) {
    font-family: "Roboto", sans-serif !important;
    font-size: clamp(16px, 1.3vw, 19px) !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, 0.82) !important;
    line-height: 1.55 !important;
    text-align: left !important;
    max-width: 56ch !important;
    margin-bottom: 0 !important;
}

/* Buttons-wrapper: flex rij met gap */
.beasy_header_owl_carousel .owl-item p.mt-4 {
    margin-top: 28px !important;
    display: inline-flex !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}

/* Primaire knop (oranje) */
.beasy_header_owl_carousel .btn-primary {
    background: var(--jsf-accent) !important;
    border-color: var(--jsf-accent) !important;
    color: #111 !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 14px 24px !important;
    border-radius: 2px !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.beasy_header_owl_carousel .btn-primary:hover {
    background: var(--jsf-accent-dark) !important;
    border-color: var(--jsf-accent-dark) !important;
    color: #fff !important;
}

/* Ghost/secundaire knop (transparant met witte rand) */
.beasy_header_owl_carousel .btn-secondary {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    color: #fff !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 14px 24px !important;
    border-radius: 2px !important;
    margin-left: 0 !important;
    transition: border-color 0.2s ease, color 0.2s ease !important;
}

.beasy_header_owl_carousel .btn-secondary:hover {
    background: transparent !important;
    border-color: var(--jsf-accent) !important;
    color: var(--jsf-accent) !important;
}
body .beasy_header_owl_carousel .btn-secondary:active,
body .beasy_header_owl_carousel .btn-secondary:active:focus {
    background: transparent !important;
    border-color: var(--jsf-accent-dark) !important;
    color: var(--jsf-accent-dark) !important;
    box-shadow: none !important;
}

/* ============ BEASY HEADER IMAGE (page-hero) ============ */
.beasy_header_image {
    position: relative !important;
    min-height: clamp(200px, 26vw, 300px) !important;
    display: flex !important;
    align-items: flex-end !important;
    overflow: hidden !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: var(--jsf-text) !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}

/* Scrim: donkere gradient over de achtergrondafbeelding */
.beasy_header_image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg,
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.45) 55%,
            rgba(0, 0, 0, 0.78) 100%) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.beasy_header_image .container {
    position: relative !important;
    z-index: 1 !important;
    padding-top: clamp(24px, 3vw, 40px) !important;
    padding-bottom: clamp(24px, 3vw, 40px) !important;
}

.beasy_header_image .row {
    margin: 0 !important;
}

.beasy_header_image .col-md-12 {
    padding: 0 !important;
    align-self: auto !important;
}

.beasy_header_image h1 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(36px, 4.6vw, 64px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    line-height: 1 !important;
    color: #FAFAF7 !important;
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45) !important;
    margin: 0 !important;
    text-transform: none !important;
}

/* ============ SECTIE ACHTERGRONDEN ============ */
.beasy_header_owl_carousel {
    margin-bottom: 0 !important;
}

.beasy_module_text_2118,
.beasy_module_image-boxes_2119 {
    background: #FAFAF7 !important;
    margin: 0 !important;
}

/* ============ BEASY MODULE TEXT — section-head stijl ============ */

/* Sectie: ruimere boven- en onderkant */
.beasy_module_text {
    padding-top: clamp(64px, 8vw, 112px) !important;
    padding-bottom: clamp(64px, 8vw, 112px) !important;
}

/* Uitzonderingen zonder onderkant-padding (aansluiting op volgende sectie) */
.beasy_module_text_2118,
.beasy_module_text_2127 {
    padding-bottom: 0 !important;
}

.beasy_module_text_2127 {
    margin: 0 !important;
}

/* Col uitbreiden naar volle breedte zodat het grid de container vult */
.beasy_module_text .row>.col-lg-8 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* 2-koloms grid: links eyebrow + heading, rechts lede */
.beasy_module_text .col-lg-8 {
    display: grid !important;
    grid-template-columns: 1fr 1.4fr !important;
    column-gap: clamp(32px, 6vw, 80px) !important;
    align-items: end !important;
}

/* jQuery-wrapper voor h2+h3: linkerkolom, onderin uitgelijnd */
.beasy_module_text .col-lg-8 .jsf-text-headings {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
    align-self: start !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
}

/* h2/h3 binnen wrapper: grid-plaatsing resetten */
.beasy_module_text .col-lg-8 .jsf-text-headings h2,
.beasy_module_text .col-lg-8 .jsf-text-headings h3 {
    grid-column: unset !important;
    grid-row: unset !important;
    margin: 0 !important;
}

/* Fallback zonder jQuery */
.beasy_module_text .col-lg-8>h2 {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
}

.beasy_module_text .col-lg-8>h3 {
    grid-column: 1 !important;
    grid-row: 2 !important;
}

/* Enkel paragraaf: direct in de grid */
.beasy_module_text .col-lg-8 p {
    grid-column: 2 !important;
    grid-row: 1 / 3 !important;
    align-self: end !important;
}

/* Meerdere paragrafen: jQuery-wrapper als één grid-item */
.beasy_module_text .col-lg-8 .jsf-text-paragraphs {
    grid-column: 2 !important;
    grid-row: 1 / 3 !important;
    align-self: end !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

/* p's binnen de wrapper resetten */
.beasy_module_text .col-lg-8 .jsf-text-paragraphs p {
    grid-column: unset !important;
    grid-row: unset !important;
    align-self: unset !important;
    margin: 0 !important;
}

/* h2 als eyebrow (klein, uppercase, oranje, streepje voor) */
.beasy_module_text h2 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    line-height: 1.4 !important;
    margin-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.beasy_module_text h2 span {
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
}

.beasy_module_text h2::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}

/* h3 als grote hoofdtitel */
.beasy_module_text h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(40px, 5.2vw, 76px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em !important;
    line-height: 0.95 !important;
    color: var(--jsf-text) !important;
    margin-top: 18px !important;
    margin-bottom: 0 !important;
    text-transform: none !important;
}

/* h4 wat lucht boven */
.beasy_module_text h4 {
    margin-top: 32px !important;
}

/* lijsten zelfde grootte als paragrafen */
.beasy_module_text ul li,
.beasy_module_text ol li {
    font-size: clamp(17px, 1.4vw, 20px) !important;
    color: rgba(20, 20, 26, 0.66) !important;
    line-height: 1.55 !important;
}

/* p als lede (rechterkolom) */
.beasy_module_text p {
    font-size: clamp(17px, 1.4vw, 20px) !important;
    color: rgba(20, 20, 26, 0.66) !important;
    line-height: 1.55 !important;
    max-width: none !important;
    font-weight: 400 !important;
    margin-bottom: 0 !important;
}

/* ============ BEASY MODULE IMAGE-BOXES — services-grid stijl ============ */

/* Sectie boven- en onderkant */
.beasy_module_image-boxes {
    padding-top: clamp(64px, 8vw, 96px) !important;
    padding-bottom: clamp(64px, 8vw, 112px) !important;
}

/* Strak 3-koloms grid met 1px scheiding (geen Bootstrap gutters) */
.beasy_module_image-boxes .row.featured-boxes {
    --bs-gutter-x: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 1px !important;
    background: var(--jsf-hairline) !important;
    border: 1px solid var(--jsf-hairline) !important;
}

.beasy_module_image-boxes .row.featured-boxes>[class*="col-"] {
    background: #fff !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}

/* Kaart-inhoud */
.beasy_module_image-boxes .beasy_module_image-boxes-boxcontent {
    padding: clamp(28px, 3vw, 44px) !important;
    gap: 20px !important;
    min-height: 420px !important;
    background: #fff !important;
    transition: background 0.25s ease !important;
}

.beasy_module_image-boxes .col-lg-4:hover .beasy_module_image-boxes-boxcontent {
    background: #FAFAF7 !important;
}

/* Porto featured-box resets */
.beasy_module_image-boxes .featured-box {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

.beasy_module_image-boxes .box-content {
    padding: 0 !important;
}

/* h4 als number label (01 / RAIL) */
.beasy_module_image-boxes h4 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: rgba(20, 20, 26, 0.42) !important;
    margin-bottom: 0 !important;
}

/* h6 als grote kaart-heading (Spoor.) */
.beasy_module_image-boxes h6 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(32px, 3.4vw, 48px) !important;
    font-weight: 800 !important;
    line-height: 0.9 !important;
    letter-spacing: -0.01em !important;
    color: var(--jsf-text) !important;
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    text-transform: none !important;
}

/* Beschrijvingstekst */
.beasy_module_image-boxes .box-content p {
    font-size: 15px !important;
    color: rgba(20, 20, 26, 0.66) !important;
    line-height: 1.55 !important;
    max-width: 38ch !important;
    margin-top: 16px !important;
    margin-bottom: 0 !important;
    text-align: left !important;
}

/* Lijst met oranje streepjes als marker */
.beasy_module_image-boxes ul {
    list-style: none !important;
    padding: 0 !important;
    margin-top: 16px !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.beasy_module_image-boxes ul li {
    font-family: "Roboto", sans-serif !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: rgba(20, 20, 26, 0.66) !important;
    padding-left: 14px !important;
    position: relative !important;
    text-align: left !important;
}

.beasy_module_image-boxes ul li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
}

/* Knop als link-stijl (geen gevulde button) */
.beasy_module_image-boxes .btn-primary {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--jsf-text) !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    padding: 0 !important;
    gap: 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    transition: color 0.2s ease !important;
}

/* Pijltje via ::before met order:2 zodat het NA de tekst staat (::after is bezet door stretched-link) */
.beasy_module_image-boxes .btn-primary::before {
    content: "→" !important;
    order: 2 !important;
    display: inline-block !important;
    transition: transform 0.2s ease !important;
}

.beasy_module_image-boxes .col-lg-4:hover .btn-primary {
    color: var(--jsf-accent) !important;
    background: transparent !important;
}

.beasy_module_image-boxes .col-lg-4:hover .btn-primary::before {
    transform: translateX(4px) !important;
}

/* ============ BEASY MODULE TEXT-MEDIA — about stijl ============ */

/* Sectie: lichte achtergrond, boven- en onderrand, ruime padding */
.beasy_module_text-media {
    background: #fff !important;
    border-top: 1px solid var(--jsf-hairline) !important;
    border-bottom: 1px solid var(--jsf-hairline) !important;
    padding: clamp(72px, 9vw, 128px) 0 !important;
    margin-bottom: 0 !important;
}

/* 2-koloms grid, gutters weg */
.beasy_module_text-media .row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: clamp(40px, 6vw, 96px) !important;
    align-items: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 0 !important;
}

.beasy_module_text-media .row>[class*="col-"] {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}

/* DOM-volgorde: tekst eerst → rechterkolom, afbeelding tweede → linkerkolom */
.beasy_module_text-media .row>.col-lg-6:first-child {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
}

.beasy_module_text-media .row>.col-lg-6:last-child {
    grid-column: 1 !important;
    grid-row: 1 !important;
}

/* Afbeelding: aspect-ratio 4/5, rand, object-fit */
.beasy_module_text-media figure {
    aspect-ratio: 4 / 5 !important;
    border: 1px solid var(--jsf-hairline) !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    display: block !important;
}

.beasy_module_text-media figure img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    margin: 0 !important;
}

/* h2 als eyebrow */
.beasy_module_text-media h2 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.beasy_module_text-media h2 span {
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
}

.beasy_module_text-media h2::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}

/* h3 als grote heading */
.beasy_module_text-media h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(36px, 4.5vw, 64px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
    line-height: 0.95 !important;
    color: var(--jsf-text) !important;
    margin: 0 !important;
    text-transform: none !important;
}

/* Paragrafen */
.beasy_module_text-media p {
    font-size: clamp(16px, 1.2vw, 18px) !important;
    color: rgba(20, 20, 26, 0.66) !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* ============ BEASY MODULE CTA ============ */
.beasy_module_cta {
    background: var(--jsf-accent) !important;
    padding: clamp(72px, 9vw, 128px) 0 !important;
    margin: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

.beasy_module_cta::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.04) 0 24px, transparent 24px 48px) !important;
    pointer-events: none !important;
}

.beasy_module_cta .row {
    --bs-gutter-x: 0 !important;
    margin: 0 !important;
}

/* Porto call-to-action reset + grid layout */
.beasy_module_cta .call-to-action.call-to-action-primary {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1.4fr 1fr !important;
    gap: clamp(32px, 6vw, 80px) !important;
    align-items: center !important;
    position: relative !important;
}

.beasy_module_cta .call-to-action>[class*="col-"] {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}

.beasy_module_cta .call-to-action-content {
    text-align: left !important;
}

/* Porto clearfix ::after verwijderen — anders extra ruimte onderaan */
.beasy_module_cta .call-to-action::after {
    display: none !important;
    content: none !important;
}

/* Porto inner padding volledig resetten */
.beasy_module_cta .call-to-action,
.beasy_module_cta .call-to-action-content,
.beasy_module_cta .call-to-action-btn {
    padding: 0 !important;
    margin: 0 !important;
}

/* ============ FOOTER ============ */
#footer {
    background: #060607 !important;
    color: rgba(255, 255, 255, 0.7) !important;
    margin-top: 0 !important;
    padding: 0 !important;
}

/* Reset Porto container pt-5 */
#footer>.container {
    padding-top: 0 !important;
}

/* Hoofdgrid: 4 kolommen */
#footer>.container>.row {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
    gap: clamp(32px, 4vw, 56px) !important;
    padding: clamp(56px, 7vw, 96px) 0 clamp(48px, 5vw, 72px) 0 !important;
    margin: 0 !important;
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#footer>.container>.row>[class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Kolom 1: logo + beschrijving */
#footer .beasy_footer_col_1 {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    max-width: 360px !important;
}

/* Logo zonder achtergrond */
#footer .beasy_footer_col_1 figure {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    align-self: flex-start !important;
    margin: 0 !important;
    max-width: none !important;
    width: auto !important;
}

#footer .beasy_footer_col_1 figure img {
    height: 60px !important;
    width: auto !important;
    display: block !important;
    margin: 0 !important;
}

#footer .beasy_footer_col_1 p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: rgba(255, 255, 255, 0.6) !important;
    margin: 0 !important;
}

/* Kolom-koppen (h4) */
#footer .beasy_footer_title_text {
    margin: 0 !important;
}

#footer .beasy_footer_title_text h4 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    margin: 0 0 18px 0 !important;
}

/* Sitemap nav-links (kolom 2) */
#footer .beasy_footer_sitemap .nav {
    flex-direction: column !important;
    gap: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
}

#footer .beasy_footer_sitemap .nav-item {
    padding: 0 !important;
    margin: 0 !important;
}

#footer .beasy_footer_sitemap .nav-link {
    font-size: 15px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    background: none !important;
}

#footer .beasy_footer_sitemap .nav-link:hover {
    color: var(--jsf-accent) !important;
    background: none !important;
}

/* Contact & Bedrijf tekst/links (kolom 3 & 4) */
#footer .beasy_footer_col_3 .beasy_footer_title_text p,
#footer .beasy_footer_col_4 .beasy_footer_title_text p {
    font-size: 15px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    line-height: 1.6 !important;
    margin: 0 0 10px 0 !important;
}

#footer .beasy_footer_col_3 .beasy_footer_title_text p:last-child,
#footer .beasy_footer_col_4 .beasy_footer_title_text p:last-child {
    margin-bottom: 0 !important;
}

#footer .beasy_footer_title_text a {
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none !important;
}

#footer .beasy_footer_title_text a:hover {
    color: var(--jsf-accent) !important;
}

/* Button in footer */
#footer .btn-primary {
    margin-top: 20px !important;
}

/* Copyright-balk */
#footer .footer-copyright {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

#footer .footer-copyright .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#footer .footer-copyright .row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    padding: 24px 0 !important;
    margin: 0 !important;
    --bs-gutter-x: 0 !important;
}

#footer .footer-copyright .row>[class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
    margin: 0 !important;
    justify-content: flex-start !important;
}

#footer .footer-copyright p,
#footer .footer-copyright a {
    font-size: 13px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, 0.4) !important;
    margin: 0 !important;
    text-decoration: none !important;
}

#footer .footer-copyright a:hover {
    color: var(--jsf-accent) !important;
}

/* h3 als eyebrow label */
.beasy_module_cta .call-to-action h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: rgba(0, 0, 0, 0.7) !important;
    text-align: left !important;
    margin: 0 0 18px 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.beasy_module_cta .call-to-action h3::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: rgba(0, 0, 0, 0.4) !important;
    flex-shrink: 0 !important;
}

/* h4 als grote heading */
.beasy_module_cta .call-to-action h4 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(40px, 5.5vw, 84px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em !important;
    line-height: 0.92 !important;
    color: var(--jsf-text) !important;
    text-align: left !important;
    margin: 0 !important;
    text-transform: none !important;
}

.beasy_module_cta p {
    font-family: "Roboto", sans-serif !important;
    font-size: clamp(16px, 1.3vw, 18px) !important;
    color: rgba(0, 0, 0, 0.75) !important;
    line-height: 1.6 !important;
    max-width: 56ch !important;
    margin: 20px 0 0 0 !important;
}

/* Button kolom */
.beasy_module_cta .call-to-action-btn {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.beasy_module_cta .btn {
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    letter-spacing: 0.04em !important;
    text-transform: none !important;
    padding: 22px 28px !important;
    border-radius: 2px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 16px !important;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

.beasy_module_cta .btn::after {
    content: "→" !important;
    flex-shrink: 0 !important;
}

.beasy_module_cta .btn-light,
.beasy_module_cta .btn-modern {
    background: var(--jsf-text) !important;
    color: var(--jsf-accent) !important;
    border: 1px solid var(--jsf-text) !important;
}

.beasy_module_cta .btn-light:hover,
.beasy_module_cta .btn-modern:hover {
    background: #000 !important;
    color: #fff !important;
    border-color: #000 !important;
}

/* ============ SUBPAGINA — wisselende achtergronden ============ */
/*
 * body:has(.beasy_header_image) herkent subpagina's via de paginatitel-hero.
 * De homepage heeft alleen beasy_header_owl_carousel, dus wordt nooit geraakt.
 */
body:has(.beasy_header_image) .main>section:first-child:not(.beasy_module_text_2137):not(.beasy_module_text_2138) {
    background: #FAFAF7 !important;
}

/* ============ UITZONDERINGEN — lange tekstpagina's (AV / Privacy) ============ */
.beasy_module_text_2137,
.beasy_module_text_2138 {
    background: transparent !important;
}

/* Grid uitzetten: titels boven de tekst, 1 kolom */
.beasy_module_text_2137 .col-lg-8,
.beasy_module_text_2138 .col-lg-8 {
    display: block !important;
}

/* jQuery-wrappers en losse elementen terug naar normale flow */
.beasy_module_text_2137 .col-lg-8 .jsf-text-headings,
.beasy_module_text_2138 .col-lg-8 .jsf-text-headings {
    display: flex !important;
    margin-bottom: 24px !important;
}

.beasy_module_text_2137 .col-lg-8 p,
.beasy_module_text_2137 .col-lg-8 .jsf-text-paragraphs,
.beasy_module_text_2138 .col-lg-8 p,
.beasy_module_text_2138 .col-lg-8 .jsf-text-paragraphs {
    grid-column: unset !important;
    grid-row: unset !important;
    align-self: unset !important;
    max-width: 72ch !important;
}

/* ============ CONTACT GRID ============ */
.jsf-contact-section {
    padding: clamp(64px, 8vw, 112px) 0 !important;
    background: #FAFAF7 !important;
}
.jsf-contact-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: clamp(32px, 5vw, 80px) !important;
    align-items: start !important;
}

/* Linkerkolom: contact info */
.jsf-contact-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}
.jsf-contact-info h2 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
}
.jsf-contact-info h2::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}
.jsf-contact-info h2 span { font-size: inherit !important; color: inherit !important; }
.jsf-contact-info h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(36px, 4.5vw, 64px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em !important;
    line-height: 0.95 !important;
    color: var(--jsf-text) !important;
    margin: 0 !important;
    text-transform: none !important;
}
/* Eerste p = lede tekst */
.jsf-contact-info > p:first-of-type {
    font-size: clamp(16px, 1.2vw, 18px) !important;
    color: rgba(20, 20, 26, 0.66) !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}
/* Contactgegevens paragrafen: geen eigen styling, erft van body */

/* Icoontjes in contactgegevens: absoluut zodat tweede regel netjes uitlijnt */
.jsf-contact-info p a {
    display: block !important;
    position: relative !important;
    padding-left: 22px !important;
}
.jsf-contact-info p .fas {
    color: var(--jsf-accent) !important;
    position: absolute !important;
    left: 0 !important;
    top: 0.2em !important;
    width: 16px !important;
    text-align: center !important;
}
/* <br> direct in <p> tussen twee block-links is overbodig */
.jsf-contact-info p > br {
    display: none !important;
}

/* Rechterkolom: formulier card */
.jsf-contact-form {
    background: #fff !important;
    border: 1px solid var(--jsf-hairline) !important;
    padding: clamp(24px, 3vw, 36px) !important;
    margin-top: calc(-1 * clamp(24px, 3vw, 36px)) !important;
    position: sticky !important;
    top: 100px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}
.jsf-contact-form h2 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    text-align: left !important;
}
.jsf-contact-form h2::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}
.jsf-contact-form h2 span { font-size: inherit !important; color: inherit !important; }
.jsf-contact-form h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(24px, 2.5vw, 32px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
    line-height: 1 !important;
    color: var(--jsf-text) !important;
    margin: 0 !important;
    text-transform: none !important;
    text-align: left !important;
}
/* Labels */
.jsf-contact-form .form-label {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    color: rgba(20, 20, 26, 0.6) !important;
    margin-bottom: 6px !important;
}
/* Velden */
.jsf-contact-form .form-control {
    background: #FAFAF7 !important;
    border: 1px solid var(--jsf-hairline-strong) !important;
    color: var(--jsf-text) !important;
    padding: 12px 14px !important;
    font-family: "Roboto", sans-serif !important;
    font-size: 15px !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease !important;
}
.jsf-contact-form .form-control:focus {
    border-color: var(--jsf-accent) !important;
    box-shadow: none !important;
    background: #fff !important;
}
.jsf-contact-form textarea.form-control {
    min-height: 130px !important;
    resize: vertical !important;
}
.jsf-contact-form .mb-3 {
    margin-bottom: 18px !important;
}
/* Verzendknop */
.jsf-contact-form .btn-primary {
    background: var(--jsf-accent) !important;
    border-color: var(--jsf-accent) !important;
    color: #111 !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 14px 24px !important;
    border-radius: 2px !important;
    transition: background 0.2s ease !important;
    align-self: flex-start !important;
}
.jsf-contact-form .btn-primary:hover {
    background: var(--jsf-accent-dark) !important;
    border-color: var(--jsf-accent-dark) !important;
    color: #fff !important;
}

/* ============ RESERVEER FORMULIER ============ */
.beasy_module_forms_2142 {
    padding: clamp(64px, 8vw, 112px) 0 !important;
    margin-bottom: 0 !important;
}
/* Smalle gecentreerde kolom, zoals simple-wrap */
.beasy_module_forms_2142 .container {
    max-width: 720px !important;
}
/* Bootstrap row/col resetten */
.beasy_module_forms_2142 .row {
    display: block !important;
    margin: 0 !important;
}
.beasy_module_forms_2142 [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 0 !important;
    text-align: left !important;
}
/* Eyebrow */
.beasy_module_forms_2142 h2 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--jsf-accent) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 18px 0 !important;
}
.beasy_module_forms_2142 h2::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 1px !important;
    background: var(--jsf-accent) !important;
    flex-shrink: 0 !important;
}
.beasy_module_forms_2142 h2 span { font-size: inherit !important; color: inherit !important; }
/* Grote titel */
.beasy_module_forms_2142 h3 {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: clamp(34px, 4.4vw, 56px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
    line-height: 0.98 !important;
    color: var(--jsf-text) !important;
    margin: 0 0 18px 0 !important;
    text-transform: none !important;
}
.beasy_module_forms_2142 h3 span { color: var(--jsf-accent) !important; }
/* Lede paragraaf */
.beasy_module_forms_2142 .col-lg-8 p {
    font-size: 17px !important;
    line-height: 1.6 !important;
    color: rgba(20, 20, 26, 0.66) !important;
    max-width: 56ch !important;
    margin: 0 0 40px 0 !important;
}
/* Formulier: witte card met rand */
.beasy_module_forms_2142 form {
    background: #fff !important;
    border: 1px solid var(--jsf-hairline) !important;
    padding: clamp(24px, 3vw, 36px) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
}
.beasy_module_forms_2142 .mb-3 { margin-bottom: 0 !important; }
/* Labels */
.beasy_module_forms_2142 .form-label {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    color: rgba(20, 20, 26, 0.6) !important;
    margin-bottom: 6px !important;
}
/* Velden */
.beasy_module_forms_2142 .form-control,
.beasy_module_forms_2142 .form-select {
    background: #FAFAF7 !important;
    border: 1px solid var(--jsf-hairline-strong) !important;
    color: var(--jsf-text) !important;
    padding: 12px 14px !important;
    font-family: "Roboto", sans-serif !important;
    font-size: 15px !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease !important;
}
/* Select: pijltje terug (background shorthand wiste Bootstrap's background-image) */
.beasy_module_forms_2142 .form-select {
    background-color: #FAFAF7 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2314141A' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px 10px !important;
    padding-right: 40px !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.beasy_module_forms_2142 .form-control:focus {
    border-color: var(--jsf-accent) !important;
    box-shadow: none !important;
    background: #fff !important;
}
.beasy_module_forms_2142 .form-select:focus {
    border-color: var(--jsf-accent) !important;
    box-shadow: none !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2314141A' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
}
.beasy_module_forms_2142 textarea.form-control {
    min-height: 130px !important;
    resize: vertical !important;
}
/* Knop */
.beasy_module_forms_2142 .btn-primary {
    background: var(--jsf-accent) !important;
    border-color: var(--jsf-accent) !important;
    color: #111 !important;
    font-family: "Roboto Condensed", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 14px 24px !important;
    border-radius: 2px !important;
    align-self: flex-start !important;
    transition: background 0.2s ease !important;
}
.beasy_module_forms_2142 .btn-primary:hover {
    background: var(--jsf-accent-dark) !important;
    border-color: var(--jsf-accent-dark) !important;
    color: #fff !important;
}

/* ============ RESPONSIVE ============ */

@media (max-width: 1399.98px) {}

@media (max-width: 1199.98px) {}

@media (max-width: 900px) {

    /* CTA: 1 kolom op mobiel/tablet */
    .beasy_module_cta .call-to-action.call-to-action-primary {
        grid-template-columns: 1fr !important;
    }

    /* contact grid: 1 kolom */
    .jsf-contact-grid {
        grid-template-columns: 1fr !important;
    }
    .jsf-contact-form {
        position: static !important;
    }

    /* text-media: 1 kolom, afbeelding boven tekst */
    .beasy_module_text-media .row {
        grid-template-columns: 1fr !important;
    }

    .beasy_module_text-media .row>.col-lg-6:first-child {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    .beasy_module_text-media .row>.col-lg-6:last-child {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    .beasy_module_text-media figure {
        aspect-ratio: 4 / 3 !important;
    }
}

@media (max-width: 991.98px) {

    /* Header fixed op mobiel — padding via custom.js geregeld */
    #header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 1100 !important;
    }

    /* image-boxes: 2 kolommen op tablet */
    .beasy_module_image-boxes .row.featured-boxes {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* Mobiel nav: active item oranje tekst, streepje weg */
    #header .header-nav-main nav>ul>li>a.active::after {
        display: none !important;
        content: none !important;
    }

    #header .header-nav-main nav>ul>li>a.active {
        color: var(--jsf-accent) !important;
    }
}

@media (max-width: 800px) {

    /* footer: 2 kolommen op tablet */
    #footer>.container>.row {
        grid-template-columns: 1fr 1fr !important;
    }

    /* beasy_module_text: 1 kolom op kleine schermen */
    .beasy_module_text .col-lg-8 {
        grid-template-columns: 1fr !important;
        align-items: start !important;
        gap: 20px !important;
    }

    .beasy_module_text .col-lg-8 p,
    .beasy_module_text .col-lg-8 .jsf-text-paragraphs {
        grid-column: 1 !important;
        grid-row: 3 !important;
        align-self: start !important;
    }
}

@media (max-width: 640px) {

    /* image-boxes: 1 kolom op mobiel */
    .beasy_module_image-boxes .row.featured-boxes {
        grid-template-columns: 1fr !important;
    }

    .beasy_module_image-boxes .beasy_module_image-boxes-boxcontent {
        min-height: auto !important;
    }
}

@media (max-width: 480px) {

    /* footer: 1 kolom op mobiel */
    #footer>.container>.row {
        grid-template-columns: 1fr !important;
    }
}