/*
 * Incolora: layout in de stijl van de oude site (Genesis News Pro 3.0.2).
 * Maten uit de originele News Pro-stylesheet; tekst donkerder en lijnen
 * iets donkerder op verzoek van de klant.
 * Alleen actief op body.inc-layout. Selectors beginnen met
 * "body.inc-layout #page" om Astra's eigen stijlen te overstemmen.
 */

body.inc-layout {
	--inc-black: #000;
	--inc-text: #222;
	--inc-body: #222;
	--inc-muted: #777;
	--inc-line: #ccc;
	--inc-bg: #f6f5f2;
	--inc-crumb: #f3f3f3;
	--inc-red: #f00;
	--inc-font: 'Raleway', sans-serif;
	background: var(--inc-bg);
	color: var(--inc-body);
	font-family: var(--inc-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.625;
}

body.inc-layout #page,
body.inc-layout #page p,
body.inc-layout #page li,
body.inc-layout #page input,
body.inc-layout #page h1, body.inc-layout #page h2,
body.inc-layout #page h3, body.inc-layout #page h4,
body.inc-layout #page .site-title,
body.inc-layout #page .entry-title,
body.inc-layout #page .menu-link {
	font-family: var(--inc-font);
}
body.inc-layout #page h1, body.inc-layout #page h2,
body.inc-layout #page h3, body.inc-layout #page h4 {
	color: var(--inc-black);
}
body.inc-layout #page a { color: var(--inc-black); }
body.inc-layout #page a:hover { color: var(--inc-red); }

/* ---------- Omkaderde pagina ---------- */
body.inc-layout #page {
	max-width: 1140px;
	margin: 60px auto;
	background: #fff;
	border: 1px solid var(--inc-line);
}
body.inc-layout #page .ast-container { max-width: 100%; }
body.inc-layout #page .site-content { margin: 0; padding: 0; }
body.inc-layout #page .site-content > .ast-container { padding: 0; }
body.inc-layout #page #masthead { margin: 0; }

/* ---------- Header ---------- */
body.inc-layout #page .ast-above-header-bar,
body.inc-layout #page .ast-primary-header-bar,
body.inc-layout #page .ast-below-header-bar {
	background: #fff;
}
body.inc-layout #page .ast-above-header-bar,
body.inc-layout #page .ast-below-header-bar {
	border-bottom: 1px solid var(--inc-line) !important;
	min-height: 0 !important;
}
body.inc-layout #page .ast-above-header-bar,
body.inc-layout #page .ast-below-header-bar,
body.inc-layout #page .ast-above-header-wrap,
body.inc-layout #page .ast-below-header-wrap {
	margin: 0 !important;
}
body.inc-layout #page .site-above-header-wrap,
body.inc-layout #page .site-below-header-wrap {
	padding: 0 !important;
	min-height: 0 !important;
}
body.inc-layout #page .ast-above-header-bar .ast-builder-grid-row,
body.inc-layout #page .ast-below-header-bar .ast-builder-grid-row,
body.inc-layout #page .site-header-above-section-center,
body.inc-layout #page .site-header-below-section-center {
	justify-content: flex-start !important;
}

/* Menu-items */
body.inc-layout #page .ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link,
body.inc-layout #page .ast-builder-menu-2 .main-header-menu > .menu-item > .menu-link {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0;
	color: var(--inc-black);
	background: transparent;
	padding: 0 20px;
	line-height: 60px;
	border-right: 1px solid var(--inc-line);
}
/* Hover en actief: witte tekst op zwart */
body.inc-layout #page .ast-builder-menu .main-header-menu > .menu-item:hover > .menu-link,
body.inc-layout #page .ast-builder-menu .main-header-menu > .menu-item > .menu-link:focus,
body.inc-layout #page .ast-builder-menu .main-header-menu > .current-menu-item > .menu-link,
body.inc-layout #page .ast-builder-menu .main-header-menu > .current_page_item > .menu-link {
	color: #fff !important;
	background: var(--inc-black) !important;
}
/* Bovenliggende items (bijv. de categorie van een bericht) niet markeren, zoals op de oude site */
body.inc-layout #page .ast-builder-menu .main-header-menu > .current-menu-ancestor:not(:hover):not(.current-menu-item) > .menu-link,
body.inc-layout #page .ast-builder-menu .main-header-menu > .current-menu-parent:not(:hover):not(.current-menu-item) > .menu-link,
body.inc-layout #page .ast-builder-menu .main-header-menu > .current_page_ancestor:not(:hover):not(.current_page_item) > .menu-link {
	color: var(--inc-black) !important;
	background: transparent !important;
}
body.inc-layout #page .ast-builder-menu .main-header-menu > .menu-item:hover > .menu-link svg,
body.inc-layout #page .ast-builder-menu .main-header-menu > .current-menu-item > .menu-link svg {
	fill: #fff !important;
	color: #fff !important;
}
/* Submenu's */
body.inc-layout #page .ast-builder-menu .sub-menu .menu-link {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--inc-black);
}
/* (submenu-hover: zie onderaan) */

/* Titel en tagline */
body.inc-layout #page .ast-primary-header-bar {
	border-bottom: 3px solid var(--inc-black) !important;
}
body.inc-layout #ast-desktop-header .site-primary-header-wrap {
	padding: 40px 0 !important;
}
body.inc-layout #ast-desktop-header .site-logo-img { display: none; }
body.inc-layout #ast-desktop-header .site-branding,
body.inc-layout #ast-desktop-header .ast-site-identity {
	justify-content: center;
	text-align: center;
}
body.inc-layout #page #ast-desktop-header .site-title,
body.inc-layout #page #ast-desktop-header .site-title a {
	font-size: 48px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	color: var(--inc-black);
	margin: 0;
}
body.inc-layout #page #ast-desktop-header .site-description {
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: var(--inc-muted);
	margin: 12px 0 0;
}

/* ---------- Kolommen: inhoud 778px + sidebar 359px ---------- */
body.inc-layout #page #primary {
	margin: 0;
	padding: 20px;
}
body.inc-layout #page #secondary {
	margin: 0;
	padding: 0;
	background: #fff;
	border: 0;
}
@media (min-width: 922px) {
	body.inc-layout.ast-right-sidebar #page #primary {
		width: 68.4%;
		border-right: 1px solid var(--inc-line);
	}
	body.inc-layout.ast-right-sidebar #page #secondary {
		width: 31.6%;
	}
	body.inc-layout.single-post #page #primary { padding: 30px 40px 40px; }
}
/* Astra's extra binnenmarge rond berichten weghalen */
body.inc-layout.single-post #page #primary article.post,
body.inc-layout.single-post #page #primary .ast-article-single {
	padding: 0;
	margin: 0;
}
body.inc-layout.single-post #page .entry-header { margin-bottom: 24px; }
body.inc-layout.single-post #page .entry-title { margin-bottom: 10px; }

/* ---------- Sidebar ---------- */
body.inc-layout .sidebar-main,
body.inc-layout.ast-sticky-sidebar .sidebar-main {
	position: static !important;
	top: auto !important;
	overflow: visible !important;
	max-height: none !important;
	padding: 0 !important;
	background: transparent !important;
}
body.inc-layout #page #secondary .widget {
	background: #fff;
	border-bottom: 1px solid var(--inc-line);
	padding: 20px;
	margin: 0;
	box-shadow: none;
	font-size: 16px;
}
body.inc-layout #page #secondary .widget:last-child { border-bottom: 0; }

/* Kopjes van blokken en widgets */
body.inc-layout #page .inc-widget-title,
body.inc-layout #page #secondary .widget-title,
body.inc-layout #page #secondary .widget h2 {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.625;
	text-transform: uppercase;
	text-align: center;
	color: var(--inc-black);
	border-top: 3px solid var(--inc-black);
	border-bottom: 1px solid var(--inc-line);
	padding: 16px;
	margin: 0 0 24px;
	letter-spacing: 0;
}

body.inc-layout #page #secondary ul { list-style: none; margin: 0; }
body.inc-layout #page #secondary li {
	border-bottom: 1px solid var(--inc-line);
	padding: 12px 0 12px 14px;
	position: relative;
	margin: 0;
	font-size: 15px;
	line-height: 1.4;
}
body.inc-layout #page #secondary li:last-child { border-bottom: 0; }
body.inc-layout #page #secondary li::before {
	content: '›';
	position: absolute;
	left: 0;
	color: var(--inc-muted);
}
body.inc-layout #page #secondary li a { color: var(--inc-black); }

/* Destacados: 2x2 raster */
body.inc-layout #page #secondary #text-7 .textwidget > div {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
}
body.inc-layout #page #secondary #text-7 img.ad {
	width: 100%;
	height: auto;
	border: 1px solid var(--inc-line);
	display: block;
}

/* Zoekveld */
body.inc-layout #page #secondary .search-form { margin: 0; }
body.inc-layout #page #secondary .search-form input[type="search"] {
	width: 100%;
	border: 1px solid var(--inc-line);
	padding: 16px;
	font-size: 16px;
	background: #fff;
	color: var(--inc-black);
}
body.inc-layout #page #secondary .search-form input::placeholder { color: var(--inc-muted); }
body.inc-layout #page #secondary .search-form button,
body.inc-layout #page #secondary .search-form .search-submit { display: none; }

/* Sociale iconen */
body.inc-layout #page #secondary .simple-social-icons li { border: 0; padding: 0; }
body.inc-layout #page #secondary .simple-social-icons li::before { content: none; }

/* ---------- Homepage ---------- */
.inc-featured {
	position: relative;
	margin: 0 0 20px;
	background: var(--inc-crumb);
	padding: 15px;
	border: 1px solid var(--inc-line);
}
.inc-featured-link { display: block; position: relative; }
.inc-featured img { display: block; width: 100%; height: auto; max-height: 460px; object-fit: cover; }
body.inc-layout #page .inc-featured-excerpt {
	position: absolute;
	top: 0;
	left: 20px;
	right: 20px;
	background: rgba(0, 0, 0, .8);
	color: #fff;
	font-size: 15px;
	line-height: 1.6;
	padding: 12px 20px;
}
body.inc-layout #page .inc-featured-cat {
	position: absolute;
	right: 30px;
	bottom: 30px;
	background: var(--inc-red);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	padding: 8px 14px;
}

.inc-home-cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin: 0 -20px 20px;
	border-top: 1px solid var(--inc-line);
	border-bottom: 1px solid var(--inc-line);
}
.inc-home-col { padding: 20px; }
.inc-home-col + .inc-home-col { border-left: 1px solid var(--inc-line); }
.inc-home-col img { display: block; width: 100%; height: auto; margin-bottom: 16px; }
body.inc-layout #page .inc-col-title { font-size: 20px; font-weight: 700; margin: 0 0 12px; line-height: 1.2; }
.inc-title-list { list-style: none; margin: 0; }
.inc-title-list li {
	border-bottom: 1px solid var(--inc-line);
	padding: 14px 0;
	margin: 0;
}
.inc-title-list li:last-child { border-bottom: 0; }
body.inc-layout #page .inc-title-list a {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--inc-black);
}

/* Lijst "Actualidad" en archieven */
.inc-list-item {
	display: flex;
	gap: 20px;
	padding: 20px 0;
	border-bottom: 1px solid var(--inc-line);
}
.inc-list-thumb { flex: 0 0 120px; }
.inc-list-thumb img { display: block; width: 120px; height: 120px; object-fit: cover; }
.inc-list-body { flex: 1; min-width: 0; }
body.inc-layout #page .inc-list-title { font-size: 20px; font-weight: 700; line-height: 1.2; margin: 0 0 10px; }
body.inc-layout #page .inc-list-title a { color: var(--inc-black); }
body.inc-layout #page .inc-list-excerpt { font-size: 16px; line-height: 1.625; color: var(--inc-body); margin: 0; }
.inc-more { white-space: nowrap; }

/* Paginering */
.inc-pagination { margin: 30px 0 0; }
.inc-pagination ul { list-style: none; margin: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.inc-pagination li { margin: 0; }
body.inc-layout #page .inc-pagination a,
body.inc-layout #page .inc-pagination span {
	display: inline-block;
	background: var(--inc-black);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	padding: 8px 12px;
}
body.inc-layout #page .inc-pagination .current,
body.inc-layout #page .inc-pagination a:hover { background: var(--inc-red); color: #fff; }
body.inc-layout #page .inc-pagination .dots { background: transparent; color: var(--inc-black); }

/* ---------- Broodkruimels ---------- */
.inc-breadcrumbs {
	background: var(--inc-crumb);
	border-bottom: 1px solid var(--inc-line);
	padding: 20px;
	font-size: 12px;
	text-transform: uppercase;
	color: var(--inc-body);
}
body.inc-layout #page .inc-breadcrumbs a { color: var(--inc-black); font-weight: 700; }

/* ---------- Losse berichten ---------- */
body.inc-layout.single-post #page .entry-title {
	font-size: 36px;
	font-weight: 700;
	line-height: 1.1;
}
body.inc-layout.single-post #page .entry-meta,
body.inc-layout.single-post #page .entry-meta * {
	font-size: 12px;
	text-transform: uppercase;
	color: var(--inc-muted);
}
body.inc-layout.single-post #page .entry-meta a { color: var(--inc-black); }
body.inc-layout.single-post #page .entry-content,
body.inc-layout.single-post #page .entry-content p,
body.inc-layout.single-post #page .entry-content li {
	font-size: 16px;
	line-height: 1.625;
	color: var(--inc-body);
}
body.inc-layout.single-post #page .entry-content strong { color: var(--inc-black); font-weight: 700; }
.inc-posted-in {
	border-top: 1px solid var(--inc-line);
	margin-top: 30px;
	padding-top: 20px;
	font-size: 12px;
	text-transform: uppercase;
	color: var(--inc-muted);
}
body.inc-layout #page .inc-posted-in a { color: var(--inc-black); }

/* ---------- Footer ---------- */
body.inc-layout .site-footer { display: none; }
.inc-footer { background: #3d3d3d; padding: 40px 40px 16px; }
.inc-footer-cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 30px; }
body.inc-layout #page .inc-footer h4 {
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 16px;
}
.inc-footer ul { list-style: none; margin: 0 0 24px; }
.inc-footer li { margin: 0 0 6px; }
body.inc-layout #page .inc-footer a { color: #fff; font-size: 16px; }
body.inc-layout #page .inc-footer a:hover { color: #ccc; }
.inc-credits {
	background: var(--inc-black);
	color: #999;
	text-align: center;
	font-size: 14px;
	padding: 40px 20px;
}
body.inc-layout #page .inc-credits a { color: #ccc; }

/* ---------- Middelgrote schermen: menu op één regel houden ---------- */
@media (min-width: 922px) and (max-width: 1180px) {
	body.inc-layout #page .ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link,
	body.inc-layout #page .ast-builder-menu-2 .main-header-menu > .menu-item > .menu-link {
		font-size: 12px;
		padding: 0 9px;
	}
	body.inc-layout #page { margin: 30px auto; }
}

/* ---------- Mobiel ---------- */
@media (max-width: 921px) {
	body.inc-layout #page { margin: 0; border: 0; }
	body.inc-layout #page #primary { padding: 20px 16px; }
	body.inc-layout #page #secondary .widget { padding: 20px 16px; }
	.inc-home-cols { grid-template-columns: 1fr; margin: 0 0 20px; }
	.inc-home-col { padding: 20px 0; }
	.inc-home-col + .inc-home-col { border-left: 0; border-top: 1px solid var(--inc-line); }
	body.inc-layout #page .inc-featured-excerpt { position: static; display: block; }
	body.inc-layout #page .inc-featured-cat { position: static; display: inline-block; margin-top: 10px; }
	.inc-footer { padding: 30px 16px 10px; }
	.inc-footer-cols { grid-template-columns: repeat(2, 1fr); }
	.inc-breadcrumbs { padding: 14px 16px; }
	body.inc-layout #page #ast-mobile-header .site-title a { font-weight: 700; text-transform: uppercase; }
}
@media (max-width: 544px) {
	.inc-list-thumb { flex-basis: 80px; }
	.inc-list-thumb img { width: 80px; height: 80px; }
	body.inc-layout #page .inc-list-title { font-size: 18px; }
	.inc-footer-cols { grid-template-columns: 1fr; }
	body.inc-layout.single-post #page .entry-title { font-size: 28px; }
}

/* Submenu's: hover en actief altijd witte tekst op zwart */
body.inc-layout #page .ast-builder-menu .sub-menu .menu-item:hover > .menu-link,
body.inc-layout #page .ast-builder-menu .sub-menu .menu-item > .menu-link:hover,
body.inc-layout #page .ast-builder-menu .sub-menu .menu-item > .menu-link:focus,
body.inc-layout #page .ast-builder-menu .sub-menu .current-menu-item > .menu-link,
body.inc-layout #page .ast-builder-menu .sub-menu .current_page_item > .menu-link,
body.inc-layout #page .ast-builder-menu .sub-menu .current-menu-ancestor > .menu-link {
	color: #fff !important;
	background: var(--inc-black) !important;
}
body.inc-layout #page .ast-builder-menu .sub-menu .menu-item:hover > .menu-link svg,
body.inc-layout #page .ast-builder-menu .sub-menu .current-menu-item > .menu-link svg {
	fill: #fff !important;
	color: #fff !important;
}
