/* =========================================================
   IGN Theme – hoofdstijlen
   Kleuren, lettertypen en maten komen uit theme.json (presets).
   ========================================================= */

:root {
	--ign-groen: var(--wp--preset--color--groen, #79B928);
	--ign-donker: var(--wp--preset--color--groen-donker, #10291C);
	--ign-licht: var(--wp--preset--color--groen-licht, #EAF2E9);
	--ign-steen: var(--wp--preset--color--steen, #F4F2EC);
	--ign-lijn: var(--wp--preset--color--lijn, #D9DED8);
	--ign-inkt: var(--wp--preset--color--inkt, #1E2A23);
	--ign-zacht: var(--wp--preset--color--inkt-zacht, #4A5A50);
	--ign-groentekst: var(--wp--preset--color--groen-tekst, #3F6B10);
	--ign-sectie: clamp(4rem, 9vw, 7.5rem);
	--ign-radius: 4px;
	--ign-header-h: 80px;
}

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } }
body { font-feature-settings: "cv11", "ss01"; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.ign-main { padding-bottom: 0; }
:where(.ign-main) > .alignfull:first-child { margin-top: 0; }
img { height: auto; }
::selection { background: var(--ign-groen); color: var(--ign-donker); }
:focus-visible { outline: 2px solid var(--ign-donker); outline-offset: 3px; }

/* ---------- tekst-hulpjes ---------- */
.ign-bovenregel {
	font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: var(--ign-groentekst); margin-bottom: .75rem !important;
}
.has-groen-donker-background-color .ign-bovenregel { color: var(--ign-groen); }
.ign-klein, .ign-klein a { font-size: .9rem; color: var(--ign-zacht); line-height: 1.55; }
.ign-pijllink a, .is-style-ign-tekstlink .wp-block-button__link {
	display: inline-flex; align-items: center; gap: .45em;
	font-weight: 600; text-decoration: none; color: var(--ign-donker);
	border-bottom: 2px solid var(--ign-groen); padding-bottom: 2px;
}
.ign-pijllink a::after, .is-style-ign-tekstlink .wp-block-button__link::after { content: "→"; transition: transform .2s; }
.ign-pijllink a:hover::after, .is-style-ign-tekstlink .wp-block-button__link:hover::after { transform: translateX(3px); }
.has-groen-donker-background-color .ign-pijllink a { color: #fff; }

/* ---------- knoppen ---------- */
.wp-block-button__link { transition: background-color .15s, color .15s, border-color .15s; }
.wp-block-button:not(.is-style-ign-tekstlink):not(.is-style-ign-omlijnd) .wp-block-button__link::after {
	content: ""; display: inline-block; width: .55em; height: .55em; margin-left: .6em;
	border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg) translateY(-1px);
}
.is-style-ign-tekstlink .wp-block-button__link {
	background: none !important; padding: 0 0 2px !important; border-radius: 0 !important;
}
.is-style-ign-omlijnd .wp-block-button__link {
	background: #fff !important; color: var(--ign-donker) !important;
	border: 1.5px solid var(--ign-donker); padding: .7rem 1.15rem !important;
}
.is-style-ign-omlijnd .wp-block-button__link:hover { background: var(--ign-donker) !important; color: #fff !important; }
.has-groen-donker-background-color .is-style-ign-tekstlink .wp-block-button__link { color: #fff; }

/* ---------- header ---------- */
.ign-header-wrap { position: sticky; top: 0; z-index: 50; }
.admin-bar .ign-header-wrap { top: var(--wp-admin--admin-bar--height, 32px); }
.ign-header { background: #fff; border-bottom: 1px solid var(--ign-lijn); }
.ign-header__inner { min-height: var(--ign-header-h); gap: 1.5rem; }
.ign-logo { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; flex: none; }
.ign-logo img { width: 40px; height: 40px; }
.ign-logo__woord { font-family: var(--wp--preset--font-family--manrope); line-height: 1; white-space: nowrap; }
.ign-logo__woord strong { display: block; font-weight: 800; font-size: 1.15rem; letter-spacing: -.01em; color: var(--ign-donker); }
.ign-logo__woord span { display: block; font-weight: 600; font-size: .64rem; letter-spacing: .32em; text-transform: uppercase; color: var(--ign-groentekst); margin-top: .3rem; }
.ign-logo--wit .ign-logo__woord strong { color: #fff; }
.ign-logo--wit .ign-logo__woord span { color: var(--ign-groen); }
.ign-hoofdmenu { margin-left: auto; }
.ign-hoofdmenu .wp-block-navigation-item__content { text-decoration: none; color: var(--ign-donker); padding: .35rem 0; }
.ign-hoofdmenu .wp-block-navigation-item__content:hover { color: var(--ign-groentekst); }
.ign-hoofdmenu .ign-menu-check > a { color: var(--ign-groentekst); font-weight: 600; }
.ign-hoofdmenu .wp-block-navigation__submenu-container {
	border: 1px solid var(--ign-lijn) !important; border-radius: var(--ign-radius); padding: .5rem 0 !important;
	box-shadow: 0 12px 28px -12px rgba(16, 41, 28, .25); min-width: 240px !important;
}
.ign-hoofdmenu .wp-block-navigation__submenu-container a { padding: .5rem 1.1rem !important; }
.ign-header__acties { gap: 1.1rem; flex: none; }
.ign-header__tel { margin: 0; font-weight: 600; font-size: .95rem; white-space: nowrap; }
.ign-header__tel a { text-decoration: none; color: var(--ign-donker); }
.ign-header__acties .wp-block-button__link { padding: .75rem 1.15rem; font-size: .95rem; }
.ign-header__acties .wp-block-button__link::after { display: none !important; }

/* ---------- secties ---------- */
.ign-sectie { padding-top: var(--ign-sectie); padding-bottom: var(--ign-sectie); }
.ign-sectiekop { margin-bottom: clamp(1.5rem, 4vw, 3rem) !important; gap: 1rem 2rem; }
.ign-sectiekop h2 { margin: 0; max-width: 18ch; }
.ign-main > .alignfull + .alignfull { margin-top: 0; }

:where(.ign-sectie) h2 { margin-bottom: 1.1rem; }
:where(.ign-sectie) .ign-bovenregel + h2 { margin-top: 0; }

/* hero */
.ign-hero { padding-top: clamp(2.5rem, 6vw, 5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.ign-hero__kolommen { gap: clamp(2rem, 5vw, 5rem) !important; }
.ign-hero__titel { font-size: clamp(2.5rem, 5.4vw, 4.2rem) !important; max-width: 13ch; margin: 0 0 1.4rem !important; }
.ign-hero__intro { font-size: clamp(1.08rem, 1.6vw, 1.25rem); color: var(--ign-zacht); max-width: 34em; }
.ign-hero__knoppen { margin-top: 2rem !important; gap: 1rem 1.75rem; align-items: center; }
.ign-hero__contact { margin-top: 2.5rem !important; gap: 1rem; padding-top: 1.5rem; border-top: 1px solid var(--ign-lijn); max-width: 34em; }
.ign-hero__contact p { margin: 0; font-size: .95rem; line-height: 1.45; color: var(--ign-zacht); }
.ign-hero__contact strong, .ign-hero__contact a { color: var(--ign-donker); text-decoration: none; }
.ign-avatar { margin: 0 !important; flex: none; }
.ign-avatar img { border-radius: 50%; }

/* foto's met bijschrift */
.is-style-ign-foto { position: relative; margin: 0; }
.is-style-ign-foto img { width: 100%; display: block; border-radius: var(--ign-radius); }
.is-style-ign-foto figcaption {
	position: absolute; left: .75rem; bottom: .75rem; margin: 0; max-width: calc(100% - 1.5rem);
	background: rgba(255, 255, 255, .92); color: var(--ign-donker); font-size: .78rem; font-weight: 500;
	padding: .35rem .6rem; border-radius: 3px; line-height: 1.35;
}

/* snelstart */
.ign-snelstart { padding-top: 1.6rem; padding-bottom: 1.6rem; border-bottom: 1px solid var(--ign-lijn); }
.ign-snelstart__rij { gap: .75rem 1rem; }
.ign-snelstart__vraag { margin: 0; font-family: var(--wp--preset--font-family--manrope); font-weight: 700; font-size: clamp(1.15rem, 2vw, 1.4rem); color: var(--ign-donker); }
.ign-snelstart__keuzes { gap: .5rem; }
.ign-snelstart__keuzes .wp-block-button__link { font-size: 1rem; }
.ign-snelstart__twijfel { margin: 0 0 0 auto; font-size: .95rem; }
.ign-snelstart__twijfel a { color: var(--ign-zacht); }

/* diensten-index */
.ign-dienstregel { border-top: 1px solid var(--ign-lijn); padding: 1.75rem 0 1.5rem; margin-top: 0 !important; margin-bottom: 0 !important; gap: 1rem 2.5rem !important; }
.ign-dienstregel:last-of-type { border-bottom: 1px solid var(--ign-lijn); }
.ign-dienstregel__titel { margin: 0; font-size: clamp(1.4rem, 2.4vw, 1.9rem) !important; }
.ign-dienstregel__titel a { text-decoration: none; color: var(--ign-donker); }
.ign-dienstregel__titel a:hover { color: var(--ign-groentekst); }
.ign-dienstregel p { margin: 0; color: var(--ign-zacht); }
.ign-dienstregel__links { list-style: none; padding: 0; margin: 0; font-size: .95rem; }
.ign-dienstregel__links li { padding: .1rem 0; }
.ign-dienstregel__links a { color: var(--ign-donker); text-decoration: none; }
.ign-dienstregel__links a::before { content: "→ "; color: var(--ign-groentekst); }
.ign-dienstregel__links a:hover { text-decoration: underline; }
.ign-diensten__noot { max-width: var(--wp--style--global--wide-size) !important; margin-top: 1.5rem !important; color: var(--ign-zacht); font-size: .95rem; }

/* persoonlijk */
.ign-persoonlijk__kolommen { gap: clamp(2rem, 5vw, 5rem) !important; }
.ign-persoonlijk h2 { max-width: 16ch; }
.ign-persoonlijk__brief { font-size: 1.1rem; max-width: 36em; }
.ign-handtekening { margin-top: 2rem !important; font-family: var(--wp--preset--font-family--manrope); font-weight: 700; font-size: 1.2rem; color: var(--ign-donker); }
.ign-handtekening span { display: block; font-family: var(--wp--preset--font-family--inter); font-weight: 400; font-size: .9rem; color: var(--ign-zacht); }

/* lijst met lijnen */
.is-style-ign-lijnen { list-style: none; padding: 0 !important; margin-top: 1.75rem !important; }
.is-style-ign-lijnen > li { border-top: 1px solid rgba(16, 41, 28, .15); padding: .9rem 0; }
.is-style-ign-lijnen > li:last-child { border-bottom: 1px solid rgba(16, 41, 28, .15); }
.has-groen-donker-background-color .is-style-ign-lijnen > li { border-color: rgba(255, 255, 255, .16); }
.ign-doelgroepen a { display: grid; grid-template-columns: 1fr auto; gap: .1rem 1rem; text-decoration: none; color: #cfe0c9; }
.ign-doelgroepen a strong { color: #fff; font-family: var(--wp--preset--font-family--manrope); font-size: 1.1rem; grid-column: 1; }
.ign-doelgroepen a::after { content: "→"; color: var(--ign-groen); grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.ign-doelgroepen a:hover strong { text-decoration: underline; }
.ign-zakelijk__kolommen { gap: clamp(2rem, 5vw, 5rem) !important; }
.ign-zakelijk h2 { color: #fff; }
.ign-zakelijk p { color: #cfe0c9; }
.ign-zakelijk .wp-block-buttons { margin-top: 2rem; }
.ign-zakelijk figcaption { background: rgba(255, 255, 255, .9); }

/* werkwijze */
.ign-stappen { list-style: none; padding: 0; margin: 0; counter-reset: stap; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border-top: 2px solid var(--ign-donker); }
.ign-stappen > li { counter-increment: stap; padding: 1.25rem 1.5rem 0 0; color: var(--ign-zacht); font-size: .97rem; line-height: 1.55; }
.ign-stappen > li::before { content: counter(stap); display: block; font-family: var(--wp--preset--font-family--manrope); font-weight: 800; font-size: .9rem; color: var(--ign-groentekst); margin-bottom: .4rem; }
.ign-stappen > li strong { display: block; font-family: var(--wp--preset--font-family--manrope); font-size: 1.2rem; color: var(--ign-donker); margin-bottom: .35rem; }

/* werkgebied */
.ign-werkgebied .wp-block-columns { gap: clamp(2rem, 5vw, 5rem) !important; }

/* faq */
.ign-faq__lijst .wp-block-details { border-top: 1px solid var(--ign-lijn); padding: 1.15rem 0; margin: 0; }
.ign-faq__lijst .wp-block-details:last-child { border-bottom: 1px solid var(--ign-lijn); }
.wp-block-details summary {
	cursor: pointer; list-style: none; position: relative; padding-right: 2.5rem;
	font-family: var(--wp--preset--font-family--manrope); font-weight: 700; font-size: 1.12rem; color: var(--ign-donker);
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; position: absolute; right: .25rem; top: -.1rem; font-size: 1.5rem; font-weight: 400; color: var(--ign-groentekst); }
.wp-block-details[open] summary::after { content: "–"; }
.wp-block-details > p { color: var(--ign-zacht); margin-top: .75rem; max-width: 40em; }

/* afsluiter */
.ign-afsluiter h2 { max-width: 18ch; }
.ign-afsluiter .wp-block-buttons { gap: 1rem 1.75rem; align-items: center; margin-top: 1.75rem; }
.ign-afsluiter__bellen { display: flex; gap: 1.25rem; align-items: center; border-left: 1px solid rgba(16, 41, 28, .15); padding-left: clamp(1rem, 3vw, 2.5rem); }
.ign-afsluiter__bellen p { margin: 0; line-height: 1.5; }
.ign-afsluiter__bellen strong { font-family: var(--wp--preset--font-family--manrope); font-size: 1.35rem; color: var(--ign-donker); }
.ign-afsluiter__bellen a { text-decoration: none; color: inherit; }

/* paginakop (binnenpagina's) */
.ign-paginakop { padding-top: clamp(2rem, 5vw, 3.75rem); padding-bottom: clamp(1.5rem, 4vw, 3rem); border-bottom: 1px solid var(--ign-lijn); margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.ign-paginakop__titel { max-width: 20ch; margin: .5rem 0 0; font-size: clamp(2.1rem, 4.4vw, 3.3rem) !important; }
.ign-paginakop__intro { max-width: 40em; font-size: 1.15rem; color: var(--ign-zacht); margin-top: 1rem; }
.ign-paginakop--zakelijk { background: var(--ign-donker); color: #cfe0c9; border: 0; }
.ign-paginakop--zakelijk .ign-paginakop__titel { color: #fff; }
.ign-paginakop--zakelijk .ign-paginakop__intro, .ign-paginakop--zakelijk .ign-kruimelpad, .ign-paginakop--zakelijk .ign-kruimelpad a { color: #cfe0c9; }
.ign-paginakop--dienst { background: var(--ign-steen); border: 0; }
.ign-paginakop--smal > * { max-width: 720px; }
.ign-inhoud > * + * { margin-top: 1.25rem; }
.ign-inhoud--tool > * { max-width: 880px; }
.ign-inhoud--pagina > * { max-width: 760px; }
.ign-inhoud--pagina > .ign-rd, .ign-inhoud--pagina > .ign-subsidiecheck, .ign-inhoud--pagina > .wp-block-columns { max-width: 980px; }
.ign-inhoud--pagina > h2 { margin-top: 3rem; }
.ign-inhoud--pagina { font-size: 1.06rem; }
.ign-inhoud--tool > h2 { margin-top: 3rem; }
.ign-tool { padding-bottom: var(--ign-sectie); }
.ign-inhoud h2 { margin-top: 2.75rem; }
.ign-inhoud > .alignfull { margin-top: var(--ign-sectie); }

/* kruimelpad (plugin-blok) */
.ign-kruimelpad { font-size: .85rem; color: var(--ign-zacht); }
.ign-kruimelpad ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .25rem .5rem; }
.ign-kruimelpad li + li::before { content: "/"; margin-right: .5rem; opacity: .5; }
.ign-kruimelpad a { color: inherit; }

/* notitie */
.is-style-ign-notitie { border: 1px solid var(--ign-lijn); border-left: 3px solid var(--ign-groen); padding: 1.1rem 1.25rem; border-radius: var(--ign-radius); background: #fff; }

/* artikellijst */
.ign-artikelen .wp-block-post-title a { text-decoration: none; }
.ign-artikelen .wp-block-post-featured-image img { border-radius: var(--ign-radius); }
.ign-leeg { color: var(--ign-zacht); border: 1px dashed var(--ign-lijn); padding: 1.5rem; border-radius: var(--ign-radius); }
.ign-artikel .wp-block-post-content { font-size: 1.08rem; }
.ign-404 { padding: var(--ign-sectie) 0; }

/* footer */
.ign-footer { padding-top: clamp(3.5rem, 7vw, 5rem); padding-bottom: 2rem; color: #b8cbb4; font-size: .95rem; }
.ign-footer__kolommen { gap: 2.5rem !important; }
.ign-footer__slogan { font-family: var(--wp--preset--font-family--manrope); font-weight: 700; font-size: 1.25rem; line-height: 1.3; color: #fff; margin-top: 1.5rem !important; }
.ign-footer__intro { color: #b8cbb4; }
.ign-footer__kop { font-size: .95rem !important; color: #fff !important; margin-bottom: 1rem; letter-spacing: 0; }
.ign-footer__lijst { list-style: none; padding: 0; margin: 0; }
.ign-footer__lijst li { padding: .25rem 0; }
.ign-footer a { color: #b8cbb4; text-decoration: none; }
.ign-footer a:hover { color: #fff; text-decoration: underline; }
.ign-footer__onder { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 3rem !important; padding-top: 1.5rem; font-size: .85rem; gap: .5rem 2rem; }
.ign-footer__onder p { margin: 0; }
.ign-footer__juridisch a + a { margin-left: 1.1rem; }

/* mobiele actiebalk */
.ign-mobiele-balk { display: none; }

/* =========================================================
   Tablet en mobiel
   ========================================================= */
@media (max-width: 1080px) {
	.ign-header__tel { display: none; }
	.ign-stappen { grid-template-columns: 1fr 1fr 1fr; row-gap: 1.5rem; }
}
@media (max-width: 781px) {
	:root { --ign-header-h: 64px; }
	.ign-header__acties .wp-block-buttons { display: none; }
	.ign-hoofdmenu { order: 3; }
	.ign-hero__titel { max-width: none; }
	.ign-snelstart__twijfel { margin-left: 0; width: 100%; }
	.ign-dienstregel { gap: .6rem !important; padding: 1.4rem 0; }
	.ign-stappen { grid-template-columns: 1fr; border-top: 0; border-left: 2px solid var(--ign-donker); }
	.ign-stappen > li { padding: 0 0 1.25rem 1.25rem; }
	.ign-afsluiter__bellen { border-left: 0; padding-left: 0; border-top: 1px solid rgba(16, 41, 28, .15); padding-top: 1.5rem; }
	.ign-footer__kolommen { display: grid !important; grid-template-columns: 1fr 1fr; }
	.ign-footer__kolommen > .wp-block-column:first-child { grid-column: 1 / -1; }
	.ign-footer__juridisch a { display: inline-block; margin: 0 1rem .4rem 0 !important; }
	body { padding-bottom: 72px; }
	.ign-mobiele-balk {
		display: flex; position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; gap: .6rem;
		padding: .6rem .9rem calc(.6rem + env(safe-area-inset-bottom)); background: #fff;
		border-top: 1px solid var(--ign-lijn); box-shadow: 0 -8px 24px rgba(16, 41, 28, .08);
	}
	.ign-mobiele-balk a {
		flex: 1; display: flex; align-items: center; justify-content: center; height: 48px; border-radius: var(--ign-radius);
		font-weight: 600; text-decoration: none; font-size: 1rem;
	}
	.ign-mobiele-balk__bel { border: 1.5px solid var(--ign-donker); color: var(--ign-donker); }
	.ign-mobiele-balk__offerte { background: var(--ign-groen); color: var(--ign-donker); }
}
@media print {
	.ign-header-wrap, .ign-mobiele-balk, .ign-footer { display: none; }
}
/* Geen dubbele offerteknop op pagina's die zelf al een formulier of de check bevatten. */
@media (max-width: 781px) {
	body:has(.ign-inhoud--tool) .ign-mobiele-balk { display: none; }
	body:has(.ign-inhoud--tool) { padding-bottom: 0; }
}

/* =========================================================
   Ontwerpronde 2 – menselijker, met details die laten zien dat er over is nagedacht
   ========================================================= */
:root { --ign-serif: var(--wp--preset--font-family--serif, Georgia, serif); --ign-papier: #FFFDF8; }

/* Hero: tekst links, rechts een projectfoto met een offertevoorbeeld erop "neergelegd" */
.ign-hero { position: relative; overflow: hidden; padding-top: clamp(2.5rem, 6vw, 5.5rem); padding-bottom: clamp(3.5rem, 7vw, 6rem); }
.ign-hero__plaats { font-size: .95rem; font-weight: 600; color: var(--ign-groentekst); margin: 0 0 1rem !important; display: flex; align-items: center; gap: .6rem; }
.ign-hero__plaats::before { content: ""; width: 10px; height: 10px; background: var(--ign-groen); clip-path: polygon(0 0, 70% 0, 100% 30%, 100% 100%, 0 100%); }
.ign-hero__titel { max-width: 12ch; }
.ign-onderstreept { background: none; color: inherit; position: relative; white-space: nowrap; padding: 0; }
.ign-onderstreept::after {
	content: ""; position: absolute; left: -2%; right: -4%; bottom: -.16em; height: .32em; pointer-events: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M3 11 C 40 4, 80 4, 118 8 S 175 13, 197 6' fill='none' stroke='%2379B928' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.ign-hero__intro { max-width: 31em; }
.ign-hero__contact { max-width: 30em; }
.ign-hero__contact p { font-size: .95rem; }

.ign-hero__beeld { position: relative; }
.ign-hero__beeld::before { /* millimeterpapier: knipoog naar de bouwtekening */
	content: ""; position: absolute; inset: -6% -40% -10% 8%; z-index: 0; opacity: .55; pointer-events: none;
	background-image: linear-gradient(var(--ign-lijn) 1px, transparent 1px), linear-gradient(90deg, var(--ign-lijn) 1px, transparent 1px);
	background-size: 24px 24px;
	-webkit-mask-image: radial-gradient(ellipse at 60% 45%, #000 30%, transparent 72%); mask-image: radial-gradient(ellipse at 60% 45%, #000 30%, transparent 72%);
}
.ign-hero__foto { position: relative; z-index: 1; width: 82%; margin-left: auto !important; }
.ign-hero__foto figcaption { left: auto; right: .75rem; top: .75rem; bottom: auto; }
.ign-offertevoorbeeld {
	position: absolute; z-index: 2; left: 0; bottom: 4.5rem; width: min(400px, 80%);
	background: var(--ign-papier); border: 1px solid #E7E1D3; border-radius: 3px; padding: 1.2rem 1.25rem 1rem;
	box-shadow: 0 1px 0 rgba(16, 41, 28, .04), 0 28px 44px -26px rgba(16, 41, 28, .45);
	transform: rotate(-1.6deg);
}
.ign-offertevoorbeeld::before { /* stukje tape */
	content: ""; position: absolute; top: -11px; left: 42%; width: 74px; height: 22px; transform: rotate(3deg);
	background: rgba(234, 242, 233, .85); border: 1px solid rgba(121, 185, 40, .25);
}
.ign-offertevoorbeeld__kop { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin: 0 0 .7rem !important; padding-bottom: .55rem; border-bottom: 2px solid var(--ign-donker); }
.ign-offertevoorbeeld__kop strong { font-family: var(--wp--preset--font-family--manrope); font-size: 1.05rem; color: var(--ign-donker); letter-spacing: -.01em; }
.ign-offertevoorbeeld__kop span { font-size: .72rem; color: var(--ign-zacht); }
.ign-offertevoorbeeld__tabel { margin: 0 !important; }
.ign-offertevoorbeeld__tabel table { width: 100%; border-collapse: collapse; font-size: .8rem; font-variant-numeric: tabular-nums; }
.ign-offertevoorbeeld__tabel th { font-weight: 600; font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ign-zacht); text-align: left; padding: 0 .4rem .35rem 0; border: 0; }
.ign-offertevoorbeeld__tabel td { padding: .45rem .4rem .45rem 0; border: 0; border-top: 1px dashed #D9D3C4; color: var(--ign-inkt); vertical-align: top; }
.ign-offertevoorbeeld__tabel td:last-child, .ign-offertevoorbeeld__tabel th:last-child { text-align: right; padding-right: 0; font-weight: 700; color: var(--ign-groentekst); }
.ign-offertevoorbeeld__tabel td:nth-child(3), .ign-offertevoorbeeld__tabel th:nth-child(3) { text-align: right; }
.ign-offertevoorbeeld__voet { margin: .6rem 0 0 !important; padding-top: .55rem; border-top: 1px solid #E7E1D3; font-size: .78rem; color: var(--ign-zacht); }
.ign-annotatie {
	position: relative; z-index: 2; margin: 1.1rem 0 0 auto !important; max-width: 24ch; padding-left: 58px;
	font-family: var(--ign-serif); font-style: italic; font-size: 1.02rem; line-height: 1.35; color: var(--ign-groentekst);
}
.ign-annotatie::before {
	content: ""; position: absolute; left: 0; top: -24px; width: 50px; height: 40px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 40'%3E%3Cpath d='M46 34 C 34 34, 18 30, 9 8' fill='none' stroke='%233F6B10' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M4 15 L9 7 L16 13' fill='none' stroke='%233F6B10' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat;
}

/* Secties zonder labels: de kop draagt de sectie */
.ign-sectie h2 { font-size: clamp(1.9rem, 3.4vw, 2.6rem) !important; max-width: 20ch; }

/* Diensten-index met doorsnede-icoontjes (het "De Laag"-motief) */
.ign-dienstregel__titel::before { content: ""; display: block; width: 46px; height: 30px; margin-bottom: .75rem; background-repeat: no-repeat; background-position: left center; }
.ign-dienstregel--dak .ign-dienstregel__titel::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 30'%3E%3Cpath d='M3 25 L23 6 L43 25' fill='none' stroke='%2310291C' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M10 27.5 L23 15 L36 27.5' fill='none' stroke='%2379B928' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ign-dienstregel--vloer .ign-dienstregel__titel::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 30'%3E%3Crect x='2' y='6' width='42' height='3' fill='%2310291C'/%3E%3Crect x='2' y='11' width='42' height='6' fill='%2379B928'/%3E%3Crect x='7' y='17' width='4' height='9' fill='%2310291C'/%3E%3Crect x='21' y='17' width='4' height='9' fill='%2310291C'/%3E%3Crect x='35' y='17' width='4' height='9' fill='%2310291C'/%3E%3C/svg%3E"); }
.ign-dienstregel--bodem .ign-dienstregel__titel::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 30'%3E%3Crect x='2' y='4' width='42' height='3' fill='%2310291C'/%3E%3Cpath d='M6 7v10M40 7v10' stroke='%2310291C' stroke-width='2'/%3E%3Crect x='2' y='19' width='42' height='5' fill='%2379B928'/%3E%3Cpath d='M2 27h42' stroke='%2310291C' stroke-width='1.5' stroke-dasharray='3 3'/%3E%3C/svg%3E"); }
.ign-dienstregel--spouw .ign-dienstregel__titel::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 30'%3E%3Crect x='8' y='2' width='7' height='26' fill='%2310291C'/%3E%3Crect x='17' y='2' width='10' height='26' fill='%2379B928'/%3E%3Crect x='29' y='2' width='7' height='26' fill='%2310291C' opacity='.55'/%3E%3C/svg%3E"); }
.ign-dienstregel { transition: background-color .2s; }
.ign-dienstregel__titel a { display: inline-flex; align-items: baseline; gap: .5rem; }
.ign-dienstregel__titel a::after { content: "→"; font-size: .7em; color: var(--ign-groentekst); opacity: 0; transform: translateX(-6px); transition: opacity .2s, transform .2s; }
.ign-dienstregel:hover .ign-dienstregel__titel a::after { opacity: 1; transform: none; }

/* Persoonlijk: als een brief */
.ign-persoonlijk h2 { font-size: clamp(1.6rem, 2.6vw, 2rem) !important; margin-bottom: 1.5rem; }
.ign-persoonlijk__brief { font-family: var(--ign-serif); font-size: clamp(1.15rem, 1.6vw, 1.32rem); line-height: 1.6; color: var(--ign-inkt); max-width: 34em; }
.ign-persoonlijk__foto img { box-shadow: -16px 16px 0 rgba(16, 41, 28, .08); }
.ign-beloftes { font-size: 1rem; }
.ign-handtekening { font-family: var(--ign-serif); font-style: italic; font-weight: 500; font-size: 1.7rem; letter-spacing: -.01em; margin-top: 2.25rem !important; }
.ign-handtekening span { font-style: normal; margin-top: .2rem; }

/* Zakelijk: typografisch, zonder foto */
.ign-zakelijk h2 { font-size: clamp(2rem, 3.6vw, 2.9rem) !important; max-width: 14ch; }
.ign-zakelijk__intro { font-size: 1.1rem; max-width: 30em; }
.ign-zakelijk .wp-block-buttons { margin-top: 2rem; }
.ign-zakelijk .ign-doelgroepen { margin-top: .4rem !important; }

/* Werkgebied: schematische kaart */
.ign-kaart-nh { margin: 0 auto; max-width: 430px; }
.ign-kaart-nh svg { width: 100%; height: auto; display: block; overflow: visible; }
.ign-kaart-nh figcaption { font-size: .8rem; color: var(--ign-zacht); margin-top: .75rem; text-align: center; }

@media (max-width: 781px) {
	.ign-hero__titel { max-width: none; }
	.ign-hero__foto { width: 100%; }
	.ign-hero__beeld::before { display: none; }
	.ign-offertevoorbeeld { position: relative; left: auto; bottom: auto; width: auto; margin: -3.5rem .75rem 0; }
	.ign-annotatie { margin-left: 1rem !important; max-width: none; padding-left: 58px; margin-top: 1.75rem !important; }
	.ign-persoonlijk__foto { max-width: 280px; }
	.ign-kaart-nh { max-width: 320px; }
}

/* Groene knoppen altijd met witte tekst (keuze opdrachtgever). */
.wp-block-button:not(.is-style-ign-tekstlink):not(.is-style-ign-omlijnd) .wp-block-button__link { color: #fff; font-weight: 700; }
.wp-block-button:not(.is-style-ign-tekstlink):not(.is-style-ign-omlijnd) .wp-block-button__link:hover { background-color: #5E9A1A; color: #fff; }
.ign-mobiele-balk__offerte { color: #fff !important; font-weight: 700 !important; }

.ign-kaart-nh text { paint-order: stroke; stroke: #F4F2EC; stroke-width: 4px; stroke-linejoin: round; }
.ign-sectie h2 + p, .ign-sectie h2 + .wp-block-list { margin-top: 1.25rem !important; }
.ign-offertevoorbeeld__tabel td:nth-child(n+2), .ign-offertevoorbeeld__tabel th:nth-child(n+2) { white-space: nowrap; }
@media (max-width: 781px) {
	.ign-offertevoorbeeld__tabel table { font-size: .74rem; }
	.ign-offertevoorbeeld__tabel td:nth-child(3), .ign-offertevoorbeeld__tabel th:nth-child(3) { display: none; }
	.ign-offertevoorbeeld__kop span { font-size: .66rem; }
}

/* Hero zonder offertevoorbeeld: de foto draagt het beeld. */
.ign-hero__foto { width: 100%; }
.ign-hero__foto figcaption { top: auto; bottom: .75rem; left: .75rem; right: auto; }

/* =========================================================
   Ontwerpronde 4 – grote foto, durf met kleur, zachte vormen
   ========================================================= */
:root { --ign-rond: 16px; }

/* Header over de hero (alleen homepage) */
.ign-header-wrap--over { position: fixed; left: 0; right: 0; top: 0; z-index: 60; transition: background-color .25s, box-shadow .25s; }
.admin-bar .ign-header-wrap--over { top: var(--wp-admin--admin-bar--height, 32px); }
.ign-header-wrap--over .ign-header { background: transparent; border-bottom-color: transparent; transition: background-color .25s; }
.ign-header-wrap--over.is-gescrold .ign-header { background: var(--ign-donker); box-shadow: 0 6px 24px rgba(0, 0, 0, .18); }
.ign-header-wrap--over .ign-logo__woord strong,
.ign-header-wrap--over .ign-hoofdmenu .wp-block-navigation-item__content,
.ign-header-wrap--over .ign-header__tel, .ign-header-wrap--over .ign-header__tel a { color: #fff; }
.ign-header-wrap--over .ign-logo__woord span { color: var(--ign-groen); }
.ign-header-wrap--over .ign-hoofdmenu .ign-menu-check > a { color: var(--ign-groen); }
.ign-header-wrap--over .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--ign-donker) !important; }
.ign-header-wrap--over .wp-block-navigation__responsive-container-open svg { fill: #fff; }
.ign-header-wrap--over .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { color: var(--ign-donker); }
.ign-header-wrap--over .ign-logo img { content: url("../img/beeldmerk-wit.svg"); }

/* Hero met grote foto */
.ign-hero-foto { padding-top: calc(var(--ign-header-h) + 3rem) !important; padding-bottom: 4rem !important; }
.ign-hero-foto .wp-block-cover__background { background: linear-gradient(90deg, rgba(16, 41, 28, .94) 0%, rgba(16, 41, 28, .78) 45%, rgba(16, 41, 28, .35) 100%) !important; opacity: 1 !important; }
.ign-hero-foto__tekst { max-width: 1240px; }
.ign-hero-foto .ign-hero__titel { color: #fff; font-size: clamp(2.5rem, 5.6vw, 4.6rem) !important; max-width: 13ch; }
.ign-hero-foto .ign-groen { color: var(--ign-groen); }
.ign-hero-foto .ign-hero__plaats { color: #cfe3c4; }
.ign-hero-foto .ign-hero__intro { color: #e3eedd; max-width: 32em; font-size: clamp(1.08rem, 1.5vw, 1.22rem); }
.ign-hero-foto .is-style-ign-tekstlink .wp-block-button__link { color: #fff; }

/* Stappen + formulier */
.ign-stappen-sectie__kolommen { gap: clamp(2.5rem, 6vw, 6rem) !important; align-items: flex-start; }
.ign-stappen-sectie h2 { color: #fff; max-width: 16ch; margin-bottom: 2.25rem; }
.ign-rondjes { list-style: none; padding: 0; margin: 0; counter-reset: r; }
.ign-rondjes > li { counter-increment: r; position: relative; padding: 0 0 2rem 4rem; color: #cfe0c9; line-height: 1.55; }
.ign-rondjes > li::before { content: counter(r); position: absolute; left: 0; top: -.15rem; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--ign-groen); color: var(--ign-donker); font: 800 1.05rem/2.6rem var(--wp--preset--font-family--manrope); text-align: center; }
.ign-rondjes > li:not(:last-child)::after { content: ""; position: absolute; left: 1.3rem; top: 2.8rem; bottom: .4rem; width: 1px; background: rgba(255, 255, 255, .18); }
.ign-rondjes > li strong { display: block; color: #fff; font-family: var(--wp--preset--font-family--manrope); font-size: 1.2rem; margin-bottom: .3rem; }
.ign-formulierkaart { background: #fff; color: var(--ign-inkt); border-radius: var(--ign-rond); padding: clamp(1.5rem, 3vw, 2.5rem) !important; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .5); }
.ign-formulierkaart__kop { color: var(--ign-donker) !important; margin: 0 0 .4rem !important; font-size: 1.6rem !important; }
.ign-formulierkaart__intro { color: var(--ign-zacht); margin: 0 0 1.5rem !important; font-size: .98rem; }
.ign-offerte--kort .ign-form__knoppen--kort { border-top: 0; padding-top: 0; margin-top: .5rem; }
.ign-offerte--kort .ign-form__knoppen--kort .ign-knop { width: 100%; }
.ign-offerte--kort__meer { margin-top: 1rem !important; }
.ign-offerte--kort .ign-veld { margin-bottom: .85rem; }

/* Zachte vormen */
.is-style-ign-foto img, .ign-rd, .ign-kaart, .ign-leeg-blok { border-radius: var(--ign-rond) !important; }
.ign-rd__resultaat { border-radius: 10px; }

/* Projecten op donkergroen: grote fotokaarten */
.ign-projectensectie h2 { color: #fff; }
.ign-projectensectie .ign-projecten { margin-top: 0; }
.ign-projectensectie .ign-projecten__grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.ign-projectensectie .ign-project a { position: relative; border-radius: var(--ign-rond); overflow: hidden; }
.ign-projectensectie .ign-project img { aspect-ratio: 16/10; border-radius: 0; }
.ign-projectensectie .ign-project a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(16, 41, 28, .85)); }
.ign-projectensectie .ign-project__titel, .ign-projectensectie .ign-project__plaats { position: absolute; left: 1.4rem; z-index: 1; color: #fff; }
.ign-projectensectie .ign-project__titel { bottom: 2.6rem; font-size: 1.35rem; }
.ign-projectensectie .ign-project__plaats { bottom: 1.3rem; color: var(--ign-groen); margin: 0; }

/* Diensten op lichtgroen */
.ign-diensten .ign-dienstregel { border-color: rgba(16, 41, 28, .14); }

@media (max-width: 781px) {
	.ign-hero-foto { min-height: 92vh !important; }
	.ign-hero-foto .wp-block-cover__background { background: rgba(16, 41, 28, .82) !important; }
	.ign-rondjes > li { padding-left: 3.4rem; }
}
.ign-hero-foto .wp-block-cover__inner-container { width: 100%; }
.ign-hero-foto__tekst { width: 100%; max-width: var(--wp--style--global--wide-size, 1240px) !important; margin-inline: auto !important; }
.wp-block-cover.ign-hero-foto .wp-block-cover__inner-container { width: 100% !important; max-width: none !important; margin: 0 !important; }

/* Woningcheck direct onder de hero: kaart schuift over de foto heen. */
.ign-woningcheck-sectie { padding-top: 0 !important; display: flow-root; }
.ign-woningcheck-sectie .ign-wc { position: relative; z-index: 2; margin-top: -96px !important; }
@media (max-width: 781px) { .ign-woningcheck-sectie .ign-wc { margin-top: -40px !important; } }
.ign-hero-foto:has(+ .ign-woningcheck-sectie) { padding-bottom: 160px !important; }
@media (max-width: 781px) { .ign-hero-foto:has(+ .ign-woningcheck-sectie) { padding-bottom: 80px !important; } }
.ign-kaart-nh--beeld { max-width: 560px; margin: 0 auto; }
.ign-kaart-nh--beeld img { width: 100%; height: auto; display: block; }
.ign-inhoud--tool > .ign-wc { max-width: 1180px; }
