/* SmartHub 2026 - Avada-wrappers neutraliseren
 *
 * Elke sectie van het v4-ontwerp zit in een Fusion-container met de klasse
 * .sh-sectie. Avada geeft die containers, rijen en kolommen eigen breedtes,
 * marges en negatieve marges (--hundredp_padding-hundred_percent_negative_margin).
 * Die vechten met het ontwerp, dat zijn eigen .wrap gebruikt voor de binnenbreedte
 * en zijn eigen verticale ritme per sectie.
 *
 * Hier zetten we de wrappers terug op nul, zodat de sectie de volle breedte krijgt
 * en de opmaak uit base.css onaangeroerd zijn werk doet. Dit raakt uitsluitend
 * containers met .sh-sectie; gewone Avada-pagina's blijven zoals ze zijn.
 *
 * BEHALVE bij .sh-avada. Dat zijn de blokken die juist wel met Avada-kolommen zijn
 * opgebouwd: daar moeten de breedte, de kolomruimte en de padding uit de builder
 * gewoon hun werk doen. Zou de reset daar ook gelden, dan wist hij de instellingen
 * die in de builder zijn gezet - en dat is precies wat we niet willen.
 *
 * .sh-avada is de markering "met Avada opgebouwd"; daarnaast staat een klasse voor
 * de vorm van het blok (.sh-duo, .sh-wg). Zo hoeft deze reset niet mee te groeien
 * met elk nieuw blok dat we omzetten.
 */

.sh-sectie.fusion-fullwidth:not(.sh-avada) {
	margin-left: 0;
	margin-right: 0;
	padding: 0;
	border: 0;
}

.sh-sectie:not(.sh-avada) .fusion-builder-row {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 0;
}

.sh-sectie:not(.sh-avada) .fusion-layout-column {
	width: 100%;
	min-width: 100%;
	margin: 0;
	padding: 0;
	float: none;
}

.sh-sectie:not(.sh-avada) .fusion-column-wrapper {
	margin: 0;
	padding: 0;
	min-height: 0;
}

/* Avada zet op sommige kolommen een negatieve marge om rijen te laten aansluiten. */
.sh-sectie:not(.sh-avada) .fusion-layout-column.fusion-column-last {
	margin-right: 0;
}

/* De secties bepalen hun eigen verticale ritme; een lege alinea van de editor
   mag daar geen extra gat in slaan. */
.sh-sectie .fusion-column-wrapper > p:empty,
.sh-sectie .fusion-text > p:empty {
	display: none;
}

/*
 * Typografie terugpakken.
 *
 * Avada schrijft body- en kopkleuren weg als CSS-variabelen in fusion-dynamic-css.
 * Onze stylesheet laadt daarna, maar Avada zet die kleuren ook op selectors met
 * hoge specificiteit binnen #wrapper. Daarom hier expliciet binnen onze secties.
 */
.sh-sectie h1,
.sh-sectie h2,
.sh-sectie h3,
.sh-sectie h4 {
	color: inherit;
	font-family: inherit;
	letter-spacing: -.01em;
	text-transform: uppercase;
	font-weight: 900;
	line-height: 1.05;
}

.sh-sectie p,
.sh-sectie li,
.sh-sectie span {
	font-family: inherit;
}

.sh-sectie a {
	text-decoration: none;
}

/* Avada geeft afbeeldingen in kolommen soms een eigen marge en max-breedte. */
.sh-sectie img {
	max-width: 100%;
	height: auto;
	margin: 0;
	display: block;
}

/*
 * Header: logo, menu en knop op één lijn.
 *
 * De balk is een grid met vaste hoogte, maar Avada's kolomwrapper rekt de
 * cellen op waardoor logo en menu bovenaan blijven hangen. Hier expliciet
 * centreren, ook op de wrapper zelf.
 */
.sh-sectie header .nav,
.sh-sectie .wrap.nav {
	align-items: center;
}

.sh-sectie header .logo,
.sh-sectie header nav,
.sh-sectie header .btn {
	align-self: center;
	margin-top: 0;
	margin-bottom: 0;
}

.sh-sectie header .logo img {
	display: block;
}

/*
 * Avada plakt op eigen houtje een zoek-icoon achter het hoofdmenu
 * (Theme Options > Menu > Main Menu Search Icon). Dat staat niet in het ontwerp
 * en verstoort de rij; zoeken zit hier op de vacature- en verhalenpagina zelf.
 */
.sh-sectie header .fusion-main-menu-search,
.sh-sectie header .fusion-custom-menu-item-contents {
	display: none;
}

/*
 * Footer: de menu's komen uit WordPress en krijgen daar hun eigen opsomming
 * mee. Het ontwerp gebruikt daar een compacte, kale lijst voor.
 */
.sh-sectie footer .f-grid ul,
.sh-sectie footer .f-grid ul.menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sh-sectie footer .f-grid li {
	margin: 0 0 8px;
	font-size: .9rem;
	line-height: 1.5;
}

.sh-sectie footer .f-grid li a {
	text-decoration: none;
}

/* De onderregel: losse links met een punt ertussen, geen lijst. */
.sh-sectie footer .f-juridisch a {
	color: inherit;
	text-decoration: none;
}

.sh-sectie footer .f-juridisch a:hover {
	text-decoration: underline;
}