/* FAAM Klant: de opmaak van de bouwblokken. Kleuren, letters en hoeken komen uit theme.json (en de gekozen stijl). */
.fk-kop{border-bottom:1px solid var(--wp--preset--color--lijn);padding-top:14px;padding-bottom:14px;background:var(--wp--preset--color--achtergrond);position:relative;z-index:10}
.fk-kop-rij{gap:1.25rem;min-height:48px}
.fk-kop .fk-naam{flex:0 1 auto;min-width:0;max-width:22rem;overflow-wrap:anywhere}
.fk-kop .fk-naam a{text-decoration:none}
.fk-kop-rechts{gap:1.5rem;min-width:0}
.fk-menu .wp-block-navigation-item__content{text-transform:var(--wp--custom--nav-case);letter-spacing:var(--wp--custom--nav-spatie);color:var(--wp--preset--color--zacht)}
.fk-menu .wp-block-navigation-item__content:hover{color:var(--wp--preset--color--tekst)}
.fk-kop .fk-kop-knop .wp-block-button__link{padding:.6rem 1.1rem;font-size:.88rem}
@media (max-width:781px){.fk-kop .fk-kop-knop{display:none}.fk-kop .fk-naam{max-width:calc(100vw - 7rem)}}

.fk-inhoud{padding-top:0;padding-bottom:0}
.fk-inhoud > .wp-block-post-content > *:first-child{margin-block-start:0}
.fk-sectie{padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--40)}
.fk-sectie + .fk-sectie{padding-top:var(--wp--preset--spacing--40)}

.fk-label{display:inline-block;font-size:.82rem;font-weight:700;color:var(--wp--preset--color--accent-tekst);background:var(--wp--custom--label-achtergrond);padding:var(--wp--custom--label-padding);border-radius:var(--wp--custom--label-ronding);text-transform:var(--wp--custom--label-case);letter-spacing:var(--wp--custom--label-spatie);margin-bottom:.25rem!important}
.fk-intro{font-size:var(--wp--preset--font-size--groot);color:var(--wp--preset--color--zacht);max-width:34em}
.has-text-align-center.fk-intro{margin-left:auto;margin-right:auto}

.fk-bovenaan.is-klassiek{padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50)}
.fk-bovenaan-kolommen{gap:clamp(1.5rem,5vw,3.5rem)}
.fk-beeld img,.fk-zigzag .wp-block-media-text__media img,.fk-over .wp-block-media-text__media img{border-radius:var(--wp--custom--r-beeld);object-fit:cover}
.fk-bovenaan.is-beeld{color:#fff}
.fk-bovenaan.is-beeld h1,.fk-bovenaan.is-beeld p{color:#fff}
.fk-bovenaan.is-beeld .fk-label{color:#fff;background:rgba(255,255,255,.16)}
.fk-bovenaan.is-beeld .is-style-outline .wp-block-button__link{color:#fff;border-color:#fff}
.fk-bovenaan.is-compact{padding-top:var(--wp--preset--spacing--40)}
.fk-bovenaan.is-compact .fk-vlak{background:var(--wp--preset--color--vlak);border-radius:var(--wp--custom--r);padding:clamp(1.5rem,5vw,3.5rem);max-width:none}
.fk-fotorij{margin-top:1.25rem!important}
.fk-fotorij .wp-block-image img{border-radius:var(--wp--custom--r);aspect-ratio:4/3}

.wp-block-button.is-style-outline .wp-block-button__link{background:transparent;color:var(--wp--preset--color--tekst);border:2px solid currentColor;padding:calc(.85rem - 2px) calc(1.5rem - 2px)}
.wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--wp--preset--color--tekst);color:var(--wp--preset--color--achtergrond)}

.fk-kenmerken{display:flex;flex-wrap:wrap;gap:.75rem;list-style:none;padding:0!important;margin:0}
.fk-kenmerken li{display:flex;align-items:center;gap:.5rem;background:var(--wp--preset--color--vlak);border:1px solid var(--wp--preset--color--lijn);border-radius:999px;padding:.55rem 1rem;font-weight:600;font-size:.95rem}
.fk-kenmerken li::before{content:"";flex:none;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--wp--preset--color--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

.fk-kaarten{gap:1.1rem}
.fk-kaart{background:var(--wp--preset--color--vlak);border:1px solid var(--wp--preset--color--lijn);border-radius:var(--wp--custom--r);padding:1.6rem;height:100%}
.fk-kaart h3{margin-top:0}
.fk-kaart p{color:var(--wp--preset--color--zacht)}
.fk-meer{font-weight:700}
.fk-meer a{text-underline-offset:4px}
.fk-zigzag{margin-top:2rem!important;gap:clamp(1.25rem,4vw,3rem)}
.fk-zigzag .wp-block-media-text__content{padding:0 0 0 0!important}

.fk-oproep{background:var(--wp--preset--color--accent);color:var(--wp--preset--color--op-accent);border-radius:var(--wp--custom--r);padding:clamp(1.75rem,5vw,3rem)!important;margin-top:var(--wp--preset--spacing--40)!important;margin-bottom:var(--wp--preset--spacing--50)!important;gap:1.5rem}
.fk-oproep h2,.fk-oproep p{color:var(--wp--preset--color--op-accent);margin:0}
.fk-oproep h2{margin-bottom:.4rem}
.fk-oproep .wp-block-button__link{background:var(--wp--preset--color--op-accent);color:var(--wp--preset--color--accent)}

.fk-voet{background:var(--wp--preset--color--vlak);border-top:1px solid var(--wp--preset--color--lijn);padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--40);margin-top:0;font-size:.95rem}
.fk-voet-kop{font-family:inherit!important;font-size:.78rem!important;letter-spacing:.08em;text-transform:uppercase;color:var(--wp--preset--color--zacht)}
.fk-voet .wp-block-page-list{list-style:none;padding:0}
.fk-klein{font-size:.85rem;color:var(--wp--preset--color--zacht);border-top:1px solid var(--wp--preset--color--lijn);padding-top:1rem;margin-top:2rem}

/* Lange woorden in titels (bv. "Binnenschilderwerk") breken op een gsm in plaats van uit het scherm te lopen. */
h1,h2,h3{overflow-wrap:break-word;hyphens:auto}
@media (max-width:600px){h1{overflow-wrap:anywhere}}
/* De fotorij bovenaan blijft ook op een gsm drie naast elkaar. */
@media (max-width:600px){.fk-fotorij.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image){width:calc((100% - 2*var(--wp--style--unstable-gallery-gap,16px))/3)!important}}

/* Editor: de paginanaam staat niet op de website zelf (de titel zit in het bouwblok Bovenaan). Daarom klein, met uitleg. */
.editor-visual-editor__post-title-wrapper{border-bottom:1px dashed var(--wp--preset--color--lijn);padding-bottom:.75rem!important;margin-bottom:0!important}
.editor-visual-editor__post-title-wrapper::before{content:"Naam van de pagina (in het menu en in Google). Staat niet op de pagina zelf.";display:block;max-width:var(--wp--style--global--content-size);margin:0 auto .35rem;font:600 .75rem/1.4 system-ui,sans-serif;color:var(--wp--preset--color--zacht)}
.editor-visual-editor__post-title-wrapper .editor-post-title{font-size:1.25rem!important;font-family:system-ui,sans-serif!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;color:var(--wp--preset--color--tekst)!important}
