/* =========================================================================
   Industrial Blunor — main stylesheet (the ONLY stylesheet).
   Token-driven · mobile-first · NL e-commerce.
   Palette: warm infrared on near-white. Tokens: Customizer → Ontwerpsysteem.
   ========================================================================= */

/* ---------- 1. Design tokens (LOCKED — Phase 0) ----------------------- */

:root {
	/* Colours, fonts + radii come from inc/design-system.php (Customizer → Ontwerpsysteem).
	   Palette — matched to the Industrial Blunor logo (orange #F58124, grey #4D4D4D, gold #FBC015) */
	--iv-warm-100:      #ffedd5;   /* card hover / chips */
	/* Brand gradient (mirrors the V-mark sunburst) */
	--iv-grad-warm:     linear-gradient(135deg, #4d4d4d 0%, #c79d26 30%, #fbc015 50%, #f58124 100%);

	/* Type */

	/* Type scale */
	--iv-fs-h1: clamp(2.25rem, 4vw + 1rem, 3.75rem);
	--iv-fs-h2: clamp(1.75rem, 2.5vw + 1rem, 2.75rem);
	--iv-fs-h3: clamp(1.25rem, 1vw + 1rem, 1.75rem);
	--iv-fs-h4: 1.25rem;
	--iv-fs-body: 1rem;
	--iv-fs-small: 0.875rem;

	/* Spacing (8pt scale) */
	--iv-s-1: 0.5rem;
	--iv-s-2: 1rem;
	--iv-s-3: 1.5rem;
	--iv-s-4: 2rem;
	--iv-s-5: 3rem;
	--iv-s-6: 4rem;
	--iv-s-7: 6rem;

	/* Layout — outer max 1380 so the CONTENT area is 1340px after the 20px
	   gutters (client asked for a 1340 content width; was 1300). */
	--iv-container-max: 1380px;
	--iv-gutter: 20px;

	/* Radii */
	--iv-radius-lg: 20px;
	--iv-radius-pill: 999px;

	/* Shadows */
	--iv-shadow-sm: 0 1px 2px rgba(0,0,0,.06);
	--iv-shadow-md: 0 8px 24px rgba(0,0,0,.08);
	--iv-shadow-lg: 0 20px 48px rgba(0,0,0,.12);

	/* Easing */
	--iv-ease: cubic-bezier(.2,.8,.2,1);
}

/* ---------- 2. Reset ---------------------------------------------------- */

*,*::before,*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--iv-font-body);
	font-size: var(--iv-fs-body);
	line-height: 1.6;
	color: var(--iv-ink);
	background: var(--iv-paper);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img,svg,video { max-width: 100%; height: auto; display: block; }
/* WP emoji <img>s in client-pasted content: we strip WP's inline emoji CSS
   (enqueue.php §5), so without this rule the img reset above blows the SVGs
   up to full container width (seen as 1300px "blobs" in product descriptions). */
img.emoji, img.wp-smiley { display: inline-block; width: 1em; height: 1em; max-width: 1em; margin: 0 0.07em; vertical-align: -0.1em; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--iv-accent); outline-offset: 2px; border-radius: 4px; }

/* ---------- 3. Typography ---------------------------------------------- */

h1,h2,h3,h4 {
	font-family: var(--iv-font-display);
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--iv-ink);
	margin: 0 0 var(--iv-s-2);
}
h1 { font-size: var(--iv-fs-h1); }
h2 { font-size: var(--iv-fs-h2); }
h3 { font-size: var(--iv-fs-h3); }
h4 { font-size: var(--iv-fs-h4); font-family: var(--iv-font-body); font-weight: 600; }
p  { margin: 0 0 1em; color: var(--iv-ink-soft); }

.iv_eyebrow {
	display: inline-block;
	font-family: var(--iv-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	/* accent-deep, not accent: 11px orange on cream was 2.6:1 (WCAG fail,
	 * flagged by Lighthouse). Dark-section eyebrows override with gold. */
	color: var(--iv-accent-deep);
	margin-bottom: var(--iv-s-2);
}

/* ---------- 4. Layout primitives -------------------------------------- */

.iv_container {
	width: 100%;
	max-width: var(--iv-container-max);
	margin: 0 auto;
	padding: 0 var(--iv-gutter);
}
.iv_section { padding: clamp(48px, 8vw, 112px) 0; }
.iv_section-paper { background: var(--iv-paper); }
.iv_section-warm  { background: var(--iv-warm-50); }
.iv_section-stone { background: var(--iv-stone-100); }
.iv_section-ink   { background: var(--iv-ink); color: var(--iv-paper); }
.iv_section-ink h1, .iv_section-ink h2, .iv_section-ink h3, .iv_section-ink p { color: inherit; }

.iv_grid { display: grid; gap: var(--iv-s-3); }
.iv_grid-2 { grid-template-columns: 1fr; }
.iv_grid-3 { grid-template-columns: 1fr; }
.iv_grid-4 { grid-template-columns: 1fr; }
@media (min-width: 640px)  { .iv_grid-2 { grid-template-columns: repeat(2,1fr); }
                              .iv_grid-4 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .iv_grid-3 { grid-template-columns: repeat(3,1fr); }
                              .iv_grid-4 { grid-template-columns: repeat(4,1fr); } }

.iv_actions-row { display: flex; flex-wrap: wrap; gap: var(--iv-s-2); }
.iv_empty { text-align: center; padding: var(--iv-s-7) 0; }

/* ---------- 5. Buttons ------------------------------------------------- */

.iv_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 26px;
	font-family: var(--iv-font-body);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	border-radius: var(--iv-radius-pill);
	border: 1.5px solid transparent;
	transition: background .2s var(--iv-ease), color .2s var(--iv-ease), border-color .2s var(--iv-ease), transform .15s var(--iv-ease);
	cursor: pointer;
	text-decoration: none;
	line-height: 1;
}
.iv_btn:hover { transform: translateY(-1px); }
.iv_btn-primary {
	background: var(--iv-accent-deep);
	color: #fff;
	border-color: var(--iv-accent);
}
.iv_btn-primary:hover {
	background: var(--iv-accent-deep-2);
	border-color: var(--iv-accent-2);
}
.iv_btn-secondary {
	background: var(--iv-ink);
	color: var(--iv-paper);
	border-color: var(--iv-ink);
}
.iv_btn-secondary:hover { background: #000; border-color: #000; }
.iv_btn-outline {
	background: transparent;
	color: var(--iv-ink);
	border-color: var(--iv-ink);
}
.iv_btn-outline:hover {
	background: var(--iv-ink);
	color: var(--iv-paper);
}

/* ---------- 6. Forms (baseline) --------------------------------------- */

input[type="text"],input[type="email"],input[type="tel"],input[type="search"],
input[type="number"],input[type="password"],select,textarea {
	width: 100%;
	padding: 12px 14px;
	font: inherit;
	color: var(--iv-ink);
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-sm);
	transition: border-color .15s var(--iv-ease);
}
input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--iv-accent);
}

.iv_searchform { display: flex; gap: 8px; }
.iv_searchform input[type="search"] { flex: 1; }

/* ---------- 7. Brand mark --------------------------------------------- */

.iv_brand {
	display: inline-flex;
	align-items: center;
	font-family: var(--iv-font-display);
	font-size: 1.625rem;
	color: var(--iv-ink);
	text-decoration: none;
	letter-spacing: -0.01em;
}
.iv_brand img,
.iv_brand-mark,
.custom-logo,
.custom-logo-link img {
	display: block;
	height: 52px !important;   /* +30% from previous 40px (client request 2026-06-09) */
	width: auto !important;
	max-width: 286px !important;
	image-rendering: -webkit-optimize-contrast; /* keeps SVG crisp on hi-DPI */
}
@media (min-width: 1024px) {
	.iv_brand img,
	.iv_brand-mark,
	.custom-logo,
	.custom-logo-link img { height: 62px !important; max-width: 364px !important; } /* +30% from previous 48 / 280 */
}

/* ---------- 8. Header (two rows on desktop, single row on mobile) ---- */

.iv_skip-link {
	position: absolute;
	top: 0; left: 0;
	background: var(--iv-ink);
	color: #fff;
	padding: 8px 12px;
	text-decoration: none;
	z-index: 100;
	transform: translateY(-110%);
	transition: transform .15s var(--iv-ease);
}
.iv_skip-link:focus { transform: translateY(0); }

.iv_site-header {
	background: var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-100);
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate(180%) blur(8px);
	-webkit-backdrop-filter: saturate(180%) blur(8px);
}

.iv_header-top {
	padding: 10px 0;
}
.iv_header-top-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--iv-s-3);
}

.iv_header-actions {
	display: flex;
	align-items: center;
	gap: 6px;
}

/* Desktop inline search pill — clicking opens the search overlay */
.iv_search-pill {
	display: none;
	align-items: center;
	gap: 10px;
	width: 320px;
	max-width: 36vw;
	padding: 10px 14px;
	background: var(--iv-warm-50);
	border: 1.5px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-pill);
	color: var(--iv-ink-muted);
	font: inherit;
	font-size: 0.875rem;
	text-align: left;
	cursor: pointer;
	transition: background .15s var(--iv-ease), border-color .15s var(--iv-ease), color .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_search-pill:hover,
.iv_search-pill:focus-visible {
	background: var(--iv-paper);
	border-color: var(--iv-accent);
	color: var(--iv-ink-soft);
	box-shadow: 0 0 0 4px var(--iv-accent-soft);
	outline: none;
}
.iv_search-pill svg { color: var(--iv-accent); flex: 0 0 auto; }
.iv_search-pill-text {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.iv_search-pill-key {
	display: none;
	padding: 2px 7px;
	font-size: 0.6875rem;
	font-weight: 600;
	color: var(--iv-ink-muted);
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 4px;
	flex: 0 0 auto;
}
@media (min-width: 1024px) {
	.iv_search-pill         { display: inline-flex; }
	.iv_search-pill-key     { display: inline-block; }
	.iv_search-icon-only    { display: none; }
}

.iv_icon-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 50%;
	color: var(--iv-ink);
	cursor: pointer;
	text-decoration: none;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), border-color .15s var(--iv-ease);
}
.iv_icon-btn:hover {
	background: var(--iv-warm-50);
	color: var(--iv-accent);
}
.iv_icon-btn:focus-visible {
	border-color: var(--iv-accent);
}

.iv_cart-link { position: relative; }
.iv_cart-count {
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--iv-accent-deep);
	color: #fff;
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	box-shadow: 0 0 0 2px var(--iv-paper);
	transition: transform .15s var(--iv-ease);
}
.iv_cart-count.is-empty { display: none; }
body.iv_cart-bump .iv_cart-count { transform: scale(1.18); }

/* Row 2 — desktop nav (dark ink bar with orange hover + gradient accent) */
.iv_header-nav {
	display: none;
	position: relative;
	background: var(--iv-ink);
	color: var(--iv-paper);
}
.iv_header-nav::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	animation: iv_grad-shift 14s linear infinite;
}
@keyframes iv_grad-shift {
	0%   { background-position:   0% 50%; }
	50%  { background-position: 100% 50%; }
	100% { background-position:   0% 50%; }
}
@media (min-width: 1024px) {
	.iv_header-nav { display: block; }
	.iv_menu-toggle { display: none; }
}

.iv_primary-nav { padding: 0; }
.iv_primary-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
}
.iv_primary-menu > li {
	position: relative;
	display: flex;
}
.iv_primary-menu > li > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 14px 11px;   /* 11px keeps all 9 top-level items on one line within the 1300px container (was 18px, wrapped after the Bereken-vermogen item was added, 1.18.0) */
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: rgba(255,255,255,0.85);
	text-decoration: none;
	transition: color .18s var(--iv-ease), background .18s var(--iv-ease);
}
/* Bottom-edge "tab" indicator — full-width orange bar */
.iv_primary-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0;
	bottom: 0;
	height: 3px;
	background: var(--iv-accent);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .22s var(--iv-ease);
}
/* Hover state — subtle, transient */
.iv_primary-menu > li:hover > a,
.iv_primary-menu > li:focus-within > a {
	color: #ffffff;
	background: rgba(255,255,255,0.05);
}
.iv_primary-menu > li:hover > a::after,
.iv_primary-menu > li:focus-within > a::after {
	transform: scaleX(1);
}
/* Active state — clearly differentiated from hover (brighter, with text-tint) */
.iv_primary-menu > .current-menu-item > a,
.iv_primary-menu > .current-menu-parent > a,
.iv_primary-menu > .current-menu-ancestor > a,
.iv_primary-menu > .current_page_parent > a,
.iv_primary-menu > .current_page_ancestor > a {
	color: #ffffff;
	background: linear-gradient(180deg, rgba(245,129,36,0.18) 0%, rgba(245,129,36,0.05) 100%);
}
.iv_primary-menu > .current-menu-item > a::after,
.iv_primary-menu > .current-menu-parent > a::after,
.iv_primary-menu > .current-menu-ancestor > a::after,
.iv_primary-menu > .current_page_parent > a::after,
.iv_primary-menu > .current_page_ancestor > a::after {
	transform: scaleX(1);
}
.iv_primary-menu > li.menu-item-has-children > a {
	padding-right: 28px;
}
.iv_primary-menu > li.menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 14px;
	top: 50%;
	width: 0; height: 0;
	border: 4px solid transparent;
	border-top-color: currentColor;
	transform: translateY(-2px);
	opacity: 0.7;
}
/* Sub-menu (desktop dropdown) — drops cleanly below the dark nav bar */
.iv_primary-menu ul {
	position: absolute;
	top: calc(100% + 2px);
	left: 0;
	min-width: 260px;
	margin: 0;
	padding: 8px;
	list-style: none;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	box-shadow: 0 12px 32px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.06);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .18s var(--iv-ease), transform .18s var(--iv-ease), visibility .18s;
	z-index: 60;
}
.iv_primary-menu li:hover > ul,
.iv_primary-menu li:focus-within > ul {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.iv_primary-menu ul a {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	border-radius: var(--iv-radius-sm);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--iv-ink-soft);
	text-decoration: none;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease), padding-left .15s var(--iv-ease);
}
.iv_primary-menu ul a::before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--iv-accent);
	opacity: 0;
	transition: opacity .15s var(--iv-ease);
}
.iv_primary-menu ul a:hover {
	background: var(--iv-warm-50);
	color: var(--iv-accent);
	padding-left: 16px;
}
.iv_primary-menu ul a:hover::before { opacity: 1; }

/* ── "Bereken vermogen" nav item — accent calculator icon so the conversion
   tool stands out from the plain nav links (client request 2026-08-21).
   Icon is a mask (tints via background-color, survives the hover `background`
   shorthand). Desktop: on the <li> because the <a>'s ::before is the caret and
   ::after is the tab-indicator. Mobile: on the <a> (its ::before is free —
   the drawer chevron is a JS-injected <button>, not a pseudo). The menu-item
   CSS class `iv-nav-calc` is set on the menu item in wp-admin. ── */
.iv_primary-menu > .iv-nav-calc > a { padding-left: 34px; color: #fff; }
.iv_primary-menu > .iv-nav-calc::before {
	content: ""; position: absolute; left: 11px; top: 50%; transform: translateY(-50%);
	width: 17px; height: 17px; z-index: 1; pointer-events: none;
	background-color: var(--iv-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='5'%20y='2'%20width='14'%20height='20'%20rx='2'/%3E%3Cpath%20d='M8%206h8'/%3E%3Cpath%20d='M8%2011h.01M12%2011h.01M16%2011h.01M8%2015h.01M12%2015h.01M16%2015h.01M8%2019h4'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='5'%20y='2'%20width='14'%20height='20'%20rx='2'/%3E%3Cpath%20d='M8%206h8'/%3E%3Cpath%20d='M8%2011h.01M12%2011h.01M16%2011h.01M8%2015h.01M12%2015h.01M16%2015h.01M8%2019h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

.iv_menu-hint {
	display: inline-block;
	margin-left: 16px;
	padding: 10px 14px;
	font-size: 0.8125rem;
	color: rgba(255,255,255,0.7);
}

/* ---------- 9. Mobile drawer (Boujee pattern) -------------------------- */

.iv_mobile-menu {
	position: fixed;
	inset: 0;
	z-index: 70;
	background: var(--iv-paper);
	display: flex;
	flex-direction: column;
	padding: 20px;
	overflow-y: auto;
	transform: translateX(100%);
	transition: transform .35s var(--iv-ease);
	visibility: hidden;
}
.iv_mobile-menu[data-open="true"] {
	transform: translateX(0);
	visibility: visible;
}
@media (min-width: 1024px) {
	.iv_mobile-menu { display: none !important; }
}
body.iv_drawer-open { overflow: hidden; }

.iv_mobile-menu-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: var(--iv-s-2);
	border-bottom: 1px solid var(--iv-stone-100);
}

.iv_mobile-nav { flex: 1; }
.iv_mobile-primary {
	list-style: none;
	padding: 0;
	margin: var(--iv-s-3) 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.iv_mobile-primary > li > a {
	display: block;
	padding: 14px 4px;
	font-family: var(--iv-font-display);
	font-size: 1.375rem;
	color: var(--iv-ink);
	text-decoration: none;
	border-bottom: 1px solid var(--iv-stone-100);
}
.iv_mobile-primary > li > a:hover { color: var(--iv-accent); }
.iv_mobile-primary > .current-menu-item > a { color: var(--iv-accent); }

/* "Bereken vermogen" in the drawer — accent text + calculator icon so it's the
   one item that pops (client request 2026-08-21). Icon on the <a>'s ::before
   (free on mobile) so it tracks the link even when the sub-menu is open. */
.iv_mobile-primary > .iv-nav-calc > a { position: relative; padding-left: 34px; color: var(--iv-accent-deep); }
.iv_mobile-primary > .iv-nav-calc > a::before {
	content: ""; position: absolute; left: 0; top: 22px; transform: translateY(-50%);
	width: 22px; height: 22px; pointer-events: none;
	background-color: var(--iv-accent-deep);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='5'%20y='2'%20width='14'%20height='20'%20rx='2'/%3E%3Cpath%20d='M8%206h8'/%3E%3Cpath%20d='M8%2011h.01M12%2011h.01M16%2011h.01M8%2015h.01M12%2015h.01M16%2015h.01M8%2019h4'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='5'%20y='2'%20width='14'%20height='20'%20rx='2'/%3E%3Cpath%20d='M8%206h8'/%3E%3Cpath%20d='M8%2011h.01M12%2011h.01M16%2011h.01M8%2015h.01M12%2015h.01M16%2015h.01M8%2019h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Parent rows that have a submenu: relative so we can pin the toggle */
.iv_mobile-primary .menu-item-has-children { position: relative; }
.iv_mobile-primary .menu-item-has-children > a {
	padding-right: 56px;   /* room for the chevron toggle */
}

/* Submenu toggle (chevron) — JS injects this <button> next to each parent */
.iv_mobile-sub-toggle {
	position: absolute;
	top: 4px;
	right: 0;
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	color: var(--iv-ink-soft);
	cursor: pointer;
	border-radius: 50%;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), transform .2s var(--iv-ease);
}
.iv_mobile-sub-toggle:hover { background: var(--iv-warm-50); color: var(--iv-accent); }
.iv_mobile-sub-toggle svg { transition: transform .2s var(--iv-ease); }
.iv_mobile-primary .menu-item-has-children[data-open="true"] > .iv_mobile-sub-toggle {
	color: var(--iv-accent);
}
.iv_mobile-primary .menu-item-has-children[data-open="true"] > .iv_mobile-sub-toggle svg {
	transform: rotate(180deg);
}

/* Nested submenu — closed by default, accordion-style on toggle */
.iv_mobile-primary ul {
	list-style: none;
	margin: 0;
	padding: 0 0 0 16px;
	border-left: 2px solid rgba(245, 129, 36, 0.35);
	max-height: 0;
	overflow: hidden;
	transition: max-height .35s var(--iv-ease), margin .35s var(--iv-ease);
}
.iv_mobile-primary .menu-item-has-children[data-open="true"] > ul {
	max-height: 1200px;     /* generous ceiling — auto would prevent transitions */
	margin: 4px 0 8px;
}
.iv_mobile-primary ul li { margin: 0; }
.iv_mobile-primary ul a {
	display: block;
	padding: 10px 4px;
	font-family: var(--iv-font-body);
	font-size: 1rem;
	font-weight: 500;
	color: var(--iv-ink-muted);
	text-decoration: none;
	border-bottom: 1px dashed rgba(0,0,0,0.06);
}
.iv_mobile-primary ul li:last-child a { border-bottom: none; }

.iv_mobile-menu-actions {
	margin-top: auto;
	padding-top: var(--iv-s-3);
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* ---------- 10. Search overlay --------------------------------------- */

.iv_search-overlay[hidden] { display: none !important; }
.iv_search-overlay {
	position: fixed;
	inset: 0;
	z-index: 80;
	background: rgba(26,26,26,0.92);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	display: grid;
	place-items: center;
	padding: 24px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s var(--iv-ease);
}
.iv_search-overlay.is-open {
	opacity: 1;
	pointer-events: auto;
}
.iv_search-overlay-inner {
	width: 100%;
	max-width: 760px;
	position: relative;
}
.iv_search-overlay-close {
	position: absolute;
	top: -56px; right: 0;
	width: 44px; height: 44px;
	display: grid; place-items: center;
	background: rgba(255,255,255,0.1);
	border: 1px solid rgba(255,255,255,0.2);
	color: #fff;
	border-radius: 50%;
	cursor: pointer;
	transition: background .15s var(--iv-ease);
}
.iv_search-overlay-close:hover { background: rgba(255,255,255,0.2); }
.iv_search-overlay-stage { text-align: center; }
.iv_search-overlay-stage .iv_eyebrow { color: #fff7ed; }
.iv_search-overlay-title {
	color: #fff;
	font-family: var(--iv-font-display);
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	margin: 12px 0 28px;
}
.iv_search-overlay-form {
	display: flex;
	gap: 8px;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.2);
	padding: 6px;
	border-radius: var(--iv-radius-pill);
}
.iv_search-overlay-form input[type="search"] {
	flex: 1;
	background: transparent;
	border: none;
	color: #fff;
	font-size: 1rem;
	padding: 12px 16px;
}
.iv_search-overlay-form input[type="search"]::placeholder { color: rgba(255,255,255,0.55); }
.iv_search-overlay-form input[type="search"]:focus { outline: none; }
.iv_search-overlay-form input[type="search"]::-webkit-search-cancel-button { display: none; }
.iv_search-overlay-form .iv_btn { flex: 0 0 auto; }
.iv_search-overlay-clear {
	flex: 0 0 auto;
	width: 32px; height: 32px;
	display: grid; place-items: center;
	background: rgba(255,255,255,0.12);
	border: none;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	align-self: center;
	margin-right: 2px;
	transition: background .15s var(--iv-ease);
}
.iv_search-overlay-clear:hover { background: rgba(255,255,255,0.22); }
.iv_search-overlay-clear[hidden] { display: none; }
@media (max-width: 540px) {
	.iv_search-overlay-form-label { display: none; }
	.iv_search-overlay-form .iv_btn { padding: 12px 14px; }
}
.iv_search-overlay-quick {
	margin-top: 24px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px 16px;
	font-size: 0.8125rem;
}
.iv_search-overlay-quick[hidden] { display: none; }
.iv_search-overlay-quick-label {
	color: rgba(255,255,255,0.55);
	margin-right: 4px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.iv_search-overlay-quick a {
	color: #fff7ed;
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
	transition: color .15s, border-color .15s;
}
.iv_search-overlay-quick a:hover {
	color: #fff;
	border-bottom-color: #fff;
}

/* ---------- 10b. Predictive search results panel ---------- */

.iv_search-results[hidden] { display: none; }
.iv_search-results {
	margin-top: 18px;
	background: #fff;
	color: var(--iv-ink);
	border-radius: var(--iv-radius-md, 12px);
	box-shadow: 0 24px 64px rgba(0,0,0,0.35), 0 2px 8px rgba(0,0,0,0.15);
	text-align: left;
	overflow: hidden;
	max-height: min(70vh, 640px);
	overflow-y: auto;
	animation: iv_search_in .18s var(--iv-ease) both;
}
@keyframes iv_search_in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0); }
}
.iv_search-results-section + .iv_search-results-section {
	border-top: 1px solid var(--iv-stone-100);
}
.iv_search-results-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 18px 6px;
}
.iv_search-results-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
}
.iv_search-results-count {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--iv-accent);
	background: var(--iv-accent-soft, #fef0e3);
	padding: 2px 10px;
	border-radius: 999px;
	font-variant-numeric: tabular-nums;
}
.iv_search-results-clear {
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.iv_search-results-clear:hover { color: var(--iv-accent); }

/* Product rows */
.iv_search-products {
	list-style: none;
	margin: 0;
	padding: 0 8px 8px;
}
.iv_search-product {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	gap: 14px;
	padding: 10px 12px;
	border-radius: 10px;
	color: var(--iv-ink);
	text-decoration: none;
	transition: background .12s var(--iv-ease);
}
.iv_search-product:hover,
.iv_search-product.is-active {
	background: var(--iv-warm-50, #fff7ed);
}
.iv_search-product-thumb {
	width: 56px; height: 56px;
	border-radius: 8px;
	overflow: hidden;
	background: var(--iv-stone-100);
	display: grid; place-items: center;
	flex: 0 0 56px;
}
.iv_search-product-thumb img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.iv_search-product-main {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.iv_search-product-cat {
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	font-weight: 600;
}
.iv_search-product-title {
	font-weight: 600;
	color: var(--iv-ink);
	font-size: 0.9375rem;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.iv_search-product-title mark,
.iv_search-cat mark,
.iv_search-recent-item mark {
	background: linear-gradient(transparent 60%, var(--iv-accent-soft, #fef0e3) 60%);
	color: inherit;
	padding: 0;
}
.iv_search-product-price {
	font-family: var(--iv-font-display);
	color: var(--iv-accent);
	font-size: 1rem;
	margin-top: 2px;
}
.iv_search-product-price .iv_tax-suffix { margin-left: 4px; }
.iv_search-product-arrow {
	color: var(--iv-ink-muted);
	transition: transform .15s var(--iv-ease), color .15s var(--iv-ease);
}
.iv_search-product:hover .iv_search-product-arrow,
.iv_search-product.is-active .iv_search-product-arrow {
	color: var(--iv-accent);
	transform: translateX(2px);
}

/* Category pills */
.iv_search-results-cats { padding-bottom: 14px; }
.iv_search-cats {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 4px 18px 4px;
	margin: 0;
}
.iv_search-cat {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--iv-stone-100);
	color: var(--iv-ink);
	text-decoration: none;
	font-size: 0.8125rem;
	font-weight: 500;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_search-cat:hover,
.iv_search-cat.is-active {
	background: var(--iv-accent-deep);
	color: #fff;
}
.iv_search-cat-count {
	font-variant-numeric: tabular-nums;
	font-size: 0.6875rem;
	background: rgba(0,0,0,0.06);
	padding: 1px 7px;
	border-radius: 999px;
}
.iv_search-cat:hover .iv_search-cat-count,
.iv_search-cat.is-active .iv_search-cat-count {
	background: rgba(255,255,255,0.25);
}

/* Recent searches */
.iv_search-recent {
	list-style: none;
	margin: 0;
	padding: 0 8px 12px;
}
.iv_search-recent-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	border-radius: 10px;
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--iv-ink-soft);
	text-align: left;
	font-size: 0.9375rem;
	transition: background .12s var(--iv-ease);
}
.iv_search-recent-item:hover,
.iv_search-recent-item.is-active {
	background: var(--iv-warm-50, #fff7ed);
	color: var(--iv-ink);
}
.iv_search-recent-item svg {
	color: var(--iv-ink-muted);
	flex: 0 0 auto;
}

/* "Alle resultaten" footer link */
.iv_search-results-all {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 22px;
	background: linear-gradient(180deg, transparent, var(--iv-warm-50, #fff7ed));
	color: var(--iv-accent);
	font-weight: 600;
	text-decoration: none;
	border-top: 1px solid var(--iv-stone-100);
	transition: background .12s var(--iv-ease);
}
.iv_search-results-all:hover,
.iv_search-results-all.is-active {
	background: var(--iv-accent-soft, #fef0e3);
}
.iv_search-results-all svg { transition: transform .15s var(--iv-ease); }
.iv_search-results-all:hover svg { transform: translateX(3px); }

/* States: loading / empty / error */
.iv_search-results-state {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 28px 20px;
	color: var(--iv-ink-muted);
	font-size: 0.9375rem;
}
.iv_search-results-state--error { color: #b00020; }
.iv_search-results-empty {
	padding: 28px 24px;
	text-align: center;
}
.iv_search-results-empty strong {
	display: block;
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	color: var(--iv-ink);
	margin-bottom: 6px;
}
.iv_search-results-empty p {
	color: var(--iv-ink-muted);
	margin: 0;
	font-size: 0.9375rem;
}
.iv_search-spinner {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid var(--iv-stone-200, #e6e3dc);
	border-top-color: var(--iv-accent);
	animation: iv_search_spin .7s linear infinite;
	flex: 0 0 auto;
}
@keyframes iv_search_spin { to { transform: rotate(360deg); } }

/* ---------- 11. Footer — 3 tiers (CTA / main dark / legal) ----------- */

/* ===== Tier 1: CTA band — dark gradient with warm sunburst ===== */
.iv_footer-cta {
	position: relative;
	background:
		radial-gradient(ellipse at 80% 0%, rgba(245, 129, 36, 0.18) 0%, transparent 55%),
		radial-gradient(ellipse at 10% 100%, rgba(251, 192, 21, 0.08) 0%, transparent 50%),
		linear-gradient(180deg, #1a1a1a 0%, var(--iv-ink) 100%);
	color: rgba(255, 255, 255, 0.78);
	padding: clamp(48px, 7vw, 88px) 0 clamp(28px, 4vw, 48px);
	overflow: hidden;
}
.iv_footer-cta::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	animation: iv_grad-shift 14s linear infinite;
}
.iv_footer-cta::after {
	content: "";
	position: absolute;
	right: -140px; bottom: -140px;
	width: 360px; height: 360px;
	border-radius: 50%;
	background: var(--iv-grad-warm);
	opacity: 0.10;
	filter: blur(28px);
	pointer-events: none;
}
.iv_footer-cta-inner {
	display: grid;
	gap: var(--iv-s-4);
	align-items: start;
	position: relative;
	z-index: 1;
}
@media (min-width: 880px) {
	.iv_footer-cta-inner {
		grid-template-columns: minmax(0, 1.4fr) minmax(280px, auto);
		gap: clamp(40px, 6vw, 80px);
	}
}

/* LEFT column — copy + buttons stacked vertically */
.iv_footer-cta-main {
	display: flex;
	flex-direction: column;
	gap: var(--iv-s-3);
}
.iv_footer-cta-copy { max-width: 32ch; }
.iv_footer-cta-copy .iv_eyebrow {
	display: inline-block;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-gold);
	margin-bottom: 10px;
}
.iv_footer-cta-title {
	font-family: var(--iv-font-display);
	font-size: clamp(1.625rem, 3vw + 0.5rem, 2.75rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #fff;
	margin: 0 0 12px;
}
.iv_footer-cta-sub {
	font-size: 1rem;
	color: rgba(255, 255, 255, 0.65);
	margin: 0;
	line-height: 1.55;
}
.iv_footer-cta-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 4px;
}
.iv_footer-cta-primary,
.iv_footer-cta-phone {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	padding: 14px 22px !important;
	border-radius: 999px !important;
	font-weight: 700 !important;
	white-space: nowrap;
}
.iv_footer-cta-phone {
	background: transparent !important;
	color: #fff !important;
	border: 1.5px solid rgba(255, 255, 255, 0.32) !important;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), border-color .15s var(--iv-ease);
}
.iv_footer-cta-phone:hover {
	background: #fff !important;
	color: var(--iv-ink) !important;
	border-color: #fff !important;
}
.iv_footer-cta-phone svg { color: var(--iv-accent); }
.iv_footer-cta-phone:hover svg { color: var(--iv-accent); }

/* RIGHT column — trust badges stacked vertically (was a 3-up row below).
 * Each item gets its own row in a subtle bordered card so they read as a list. */
.iv_footer-trust {
	list-style: none;
	margin: 0;
	padding: var(--iv-s-3);
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--iv-radius-lg);
	display: flex;
	flex-direction: column;
	gap: 14px;
	position: relative;
	z-index: 1;
}
@media (min-width: 880px) {
	.iv_footer-trust { align-self: stretch; }
}
.iv_footer-trust-item {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 4px 0;
}
.iv_footer-trust-item + .iv_footer-trust-item {
	border-top: 1px solid rgba(255, 255, 255, 0.06);
	padding-top: 14px;
}
.iv_footer-trust-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	background: rgba(255, 255, 255, 0.05);
	color: var(--iv-accent);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 50%;
}
.iv_footer-trust-copy {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.3;
}
.iv_footer-trust-copy strong {
	font-size: 0.9375rem;
	color: #fff;
	font-weight: 700;
}
.iv_footer-trust-copy span {
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.55);
	margin-top: 2px;
}

/* ===== Tier 2: Main footer (bright, real logo) ===== */
.iv_site-footer {
	background: var(--iv-warm-50);
	color: var(--iv-ink-soft);
	padding: clamp(40px, 5vw, 64px) 0 clamp(28px, 3vw, 40px);
	position: relative;
	border-top: 1px solid var(--iv-stone-100);
}
/* Animated brand-gradient strip across the top — same one as the header
 * nav row and the footer CTA tier. Visual continuity, no extra weight. */
.iv_site-footer::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 2px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	animation: iv_grad-shift 14s linear infinite;
	pointer-events: none;
}
.iv_site-footer a {
	color: var(--iv-ink-soft);
	transition: color .15s var(--iv-ease);
	text-decoration: none;
}
.iv_site-footer a:hover { color: var(--iv-accent); }

.iv_footer-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 36px;
}
@media (min-width: 640px) {
	.iv_footer-grid { grid-template-columns: repeat(2, 1fr); gap: 32px 28px; }
}
@media (min-width: 900px) {
	/* Mid-laptop: 3 across, the 5 cols wrap to 2 rows. */
	.iv_footer-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 40px 28px;
	}
}
/* 5-col on wide viewports — five equal menu/service cols.
   Contact col gets a touch more breathing room (1.1fr) for the icons. */
@media (min-width: 1100px) {
	.iv_footer-grid {
		grid-template-columns: 1fr 1.1fr 1fr 1.1fr 1.1fr;
		gap: 40px 32px;
	}
}

/* "Volledig assortiment →" link styled distinctly inside Shop column */
.iv_footer-menu-all {
	display: inline-block;
	margin-top: 6px;
	color: var(--iv-accent) !important;
	font-weight: 700 !important;
}

/* Real-logo brand block */
.iv_footer-brand { margin: 0 0 18px; }
.iv_footer-brand .iv_brand,
.iv_footer-brand .custom-logo-link {
	display: inline-block;
	text-decoration: none;
}
.iv_footer-brand .iv_brand img,
.iv_footer-brand .iv_brand-mark,
.iv_footer-brand .custom-logo,
.iv_footer-brand .custom-logo-link img {
	height: 56px !important;
	max-width: 240px !important;
	width: auto !important;
	display: block;
}

.iv_footer-tagline {
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--iv-ink-muted);
	margin: 0 0 var(--iv-s-2);
	max-width: 36ch;
}

/* Mini shop CTA card in the brand column — always shown to fill the
 * empty space when no newsletter form / socials are configured. */
.iv_footer-shopcard {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	margin: var(--iv-s-2) 0 var(--iv-s-3);
	max-width: 360px;
	transition: border-color .18s var(--iv-ease), transform .18s var(--iv-ease), box-shadow .25s var(--iv-ease);
	position: relative;
	overflow: hidden;
}
/* Subtle accent line that slides across on hover */
.iv_footer-shopcard::before {
	content: "";
	position: absolute;
	top: 0; left: -100%;
	right: 0; height: 2px;
	background: var(--iv-grad-warm);
	transition: left .5s var(--iv-ease);
}
.iv_footer-shopcard:hover {
	border-color: var(--iv-accent);
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(245, 129, 36, 0.15);
}
.iv_footer-shopcard:hover::before { left: 0; }
.iv_footer-shopcard-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.iv_footer-shopcard-body strong {
	color: var(--iv-ink);
	font-weight: 700;
	font-size: 0.9375rem;
	line-height: 1.3;
}
.iv_footer-shopcard-body span {
	color: var(--iv-ink-muted);
	font-size: 0.8125rem;
	line-height: 1.4;
}
.iv_footer-shopcard-link {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: var(--iv-accent-deep);
	color: #fff !important;
	transition: background .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_footer-shopcard:hover .iv_footer-shopcard-link {
	background: var(--iv-accent-deep-2);
	transform: translate(2px, -2px);
}

.iv_footer-title {
	font-family: var(--iv-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-ink);
	margin: 0 0 16px;
	display: inline-flex;
	flex-direction: column;
	gap: 8px;
}
/* Accent line under each column title for visual weight */
.iv_footer-title::after {
	content: "";
	display: block;
	width: 28px;
	height: 2px;
	background: var(--iv-accent);
	border-radius: 999px;
}

.iv_footer-menu,
.iv_footer-contact {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
	font-size: 0.9375rem;
}
.iv_footer-menu li a {
	position: relative;
	display: inline-block;
	padding-left: 0;
	transition: color .15s var(--iv-ease), padding-left .18s var(--iv-ease);
}
/* Accent dot prefix slides in on hover for a livelier feel */
.iv_footer-menu li a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--iv-accent);
	transform: translate(-8px, -50%) scale(0);
	transition: transform .2s var(--iv-ease);
}
.iv_footer-menu li a:hover {
	padding-left: 12px;
	color: var(--iv-accent);
}
.iv_footer-menu li a:hover::before {
	transform: translate(0, -50%) scale(1);
}

.iv_footer-contact li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}
.iv_footer-contact-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px; height: 28px;
	background: var(--iv-accent-soft);
	border-radius: 50%;
	margin-top: 1px;
}
.iv_footer-contact-icon svg { color: var(--iv-accent); }

.iv_footer-socials {
	list-style: none;
	padding: 0;
	margin: var(--iv-s-2) 0 var(--iv-s-3);
	display: flex;
	gap: 8px;
}
.iv_footer-socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	color: var(--iv-ink);
	transition: background .2s var(--iv-ease), color .2s var(--iv-ease), border-color .2s var(--iv-ease), transform .25s cubic-bezier(.34, 1.56, .64, 1);
}
.iv_footer-socials a:hover {
	background: var(--iv-accent);
	color: #fff;
	border-color: var(--iv-accent);
	transform: translateY(-3px) rotate(-6deg);
	box-shadow: 0 8px 20px rgba(245, 129, 36, 0.28);
}

/* Contact column fallback — when no Customizer contact data is set */
.iv_footer-contact-fallback {
	padding: 14px 16px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
}
.iv_footer-contact-fallback p {
	margin: 0 0 10px;
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.5;
}
.iv_footer-contact-fallback-cta {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	color: var(--iv-accent) !important;
	font-weight: 700;
	font-size: 0.875rem;
	text-decoration: none !important;
}
.iv_footer-contact-fallback-cta svg { transition: transform .15s var(--iv-ease); }
.iv_footer-contact-fallback-cta:hover svg { transform: translateX(3px); }

.iv_footer-newsletter { margin-top: var(--iv-s-3); }
.iv_footer-newsletter .iv_footer-title { margin-top: 0; }
/* Light-tier form fields */
.iv_footer-newsletter input[type="email"],
.iv_footer-newsletter input[type="text"] {
	width: 100%;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	color: var(--iv-ink);
	padding: 11px 14px;
	border-radius: 999px;
	font-size: 0.9375rem;
}
.iv_footer-newsletter input[type="email"]::placeholder,
.iv_footer-newsletter input[type="text"]::placeholder { color: var(--iv-ink-muted); }
.iv_footer-newsletter input[type="submit"],
.iv_footer-newsletter button[type="submit"] {
	background: var(--iv-accent-deep);
	color: #fff;
	border: none;
	padding: 11px 18px;
	border-radius: 999px;
	font-weight: 600;
	cursor: pointer;
	margin-top: 8px;
}

/* ===== Payments strip — lives INSIDE the cream tier ===== */
.iv_footer-payments {
	margin-top: clamp(28px, 4vw, 44px);
	padding-top: var(--iv-s-3);
	border-top: 1px solid var(--iv-stone-200);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
}
@media (min-width: 540px) {
	.iv_footer-payments {
		flex-direction: row;
		justify-content: center;
		gap: 18px;
		text-align: left;
	}
}
.iv_footer-payments-label {
	font-size: 0.6875rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--iv-ink-muted);
}
.iv_footer-payments ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	font-weight: 600;
	font-size: 0.8125rem;
}
.iv_footer-payments li {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 6px;
	color: var(--iv-ink);
	font-variant-numeric: tabular-nums;
	transition: transform .18s var(--iv-ease), border-color .18s var(--iv-ease), box-shadow .18s var(--iv-ease);
	cursor: default;
}
.iv_footer-payments li:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 4px 10px rgba(245, 129, 36, 0.12);
}

/* ===== Tier 3: Slim legal bar (cream→dark transition) ===== */
.iv_footer-legal-tier {
	background: #1a1a1a;
	color: rgba(255, 255, 255, 0.55);
	padding: 16px 0;
	font-size: 0.8125rem;
}
.iv_footer-legal-tier a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color .15s var(--iv-ease);
}
.iv_footer-legal-tier a:hover { color: var(--iv-accent); }

.iv_footer-legal-row {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	text-align: center;
}
@media (min-width: 720px) {
	.iv_footer-legal-row {
		flex-direction: row;
		justify-content: space-between;
		text-align: left;
	}
}
.iv_footer-copy {
	margin: 0;
	color: rgba(255, 255, 255, 0.5);
}
.iv_footer-legal-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 18px;
	justify-content: center;
	/* Cap the link list width so on wide screens the 9 items wrap to 2
	   lines instead of stretching into a single long line that crowds the
	   copyright. */
	max-width: min(820px, 70%);
}
@media (max-width: 719px) {
	.iv_footer-legal-menu { max-width: none; }
}
.iv_footer-legal-menu a { font-size: 0.8125rem; }

/* ---------- 8. Reveal animation hook ---------------------------------- */

[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--iv-ease), transform .6s var(--iv-ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* ---------- 9. Reduced motion ----------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	*,*::before,*::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- 10. Phase 2+ will add: hero, USP strip, category grid,
   product cards, mini-cart drawer, predictive search, footer columns,
   WC overrides, blog cards, FAQ accordions, etc. ----------------------- */

/* =========================================================================
   WC archive layout — filter sidebar + product grid
   ========================================================================= */

.iv_archive-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-4);
	padding: var(--iv-s-4) 0;
	/* `position: sticky` on the sidebar requires NO ancestor with overflow:hidden.
	   This is explicit for the sake of future maintainers. */
	overflow: visible;
}
@media (min-width: 1024px) {
	.iv_archive-layout {
		grid-template-columns: 280px minmax(0, 1fr);
		gap: var(--iv-s-5);
		padding: var(--iv-s-5) 0;
		align-items: start;     /* CRITICAL: lets the sticky aside scroll independently */
	}
}

/* ---------- Filter sidebar — premium cards ---------- */

.iv_filters {
	background: transparent;
	padding: 0;
	box-shadow: none;
	border: none;
}
@media (min-width: 1024px) {
	.iv_filters {
		position: sticky;
		top: 120px;
		max-height: calc(100dvh - 140px);
		/* IMPORTANT: no overflow on the aside itself — put it on the body
		   below so the head stays pinned at the top of the sidebar. */
		overflow: visible;
		display: flex;
		flex-direction: column;
	}
	/* Title stays at the top of the sidebar — never scrolls away */
	.iv_filters > .iv_filters-head {
		flex: 0 0 auto;
		background: var(--iv-paper);
		z-index: 2;
	}
	/* Only the body scrolls when filters overflow */
	.iv_filters > .iv_filters-body {
		flex: 1 1 auto;
		min-height: 0;            /* CRITICAL: lets flex child shrink */
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		padding-right: 4px;
	}
}

.iv_filters-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px;
	margin-bottom: 12px;
}
.iv_filters-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-family: var(--iv-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
}
.iv_filters-title::before {
	content: "";
	display: inline-block;
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--iv-accent);
	box-shadow: 0 0 0 3px var(--iv-accent-soft);
}
.iv_filters-close { display: inline-flex; }
@media (min-width: 1024px) {
	.iv_filters-close { display: none; }
}

/* Horizontal active-chips bar — sits above the product grid */
.iv_chips-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	margin: 0 0 var(--iv-s-3);
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
}
.iv_chips-bar-label {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
}
.iv_chips {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	flex: 1 1 auto;
	min-width: 0;
}
.iv_chip a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px 6px 12px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent-2);
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease), border-color .12s var(--iv-ease), transform .12s var(--iv-ease);
}
.iv_chip a:hover {
	background: var(--iv-accent-deep);
	color: #fff;
	transform: translateY(-1px);
}
.iv_chip-x {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px; height: 18px;
	border-radius: 50%;
	background: rgba(0,0,0,0.07);
	transition: background .12s var(--iv-ease);
}
.iv_chip a:hover .iv_chip-x { background: rgba(255,255,255,0.28); }

/* Reset = plain underlined text, no background */
.iv_chips-reset {
	margin-left: auto;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--iv-ink-soft);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	white-space: nowrap;
	transition: color .12s var(--iv-ease), text-decoration-color .12s var(--iv-ease);
}
.iv_chips-reset:hover { color: var(--iv-accent); text-decoration-color: var(--iv-accent); }

/* Filter groups — each one is now its own card */
.iv_filter-group {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	margin-bottom: 10px;
	transition: border-color .2s var(--iv-ease), box-shadow .25s var(--iv-ease), transform .2s var(--iv-ease);
	overflow: hidden;
}
.iv_filter-group:hover {
	border-color: var(--iv-stone-100);
	box-shadow: 0 4px 14px rgba(0,0,0,0.05);
}
.iv_filter-group[open] {
	border-color: var(--iv-accent);
	box-shadow: 0 12px 28px rgba(245,129,36,0.12), 0 2px 8px rgba(245,129,36,0.08);
	transform: translateY(-1px);
}
.iv_filter-group.has-active {
	border-color: var(--iv-accent);
	background: linear-gradient(180deg, var(--iv-accent-soft) 0%, var(--iv-paper) 100%);
}
.iv_filter-group.has-active > .iv_filter-group-title { color: var(--iv-accent); }

.iv_filter-group-title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 14px 14px;
	font-family: var(--iv-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--iv-ink);
	cursor: pointer;
	list-style: none;
	transition: color .15s var(--iv-ease), background .15s var(--iv-ease);
}
.iv_filter-group-title:hover { color: var(--iv-accent); }
.iv_filter-group-title::-webkit-details-marker { display: none; }
.iv_filter-group-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px; height: 32px;
	border-radius: 10px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent);
	flex: 0 0 auto;
	transition: background .2s var(--iv-ease), color .2s var(--iv-ease), transform .25s var(--iv-ease);
}
.iv_filter-group:hover .iv_filter-group-icon,
.iv_filter-group[open] .iv_filter-group-icon {
	background: var(--iv-accent);
	color: #fff;
	transform: rotate(-6deg) scale(1.05);
}
.iv_filter-group-label { flex: 1; min-width: 0; }
.iv_filter-group-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	background: var(--iv-accent-deep);
	color: #fff;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 700;
	box-shadow: 0 4px 10px rgba(245,129,36,0.35);
}
.iv_filter-group-chevron {
	display: inline-flex;
	color: var(--iv-ink-muted);
	transition: transform .3s var(--iv-ease), color .15s var(--iv-ease);
}
.iv_filter-group[open] > .iv_filter-group-title .iv_filter-group-chevron {
	transform: rotate(180deg);
	color: var(--iv-accent);
}

.iv_filter-list {
	list-style: none;
	margin: 0;
	padding: 0 10px 12px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	max-height: 320px;
	overflow-y: auto;
	scrollbar-width: thin;
	animation: iv_filter-list-in .25s var(--iv-ease);
}
@keyframes iv_filter-list-in {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}
.iv_filter-item a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 10px;
	border-radius: 8px;
	font-size: 0.875rem;
	color: var(--iv-ink-soft);
	text-decoration: none;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease), padding-left .15s var(--iv-ease);
}
.iv_filter-item a:hover {
	background: var(--iv-paper);
	color: var(--iv-ink);
	padding-left: 12px;
}
.iv_filter-box {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	border: 1.5px solid var(--iv-stone-200);
	border-radius: 5px;
	background: var(--iv-paper);
	position: relative;
	transition: background .15s var(--iv-ease), border-color .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_filter-item a:hover .iv_filter-box { border-color: var(--iv-accent); }
.iv_filter-item.is-active .iv_filter-box {
	background: var(--iv-accent);
	border-color: var(--iv-accent);
	transform: scale(1.05);
}
.iv_filter-item.is-active .iv_filter-box::after {
	content: "";
	position: absolute;
	left: 5px; top: 2px;
	width: 5px; height: 9px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.iv_filter-item.is-active a {
	color: var(--iv-ink);
	font-weight: 600;
	background: var(--iv-paper);
}
.iv_filter-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.iv_filter-count {
	color: var(--iv-ink-muted);
	font-size: 0.75rem;
	background: var(--iv-stone-100);
	padding: 1px 7px;
	border-radius: 999px;
	font-variant-numeric: tabular-nums;
}
.iv_filter-item.is-active .iv_filter-count {
	background: var(--iv-accent-soft);
	color: var(--iv-accent-2);
}

/* ---------- Filter toolbar trigger (mobile) ---------- */

.iv_filters-toggle {
	display: inline-flex;
	margin-bottom: var(--iv-s-3);
	padding: 12px 20px !important;
	font-weight: 600 !important;
}
@media (min-width: 1024px) {
	.iv_filters-toggle { display: none; }
}

/* Sticky head/foot wrappers hidden by default — only used inside mobile drawer */
.iv_filters-body { }
.iv_filters-foot { display: none; }

/* Desktop: head is just a label, no chrome */
@media (min-width: 1024px) {
	.iv_filters-head {
		padding: 4px;
		margin-bottom: 12px;
		background: transparent;
		border: none;
		box-shadow: none;
	}
	.iv_filters-close { display: none; }
}

/* ---------- Mobile: sidebar becomes a premium off-canvas drawer ---------- */

@media (max-width: 1023px) {

	/* Backdrop dims the page behind the drawer */
	.iv_filters-backdrop {
		position: fixed;
		inset: 0;
		z-index: 74;
		background: rgba(15, 15, 15, 0.45);
		backdrop-filter: blur(2px);
		-webkit-backdrop-filter: blur(2px);
		opacity: 0;
		transition: opacity .25s var(--iv-ease);
	}
	.iv_filters-backdrop.is-open { opacity: 1; }

	/* Drawer container — full-height side panel */
	.iv_filters {
		position: fixed;
		left: 0; top: 0;
		height: 100dvh;
		width: min(420px, 100vw);
		z-index: 75;
		padding: 0;
		margin: 0;
		background: var(--iv-paper);     /* SOLID — was transparent, that was the bug */
		box-shadow: 24px 0 60px rgba(0,0,0,0.18);
		transform: translateX(-100%);
		transition: transform .35s var(--iv-ease);
		visibility: hidden;
		display: flex;
		flex-direction: column;
		overflow: hidden;   /* let the body scroll, not the drawer itself */
	}
	.iv_filters[data-open="true"] {
		transform: translateX(0);
		visibility: visible;
	}
	/* Top brand-gradient accent strip on the drawer */
	.iv_filters::before {
		content: "";
		position: absolute;
		left: 0; right: 0; top: 0;
		height: 3px;
		background: var(--iv-grad-warm);
		z-index: 4;
	}

	/* Sticky header inside the drawer */
	.iv_filters-head {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 18px 20px 14px;
		margin: 0;
		background: var(--iv-paper);
		border-bottom: 1px solid var(--iv-stone-100);
		z-index: 3;
	}
	.iv_filters-title {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		margin: 0;
		font-family: var(--iv-font-body);
		font-size: 0.9375rem;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--iv-ink);
	}
	.iv_filters-title::before { display: none; }
	.iv_filters-title svg { color: var(--iv-accent); }
	.iv_filters-close {
		display: inline-flex;
		width: 40px; height: 40px;
		background: var(--iv-warm-50);
		border: none;
		border-radius: 999px;
		color: var(--iv-ink);
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: background .15s var(--iv-ease), color .15s var(--iv-ease);
	}
	.iv_filters-close:hover { background: var(--iv-accent); color: #fff; }

	/* Scrollable body */
	.iv_filters-body {
		flex: 1 1 auto;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		padding: 16px 16px 12px;
		background: var(--iv-warm-50);
	}

	/* Sticky footer with reset + apply CTA */
	.iv_filters-foot {
		display: flex;
		flex: 0 0 auto;
		gap: 8px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		background: var(--iv-paper);
		border-top: 1px solid var(--iv-stone-100);
		box-shadow: 0 -8px 24px rgba(0,0,0,0.08);
		z-index: 3;
	}
	.iv_filters-foot .iv_btn {
		flex: 1 1 auto;
		justify-content: center;
		padding: 13px 16px;
	}
	.iv_filters-foot-reset { flex: 0 1 auto !important; padding: 13px 18px !important; }
	.iv_filters-foot-apply { flex: 1 1 auto !important; }

	/* Inside the mobile drawer, the filter group cards still look like cards
	   but with a lighter shadow and tighter spacing. */
	.iv_filters-body .iv_filter-group {
		margin-bottom: 10px;
	}
	.iv_filters-body .iv_filter-group-title {
		padding: 16px 14px;
	}
}

/* ---------- Archive main column ---------- */

.iv_archive-main {
	min-width: 0;   /* allows grid children to shrink correctly */
}

/* Hide WC's default products header — we render our own hero above the layout */
.woocommerce-products-header { display: none; }

/* Premium toolbar above the grid: results count (left) + sort dropdown (right) */
.woocommerce-result-count,
.woocommerce-notices-wrapper + .woocommerce-result-count {
	float: none !important;
	display: inline-flex;
	align-items: center;
	margin: 0 0 var(--iv-s-3) !important;
	padding: 8px 14px;
	background: var(--iv-warm-50);
	border-radius: 999px;
	color: var(--iv-ink-soft);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}
.woocommerce-result-count::before {
	content: "";
	display: inline-block;
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--iv-accent);
	margin-right: 8px;
	box-shadow: 0 0 0 3px var(--iv-accent-soft);
}
.woocommerce-ordering {
	float: none !important;
	display: inline-block;
	margin: 0 0 var(--iv-s-3) !important;
	margin-left: auto !important;
}
.woocommerce-ordering select {
	padding: 9px 36px 9px 14px !important;
	border-radius: 999px !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	background: var(--iv-paper) !important;
	font-size: 0.8125rem !important;
	font-weight: 600 !important;
	color: var(--iv-ink) !important;
	cursor: pointer;
	transition: border-color .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.woocommerce-ordering select:hover,
.woocommerce-ordering select:focus {
	border-color: var(--iv-accent) !important;
	box-shadow: 0 0 0 4px var(--iv-accent-soft);
	outline: none;
}

/* Wrap the result count + sort dropdown on one row above the grid */
.iv_archive-grid::before {
	content: "";
	display: block;
}
.iv_archive-grid .woocommerce-result-count,
.iv_archive-grid .woocommerce-ordering {
	margin-bottom: var(--iv-s-3) !important;
}

/* Product grid — defensively override every WC selector that could re-center the cards */
.woocommerce ul.products,
.woocommerce-page ul.products,
.iv_archive-grid ul.products,
.iv_archive-grid > ul,
ul.products {
	display: grid !important;
	grid-template-columns: 1fr !important;
	grid-auto-flow: row !important;
	gap: var(--iv-s-3) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	width: 100% !important;
	max-width: 100% !important;
	justify-content: start !important;
	justify-items: stretch !important;
	align-items: start !important;
	text-align: left !important;
}
/* Kill WC's clearfix pseudo-elements which leave invisible grid cells */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
ul.products::before,
ul.products::after {
	content: none !important;
	display: none !important;
}
@media (min-width: 560px)  {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.iv_archive-grid ul.products,
	ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1024px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.iv_archive-grid ul.products,
	ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
/* Force first product into column 1 — kills any "first product floats right" weirdness */
.woocommerce ul.products li.product:first-of-type,
.woocommerce ul.products li.product:first-child {
	grid-column-start: 1 !important;
}
.woocommerce ul.products li.product:only-child {
	grid-column: 1 / 2 !important;
}
/* Belt-and-suspenders: kill WC's per-card centering rules + auto margins */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products li.product {
	clear: none !important;
	float: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	left: auto !important;
	right: auto !important;
}

/* Premium product card */
.woocommerce ul.products li.product,
ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	position: relative;
	display: flex !important;
	flex-direction: column !important;
	transition: box-shadow .25s var(--iv-ease), transform .25s var(--iv-ease), border-color .25s var(--iv-ease);
	float: none !important;
	text-align: left !important;
}
/* Brand-gradient strip — ALWAYS visible (was hover-only). Animates a wider
   gradient on hover so the strip feels alive when the card is focused. */
.woocommerce ul.products li.product::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	background-position: 0% 50%;
	transition: height .25s var(--iv-ease), background-position 1.2s var(--iv-ease);
	z-index: 2;
}
.woocommerce ul.products li.product:hover {
	box-shadow: 0 24px 56px rgba(245, 129, 36, 0.18), 0 6px 18px rgba(0, 0, 0, 0.08);
	border-color: var(--iv-accent-soft);
	transform: translateY(-6px);
}
.woocommerce ul.products li.product:hover::before {
	height: 5px;
	background-position: 100% 50%;
}

/* Image — fixed aspect, hover zoom */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img {
	width: 100% !important;
	aspect-ratio: 1 / 1 !important;
	object-fit: cover !important;
	display: block !important;
	margin: 0 !important;
	background: var(--iv-warm-50);
	transition: transform .5s var(--iv-ease);
}
/* Framed image tile — white product photos otherwise bleed invisibly
 * into the white card. Hairline border + inset margin makes the image
 * area read as a distinct surface. */
.woocommerce ul.products li.product > a:first-child {
	display: block;
	overflow: hidden;
	margin: 16px 16px 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: 12px;
	background: #ffffff;
}
.woocommerce ul.products li.product:hover > a:first-child {
	border-color: var(--iv-accent-soft);
}
.woocommerce ul.products li.product:hover img { transform: scale(1.04); }

/* Sale / new badges */
.woocommerce ul.products li.product .onsale {
	position: absolute !important;
	/* 16px tile inset + 10px inside the framed image area */
	top: 26px !important;
	left: 26px !important;
	right: auto !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 4px 12px !important;
	font-size: 0.6875rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	margin: 0 !important;
	min-height: 0 !important;
	min-width: 0 !important;
	line-height: 1.6 !important;
	z-index: 3;
	box-shadow: 0 4px 12px rgba(245,129,36,0.35);
}

/* Card body */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
	font-family: var(--iv-font-body) !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	color: var(--iv-ink) !important;
	margin: 0 !important;
	padding: 14px 18px 6px !important;
	min-height: 2.7em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .15s var(--iv-ease);
}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title { color: var(--iv-accent); }

/* Star rating */
.woocommerce ul.products li.product .star-rating {
	margin: 0 18px 6px !important;
	font-size: 0.875rem !important;
	color: var(--iv-gold) !important;
}

/* Price */
.woocommerce ul.products li.product .price {
	display: block !important;
	color: var(--iv-accent) !important;
	font-family: var(--iv-font-display) !important;
	font-weight: 400 !important;
	font-size: 1.375rem !important;
	margin: 0 !important;
	padding: 0 18px 14px !important;
}
.woocommerce ul.products li.product .price del { color: var(--iv-ink-muted) !important; opacity: 0.7; font-size: 0.875rem; margin-right: 6px; }
.woocommerce ul.products li.product .price ins { background: transparent !important; text-decoration: none !important; }

/* Tiny "incl. BTW" / "excl. BTW" suffix that follows every visible price */
.iv_price-tax-suffix {
	display: inline-block;
	margin-left: 4px;
	padding: 1px 6px;
	font-family: var(--iv-font-body);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	background: var(--iv-stone-100);
	border-radius: 4px;
	vertical-align: middle;
	white-space: nowrap;
	position: relative;
	top: -2px;
}

/* On the product card price (display-font 1.375rem), bump suffix a tiny bit to balance */
.woocommerce ul.products li.product .price .iv_price-tax-suffix {
	top: -4px;
}

/* On the cart drawer subtotal (display-font 1.5rem accent-orange), use a contrasting bg */
.iv_cart-drawer-subtotal-amount .iv_price-tax-suffix {
	background: var(--iv-accent-soft);
	color: var(--iv-accent-2);
	top: -5px;
}

/* On cart totals table (right-side big number), tweak alignment */
.cart_totals .order-total .amount + .iv_price-tax-suffix,
.cart_totals .cart-subtotal .amount + .iv_price-tax-suffix {
	display: inline-block;
	margin-left: 6px;
	top: -2px;
}

/* In checkout order review */
.woocommerce-checkout #order_review .order-total .amount + .iv_price-tax-suffix {
	font-size: 0.5625rem;
	top: -4px;
}

/* Card actions row: add-to-cart + view-product side by side */
.iv_card-actions {
	display: flex;
	gap: 8px;
	margin: auto 18px 18px;     /* `auto` top pushes the row to the bottom of the card */
	padding-top: 4px;
	align-items: stretch;
}

/* Add-to-cart button — fills remaining space in the row */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button {
	flex: 1 1 auto !important;
	width: auto !important;
	margin: 0 !important;
	background: var(--iv-ink) !important;
	color: #fff !important;
	border: 1.5px solid var(--iv-ink) !important;
	border-radius: 999px !important;
	padding: 12px 16px !important;
	font-weight: 600 !important;
	font-size: 0.875rem !important;
	text-align: center !important;
	letter-spacing: 0.01em !important;
	transition: background .15s var(--iv-ease), border-color .15s var(--iv-ease), transform .15s var(--iv-ease) !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 6px;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product a.button:hover {
	background: var(--iv-accent) !important;
	border-color: var(--iv-accent) !important;
}

/* View-product icon button — animated diagonal arrow slides out + new one slides in */
.iv_card-view {
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-ink);
	border-radius: 999px;
	color: var(--iv-ink);
	text-decoration: none;
	position: relative;
	overflow: hidden;
	transition: background .2s var(--iv-ease), border-color .2s var(--iv-ease), color .2s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_card-view:hover {
	background: var(--iv-accent);
	border-color: var(--iv-accent);
	color: #fff;
	transform: translateY(-1px);
}
.iv_card-view .iv_card-view-icon,
.iv_card-view .iv_card-view-icon-hover {
	position: absolute;
	inset: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform .35s var(--iv-ease), opacity .25s var(--iv-ease);
}
.iv_card-view .iv_card-view-icon-hover {
	transform: translate(-110%, 110%);
	opacity: 0;
}
.iv_card-view:hover .iv_card-view-icon {
	transform: translate(110%, -110%);
	opacity: 0;
}
.iv_card-view:hover .iv_card-view-icon-hover {
	transform: translate(0, 0);
	opacity: 1;
}
.iv_card-view:focus-visible { outline: 2px solid var(--iv-accent); outline-offset: 2px; }
.woocommerce ul.products li.product .button.added::after {
	content: " ✓";
}
.woocommerce ul.products li.product .added_to_cart {
	display: none !important; /* hide WC's auto-inserted "View cart" link — drawer handles it */
}

/* Pagination */
.woocommerce nav.woocommerce-pagination {
	margin-top: var(--iv-s-4);
	text-align: center;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border-radius: 6px;
	padding: 8px 12px;
	color: var(--iv-ink);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--iv-accent-deep);
	color: #fff;
}

/* ---------- AJAX state on the grid ---------- */
.iv_archive-grid {
	position: relative;
	transition: opacity .15s var(--iv-ease);
}
.iv_archive-grid.is-loading { opacity: 0.55; pointer-events: none; }
.iv_archive-grid.is-loading::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle, var(--iv-paper) 0%, rgba(255,255,255,0) 60%);
	pointer-events: none;
}
.iv_archive-grid-spinner {
	position: absolute;
	left: 50%; top: 80px;
	width: 28px; height: 28px;
	margin-left: -14px;
	border: 3px solid var(--iv-stone-200);
	border-top-color: var(--iv-accent);
	border-radius: 50%;
	animation: iv-spin 0.7s linear infinite;
	opacity: 0;
	transition: opacity .15s var(--iv-ease);
	z-index: 2;
}
.iv_archive-grid.is-loading .iv_archive-grid-spinner { opacity: 1; }
@keyframes iv-spin { to { transform: rotate(360deg); } }

.iv_archive-empty {
	padding: var(--iv-s-5) 0;
	text-align: center;
	color: var(--iv-ink-muted);
	background: var(--iv-warm-50);
	border-radius: var(--iv-radius-md);
}

/* =========================================================================
   CATEGORY PAGE — hero header
   ========================================================================= */

.iv_cat-hero {
	position: relative;
	background:
		radial-gradient(circle at 80% 20%, var(--iv-warm-100) 0%, transparent 55%),
		linear-gradient(180deg, var(--iv-warm-50) 0%, var(--iv-paper) 100%);
	padding: var(--iv-s-5) 0 var(--iv-s-4);
	border-bottom: 1px solid var(--iv-stone-100);
	overflow: hidden;
}
.iv_cat-hero::after {
	content: "";
	position: absolute;
	right: -120px; bottom: -120px;
	width: 320px; height: 320px;
	border-radius: 50%;
	background: var(--iv-grad-warm);
	opacity: 0.08;
	pointer-events: none;
	filter: blur(20px);
}
.iv_cat-hero--utility {
	padding: var(--iv-s-3) 0 var(--iv-s-2);
	background: linear-gradient(180deg, var(--iv-warm-50) 0%, var(--iv-paper) 100%);
}
.iv_cat-hero--utility::after { display: none; }
.iv_cat-hero--utility .iv_cat-hero-title {
	font-size: clamp(1.6rem, 2vw + 1rem, 2.25rem);
	margin: 0 0 6px;
}
.iv_cat-hero--utility .iv_cat-hero-intro {
	max-width: 70ch;
	font-size: 0.9375rem;
	color: var(--iv-ink-muted);
}
.iv_cat-hero-inner {
	display: grid;
	gap: var(--iv-s-4);
	grid-template-columns: 1fr;
	align-items: center;
}
.iv_cat-hero.has-image .iv_cat-hero-inner {
	grid-template-columns: 1fr;
}
@media (min-width: 900px) {
	.iv_cat-hero.has-image .iv_cat-hero-inner {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		gap: var(--iv-s-5);
	}
}

.iv_cat-hero-title {
	margin: 0 0 var(--iv-s-2);
	font-size: clamp(2rem, 3.4vw + 0.5rem, 3.25rem);
	letter-spacing: -0.015em;
	line-height: 1.1;
}
.iv_cat-hero-intro {
	margin: 0;
	max-width: 60ch;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--iv-ink-soft);
}
.iv_cat-hero-media {
	position: relative;
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	box-shadow: var(--iv-shadow-lg);
	aspect-ratio: 4 / 3;
}
.iv_cat-hero-media::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,0.06) 100%);
}
.iv_cat-hero-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}

/* Breadcrumb — `iv_breadcrumb` (singular, inside hero) +
 * `iv_breadcrumbs` (plural, standalone bar from template-parts/global/breadcrumbs.php). */
.iv_breadcrumb,
.iv_breadcrumbs {
	margin-bottom: var(--iv-s-2);
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
}
/* Standalone variant — used on blog/single post pages */
.iv_breadcrumbs {
	padding: 14px 0;
	margin-bottom: 0;
	border-bottom: 1px solid var(--iv-stone-100);
	background: var(--iv-paper);
}
.iv_breadcrumb ol,
.iv_breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 8px;
	list-style: none;
	margin: 0; padding: 0;
}
.iv_breadcrumb li,
.iv_breadcrumbs li { display: inline-flex; align-items: center; }
/* CSS-drawn chevron separator — no special characters (avoids any encoding mojibake) */
.iv_breadcrumb li + li::before,
.iv_breadcrumbs li + li::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin: 0 10px 0 2px;
	border-right: 1.5px solid var(--iv-stone-200);
	border-top: 1.5px solid var(--iv-stone-200);
	transform: rotate(45deg);
	vertical-align: middle;
	position: relative;
	top: -1px;
}
.iv_breadcrumb a,
.iv_breadcrumbs a {
	color: var(--iv-ink-muted);
	transition: color .12s var(--iv-ease);
}
.iv_breadcrumb a:hover,
.iv_breadcrumbs a:hover { color: var(--iv-accent); }
.iv_breadcrumb [aria-current="page"],
.iv_breadcrumbs [aria-current="page"] { color: var(--iv-ink); font-weight: 500; }

/* =========================================================================
   CATEGORY PAGE — SEO body section
   ========================================================================= */

.iv_cat-body {
	padding: var(--iv-s-6) 0 var(--iv-s-5);
	background: var(--iv-paper);
	position: relative;
}
/* Faint divider line between products grid and SEO body — sits inside the
   container width so it doesn't span edge-to-edge */
.iv_cat-body::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: calc(100% - (var(--iv-gutter) * 2));
	max-width: var(--iv-container-max);
	height: 1px;
	background: linear-gradient(90deg,
		transparent 0%,
		var(--iv-stone-200) 20%,
		var(--iv-stone-200) 80%,
		transparent 100%
	);
}
.iv_cat-body-prose {
	max-width: 760px;
	margin: 0 auto;
	color: var(--iv-ink-soft);
	font-size: 1.0625rem;
	line-height: 1.7;
}
.iv_cat-body-prose h2,
.iv_cat-body-prose h3 {
	color: var(--iv-ink);
	margin-top: var(--iv-s-5);
	margin-bottom: var(--iv-s-2);
}
.iv_cat-body-prose h2 { font-size: clamp(1.5rem, 1.8vw + 0.75rem, 2rem); }
.iv_cat-body-prose h3 { font-size: 1.25rem; font-family: var(--iv-font-body); font-weight: 700; }
.iv_cat-body-prose h2:first-child,
.iv_cat-body-prose h3:first-child { margin-top: 0; }
.iv_cat-body-prose p { margin: 0 0 1.1em; }
.iv_cat-body-prose ul,
.iv_cat-body-prose ol { padding-left: 1.25em; margin: 0 0 1.2em; }
.iv_cat-body-prose li { margin-bottom: 0.35em; }
.iv_cat-body-prose ul li::marker { color: var(--iv-accent); }
.iv_cat-body-prose a {
	color: var(--iv-accent);
	border-bottom: 1px solid currentColor;
	transition: color .12s var(--iv-ease);
}
.iv_cat-body-prose a:hover { color: var(--iv-accent-2); }
.iv_cat-body-prose blockquote {
	margin: var(--iv-s-3) 0;
	padding: var(--iv-s-2) var(--iv-s-3);
	border-left: 3px solid var(--iv-accent);
	background: var(--iv-warm-50);
	border-radius: 0 var(--iv-radius-sm) var(--iv-radius-sm) 0;
	font-style: italic;
	color: var(--iv-ink);
}
.iv_cat-body-prose table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--iv-s-3) 0;
	font-size: 0.9375rem;
}
.iv_cat-body-prose th,
.iv_cat-body-prose td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--iv-stone-200);
	text-align: left;
}
.iv_cat-body-prose th { background: var(--iv-warm-50); color: var(--iv-ink); font-weight: 700; }

/* =========================================================================
   CATEGORY PAGE — FAQ accordion
   ========================================================================= */

.iv_cat-faq {
	padding: var(--iv-s-6) 0;
	background: var(--iv-warm-50);
}
.iv_cat-faq-inner {
	max-width: 820px;
}
.iv_cat-faq-header {
	text-align: center;
	margin-bottom: var(--iv-s-4);
}
.iv_cat-faq-title {
	margin: 4px 0 0;
	font-size: clamp(1.75rem, 2vw + 1rem, 2.5rem);
}

.iv_faq-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.iv_faq-item {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	transition: border-color .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_faq-item[open] {
	border-color: var(--iv-accent);
	box-shadow: var(--iv-shadow-sm);
}
.iv_faq-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	font-family: var(--iv-font-body);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--iv-ink);
	cursor: pointer;
	list-style: none;
	transition: color .12s var(--iv-ease), background .12s var(--iv-ease);
}
.iv_faq-q::-webkit-details-marker { display: none; }
.iv_faq-q:hover { color: var(--iv-accent); }
.iv_faq-item[open] > .iv_faq-q { color: var(--iv-accent); }
.iv_faq-chevron {
	flex: 0 0 auto;
	color: var(--iv-accent);
	transition: transform .25s var(--iv-ease);
}
.iv_faq-item[open] .iv_faq-chevron { transform: rotate(180deg); }
.iv_faq-a {
	padding: 0 22px 20px;
	color: var(--iv-ink-soft);
	line-height: 1.7;
}
.iv_faq-a p { margin: 0 0 0.8em; }
.iv_faq-a p:last-child { margin-bottom: 0; }
.iv_faq-a ul,
.iv_faq-a ol { padding-left: 1.25em; margin: 0 0 0.8em; }
.iv_faq-a li { margin-bottom: 0.3em; }

/* =========================================================================
   CATEGORY PAGE — final CTA
   ========================================================================= */

.iv_cat-cta {
	padding: var(--iv-s-6) 0;
	background: var(--iv-ink);
	color: var(--iv-paper);
	position: relative;
	overflow: hidden;
}
.iv_cat-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--iv-grad-warm);
	opacity: 0.10;
	pointer-events: none;
}
.iv_cat-cta-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--iv-s-3);
	text-align: center;
}
.iv_cat-cta-title {
	margin: 0;
	color: var(--iv-paper);
	font-size: clamp(1.75rem, 2vw + 1rem, 2.5rem);
	max-width: 22ch;
}
.iv_btn-lg {
	padding: 16px 32px;
	font-size: 1rem;
}

/* =========================================================================
   CART DRAWER — premium slide-in from right
   ========================================================================= */

.iv_cart-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(15, 15, 15, 0.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	z-index: 89;
	opacity: 0;
	transition: opacity .25s var(--iv-ease);
}
.iv_cart-backdrop.is-open { opacity: 1; }

.iv_cart-drawer {
	position: fixed;
	right: 0; top: 0;
	height: 100dvh;
	width: 440px;
	max-width: 100vw;
	z-index: 90;
	background: var(--iv-paper);
	box-shadow: -24px 0 60px rgba(0,0,0,0.18);
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform .35s var(--iv-ease);
	visibility: hidden;
}
.iv_cart-drawer[data-open="true"] {
	transform: translateX(0);
	visibility: visible;
}

/* Top gradient accent strip */
.iv_cart-drawer::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: var(--iv-grad-warm);
}

.iv_cart-drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 20px 22px 16px;
	border-bottom: 1px solid var(--iv-stone-100);
}
.iv_cart-drawer-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-family: var(--iv-font-body);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--iv-ink);
}
.iv_cart-drawer-title svg { color: var(--iv-accent); }
.iv_cart-drawer-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	background: var(--iv-accent-deep);
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	border-radius: 999px;
	letter-spacing: 0;
}

.iv_cart-drawer-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 8px 22px 16px;
	-webkit-overflow-scrolling: touch;
}
.iv_cart-drawer-loading {
	padding: 40px 0;
	text-align: center;
	color: var(--iv-ink-muted);
	font-size: 0.9rem;
}
.iv_cart-drawer-empty {
	padding: 56px 0 24px;
	text-align: center;
	color: var(--iv-ink-muted);
}
.iv_cart-drawer-empty p {
	font-size: 1rem;
	margin: 0 0 var(--iv-s-3);
}

/* Cart items */
.iv_cart-items { list-style: none; margin: 0; padding: 0; }
.iv_cart-item {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid var(--iv-stone-100);
}
.iv_cart-item:last-child { border-bottom: none; }

.iv_cart-item-thumb {
	width: 80px;
	height: 80px;
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-100);
}
.iv_cart-item-thumb img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}

.iv_cart-item-main {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.iv_cart-item-name {
	font-weight: 600;
	color: var(--iv-ink);
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.iv_cart-item-name a { color: inherit; text-decoration: none; }
.iv_cart-item-name a:hover { color: var(--iv-accent); }

.iv_cart-item-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.iv_cart-item-price {
	font-weight: 700;
	color: var(--iv-accent);
	font-size: 0.95rem;
	white-space: nowrap;
}

/* Qty stepper */
.iv_cart-item-qty {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	overflow: hidden;
	background: var(--iv-paper);
}
.iv_qty-btn {
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	color: var(--iv-ink);
	cursor: pointer;
	font-size: 1rem;
	line-height: 1;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_qty-btn:hover { background: var(--iv-warm-50); color: var(--iv-accent); }
.iv_cart-item-qty input {
	width: 36px;
	border: none;
	background: transparent;
	text-align: center;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--iv-ink);
	padding: 0;
	-moz-appearance: textfield;
}
.iv_cart-item-qty input::-webkit-outer-spin-button,
.iv_cart-item-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.iv_cart-item-qty input:focus { outline: none; }

.iv_cart-item-remove {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	color: var(--iv-ink-muted);
	font-size: 0.75rem;
	cursor: pointer;
	transition: color .12s var(--iv-ease);
	align-self: flex-start;
}
.iv_cart-item-remove:hover { color: var(--iv-accent); }

/* Drawer footer */
.iv_cart-drawer-foot {
	padding: 16px 22px 18px;
	background: var(--iv-warm-50);
	border-top: 1px solid var(--iv-stone-100);
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.iv_cart-drawer-subtotal {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
}
.iv_cart-drawer-subtotal-label {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--iv-ink);
}
.iv_cart-drawer-subtotal-amount {
	font-family: var(--iv-font-display);
	font-size: 1.5rem;
	color: var(--iv-accent);
}
.iv_cart-drawer-disclaimer {
	margin: -2px 0 4px;
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
}
.iv_cart-drawer-checkout { width: 100%; }

.iv_cart-drawer-cont {
	margin: 0;
	padding: 12px 22px 20px;
	background: var(--iv-paper);
	border: none;
	color: var(--iv-ink-muted);
	font-size: 0.8125rem;
	cursor: pointer;
	transition: color .12s var(--iv-ease);
}
.iv_cart-drawer-cont:hover { color: var(--iv-accent); }

/* Add-to-cart button loading state */
.add_to_cart_button.loading,
.single_add_to_cart_button.loading {
	opacity: 0.7;
	pointer-events: none;
	position: relative;
}
.add_to_cart_button.loading::after,
.single_add_to_cart_button.loading::after {
	content: "";
	width: 12px;
	height: 12px;
	margin-left: 8px;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	display: inline-block;
	animation: iv-spin 0.6s linear infinite;
	vertical-align: -1px;
}

/* =========================================================================
   CART, CHECKOUT, ACCOUNT — premium page styling
   ========================================================================= */

.woocommerce-cart .iv_woocommerce-main,
.woocommerce-checkout .iv_woocommerce-main,
.woocommerce-account .iv_woocommerce-main { padding: 0; }

/* Padding goes on .iv_archive-layout (the content wrapper) — NOT .iv_container,
 * because every header row also uses .iv_container and would otherwise inherit
 * 32px/48px vertical padding, blowing up the dark nav row. */
.woocommerce-cart .iv_archive-layout,
.woocommerce-checkout .iv_archive-layout,
.woocommerce-account .iv_archive-layout { padding: var(--iv-s-4) 0 var(--iv-s-5); }

/* WC notices: brand-colored bars */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
	padding: 14px 18px !important;
	margin: 0 0 var(--iv-s-3) !important;
	border-radius: var(--iv-radius-md) !important;
	font-size: 0.9375rem !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	border-left: 4px solid !important;
	background: var(--iv-warm-50) !important;
	color: var(--iv-ink) !important;
}
.woocommerce-message { border-left-color: #16a34a !important; background: #f0fdf4 !important; }
.woocommerce-info    { border-left-color: var(--iv-accent) !important; }
.woocommerce-error   { border-left-color: #dc2626 !important; background: #fef2f2 !important; }
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none !important; }
.woocommerce-message .button,
.woocommerce-error .button {
	margin-left: auto !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 8px 16px !important;
	font-size: 0.8125rem !important;
}

/* --- Cart page table --- */
.woocommerce-cart table.shop_table {
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-lg) !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
	background: var(--iv-paper);
	margin-bottom: var(--iv-s-3) !important;
}
.woocommerce-cart table.shop_table th {
	background: var(--iv-warm-50) !important;
	color: var(--iv-ink) !important;
	font-family: var(--iv-font-body) !important;
	font-weight: 700 !important;
	font-size: 0.75rem !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	padding: 16px !important;
	border: none !important;
}
.woocommerce-cart table.shop_table td {
	padding: 18px 16px !important;
	border-top: 1px solid var(--iv-stone-100) !important;
	vertical-align: middle !important;
}
.woocommerce-cart table.shop_table tbody tr:first-child td { border-top: none !important; }
.woocommerce-cart .product-thumbnail img {
	width: 80px !important;
	height: 80px !important;
	object-fit: cover;
	border-radius: var(--iv-radius-md);
}
.woocommerce-cart .product-name a {
	color: var(--iv-ink) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}
.woocommerce-cart .product-name a:hover { color: var(--iv-accent) !important; }
.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal { color: var(--iv-accent) !important; font-weight: 700 !important; }
.woocommerce-cart .product-remove a.remove {
	width: 28px !important;
	height: 28px !important;
	border-radius: 50% !important;
	background: var(--iv-stone-100) !important;
	color: var(--iv-ink-muted) !important;
	line-height: 28px !important;
	text-align: center !important;
	font-weight: 400 !important;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.woocommerce-cart .product-remove a.remove:hover {
	background: var(--iv-accent) !important;
	color: #fff !important;
}
.woocommerce-cart .quantity input.qty {
	width: 64px !important;
	padding: 6px 10px !important;
	border-radius: var(--iv-radius-sm) !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	text-align: center;
}
.woocommerce-cart .actions {
	background: var(--iv-warm-50) !important;
	padding: 16px !important;
}
.woocommerce-cart .actions .button,
.woocommerce-cart .actions .coupon .button,
.woocommerce-cart .coupon input.input-text {
	border-radius: 999px !important;
	padding: 10px 18px !important;
	border: 1.5px solid var(--iv-stone-200) !important;
}
.woocommerce-cart .actions .button[name="update_cart"] {
	background: var(--iv-ink) !important;
	color: #fff !important;
	border-color: var(--iv-ink) !important;
}
.woocommerce-cart .coupon .button {
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-color: var(--iv-accent) !important;
}

/* Cart totals card */
.cart-collaterals { display: grid; grid-template-columns: 1fr; gap: var(--iv-s-3); margin-top: var(--iv-s-3); }
@media (min-width: 768px) {
	.cart-collaterals { grid-template-columns: 1fr 1fr; }
}
.cart_totals,
.cross-sells {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-3) !important;
	margin: 0 !important;
	float: none !important;
	width: auto !important;
}
.cart_totals h2 {
	margin: 0 0 var(--iv-s-2) !important;
	font-size: 1.25rem !important;
	font-family: var(--iv-font-display);
}
.cart_totals .shop_table {
	border: none !important;
	background: transparent !important;
}
.cart_totals .shop_table th,
.cart_totals .shop_table td {
	background: transparent !important;
	padding: 12px 0 !important;
	border-top: 1px solid var(--iv-stone-100) !important;
	text-transform: none !important;
	font-size: 0.9375rem !important;
	letter-spacing: 0 !important;
}
.cart_totals .order-total td,
.cart_totals .order-total th {
	font-weight: 700 !important;
	font-size: 1.0625rem !important;
	color: var(--iv-ink) !important;
}
.cart_totals .order-total .amount { color: var(--iv-accent) !important; font-size: 1.25rem; font-family: var(--iv-font-display); }
.wc-proceed-to-checkout { margin-top: var(--iv-s-2) !important; }
.wc-proceed-to-checkout .checkout-button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	padding: 14px 22px !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	text-align: center !important;
}
.wc-proceed-to-checkout .checkout-button:hover { background: var(--iv-accent-deep-2) !important; }

/* --- Checkout page --- */
.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-4);
}
@media (min-width: 1024px) {
	.woocommerce-checkout form.checkout {
		grid-template-columns: 1.4fr 1fr;
		align-items: start;
	}
}
.woocommerce-checkout #customer_details {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-4);
}
.woocommerce-checkout #customer_details h3 {
	margin: 0 0 var(--iv-s-3) !important;
	font-size: 1.25rem !important;
	font-family: var(--iv-font-display);
}
.woocommerce-checkout .col2-set { display: grid; grid-template-columns: 1fr; gap: var(--iv-s-3); width: 100% !important; }
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { width: 100% !important; float: none !important; padding: 0 !important; }
.woocommerce-checkout .form-row {
	margin: 0 0 14px !important;
	padding: 0 !important;
}
.woocommerce-checkout .form-row label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--iv-ink);
	margin-bottom: 6px;
}
.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row .select2-selection {
	width: 100% !important;
	padding: 12px 14px !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-sm) !important;
	background: var(--iv-paper) !important;
	font-size: 0.9375rem !important;
	color: var(--iv-ink) !important;
}
.woocommerce-checkout .form-row .select2-selection__rendered { line-height: 26px !important; padding: 0 !important; }
.woocommerce-checkout .form-row .select2-selection__arrow { top: 12px !important; right: 12px !important; }

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
}
.woocommerce-checkout #order_review_heading {
	margin: 0 0 -1px !important;
	padding: var(--iv-s-3) var(--iv-s-3) 0 !important;
	border-bottom: none !important;
	font-size: 1.25rem !important;
	font-family: var(--iv-font-display);
}
.woocommerce-checkout #order_review {
	padding: var(--iv-s-3) !important;
	margin-top: 0 !important;
}
.woocommerce-checkout #order_review .shop_table {
	border: none !important;
	background: transparent !important;
}
.woocommerce-checkout #order_review .shop_table th,
.woocommerce-checkout #order_review .shop_table td {
	padding: 12px 0 !important;
	background: transparent !important;
	border-bottom: 1px solid var(--iv-stone-100) !important;
}
.woocommerce-checkout #order_review .order-total .amount {
	color: var(--iv-accent) !important;
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
}
.woocommerce-checkout #payment {
	background: transparent !important;
	border-radius: 0 !important;
	margin-top: var(--iv-s-3) !important;
}
.woocommerce-checkout #payment ul.payment_methods {
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-md) !important;
	padding: 12px !important;
	background: var(--iv-warm-50) !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
	padding: 10px 12px !important;
	background: var(--iv-paper) !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-sm) !important;
	margin-bottom: 8px !important;
}
.woocommerce-checkout #payment ul.payment_methods li:last-child { margin-bottom: 0 !important; }
.woocommerce-checkout #payment .place-order button#place_order {
	width: 100% !important;
	padding: 16px 22px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	border: none !important;
	margin-top: var(--iv-s-3) !important;
}
.woocommerce-checkout #payment .place-order button#place_order:hover { background: var(--iv-accent-deep-2) !important; }

/* --- My account page --- */
.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-4);
}
@media (min-width: 900px) {
	.woocommerce-account .woocommerce {
		grid-template-columns: 240px 1fr;
	}
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: 12px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 10px 14px;
	color: var(--iv-ink);
	text-decoration: none;
	border-radius: var(--iv-radius-sm);
	font-size: 0.9375rem;
	font-weight: 500;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: var(--iv-warm-50); color: var(--iv-accent); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--iv-accent-deep);
	color: #fff;
}
.woocommerce-account .woocommerce-MyAccount-content {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-4);
	min-width: 0;
}
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
	margin: 0 0 var(--iv-s-2);
	font-family: var(--iv-font-display);
}
.woocommerce-account .woocommerce-MyAccount-content .button {
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 10px 18px !important;
	font-weight: 600 !important;
	border: none !important;
}
.woocommerce-account .woocommerce-MyAccount-content .button:hover { background: var(--iv-accent-deep-2) !important; }
.woocommerce-account .woocommerce-form {
	max-width: 480px;
}
.woocommerce-account form.login,
.woocommerce-account form.register {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-4);
}
.woocommerce-account form .form-row input {
	width: 100% !important;
	padding: 12px 14px !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-sm) !important;
	font-size: 0.9375rem !important;
}

/* Address cards on account dashboard */
.woocommerce-account .addresses .address {
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	padding: var(--iv-s-3);
}
.woocommerce-account .addresses header.woocommerce-Address-title h3 {
	font-size: 1rem !important;
	font-family: var(--iv-font-body) !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.woocommerce-account .addresses header.woocommerce-Address-title .edit {
	color: var(--iv-accent) !important;
	font-size: 0.8125rem !important;
}

/* Order tables on account */
.woocommerce-orders-table {
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-md) !important;
	overflow: hidden;
}
.woocommerce-orders-table .button.view {
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 6px 14px !important;
	font-size: 0.8125rem !important;
}

/* =========================================================================
   BLOCK-BASED CART + CHECKOUT — premium styling for WC 8+ block markup
   (the shortcode-based CSS above still applies if a site reverts to legacy)
   ========================================================================= */

/* ---- Page-frame & container ---- */
/* NOTE: do NOT add vertical padding to .iv_container here — the header rows
 * (.iv_header-top, .iv_header-nav) also use .iv_container and would inherit
 * the padding, ballooning the header. Use .iv_archive-layout for vertical
 * spacing of the page body instead. */
.woocommerce-cart   .iv_archive-layout,
.woocommerce-checkout .iv_archive-layout { max-width: 1240px; margin: 0 auto; }

/* WC utility wrap (cart, checkout, my account) — simple container, no
 * filter sidebar. The filter sidebar is for product archives only.
 * Inside this wrap, WC blocks + our grid overrides handle the 70/30 split. */
.iv_wc-utility-wrap { width: 100%; }
.iv_wc-utility-wrap .iv_main {
	padding: clamp(20px, 3vw, 40px) 0 clamp(40px, 5vw, 80px);
}
.iv_wc-utility-section {
	padding: clamp(28px, 3vw, 48px) 0 clamp(48px, 5vw, 80px);
}
.iv_wc-utility-header {
	margin: 0 0 clamp(20px, 3vw, 36px);
	padding-bottom: clamp(16px, 2vw, 24px);
	border-bottom: 1px solid var(--iv-stone-200);
}
.iv_wc-utility-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 3vw + 1rem, 3rem);
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--iv-ink);
	margin: 0;
}

/* WC block layout — the comment below this stayed accurate until we noticed
 * that on cart/checkout pages WC's responsive 2-col layout sometimes never
 * triggers (it relies on a container query that depends on its parent's
 * width). Force the 70/30 grid explicitly at desktop widths so the layout
 * is deterministic. min-width:0 on children stops grid blowout. */
.wc-block-cart__main,
.wc-block-checkout__main,
.wc-block-cart__sidebar,
.wc-block-checkout__sidebar { min-width: 0; }

@media (min-width: 1024px) {

	/* === BLOCK-BASED cart + checkout ===
	 *
	 * INVESTIGATION (Chrome DevTools on live DOM, see commit history):
	 *
	 *   The structure WC actually renders is:
	 *     .wp-block-woocommerce-cart (or -checkout)   ← outer "alignwide" block
	 *       ↓
	 *     .wc-block-components-sidebar-layout         ← the REAL flex layout container
	 *     .wc-block-cart                              ← same node as above (composite class)
	 *       ↓
	 *     .wc-block-components-main                   ← left column
	 *     .wc-block-components-sidebar                ← right column
	 *
	 *   The bug was: WC's default CSS gave .wc-block-components-sidebar-layout
	 *   `margin: 0 113px` (auto-centered with max-width caps) AND `flex: 0 1 auto`
	 *   so it never grew to fill the outer block. That's why the layout looked
	 *   "narrow centered" — the inner layout was only ~994px inside a 1300px shell.
	 *
	 *   Fix: kill the margins, force width:100%, flex:1 1 auto on the layout.
	 *   Then inside it set main flex:1 1 auto and sidebar flex:0 0 380px sticky.
	 */
	.woocommerce-cart .wc-block-components-sidebar-layout,
	.woocommerce-checkout .wc-block-components-sidebar-layout {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: flex-start !important;
		gap: clamp(24px, 3vw, 40px) !important;
		margin: 0 !important;
		width: 100% !important;
		max-width: none !important;
		flex: 1 1 auto !important;
		container-type: normal !important;
	}

	/* Outer block can stay block-level — the layout helper above is the
	 * actual flex container; the outer just needs to stop being a flex
	 * row that fights its child. */
	.woocommerce-cart .wp-block-woocommerce-cart,
	.woocommerce-checkout .wp-block-woocommerce-checkout {
		display: block !important;
	}

	/* Main column — fills the rest */
	.wc-block-cart__main,
	.wc-block-checkout__main,
	.wc-block-components-main {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		width: auto !important;
		max-width: none !important;
	}

	/* Sidebar — fixed 380px, sticky as you scroll */
	.wc-block-cart__sidebar,
	.wc-block-checkout__sidebar,
	.wc-block-components-sidebar {
		flex: 0 0 380px !important;
		width: 380px !important;
		min-width: 380px !important;
		max-width: 380px !important;
		position: sticky !important;
		top: 100px !important;
	}

	/* === MY ACCOUNT ===
	 *
	 * INVESTIGATION: WC default stylesheet sets
	 *   .woocommerce-MyAccount-navigation { float: left;  width: 30%; }
	 *   .woocommerce-MyAccount-content    { float: right; width: 68%; }
	 * Floats inside a display:grid parent confuse the grid placement so the
	 * children were rendered in REVERSED columns AND different rows (nav
	 * went to col 2 row 1, content to col 1 row 2). Both were ~300/180px
	 * because their float widths overrode the grid.
	 *
	 * Fix: kill the float + width on both children, pin them to explicit
	 * grid-column / grid-row so they always land in the right cells.
	 */
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		float: none !important;
		width: auto !important;
		min-width: 0 !important;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation {
		grid-column: 1 !important;
		grid-row: 1 !important;
	}
	.woocommerce-account .woocommerce-MyAccount-content {
		grid-column: 2 !important;
		grid-row: 1 !important;
	}

	/* === EDIT-ADDRESS page (the 2-up Factuuradres + Verzendadres view) ===
	 *
	 * Same flavour of bug as my-account nav. WC default:
	 *   .u-column1 { float: left;  width: 48%; }
	 *   .u-column2 { float: right; width: 48%; }
	 * Inside our 1004px content column the floats put the cards in REVERSED
	 * columns and on different rows. Force a clean 2-col grid + pin each
	 * child to its grid cell.
	 */
	.woocommerce-account .u-columns.addresses,
	.woocommerce-account .u-columns.col2-set {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		gap: 20px !important;
		margin: 16px 0 0 !important;
	}
	.woocommerce-account .u-column1,
	.woocommerce-account .u-column2,
	.woocommerce-account .col-1,
	.woocommerce-account .col-2,
	.woocommerce-account .woocommerce-Address {
		float: none !important;
		width: auto !important;
		margin: 0 !important;
	}
	.woocommerce-account .u-columns > .u-column1,
	.woocommerce-account .u-columns > .col-1 { grid-column: 1 !important; grid-row: 1 !important; }
	.woocommerce-account .u-columns > .u-column2,
	.woocommerce-account .u-columns > .col-2 { grid-column: 2 !important; grid-row: 1 !important; }
}

@media (max-width: 640px) {
	.woocommerce-account .u-columns.addresses,
	.woocommerce-account .u-columns.col2-set {
		display: grid;
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

/* =====================================================================
   MY ACCOUNT — Login / Register / Lost Password (logged-out state)
   The /my-account/ page renders WC's login + register forms when the
   visitor isn't authenticated. Both get a premium card treatment so
   they match the site's design language.
   ===================================================================== */
.woocommerce-account:not(.logged-in) .iv_wc-utility-section .iv_container {
	max-width: 980px;
	margin: 0 auto;
}
.woocommerce-account .u-columns.col2-set:not(.addresses) {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
}
@media (min-width: 720px) {
	.woocommerce-account .u-columns.col2-set:not(.addresses) {
		grid-template-columns: 1fr 1fr;
	}
}

.woocommerce-form-login,
.woocommerce-form-register,
form.lost_reset_password {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.06) 0%, transparent 60%),
		var(--iv-paper);
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 16px !important;
	padding: 28px 26px !important;
	box-shadow: 0 16px 40px -28px rgba(20, 12, 4, 0.2);
}

/* Section heading above each form */
.woocommerce-account .u-columns.col2-set:not(.addresses) h2,
.woocommerce-account .lost_reset_password ~ h2,
.woocommerce-account form .woocommerce-form-row + .woocommerce-form-row {
	font-family: var(--iv-font-display);
}
.woocommerce-account h2,
.woocommerce-account .lost_reset_password h2 {
	font-family: var(--iv-font-display);
	font-size: 1.5rem;
	color: var(--iv-ink);
	letter-spacing: -0.015em;
	margin: 0 0 18px;
}

/* Form fields inside the login/register cards */
.woocommerce-form-login .form-row,
.woocommerce-form-register .form-row,
form.lost_reset_password .form-row {
	margin-bottom: 16px;
}
.woocommerce-form-login label,
.woocommerce-form-register label,
form.lost_reset_password label {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--iv-ink);
	margin-bottom: 6px;
}
.woocommerce-form-login input[type="text"],
.woocommerce-form-login input[type="email"],
.woocommerce-form-login input[type="password"],
.woocommerce-form-register input[type="text"],
.woocommerce-form-register input[type="email"],
.woocommerce-form-register input[type="password"],
form.lost_reset_password input[type="text"],
form.lost_reset_password input[type="email"],
form.lost_reset_password input[type="password"] {
	width: 100% !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 10px !important;
	padding: 12px 14px !important;
	font-size: 0.9375rem !important;
	background: var(--iv-paper) !important;
	color: var(--iv-ink) !important;
	box-shadow: none !important;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.woocommerce-form-login input:focus,
.woocommerce-form-register input:focus,
form.lost_reset_password input:focus {
	border-color: var(--iv-accent) !important;
	box-shadow: 0 0 0 3px rgba(245, 129, 36, 0.18) !important;
	outline: none !important;
}
/* Higher-specificity catch — WC ships `.woocommerce-form-row .input-text { border-radius: 6px }`
   which would otherwise beat the input[type=...] rule above. */
.woocommerce-account .woocommerce-form-login .input-text,
.woocommerce-account .woocommerce-form-register .input-text,
.woocommerce-account form.lost_reset_password .input-text,
.woocommerce-account .woocommerce-form-row .input-text {
	border-radius: 10px !important;
	border: 1px solid var(--iv-stone-200) !important;
	padding: 12px 14px !important;
	background: var(--iv-paper) !important;
	color: var(--iv-ink) !important;
}

/* "Onthouden" remember-me + bottom row layout */
.woocommerce-form-login .form-row-checkbox,
.woocommerce-form-login .woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.875rem;
	color: var(--iv-ink-muted);
}
.woocommerce-form-login input[type="checkbox"] {
	accent-color: var(--iv-accent);
}

/* Primary submit — full-width orange pill */
.woocommerce-form-login button[type="submit"],
.woocommerce-form-login .button,
.woocommerce-form-register button[type="submit"],
.woocommerce-form-register .button,
form.lost_reset_password button[type="submit"],
form.lost_reset_password .button {
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 12px 22px !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	width: 100% !important;
	height: auto !important;
	cursor: pointer;
	transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
.woocommerce-form-login button[type="submit"]:hover,
.woocommerce-form-login .button:hover,
.woocommerce-form-register button[type="submit"]:hover,
.woocommerce-form-register .button:hover,
form.lost_reset_password button[type="submit"]:hover,
form.lost_reset_password .button:hover {
	background: var(--iv-accent-deep-2) !important;
	transform: translateY(-1px);
	box-shadow: 0 12px 28px -16px rgba(245, 129, 36, 0.55) !important;
}

/* "Wachtwoord vergeten?" link */
.woocommerce-form-login .lost_password,
.woocommerce-LostPassword,
.woocommerce-form-login p.form-row + p.form-row-wide {
	text-align: center;
	margin-top: 12px;
}
.woocommerce-LostPassword a,
.lost_password a {
	color: var(--iv-accent);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.875rem;
	border-bottom: 1px dotted var(--iv-accent-soft);
}
.woocommerce-LostPassword a:hover,
.lost_password a:hover {
	color: var(--iv-accent-2);
	border-color: var(--iv-accent-2);
}

/* Privacy-policy notice inside register form */
.woocommerce-privacy-policy-text {
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
	margin: 8px 0 16px;
	line-height: 1.55;
}
.woocommerce-privacy-policy-text a {
	color: var(--iv-accent);
	font-weight: 600;
}

/* Card visuals — apply at all viewport widths */
.woocommerce-account .woocommerce-Address {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.06) 0%, transparent 60%),
		var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 14px;
	padding: 22px;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.woocommerce-account .woocommerce-Address:hover {
	border-color: var(--iv-accent);
	box-shadow: 0 10px 28px -18px rgba(245, 129, 36, 0.4);
}
.woocommerce-account .woocommerce-Address-title {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--iv-stone-100);
	font-family: var(--iv-font-display);
	font-size: 1.125rem;
	color: var(--iv-ink);
	line-height: 1.2;
}
.woocommerce-account .woocommerce-Address-title h3,
.woocommerce-account .woocommerce-Address-title .title {
	font-family: var(--iv-font-display);
	font-size: 1.125rem;
	color: var(--iv-ink);
	margin: 0;
}
.woocommerce-account .woocommerce-Address .edit {
	display: inline-flex !important;
	align-items: center;
	font-size: 0.8125rem !important;
	font-weight: 600;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent) !important;
	text-decoration: none;
	white-space: nowrap;
	width: auto !important;
	height: auto !important;
	transition: background .18s ease, color .18s ease;
}
.woocommerce-account .woocommerce-Address .edit:hover {
	background: var(--iv-accent-deep);
	color: #fff !important;
}
.woocommerce-account .woocommerce-Address address {
	font-style: normal;
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.55;
	margin: 0;
}

@media (min-width: 1024px) {
	/* === CLASSIC shortcode cart + checkout === */

	.woocommerce-cart   .woocommerce > form.woocommerce-cart-form,
	.woocommerce-cart   .woocommerce-cart-form + .cart-collaterals,
	.woocommerce-checkout .woocommerce-checkout form,
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review { min-width: 0; }

	.woocommerce-cart .woocommerce {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		gap: clamp(24px, 3vw, 40px);
		align-items: start;
	}
	.woocommerce-cart .woocommerce > .cart-collaterals { position: sticky; top: 100px; }

	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		gap: clamp(24px, 3vw, 40px);
		align-items: start;
	}
	.woocommerce-checkout form.checkout #order_review_heading,
	.woocommerce-checkout form.checkout #order_review { grid-column: 2; }
	.woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; }
	.woocommerce-checkout form.checkout #order_review { position: sticky; top: 100px; }
}

/* =====================================================================
   WC UTILITY PAGES — premium on-brand styling
   Cart, Checkout, My account — match the site's design language so
   they don't look like raw WC defaults dropped onto a premium theme.
   ===================================================================== */

/* ---- Sidebar card (right column on cart + checkout) ---- */
.wc-block-cart__sidebar,
.wc-block-checkout__sidebar,
.wc-block-components-sidebar,
.woocommerce-cart .cart_totals,
.woocommerce-checkout #order_review {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.08) 0%, transparent 55%),
		var(--iv-paper) !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 16px !important;
	padding: 24px 22px !important;
}

/* ---- Inner order summary inside the block sidebar ---- */
.wc-block-components-totals-wrapper,
.wc-block-components-totals-item {
	border-color: var(--iv-stone-100) !important;
}
.wc-block-components-totals-item__label {
	color: var(--iv-ink-soft) !important;
	font-weight: 500 !important;
}
.wc-block-components-totals-item__value {
	color: var(--iv-ink) !important;
	font-weight: 600 !important;
	font-variant-numeric: tabular-nums !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-item--grand-total .wc-block-components-totals-item__value {
	font-family: var(--iv-font-display) !important;
	color: var(--iv-accent) !important;
	font-size: 1.5rem !important;
}

/* ---- Cart item rows — card-style ---- */
.wc-block-cart-items__row,
.woocommerce-cart-form .cart_item {
	background: var(--iv-paper) !important;
}
.wc-block-cart-item__quantity .wc-block-components-quantity-selector {
	border-color: var(--iv-stone-200) !important;
	border-radius: 999px !important;
	overflow: hidden !important;
}
.wc-block-components-quantity-selector__button:hover {
	color: var(--iv-accent) !important;
}

/* ---- Primary buttons everywhere on WC utility pages → brand orange ---- */
.woocommerce-cart   .wc-block-components-button,
.woocommerce-checkout .wc-block-components-button,
.woocommerce-cart   .button:not(.wc-block-components-button),
.woocommerce-checkout .button:not(.wc-block-components-button),
.woocommerce-checkout #place_order,
.woocommerce-cart .checkout-button {
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	font-weight: 600 !important;
	transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease !important;
}
.woocommerce-cart   .wc-block-components-button:hover,
.woocommerce-checkout .wc-block-components-button:hover,
.woocommerce-cart   .button:not(.wc-block-components-button):hover,
.woocommerce-checkout .button:not(.wc-block-components-button):hover,
.woocommerce-checkout #place_order:hover,
.woocommerce-cart .checkout-button:hover {
	background: var(--iv-accent-deep-2) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 10px 24px -14px rgba(245, 129, 36, 0.55) !important;
}

/* ---- Form fields — premium look ---- */
.woocommerce-cart .wc-block-components-text-input input,
.woocommerce-checkout .wc-block-components-text-input input,
.woocommerce-checkout .input-text,
.woocommerce-checkout select {
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 12px !important;
	background: var(--iv-paper) !important;
	font-size: 0.9375rem !important;
	transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}
.woocommerce-cart .wc-block-components-text-input input:focus,
.woocommerce-checkout .wc-block-components-text-input input:focus,
.woocommerce-checkout .input-text:focus,
.woocommerce-checkout select:focus {
	border-color: var(--iv-accent) !important;
	box-shadow: 0 0 0 3px rgba(245, 129, 36, 0.15) !important;
	outline: none !important;
}

/* ---- Section dividers in checkout (Contactgegevens / Factuuradres / Betalingsopties) ---- */
.wc-block-checkout__contact-fields,
.wc-block-checkout__billing-fields,
.wc-block-checkout__shipping-fields,
.wc-block-checkout__payment-method {
	background: var(--iv-paper) !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 16px !important;
	padding: 24px 22px !important;
	margin: 0 0 18px !important;
}
.wc-block-checkout__contact-fields h2,
.wc-block-checkout__billing-fields h2,
.wc-block-checkout__shipping-fields h2,
.wc-block-checkout__payment-method h2 {
	font-family: var(--iv-font-display) !important;
	font-size: 1.25rem !important;
	color: var(--iv-ink) !important;
	letter-spacing: -0.015em !important;
	margin: 0 0 18px !important;
}

/* ---- My-account: premium pill nav ---- */
.woocommerce-account .iv_wc-utility-section .iv_container > .woocommerce,
.woocommerce-account .iv_wc-utility-section .iv_container > .wp-block-woocommerce-my-account,
.woocommerce-account .iv_wc-utility-section > .iv_container .woocommerce-MyAccount-content,
.woocommerce-account .iv_wc-utility-section > .iv_container .woocommerce-MyAccount-navigation { min-width: 0; }
@media (min-width: 900px) {
	.woocommerce-account .iv_wc-utility-section .iv_container > .woocommerce,
	.woocommerce-account .iv_wc-utility-section .iv_container > .wp-block-woocommerce-my-account {
		display: grid !important;
		grid-template-columns: 260px minmax(0, 1fr) !important;
		gap: 36px !important;
		align-items: start !important;
	}
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.05) 0%, transparent 60%),
		var(--iv-paper) !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 16px !important;
	padding: 14px !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	border-radius: 10px !important;
	padding: 11px 14px !important;
	font-weight: 600 !important;
}
.woocommerce-account .woocommerce-MyAccount-content {
	background: var(--iv-paper) !important;
	border: 1px solid var(--iv-stone-200) !important;
	border-radius: 16px !important;
	padding: 32px !important;
}

/* ---- Errors / notices ---- */
.wc-block-components-notice-banner.is-error,
.woocommerce-error,
.woocommerce-checkout .woocommerce-NoticeGroup-checkout {
	border: 1px solid #f3c2c2 !important;
	background: #fff5f5 !important;
	color: #931616 !important;
	border-radius: 12px !important;
	padding: 14px 18px !important;
}

/* ---- Coupon panel — toggle row + input/button row ----
 *
 * WC ships:
 *   .wc-block-components-totals-coupon__button { padding: 10px 18px }
 *     → renders at 64px tall because of font-size 13 * line-height 1.5 * 2
 *       lines from the flex wrapper
 *   .wc-block-components-text-input input { 52px } (taller input)
 *
 * They sit side-by-side in the same row but with 52 vs 64 heights they
 * looked misaligned. Pin both to 48px and switch the wrapper to flex
 * gap:8 stretch so they share the row cleanly. */
.wc-block-components-totals-coupon .wc-block-components-text-input input {
	height: 48px !important;
	min-height: 48px !important;
	padding: 12px 14px !important;
	line-height: 1 !important;
}
.wc-block-components-totals-coupon__button.wc-block-components-button,
.wc-block-components-totals-coupon button {
	height: 48px !important;
	min-height: 48px !important;
	padding: 0 18px !important;
	line-height: 1 !important;
}
.wc-block-components-totals-coupon__content,
.wc-block-components-panel__content {
	display: flex !important;
	gap: 8px !important;
	align-items: stretch !important;
}
.wc-block-components-totals-coupon__content > .wc-block-components-text-input {
	flex: 1 1 auto !important;
}
/* Toggle row — premium feel with accent chevron + clickable cue */
.wc-block-components-totals-coupon .wc-block-components-panel__button {
	padding: 12px 4px !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	font-weight: 600 !important;
	color: var(--iv-ink) !important;
	cursor: pointer;
}
.wc-block-components-totals-coupon .wc-block-components-panel__button-icon {
	width: 18px !important;
	height: 18px !important;
	fill: var(--iv-accent) !important;
	flex: 0 0 18px;
}

/* ---- Cart line-item product image ----
 *
 * WC renders cart items as a <table> with a <td class="wc-block-cart-item__image">
 * cell. Default styling left the image stretched (61×88 from native 80×80)
 * inside a cramped 101px wide cell. Force a clean 80×80 square with rounded
 * corners + a stone-100 fallback bg behind the placeholder. */
.wc-block-cart-item__image {
	width: 120px !important;
	padding: 16px !important;
	vertical-align: middle !important;
	background: transparent !important;
}
.wc-block-cart-item__image a {
	display: block !important;
	width: 80px !important;
	height: 80px !important;
}
.wc-block-cart-item__image img {
	display: block !important;
	width: 80px !important;
	height: 80px !important;
	max-width: 80px !important;
	max-height: 80px !important;
	object-fit: cover !important;
	border-radius: 10px !important;
	background: var(--iv-stone-100) !important;
}

/* ---- Checkout Bestelloverzicht product image + qty bubble ----
 *
 * WC structure:
 *   <div class="...item__image">
 *     <div class="...item__quantity"><span>1</span></div>   ← qty bubble
 *     <img width="48" height="48">                          ← product img
 *   </div>
 *
 * Default styles laid them out as a flex ROW (qty next to image), but the
 * wrapper collapsed to ~21px wide so only the qty showed and the image
 * was invisible. Convert to position:relative wrap + absolutely-positioned
 * qty bubble at the top-right corner of the image. */
.wc-block-components-order-summary-item {
	gap: 14px !important;
	align-items: flex-start !important;
}
.wc-block-components-order-summary-item__image {
	position: relative !important;
	display: block !important;
	flex: 0 0 64px !important;
	width: 64px !important;
	height: 64px !important;
	min-width: 64px !important;
	border-radius: 10px !important;
	overflow: visible !important;
	background: transparent !important;
}
.wc-block-components-order-summary-item__image img {
	display: block !important;
	width: 64px !important;
	height: 64px !important;
	max-width: 64px !important;
	max-height: 64px !important;
	object-fit: cover !important;
	border-radius: 10px !important;
	background: var(--iv-stone-100) !important;
}
.wc-block-components-order-summary-item__quantity {
	position: absolute !important;
	top: -8px !important;
	right: -8px !important;
	width: 22px !important;
	height: 22px !important;
	border-radius: 999px !important;
	background: var(--iv-ink) !important;
	color: #fff !important;
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: 0 0 0 2px var(--iv-paper);
	z-index: 2;
}

/* =========================================================================
   CART BLOCK
   ========================================================================= */

/* ---- Items list (left column) ---- */
.wc-block-cart-items {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	border-collapse: separate !important;
	width: 100%;
}
.wc-block-cart-items__header {
	background: var(--iv-warm-50);
	border-bottom: 1px solid var(--iv-stone-100);
}
.wc-block-cart-items__header th,
.wc-block-cart-items__header-image,
.wc-block-cart-items__header-product,
.wc-block-cart-items__header-total {
	padding: 14px 20px !important;
	font-size: 0.6875rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	color: var(--iv-ink-muted) !important;
	font-family: var(--iv-font-body) !important;
	border: none !important;
}

.wc-block-cart-items__row {
	border-top: 1px solid var(--iv-stone-100);
}
.wc-block-cart-items__row:first-child { border-top: none; }
.wc-block-cart-items__row td {
	padding: 20px !important;
	vertical-align: top !important;
	background: transparent !important;
}

.wc-block-cart-item__image {
	width: 96px;
}
.wc-block-cart-item__image img,
.wc-block-cart-item__image .wc-block-components-product-image {
	width: 88px !important;
	height: 88px !important;
	object-fit: cover !important;
	border-radius: var(--iv-radius-md) !important;
	background: var(--iv-stone-100);
	display: block;
}
.wc-block-cart-item__image a { display: block; }

.wc-block-cart-item__product .wc-block-components-product-name {
	font-weight: 600 !important;
	color: var(--iv-ink) !important;
	font-size: 1.0625rem !important;
	line-height: 1.3 !important;
	text-decoration: none !important;
	display: block;
	margin-bottom: 6px;
}
.wc-block-cart-item__product .wc-block-components-product-name:hover { color: var(--iv-accent) !important; }
.wc-block-cart-item__product .wc-block-components-product-metadata {
	font-size: 0.8125rem !important;
	color: var(--iv-ink-muted) !important;
	line-height: 1.5;
}
.wc-block-cart-item__product .wc-block-components-product-price {
	font-family: var(--iv-font-display) !important;
	color: var(--iv-accent) !important;
	font-size: 1.125rem !important;
	margin-top: 4px;
}

/* Quantity stepper inside the cart row */
.wc-block-cart-item__quantity {
	margin-top: 12px;
}
.wc-block-components-quantity-selector {
	display: inline-flex !important;
	align-items: center !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: 999px !important;
	background: var(--iv-paper) !important;
	overflow: hidden;
	height: 40px;
	min-width: 0 !important;
	max-width: 140px !important;
}
.wc-block-components-quantity-selector__input {
	border: none !important;
	background: transparent !important;
	text-align: center !important;
	font-weight: 600 !important;
	color: var(--iv-ink) !important;
	width: 48px !important;
	font-size: 0.9375rem !important;
	padding: 0 !important;
	-moz-appearance: textfield;
}
.wc-block-components-quantity-selector__input::-webkit-inner-spin-button,
.wc-block-components-quantity-selector__input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.wc-block-components-quantity-selector__button {
	background: transparent !important;
	border: none !important;
	width: 40px !important;
	height: 40px !important;
	display: grid !important;
	place-items: center !important;
	cursor: pointer !important;
	color: var(--iv-ink-soft) !important;
	font-size: 1.1rem !important;
	font-weight: 600 !important;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.wc-block-components-quantity-selector__button:hover {
	background: var(--iv-warm-50) !important;
	color: var(--iv-accent) !important;
}
.wc-block-components-quantity-selector__button--minus { border-right: 1px solid var(--iv-stone-100) !important; }
.wc-block-components-quantity-selector__button--plus  { border-left:  1px solid var(--iv-stone-100) !important; }

/* "Remove" link under the qty stepper */
.wc-block-cart-item__remove-link {
	font-size: 0.8125rem !important;
	color: var(--iv-ink-muted) !important;
	text-decoration: none !important;
	margin-top: 10px !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px;
	transition: color .12s var(--iv-ease);
}
.wc-block-cart-item__remove-link:hover { color: #dc2626 !important; }

/* Line total */
.wc-block-cart-item__total .wc-block-components-product-price__value,
.wc-block-cart-item__total .wc-block-components-formatted-money-amount {
	font-family: var(--iv-font-display) !important;
	color: var(--iv-ink) !important;
	font-size: 1.125rem !important;
	font-weight: 400 !important;
}

/* ---- Cart sidebar (totals card) ---- */
.wc-block-components-sidebar,
.wp-block-woocommerce-cart-order-summary-block,
.wp-block-woocommerce-checkout-order-summary-block {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-3) !important;
	box-shadow: var(--iv-shadow-sm);
}

.wp-block-woocommerce-cart-order-summary-heading-block,
.wc-block-components-totals-wrapper > h2,
.wp-block-woocommerce-checkout-order-summary-heading-block {
	font-family: var(--iv-font-display) !important;
	font-size: 1.25rem !important;
	margin: 0 0 var(--iv-s-2) !important;
	padding: 0 !important;
	color: var(--iv-ink) !important;
	border: none !important;
}

/* Coupon accordion */
.wc-block-components-totals-coupon {
	margin: 0 0 var(--iv-s-2) !important;
	padding: 10px 0 !important;
	border-top: 1px solid var(--iv-stone-100);
	border-bottom: 1px solid var(--iv-stone-100);
}
.wc-block-components-totals-coupon .wc-block-components-panel__button {
	font-size: 0.9375rem !important;
	font-weight: 500 !important;
	color: var(--iv-ink) !important;
	padding: 6px 0 !important;
}
.wc-block-components-totals-coupon .wc-block-components-panel__button:hover { color: var(--iv-accent) !important; }
.wc-block-components-totals-coupon-link {
	color: var(--iv-accent) !important;
	font-weight: 500 !important;
}
.wc-block-components-totals-coupon__input input {
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: 999px !important;
	padding: 10px 16px !important;
	background: var(--iv-paper) !important;
}
.wc-block-components-totals-coupon__button {
	background: var(--iv-ink) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 10px 18px !important;
	font-weight: 600 !important;
	border: none !important;
}
.wc-block-components-totals-coupon__button:hover { background: var(--iv-accent) !important; }

/* Totals rows */
.wc-block-components-totals-item {
	padding: 8px 0 !important;
	font-size: 0.9375rem;
}
.wc-block-components-totals-item__label {
	color: var(--iv-ink-soft);
}
.wc-block-components-totals-item__value {
	color: var(--iv-ink);
	font-variant-numeric: tabular-nums;
}
.wc-block-components-totals-footer-item,
.wc-block-components-totals-item.wc-block-components-totals-footer-item {
	border-top: 1px solid var(--iv-stone-100) !important;
	margin-top: 8px !important;
	padding-top: 14px !important;
	font-size: 1rem !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-weight: 700 !important;
	color: var(--iv-ink) !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.75rem;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-family: var(--iv-font-display) !important;
	color: var(--iv-accent) !important;
	font-size: 1.625rem !important;
}
.wc-block-components-totals-footer-item__description {
	color: var(--iv-ink-muted) !important;
	font-size: 0.75rem !important;
	margin-top: 4px !important;
}

/* Proceed-to-checkout / place-order button */
.wc-block-cart__submit-container,
.wc-block-checkout__actions {
	margin-top: var(--iv-s-3) !important;
	padding: 0 !important;
	background: transparent !important;
}
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	width: 100% !important;
	padding: 16px 22px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border-radius: 999px !important;
	border: none !important;
	box-shadow: 0 6px 16px rgba(245, 129, 36, 0.18);
	transition: background .15s var(--iv-ease), transform .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
	background: var(--iv-accent-deep-2) !important;
	transform: translateY(-1px);
	box-shadow: 0 10px 24px rgba(245, 129, 36, 0.24);
}

/* Continue-shopping link below the CTA */
.wp-block-woocommerce-proceed-to-checkout-block + p,
.wc-block-cart__submit-container + p {
	text-align: center;
	margin-top: var(--iv-s-2);
}

/* Empty-cart state */
.wp-block-woocommerce-empty-cart-block {
	text-align: center;
	padding: var(--iv-s-6) var(--iv-s-3) !important;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
}

/* =========================================================================
   CHECKOUT BLOCK
   ========================================================================= */

/* Step card */
.wc-block-components-checkout-step {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: var(--iv-s-3) var(--iv-s-3) var(--iv-s-3) !important;
	margin: 0 0 var(--iv-s-3) !important;
	box-shadow: var(--iv-shadow-sm);
	position: relative;
}
.wc-block-components-checkout-step__container { padding: 0 !important; }
.wc-block-components-checkout-step__heading {
	margin: 0 0 6px !important;
	font-family: var(--iv-font-display) !important;
	font-size: 1.375rem !important;
	color: var(--iv-ink) !important;
	display: flex;
	align-items: center;
	gap: 10px;
}
.wc-block-components-checkout-step__heading-content {
	font-size: 0.875rem !important;
	color: var(--iv-ink-muted) !important;
	font-weight: 500;
}
.wc-block-components-checkout-step__title {
	font-family: var(--iv-font-display) !important;
}
.wc-block-components-checkout-step__description {
	font-size: 0.9375rem !important;
	color: var(--iv-ink-muted) !important;
	margin: 0 0 var(--iv-s-2) !important;
}
.wc-block-components-checkout-step__content {
	margin-top: var(--iv-s-2) !important;
}

/* Numbered badge before each step (visual order indicator) */
.wc-block-components-checkout-step::before {
	display: none; /* WC handles this with a counter — leave native styling alone */
}

/* Inputs — pill, branded focus ring */
.wc-block-components-text-input,
.wc-block-components-select,
.wc-block-components-combobox,
.wc-block-components-textarea {
	margin: 0 0 12px !important;
}
.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-combobox input,
.wc-block-components-textarea textarea,
input.wc-block-components-address-form__input {
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-sm) !important;
	background: var(--iv-paper) !important;
	padding: 14px 16px !important;
	font-size: 0.9375rem !important;
	color: var(--iv-ink) !important;
	width: 100% !important;
	min-height: 52px !important;
	transition: border-color .12s var(--iv-ease), box-shadow .12s var(--iv-ease);
}
.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus,
.wc-block-components-combobox input:focus,
.wc-block-components-textarea textarea:focus {
	outline: none !important;
	border-color: var(--iv-accent) !important;
	box-shadow: 0 0 0 3px rgba(245, 129, 36, 0.15) !important;
}
.wc-block-components-text-input label,
.wc-block-components-select label,
.wc-block-components-combobox label,
.wc-block-components-textarea label {
	color: var(--iv-ink-soft) !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-select.is-active label,
.wc-block-components-combobox.is-active label,
.wc-block-components-textarea.is-active label {
	color: var(--iv-ink-muted) !important;
	font-size: 0.75rem !important;
}

/* Validation errors */
.wc-block-components-validation-error {
	color: #dc2626 !important;
	font-size: 0.8125rem !important;
	margin-top: 6px !important;
}
.has-error .wc-block-components-text-input input,
.has-error .wc-block-components-select select,
.has-error input.wc-block-components-address-form__input {
	border-color: #dc2626 !important;
}
.has-error label { color: #dc2626 !important; }

/* Checkboxes + radios */
.wc-block-components-checkbox__mark,
.wc-block-components-radio-control__input {
	accent-color: var(--iv-accent) !important;
}
.wc-block-components-checkbox__input:checked + .wc-block-components-checkbox__mark {
	background: var(--iv-accent) !important;
	border-color: var(--iv-accent) !important;
}
.wc-block-components-checkbox__label,
.wc-block-components-radio-control__label {
	font-size: 0.9375rem !important;
	color: var(--iv-ink) !important;
}

/* Notice banners (the red "Excuus, we staan geen bestellingen toe..." stripe) */
.wc-block-components-notice-banner {
	border-radius: var(--iv-radius-md) !important;
	border-left-width: 4px !important;
	padding: 14px 18px !important;
	font-size: 0.9375rem !important;
	background: var(--iv-warm-50) !important;
	color: var(--iv-ink) !important;
	margin: 0 0 var(--iv-s-2) !important;
}
.wc-block-components-notice-banner.is-error {
	background: #fef2f2 !important;
	border-left-color: #dc2626 !important;
	color: #7f1d1d !important;
}
.wc-block-components-notice-banner.is-info  { border-left-color: var(--iv-accent) !important; }
.wc-block-components-notice-banner.is-success {
	background: #f0fdf4 !important;
	border-left-color: #16a34a !important;
	color: #14532d !important;
}

/* Order summary (right rail) */
.wc-block-components-order-summary {
	max-height: 360px;
	overflow-y: auto;
	padding-right: 4px;
	margin-bottom: var(--iv-s-2);
}
.wc-block-components-order-summary-item {
	padding: 10px 0 !important;
	border-bottom: 1px solid var(--iv-stone-100) !important;
	gap: 12px;
}
.wc-block-components-order-summary-item:last-child { border-bottom: none !important; }
.wc-block-components-order-summary-item__image {
	width: 56px !important;
	height: 56px !important;
	border-radius: var(--iv-radius-sm) !important;
	overflow: hidden;
	background: var(--iv-stone-100);
}
.wc-block-components-order-summary-item__image img {
	width: 100% !important; height: 100% !important; object-fit: cover !important;
}
.wc-block-components-order-summary-item__quantity {
	background: var(--iv-ink) !important;
	color: #fff !important;
	border: 2px solid var(--iv-paper) !important;
	font-weight: 700 !important;
}
.wc-block-components-order-summary-item__description .wc-block-components-product-name,
.wc-block-components-order-summary-item__title {
	color: var(--iv-ink) !important;
	font-weight: 600 !important;
	font-size: 0.9375rem !important;
	line-height: 1.35 !important;
}
.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-order-summary-item__metadata {
	font-size: 0.8125rem !important;
	color: var(--iv-ink-muted) !important;
}
.wc-block-components-order-summary-item__total-price {
	font-family: var(--iv-font-display) !important;
	color: var(--iv-ink) !important;
	font-size: 1rem !important;
}

/* Payment method tiles */
.wc-block-checkout__payment-method,
.wc-block-components-payment-method-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.wc-block-components-radio-control__option {
	padding: 14px !important;
	border: 1.5px solid var(--iv-stone-200) !important;
	border-radius: var(--iv-radius-md) !important;
	background: var(--iv-paper) !important;
	transition: border-color .12s var(--iv-ease), background .12s var(--iv-ease);
}
.wc-block-components-radio-control__option:hover { border-color: var(--iv-accent) !important; }
.wc-block-components-radio-control__option--checked,
.wc-block-components-radio-control__option:has(input:checked) {
	border-color: var(--iv-accent) !important;
	background: var(--iv-accent-soft) !important;
}

/* "Voeg een notitie toe aan je bestelling" / "Add note" toggles */
.wc-block-components-checkout-step .wc-block-components-checkbox {
	font-size: 0.9375rem;
	color: var(--iv-ink-soft);
}

/* Place-order disclaimer text ("Door verder te gaan...") */
.wc-block-checkout__terms {
	font-size: 0.8125rem !important;
	color: var(--iv-ink-muted) !important;
	text-align: center;
	margin: var(--iv-s-2) 0 !important;
}
.wc-block-checkout__terms a { color: var(--iv-accent) !important; text-decoration: underline; }

/* "Terug naar winkelwagen" link */
.wc-block-components-checkout-return-to-cart-button {
	color: var(--iv-ink-muted) !important;
	font-size: 0.875rem !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px;
}
.wc-block-components-checkout-return-to-cart-button:hover { color: var(--iv-accent) !important; }

/* =========================================================================
   SINGLE PRODUCT — horizontal scroll gallery + premium layout
   ========================================================================= */

.single-product div.product {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-4);
}
@media (min-width: 900px) {
	.single-product div.product {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		gap: var(--iv-s-5);
		align-items: start;
	}
}

/* Hide WC's default gallery thumbnail strip (since the scroll shows everything) */
.single-product .flex-control-thumbs {
	display: none !important;
}

/* The gallery as a horizontal scroll-snap film strip */
.single-product .woocommerce-product-gallery {
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	opacity: 1 !important;
	max-width: none !important;
	position: relative;
}
.single-product .woocommerce-product-gallery__wrapper {
	display: flex !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	gap: 12px !important;
	margin: 0 !important;
	padding: 0 0 12px !important;
	transform: none !important;
	scrollbar-width: thin;
	scroll-behavior: smooth;
	background: var(--iv-warm-50);
	border-radius: var(--iv-radius-lg);
	border: 1px solid var(--iv-stone-200);
}
.single-product .woocommerce-product-gallery__wrapper::-webkit-scrollbar { height: 8px; }
.single-product .woocommerce-product-gallery__wrapper::-webkit-scrollbar-track {
	background: var(--iv-warm-100);
	border-radius: 999px;
}
.single-product .woocommerce-product-gallery__wrapper::-webkit-scrollbar-thumb {
	background: var(--iv-accent);
	border-radius: 999px;
}

.single-product .woocommerce-product-gallery__image {
	flex: 0 0 100% !important;
	scroll-snap-align: start !important;
	margin: 0 !important;
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	background: var(--iv-paper);
}
.single-product .woocommerce-product-gallery__image:first-child { border-top-left-radius: var(--iv-radius-lg); }
.single-product .woocommerce-product-gallery__image img {
	width: 100% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}

/* When there's only ONE image, fill the column normally (no scroll affordance) */
.single-product .woocommerce-product-gallery--columns-1 .woocommerce-product-gallery__wrapper {
	overflow: visible !important;
	background: transparent;
	border: none;
	padding: 0 !important;
}

/* (Old "← scroll →" hint pill removed — proper arrow buttons + dots replace it) */

/* --- Product summary side --- */
.single-product .product .summary {
	margin-top: 0 !important;
	width: auto !important;
	float: none !important;
}
.single-product .product_title {
	font-size: clamp(1.75rem, 2vw + 1rem, 2.5rem) !important;
	margin: 0 0 var(--iv-s-2) !important;
	color: var(--iv-ink);
}
.single-product .product .price {
	font-family: var(--iv-font-display) !important;
	font-size: 2rem !important;
	color: var(--iv-accent) !important;
	margin: 0 0 var(--iv-s-2) !important;
}
.single-product .product .price del { color: var(--iv-ink-muted) !important; font-size: 1.25rem !important; }
.single-product .product .price ins { background: transparent !important; text-decoration: none !important; }
.single-product .woocommerce-product-details__short-description {
	color: var(--iv-ink-soft);
	font-size: 1rem;
	line-height: 1.7;
	margin-bottom: var(--iv-s-3);
}

/* Add-to-cart form */
.single-product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: var(--iv-s-3) 0;
}
/* WC quantity stepper — −  [input]  +  (works on single product, cart page, anywhere) */
.quantity {
	display: inline-flex !important;
	align-items: stretch;
	border: 1.5px solid var(--iv-stone-200);
	border-radius: 999px;
	overflow: hidden;
	background: var(--iv-paper);
	transition: border-color .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.quantity:focus-within {
	border-color: var(--iv-accent);
	box-shadow: 0 0 0 4px var(--iv-accent-soft);
}
.quantity input.qty {
	width: 48px !important;
	min-width: 0;
	border: none !important;
	background: transparent !important;
	padding: 0 4px !important;
	margin: 0 !important;
	text-align: center;
	font-weight: 700;
	font-size: 0.9375rem;
	color: var(--iv-ink) !important;
	-moz-appearance: textfield;
	box-shadow: none !important;
}
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.quantity input.qty:focus { outline: none; }
.quantity .iv_qty-btn {
	width: 40px;
	min-width: 40px;
	height: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	color: var(--iv-ink);
	cursor: pointer;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1;
	padding: 0;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
	user-select: none;
}
.quantity .iv_qty-btn:hover {
	background: var(--iv-warm-50);
	color: var(--iv-accent);
}
.quantity .iv_qty-btn:active {
	background: var(--iv-accent-soft);
}
.quantity .iv_qty-btn-minus { border-right: 1px solid var(--iv-stone-100); }
.quantity .iv_qty-btn-plus  { border-left:  1px solid var(--iv-stone-100); }

/* Single product — bigger stepper to match the bigger add-to-cart button */
.single-product form.cart .quantity {
	min-height: 50px;
}
.single-product form.cart .quantity input.qty {
	width: 56px !important;
	font-size: 1rem;
}
.single-product form.cart .quantity .iv_qty-btn {
	width: 44px;
	min-width: 44px;
	font-size: 1.25rem;
}

/* Cart page — adjust to fit table cell */
.woocommerce-cart .quantity {
	max-width: 140px;
}
.single-product form.cart .single_add_to_cart_button {
	flex: 1 1 auto !important;
	padding: 14px 28px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	background: var(--iv-accent-deep) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	letter-spacing: 0.01em !important;
	transition: background .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.single-product form.cart .single_add_to_cart_button:hover {
	background: var(--iv-accent-deep-2) !important;
	transform: translateY(-1px);
}

/* Meta */
.single-product .product_meta {
	margin-top: var(--iv-s-3);
	padding-top: var(--iv-s-3);
	border-top: 1px solid var(--iv-stone-100);
	font-size: 0.875rem;
	color: var(--iv-ink-muted);
}
.single-product .product_meta > span {
	display: block;
	margin-bottom: 6px;
}
.single-product .product_meta a { color: var(--iv-accent); }

/* Tabs (description, reviews, additional info) — sits OUTSIDE the .product grid */
.woocommerce-tabs.wc-tabs-wrapper {
	margin-top: var(--iv-s-5) !important;
	clear: both;
	width: 100%;
}
.woocommerce-tabs ul.tabs {
	display: flex;
	gap: 2px;
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
	border-bottom: 1px solid var(--iv-stone-200) !important;
}
.woocommerce-tabs ul.tabs::before,
.woocommerce-tabs ul.tabs::after { display: none !important; }
.woocommerce-tabs ul.tabs li {
	background: transparent !important;
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
}
.woocommerce-tabs ul.tabs li a {
	display: inline-block;
	padding: 14px 20px !important;
	font-weight: 600 !important;
	color: var(--iv-ink-muted) !important;
	border-bottom: 3px solid transparent !important;
	margin-bottom: -1px;
	transition: color .15s var(--iv-ease), border-color .15s var(--iv-ease) !important;
}
.woocommerce-tabs ul.tabs li a:hover { color: var(--iv-ink) !important; }
.woocommerce-tabs ul.tabs li.active a {
	color: var(--iv-accent) !important;
	border-bottom-color: var(--iv-accent) !important;
}
.woocommerce-tabs .panel {
	padding: var(--iv-s-4) 0 !important;
	color: var(--iv-ink-soft);
	line-height: 1.7;
}

/* Related products — sits OUTSIDE the .product grid, with a prominent gradient divider */
.related.products,
.upsells.products {
	clear: both;
	width: 100%;
	margin-top: var(--iv-s-7) !important;
	padding-top: var(--iv-s-5);
	border-top: none;
	position: relative;
}
.related.products::before,
.upsells.products::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: var(--iv-container-max);
	height: 2px;
	background: linear-gradient(90deg,
		transparent 0%,
		var(--iv-accent-soft) 22%,
		var(--iv-accent)      48%,
		var(--iv-accent)      52%,
		var(--iv-accent-soft) 78%,
		transparent 100%
	);
	border-radius: 2px;
}
/* Small centered accent dot sitting ON the divider for extra polish */
.related.products::after,
.upsells.products::after {
	content: "";
	position: absolute;
	top: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 12px;
	height: 12px;
	background: var(--iv-paper);
	border: 2px solid var(--iv-accent);
	border-radius: 50%;
	box-shadow: 0 0 0 4px var(--iv-paper);
}
.related.products > h2,
.upsells.products > h2 {
	font-size: 1.75rem;
	margin-bottom: var(--iv-s-3);
}

/* =========================================================================
   SINGLE PRODUCT — premium content blocks (eyebrow, pills, USPs, trust, specs)
   ========================================================================= */

/* Sticky summary column on desktop so price + cart stay in view while scrolling */
@media (min-width: 900px) {
	.single-product div.product .summary {
		position: sticky;
		top: 120px;
		align-self: start;
	}
}

/* Brand eyebrow above the title */
.iv_single-eyebrow {
	display: inline-block;
	margin: 0 0 12px;
	padding: 6px 12px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	font-family: var(--iv-font-body);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	color: var(--iv-accent-deep);
}

/* Quick info pills row (in stock + delivery + warranty) */
.iv_single-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: var(--iv-s-2) 0 var(--iv-s-3);
}
.iv_single-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--iv-ink-soft);
	white-space: nowrap;
}
.iv_single-pill svg { color: var(--iv-accent); flex: 0 0 auto; }
.iv_single-pill--stock {
	background: rgba(34, 197, 94, 0.08);
	border-color: rgba(34, 197, 94, 0.30);
	color: #15803d;
}
.iv_single-pill--out {
	background: rgba(220, 38, 38, 0.08);
	border-color: rgba(220, 38, 38, 0.30);
	color: #b91c1c;
}
.iv_single-pill-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #22c55e;
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
	animation: iv_pulse 1.8s ease-in-out infinite;
}
@keyframes iv_pulse {
	0%, 100% { box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18); }
	50%      { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0.04); }
}

/* USPs — check-marked list under cart button */
.iv_single-usps {
	list-style: none;
	margin: var(--iv-s-3) 0;
	padding: var(--iv-s-3);
	background: var(--iv-warm-50);
	border-radius: var(--iv-radius-md);
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 0.9375rem;
}
.iv_single-usps li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--iv-ink-soft);
}
.iv_single-usp-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--iv-accent);
	color: #fff;
	margin-top: 1px;
}

/* Trust badges row (3 fixed items) */
.iv_single-trust {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin: var(--iv-s-3) 0;
	padding: var(--iv-s-3);
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
}
@media (min-width: 540px) and (max-width: 899px),
       (min-width: 1100px) {
	.iv_single-trust { grid-template-columns: repeat(3, 1fr); }
}
.iv_single-trust-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}
.iv_single-trust-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent);
	border-radius: 8px;
}
.iv_single-trust-copy { display: flex; flex-direction: column; line-height: 1.3; }
.iv_single-trust-copy strong {
	font-size: 0.8125rem;
	color: var(--iv-ink);
	font-weight: 700;
}
.iv_single-trust-copy span {
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
	margin-top: 2px;
}

/* ---------- "Offerte aanvragen" + phone block (under add-to-cart) ---------- */
.iv_single-quote-phone {
	margin: var(--iv-s-2) 0 var(--iv-s-3);
	padding: 14px 16px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.iv_single-quote-btn {
	width: 100%;
	justify-content: center;
	background: var(--iv-paper) !important;
	color: var(--iv-ink) !important;
	border: 1.5px solid var(--iv-ink) !important;
	border-radius: 999px !important;
	padding: 12px 20px !important;
	font-weight: 700 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px;
	text-decoration: none !important;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_single-quote-btn:hover {
	background: var(--iv-ink) !important;
	color: #fff !important;
	transform: translateY(-1px);
}
.iv_single-quote-btn svg { flex: 0 0 auto; }

.iv_single-phone-line {
	margin: 0;
	font-size: 0.875rem;
	color: var(--iv-ink-soft);
	text-align: center;
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	justify-content: center;
}
.iv_single-phone-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: var(--iv-accent);
	text-decoration: none;
	font-weight: 600;
	border-bottom: 1px dashed transparent;
	padding-bottom: 1px;
	transition: border-color .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_single-phone-link:hover { border-bottom-color: var(--iv-accent); color: var(--iv-accent-2); }
.iv_single-phone-link svg { color: var(--iv-accent); }

/* ---------- Offerte modal ---------- */
.iv_quote-modal[hidden] { display: none !important; }
.iv_quote-modal {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: grid;
	place-items: center;
	padding: 16px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .22s var(--iv-ease);
}
.iv_quote-modal.is-open { opacity: 1; pointer-events: auto; }
.iv_quote-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(26, 26, 26, 0.6);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.iv_quote-modal-card {
	position: relative;
	width: 100%;
	max-width: 580px;
	max-height: calc(100vh - 32px);
	overflow-y: auto;
	background: var(--iv-paper);
	border-radius: var(--iv-radius-lg);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.32);
	padding: var(--iv-s-4);
	transform: translateY(8px);
	transition: transform .22s var(--iv-ease);
}
.iv_quote-modal.is-open .iv_quote-modal-card { transform: translateY(0); }
.iv_quote-modal-close {
	position: absolute;
	top: 14px; right: 14px;
	width: 36px; height: 36px;
	display: grid; place-items: center;
	background: var(--iv-stone-100);
	border: none;
	border-radius: 50%;
	color: var(--iv-ink);
	cursor: pointer;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_quote-modal-close:hover { background: var(--iv-accent); color: #fff; }

.iv_quote-modal-head { text-align: left; margin-bottom: var(--iv-s-3); padding-right: 40px; }
.iv_quote-modal-head .iv_eyebrow {
	display: inline-block;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--iv-accent-deep);
	margin-bottom: 6px;
}
.iv_quote-modal-title {
	font-family: var(--iv-font-display);
	font-size: clamp(1.375rem, 2vw + 0.5rem, 1.75rem);
	color: var(--iv-ink);
	margin: 0 0 8px;
	line-height: 1.2;
}
.iv_quote-modal-sub {
	margin: 0;
	color: var(--iv-ink-muted);
	font-size: 0.9375rem;
}

/* Product context block */
.iv_quote-product {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	margin-bottom: var(--iv-s-3);
}
.iv_quote-product-thumb {
	width: 64px; height: 64px;
	flex: 0 0 64px;
	border-radius: var(--iv-radius-sm);
	overflow: hidden;
	background: var(--iv-paper);
}
.iv_quote-product-thumb img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
}
.iv_quote-product-meta { display: flex; flex-direction: column; min-width: 0; }
.iv_quote-product-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
}
.iv_quote-product-name {
	font-weight: 700;
	color: var(--iv-ink);
	font-size: 1rem;
	line-height: 1.3;
	margin: 2px 0;
}
.iv_quote-product-line {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
}
.iv_quote-product-line .amount { color: var(--iv-accent); font-weight: 600; }

/* Form */
.iv_quote-form { display: flex; flex-direction: column; gap: 12px; }
.iv_quote-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}
@media (min-width: 520px) { .iv_quote-row { grid-template-columns: 1fr 1fr; } }
.iv_quote-form label {
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.iv_quote-form label > span {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--iv-ink);
}
.iv_quote-form input,
.iv_quote-form textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-sm);
	background: var(--iv-paper);
	font-size: 0.9375rem;
	color: var(--iv-ink);
	font-family: inherit;
	transition: border-color .12s var(--iv-ease), box-shadow .12s var(--iv-ease);
}
.iv_quote-form input:focus,
.iv_quote-form textarea:focus {
	outline: none;
	border-color: var(--iv-accent);
	box-shadow: 0 0 0 3px var(--iv-accent-soft);
}
.iv_quote-form textarea { resize: vertical; min-height: 90px; }
.iv_quote-message { margin-top: 4px; }

/* Honeypot — hidden from real users */
.iv_quote-hp {
	position: absolute !important;
	left: -9999px !important;
	top: -9999px !important;
	height: 1px; width: 1px;
	overflow: hidden;
}

.iv_quote-actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}
.iv_quote-submit {
	width: 100%;
	padding: 14px 22px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	border-radius: 999px !important;
}
.iv_quote-submit.is-loading { opacity: 0.7; cursor: wait; }
.iv_quote-privacy {
	margin: 0;
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
	text-align: center;
}

/* Result state */
.iv_quote-result {
	text-align: center;
	padding: var(--iv-s-3) 0;
	color: var(--iv-ink-soft);
}
.iv_quote-result.is-success {
	color: #16a34a;
}
.iv_quote-result.is-success svg { color: #16a34a; }
.iv_quote-result.is-success p {
	color: var(--iv-ink);
	font-size: 1rem;
	margin: 10px 0 0;
}
.iv_quote-result.is-error {
	color: #b00020;
	background: #fef2f2;
	border: 1px solid #fecaca;
	border-radius: var(--iv-radius-md);
	padding: 12px 16px;
	margin-top: var(--iv-s-2);
	font-size: 0.9375rem;
}

/* ---------- Sale / discount visuals — lay out del + ins side-by-side
 * with a calculated "-X%" badge, instead of WC's stacked default ---------- */
.single-product .product .price {
	display: flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px;
}
.single-product .product .price del {
	order: 2;
	font-family: var(--iv-font-body) !important;
	font-size: 1rem !important;
	color: var(--iv-ink-muted) !important;
	opacity: 0.75;
	font-weight: 400;
	position: relative;
	top: -4px;
}
.single-product .product .price del .amount { color: inherit !important; }
.single-product .product .price ins {
	order: 1;
	background: transparent !important;
	text-decoration: none !important;
	color: var(--iv-accent) !important;
	font-family: var(--iv-font-display) !important;
}
.single-product .product .price ins .amount { color: var(--iv-accent) !important; }
.single-product .product .price > .iv_price-tax-suffix { order: 4; }
.iv_single-discount-badge {
	order: 3;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent-2);
	font-family: var(--iv-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: 999px;
	position: relative;
	top: -4px;
}

/* ---------- Inline gallery thumbnails — Shopify-style strip directly
 * under the main featured image (inside the gallery column). 4 visible at
 * once, horizontal scroll-snap for the rest. ---------- */
.iv_gallery-thumbs {
	display: flex;
	gap: 8px;
	margin-top: 12px;
	padding: 4px 0 6px;       /* room for the focus/active ring */
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: var(--iv-stone-200) transparent;
}
.iv_gallery-thumbs::-webkit-scrollbar { height: 6px; }
.iv_gallery-thumbs::-webkit-scrollbar-track { background: transparent; }
.iv_gallery-thumbs::-webkit-scrollbar-thumb {
	background: var(--iv-stone-200);
	border-radius: 999px;
}
.iv_gallery-thumb {
	flex: 0 0 calc((100% - 24px) / 4);  /* 4 visible, 3× 8px gap = 24px */
	aspect-ratio: 1 / 1;
	padding: 0;
	background: var(--iv-paper);
	border: 2px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	cursor: pointer;
	scroll-snap-align: start;
	transition: border-color .15s var(--iv-ease), transform .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.iv_gallery-thumb:hover {
	border-color: var(--iv-accent);
	transform: translateY(-1px);
}
.iv_gallery-thumb.is-active {
	border-color: var(--iv-accent);
	box-shadow: 0 0 0 3px var(--iv-accent-soft);
}
.iv_gallery-thumb:focus-visible {
	outline: none;
	border-color: var(--iv-accent);
	box-shadow: 0 0 0 3px var(--iv-accent-soft);
}

/* Narrower viewport — show 3 thumbs at once */
@media (max-width: 540px) {
	.iv_gallery-thumb { flex: 0 0 calc((100% - 16px) / 3); }
}

/* Hide the strip when there's only one thumb (a thumb of the same image
 * the user is already looking at adds no value). */
.iv_gallery-thumbs:has(> .iv_gallery-thumb:only-child) { display: none; }

/* With the new thumb strip below the gallery, the in-image dots become
 * redundant (the thumbs already show "which image am I on"). Hide them
 * on the single product gallery only — the card carousels on archives
 * still get dots. */
.single-product .woocommerce-product-gallery .iv-carousel-dots { display: none; }

/* ---------- Downloads tab ---------- */
.iv_downloads-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
@media (min-width: 700px) {
	.iv_downloads-list { grid-template-columns: 1fr 1fr; }
}
.iv_download > a {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	text-decoration: none !important;
	color: var(--iv-ink);
	transition: border-color .15s var(--iv-ease), box-shadow .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_download > a:hover {
	border-color: var(--iv-accent);
	box-shadow: 0 6px 20px rgba(245, 129, 36, 0.10);
	transform: translateY(-1px);
}
.iv_download-icon {
	position: relative;
	width: 56px; height: 56px;
	display: grid;
	place-items: center;
	background: var(--iv-warm-50);
	border-radius: var(--iv-radius-sm);
	color: var(--iv-accent);
}
.iv_download-ext {
	position: absolute;
	bottom: 4px; left: 0; right: 0;
	text-align: center;
	font-size: 0.5625rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var(--iv-paper);
	background: var(--iv-accent);
	padding: 1px 0;
	border-radius: 3px;
	margin: 0 8px;
}
.iv_download-meta { display: flex; flex-direction: column; min-width: 0; }
.iv_download-title {
	font-weight: 600;
	color: var(--iv-ink);
	line-height: 1.35;
}
.iv_download-size {
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
	margin-top: 3px;
	font-variant-numeric: tabular-nums;
}
.iv_download-action {
	color: var(--iv-ink-muted);
	display: grid;
	place-items: center;
	transition: color .15s var(--iv-ease), transform .15s var(--iv-ease);
}
.iv_download > a:hover .iv_download-action {
	color: var(--iv-accent);
	transform: translateY(2px);
}

/* ---------- WC product tab tables (apply same look to ANY pasted table) ----------
 * The client reported that pasted tables in the description didn't play
 * well with the spec layout. The Specs tab uses its own .iv_specs-table /
 * .iv_specs-custom rules; here we cover any table dropped into the
 * Beschrijving / Downloads tab by the admin. */
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	margin: var(--iv-s-2) 0;
	font-size: 0.9375rem;
}
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) th,
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) td {
	padding: 12px 16px;
	text-align: left;
	border-bottom: 1px solid var(--iv-stone-100);
	vertical-align: top;
}
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) tr:last-child th,
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) tr:last-child td { border-bottom: none; }
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) th {
	background: var(--iv-warm-50);
	font-weight: 700;
	color: var(--iv-ink);
}
.woocommerce-Tabs-panel table:not(.iv_specs-table):not(.shop_attributes) td { color: var(--iv-ink-soft); }

/* ---------- Custom specs HTML wrapper (vendor table paste) ----------
 * Tables pasted into the WYSIWYG escape hatch get sane styling so they
 * don't look like an alien element. */
.iv_specs-custom { font-size: 0.9375rem; color: var(--iv-ink-soft); }
.iv_specs-custom table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	margin: var(--iv-s-2) 0;
}
.iv_specs-custom table th,
.iv_specs-custom table td {
	padding: 12px 16px;
	text-align: left;
	border-bottom: 1px solid var(--iv-stone-100);
	vertical-align: top;
}
.iv_specs-custom table tr:last-child th,
.iv_specs-custom table tr:last-child td { border-bottom: none; }
.iv_specs-custom table th {
	background: var(--iv-warm-50);
	font-weight: 700;
	color: var(--iv-ink);
}
.iv_specs-custom table td { color: var(--iv-ink-soft); }
.iv_specs-custom ul, .iv_specs-custom ol { padding-left: 1.25em; margin: var(--iv-s-2) 0; }
.iv_specs-custom h2, .iv_specs-custom h3 {
	font-family: var(--iv-font-display);
	color: var(--iv-ink);
	margin: var(--iv-s-3) 0 var(--iv-s-1);
}

/* ---------- Defensive: kill all hover transforms on the single-product
 * gallery + the featured image. Client feedback: hover effects feel weird
 * with our flat premium look. ---------- */
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery__image a {
	transform: none !important;
	transition: none !important;
	cursor: default;
}
.single-product .woocommerce-product-gallery__image:hover img {
	transform: none !important;
	opacity: 1 !important;
	filter: none !important;
}
.single-product .woocommerce-product-gallery__trigger { /* the 🔍 lightbox trigger — keep clickable */
	cursor: zoom-in;
}

/* Energy label badge — floats on the gallery */
.iv_single-energy-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	width: 56px;
	z-index: 3;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 8px;
	padding: 4px;
	box-shadow: var(--iv-shadow-sm);
}
.iv_single-energy-badge img { width: 100%; height: auto; display: block; }

/* Specs table (inside the "Specificaties" tab) */
.iv_specs-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
}
.iv_specs-table th,
.iv_specs-table td {
	padding: 14px 18px;
	text-align: left;
	border-bottom: 1px solid var(--iv-stone-100);
	font-size: 0.9375rem;
}
.iv_specs-table tr:last-child th,
.iv_specs-table tr:last-child td { border-bottom: none; }
.iv_specs-table th {
	background: var(--iv-warm-50);
	width: 40%;
	font-weight: 700;
	color: var(--iv-ink);
}
.iv_specs-table td { color: var(--iv-ink-soft); }
.iv_specs-table tr:nth-child(odd) td { background: rgba(0,0,0,0.012); }

/* Single product — fine-tuning of WC default elements alongside our additions */
.single-product .product .price .iv_price-tax-suffix {
	font-size: 0.6875rem;
	top: -8px;
}
.single-product .woocommerce-product-rating {
	margin: 0 0 var(--iv-s-2) !important;
}
.single-product .woocommerce-product-rating .star-rating {
	display: inline-block;
	vertical-align: middle;
	margin-right: 6px;
}
.single-product .woocommerce-review-link {
	color: var(--iv-ink-muted);
	font-size: 0.875rem;
}
.single-product .product_meta > span strong { color: var(--iv-ink); font-weight: 600; }

/* =========================================================================
   SINGLE PRODUCT — top breadcrumb bar + page spacing
   ========================================================================= */

/* Slim breadcrumb bar above the gallery */
.iv_single-topbar {
	background: linear-gradient(180deg, var(--iv-warm-50) 0%, var(--iv-paper) 100%);
	border-bottom: 1px solid var(--iv-stone-100);
	padding: var(--iv-s-3) 0;
}
.iv_single-topbar .iv_breadcrumb { margin: 0; }

/* Top padding on the single product container so the gallery + summary breathe */
.iv_single-product-wrap {
	padding-top: var(--iv-s-5);
	padding-bottom: var(--iv-s-6);
}
@media (min-width: 900px) {
	.iv_single-product-wrap {
		padding-top: var(--iv-s-6);
		padding-bottom: var(--iv-s-7);
	}
}

/* Tabs + related sections get clean breathing room */
.single-product .woocommerce-tabs.wc-tabs-wrapper {
	margin-top: var(--iv-s-6) !important;
	padding-top: var(--iv-s-4);
	border-top: 1px solid var(--iv-stone-100);
}
.single-product .related.products,
.single-product .upsells.products {
	margin-top: var(--iv-s-7) !important;
	padding-top: var(--iv-s-5);
	padding-bottom: var(--iv-s-4);
}

/* Related products section header — premium spacing */
.single-product .related.products > h2,
.single-product .upsells.products > h2 {
	font-size: clamp(1.5rem, 1.5vw + 1rem, 2rem);
	margin-bottom: var(--iv-s-4);
	text-align: left;
}

/* =========================================================================
   IMAGE CAROUSEL — unified arrows + dots for single-product gallery and
   product cards on archive pages.
   ========================================================================= */

/* Generic shared chrome (arrows + dots) */
.iv-carousel-container { position: relative; }

.iv-carousel-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	color: var(--iv-ink);
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(0,0,0,0.10);
	opacity: 0;
	transition: opacity .2s var(--iv-ease), background .15s var(--iv-ease), color .15s var(--iv-ease), transform .12s var(--iv-ease);
}
.iv-carousel-arrow:hover {
	background: var(--iv-accent);
	color: #fff;
	border-color: var(--iv-accent);
}
.iv-carousel-arrow:disabled {
	opacity: 0 !important;
	pointer-events: none;
}
.iv-carousel-prev { left: 12px; }
.iv-carousel-next { right: 12px; }

/* Show arrows on hover of the container, OR always on touch devices */
.iv-carousel-container:hover .iv-carousel-arrow:not(:disabled) { opacity: 1; }
@media (hover: none) {
	.iv-carousel-arrow:not(:disabled) { opacity: 0.85; }
}

.iv-carousel-dots {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
	display: flex;
	gap: 6px;
	padding: 6px 10px;
	background: rgba(255,255,255,0.85);
	border-radius: 999px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.iv-carousel-dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(0,0,0,0.25);
	cursor: pointer;
	transition: background .15s var(--iv-ease), transform .15s var(--iv-ease), width .15s var(--iv-ease);
}
.iv-carousel-dot:hover { background: rgba(0,0,0,0.45); }
.iv-carousel-dot.is-active {
	background: var(--iv-accent);
	width: 22px;
	border-radius: 999px;
}

/* --- Single product gallery: bigger arrows, dots inside the warm container --- */
.single-product .woocommerce-product-gallery .iv-carousel-arrow {
	width: 48px;
	height: 48px;
}
.single-product .woocommerce-product-gallery .iv-carousel-prev { left: 18px; }
.single-product .woocommerce-product-gallery .iv-carousel-next { right: 18px; }
.single-product .woocommerce-product-gallery .iv-carousel-dots {
	bottom: 22px;
}
/* Hide carousel chrome when there's only one image */
.single-product .woocommerce-product-gallery--columns-1 .iv-carousel-arrow,
.single-product .woocommerce-product-gallery--columns-1 .iv-carousel-dots { display: none !important; }

/* =========================================================================
   PRODUCT CARD CAROUSEL — appears in place of WC's single thumbnail when
   the product has multiple gallery images.
   ========================================================================= */

.iv_card-carousel {
	position: relative;
	overflow: hidden;
	/* Framed image tile — white product photos otherwise bleed invisibly
	 * into the white card (same treatment as the plain a:first-child
	 * variant below). width:auto so the side margins actually inset. */
	width: auto;
	margin: 16px 16px 0;
	aspect-ratio: 1 / 1;
	background: #ffffff;
	border: 1px solid var(--iv-stone-200);
	border-radius: 12px;
}
.woocommerce ul.products li.product:hover .iv_card-carousel {
	border-color: var(--iv-accent-soft);
}
.iv_card-carousel-track {
	display: flex;
	width: 100%;
	height: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.iv_card-carousel-track::-webkit-scrollbar { display: none; }
.iv_card-carousel-slide {
	flex: 0 0 100%;
	scroll-snap-align: start;
	display: block;
	height: 100%;
	overflow: hidden;
}
.iv_card-carousel-slide img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
	transition: transform .5s var(--iv-ease);
	aspect-ratio: 1 / 1 !important;
}
.woocommerce ul.products li.product:hover .iv_card-carousel-slide img { transform: scale(1.04); }

/* Smaller arrows + dots on cards (cards are tighter than single product) */
.iv_card-carousel .iv-carousel-arrow {
	width: 32px;
	height: 32px;
}
.iv_card-carousel .iv-carousel-prev { left: 8px; }
.iv_card-carousel .iv-carousel-next { right: 8px; }
.iv_card-carousel .iv-carousel-dots {
	bottom: 8px;
	padding: 4px 8px;
}
.iv_card-carousel .iv-carousel-dot { width: 6px; height: 6px; }
.iv_card-carousel .iv-carousel-dot.is-active { width: 18px; }

/* Simple-link variant (used when product has only 1 image) — same layout as carousel */
.iv_card-image-link {
	display: block;
	overflow: hidden;
	border-radius: var(--iv-radius-lg) var(--iv-radius-lg) 0 0;
	aspect-ratio: 1 / 1;
	background: var(--iv-warm-50);
}
.iv_card-image-link img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
	transition: transform .5s var(--iv-ease);
}
.woocommerce ul.products li.product:hover .iv_card-image-link img { transform: scale(1.04); }

/* The product title link should look like normal title (override default a styling) */
.woocommerce ul.products li.product .woocommerce-loop-product__title a {
	color: inherit;
	text-decoration: none;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title a:hover {
	color: var(--iv-accent);
}

/* =========================================================================
   BLOG — archive (home.php / archive.php) + single (single.php)
   ========================================================================= */

/* ---------- Blog hero ---------- */
.iv_blog-hero {
	position: relative;
	padding: clamp(48px, 7vw, 88px) 0 clamp(32px, 4vw, 56px);
	background:
		radial-gradient(circle at 85% 15%, var(--iv-warm-100) 0%, transparent 50%),
		linear-gradient(180deg, var(--iv-warm-50) 0%, var(--iv-paper) 100%);
	border-bottom: 1px solid var(--iv-stone-100);
	overflow: hidden;
}
.iv_blog-hero::after {
	content: "";
	position: absolute;
	right: -100px; bottom: -100px;
	width: 280px; height: 280px;
	border-radius: 50%;
	background: var(--iv-grad-warm);
	opacity: 0.07;
	filter: blur(18px);
	pointer-events: none;
}
.iv_blog-hero .iv_eyebrow {
	display: inline-block;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-accent-deep);
	margin-bottom: 12px;
}
.iv_blog-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.25rem);
	line-height: 1.05;
	letter-spacing: -0.015em;
	color: var(--iv-ink);
	margin: 0 0 12px;
	max-width: 22ch;
}
.iv_blog-hero-sub {
	font-size: clamp(1rem, 0.5vw + 0.875rem, 1.125rem);
	color: var(--iv-ink-soft);
	margin: 0;
	max-width: 60ch;
	line-height: 1.55;
}

/* ---------- Blog section wrapper ---------- */
.iv_blog-section { padding-block: clamp(40px, 6vw, 80px); }
.iv_blog-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-5);
	align-items: start;
}
@media (min-width: 1000px) {
	.iv_blog-layout {
		grid-template-columns: minmax(0, 1fr) 300px;
		gap: var(--iv-s-6);
	}
}
.iv_blog-main { min-width: 0; }

/* ---------- Category pills row ---------- */
.iv_blog-tabs {
	margin-bottom: var(--iv-s-4);
}
.iv_blog-tabs-rail {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.iv_blog-tab {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	border-radius: 999px;
	color: var(--iv-ink-soft);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 500;
	transition: border-color .12s var(--iv-ease), background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_blog-tab:hover {
	border-color: var(--iv-accent);
	color: var(--iv-accent);
}
.iv_blog-tab.is-active {
	background: var(--iv-ink);
	border-color: var(--iv-ink);
	color: #fff;
}
.iv_blog-tab-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 6px;
	background: rgba(0,0,0,0.06);
	color: inherit;
	font-size: 0.6875rem;
	font-weight: 700;
	border-radius: 999px;
	font-variant-numeric: tabular-nums;
}
.iv_blog-tab.is-active .iv_blog-tab-count { background: rgba(255,255,255,0.18); }

/* ---------- Featured post (large, 2-col) ---------- */
.iv_post-feat {
	margin-bottom: var(--iv-s-5);
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	box-shadow: var(--iv-shadow-sm, 0 1px 2px rgba(0,0,0,.06));
	transition: transform .18s var(--iv-ease), box-shadow .18s var(--iv-ease), border-color .18s var(--iv-ease);
}
.iv_post-feat:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 14px 32px rgba(0,0,0,0.08);
}
.iv_post-feat-link {
	display: grid;
	grid-template-columns: 1fr;
	color: var(--iv-ink);
	text-decoration: none;
}
@media (min-width: 760px) {
	.iv_post-feat-link {
		grid-template-columns: 1.1fr 1fr;
		align-items: stretch;
	}
}
.iv_post-feat-media {
	position: relative;
	background: var(--iv-warm-100);
	aspect-ratio: 16/10;
	overflow: hidden;
}
@media (min-width: 760px) {
	.iv_post-feat-media { aspect-ratio: auto; min-height: 320px; }
}
.iv_post-feat-img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
}
.iv_post-feat-placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: var(--iv-accent);
}
.iv_post-feat-body {
	padding: clamp(24px, 3vw, 40px);
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.iv_post-feat-tag {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	background: var(--iv-accent-deep);
	color: #fff;
	font-size: 0.6875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 700;
	border-radius: 999px;
}
.iv_post-feat-cat {
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	font-weight: 700;
}
.iv_post-feat-title {
	font-family: var(--iv-font-display);
	font-size: clamp(1.5rem, 2vw + 0.75rem, 2.25rem);
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: var(--iv-ink);
	margin: 0;
}
.iv_post-feat:hover .iv_post-feat-title { color: var(--iv-accent); }
.iv_post-feat-excerpt {
	color: var(--iv-ink-soft);
	font-size: 1rem;
	line-height: 1.55;
	margin: 0;
}
.iv_post-feat-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-top: auto;
	padding-top: 12px;
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
}
.iv_post-feat-cta {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--iv-accent);
	font-weight: 700;
	font-size: 0.875rem;
}
.iv_post-feat-cta svg { transition: transform .18s var(--iv-ease); }
.iv_post-feat:hover .iv_post-feat-cta svg { transform: translateX(3px); }

/* ---------- Post cards (2-up grid in archive) ---------- */
.iv_blog-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
@media (min-width: 700px) { .iv_blog-grid { grid-template-columns: 1fr 1fr; } }

.iv_post-card {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	transition: transform .18s var(--iv-ease), box-shadow .18s var(--iv-ease), border-color .18s var(--iv-ease);
	height: 100%;
}
.iv_post-card:hover {
	transform: translateY(-3px);
	border-color: var(--iv-accent);
	box-shadow: 0 14px 30px rgba(0,0,0,0.08);
}
.iv_post-card-link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: var(--iv-ink);
	text-decoration: none;
}
.iv_post-card-media {
	position: relative;
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--iv-warm-100);
}
.iv_post-card-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
	transition: transform .35s var(--iv-ease);
}
.iv_post-card:hover .iv_post-card-img { transform: scale(1.04); }
.iv_post-card-placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: var(--iv-accent);
}
.iv_post-card-cat {
	position: absolute;
	top: 12px; left: 12px;
	padding: 4px 10px;
	background: rgba(255,255,255,0.94);
	color: var(--iv-ink);
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-weight: 700;
	border-radius: 999px;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.iv_post-card-body {
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}
.iv_post-card-title {
	font-family: var(--iv-font-display);
	font-size: 1.375rem;
	line-height: 1.25;
	color: var(--iv-ink);
	margin: 0;
	letter-spacing: -0.01em;
	transition: color .15s var(--iv-ease);
}
.iv_post-card:hover .iv_post-card-title { color: var(--iv-accent); }
.iv_post-card-excerpt {
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.55;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.iv_post-card-meta {
	margin-top: auto;
	display: flex;
	gap: 8px;
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
	padding-top: 6px;
}

/* When featured post is the only post — render sidebar widgets in a
 * centered, narrower row below the featured card. */
.iv_blog-sidebar-solo {
	max-width: 380px;
	margin: var(--iv-s-4) auto 0;
}
.iv_blog-sidebar-solo .iv_blog-sidebar { position: static; }

/* ---------- Sidebar widgets ---------- */
.iv_blog-sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--iv-s-3);
}
@media (min-width: 1000px) {
	.iv_blog-sidebar { position: sticky; top: 90px; }
}
.iv_blog-widget {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	padding: 22px;
}
.iv_blog-widget-title {
	font-family: var(--iv-font-display);
	font-size: 1.125rem;
	color: var(--iv-ink);
	margin: 0 0 14px;
}
.iv_blog-recent {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.iv_blog-recent li a {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 12px;
	color: var(--iv-ink);
	text-decoration: none;
	align-items: center;
}
.iv_blog-recent-thumb {
	width: 60px; height: 60px;
	border-radius: var(--iv-radius-sm);
	overflow: hidden;
	background: var(--iv-warm-100);
	flex: 0 0 60px;
}
.iv_blog-recent-thumb img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
}
.iv_blog-recent-meta { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.iv_blog-recent-meta strong {
	font-weight: 600;
	font-size: 0.9375rem;
	line-height: 1.3;
	color: var(--iv-ink);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .12s var(--iv-ease);
}
.iv_blog-recent li a:hover strong { color: var(--iv-accent); }
.iv_blog-recent-meta span {
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
}

.iv_blog-cats {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.iv_blog-cats li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	border-radius: var(--iv-radius-sm);
	color: var(--iv-ink-soft);
	text-decoration: none;
	font-size: 0.9375rem;
	transition: background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_blog-cats li a:hover {
	background: var(--iv-warm-50);
	color: var(--iv-accent);
}
.iv_blog-cats-count {
	font-variant-numeric: tabular-nums;
	background: var(--iv-stone-100);
	color: var(--iv-ink-muted);
	font-size: 0.75rem;
	font-weight: 600;
	padding: 2px 8px;
	border-radius: 999px;
}

.iv_blog-widget--newsletter,
.iv_blog-widget--cta {
	background: var(--iv-warm-50);
	border-color: var(--iv-warm-100);
}
.iv_blog-widget--cta { text-align: center; }
.iv_blog-widget--cta .iv_btn { width: 100%; margin-top: 8px; }
.iv_blog-widget p {
	font-size: 0.875rem;
	color: var(--iv-ink-soft);
	line-height: 1.5;
	margin: 0 0 12px;
}

/* ---------- Pagination ---------- */
.iv_pagination {
	margin-top: var(--iv-s-4);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}
.iv_pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-sm);
	color: var(--iv-ink);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 600;
	transition: border-color .12s var(--iv-ease), background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_pagination .page-numbers:hover {
	border-color: var(--iv-accent);
	color: var(--iv-accent);
}
.iv_pagination .page-numbers.current {
	background: var(--iv-accent-deep);
	border-color: var(--iv-accent);
	color: #fff;
}
.iv_pagination .page-numbers.dots {
	background: transparent;
	border-color: transparent;
	color: var(--iv-ink-muted);
}

/* ---------- Empty state ---------- */
.iv_empty {
	padding: var(--iv-s-6) var(--iv-s-3);
	text-align: center;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
}
.iv_empty h2 {
	font-family: var(--iv-font-display);
	font-size: 1.5rem;
	color: var(--iv-ink);
	margin: 0 0 8px;
}
.iv_empty p {
	color: var(--iv-ink-muted);
	max-width: 40ch;
	margin: 0 auto var(--iv-s-2);
}

/* ---------- Reading progress bar ---------- */
.iv_reading-progress {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 60;
	height: 3px;
	background: transparent;
	overflow: hidden;
	pointer-events: none;
}
.iv_reading-progress-bar {
	display: block;
	height: 100%;
	width: 0%;
	background: var(--iv-grad-warm);
	transition: width .12s linear;
}

/* ---------- Single post hero ---------- */
.iv_post-hero {
	padding: clamp(28px, 5vw, 56px) 0 clamp(16px, 3vw, 32px);
	text-align: center;
	background: linear-gradient(180deg, var(--iv-warm-50) 0%, var(--iv-paper) 100%);
}
.iv_post-hero-cat {
	display: inline-block;
	padding: 4px 14px;
	background: var(--iv-accent-deep);
	color: #fff;
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 700;
	border-radius: 999px;
	text-decoration: none;
	margin-bottom: 18px;
	transition: background .12s var(--iv-ease);
}
.iv_post-hero-cat:hover { background: var(--iv-accent-deep-2); }
.iv_post-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem);
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: var(--iv-ink);
	margin: 0 auto 18px;
	max-width: 24ch;
}
.iv_post-hero-meta {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
	font-size: 0.9375rem;
	color: var(--iv-ink-muted);
}
.iv_post-hero-author {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--iv-ink);
	font-weight: 600;
}
.iv_post-hero-avatar { border-radius: 50%; width: 28px; height: 28px; }

/* ---------- Single post featured image ---------- */
.iv_post-feature {
	padding: var(--iv-s-3) 0;
}
.iv_post-feature-wrap {
	margin: 0;
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	background: var(--iv-warm-100);
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	box-shadow: 0 20px 50px rgba(0,0,0,0.08);
}
.iv_post-feature-img {
	width: 100% !important;
	height: auto !important;
	display: block;
}

/* ---------- Single post — shell (article + share rail) ---------- */
.iv_post-section { padding-block: clamp(32px, 4vw, 56px); }
.iv_post-shell {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--iv-s-3);
	max-width: 820px;
	position: relative;
}
@media (min-width: 900px) {
	.iv_post-shell {
		grid-template-columns: 56px 1fr;
		max-width: 820px;
	}
}

/* Sticky share rail */
.iv_post-share {
	display: flex;
	flex-direction: row;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}
@media (min-width: 900px) {
	.iv_post-share {
		flex-direction: column;
		position: sticky;
		top: 90px;
		align-self: start;
		gap: 8px;
		align-items: flex-start;
	}
}
.iv_post-share-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
}
.iv_post-share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--iv-paper);
	border: 1.5px solid var(--iv-stone-200);
	color: var(--iv-ink-soft);
	transition: border-color .12s var(--iv-ease), background .12s var(--iv-ease), color .12s var(--iv-ease), transform .12s var(--iv-ease);
}
.iv_post-share-btn:hover {
	border-color: var(--iv-accent);
	background: var(--iv-accent);
	color: #fff;
	transform: translateY(-1px);
}

/* ---------- Post prose (article body) ---------- */
.iv_post-prose {
	max-width: 720px;
	font-family: var(--iv-font-body);
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--iv-ink-soft);
}
.iv_post-prose > * + * { margin-top: 1.1em; }

.iv_post-prose p { margin: 0; color: var(--iv-ink-soft); }

.iv_post-prose > p:first-of-type {
	font-size: 1.1875rem;
	line-height: 1.65;
	color: var(--iv-ink);
}

/* Drop cap on first letter of first paragraph */
.iv_post-prose > p:first-of-type::first-letter {
	float: left;
	font-family: var(--iv-font-display);
	font-size: 4.25rem;
	line-height: 0.95;
	padding: 6px 12px 0 0;
	color: var(--iv-accent);
	font-weight: 400;
}

.iv_post-prose h2,
.iv_post-prose h3,
.iv_post-prose h4 {
	font-family: var(--iv-font-display);
	color: var(--iv-ink);
	letter-spacing: -0.01em;
	line-height: 1.2;
	margin-top: 1.8em;
	margin-bottom: 0.5em;
}
.iv_post-prose h2 { font-size: 1.875rem; }
.iv_post-prose h3 { font-size: 1.5rem; }
.iv_post-prose h4 { font-size: 1.25rem; }

.iv_post-prose a {
	color: var(--iv-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1.5px;
	transition: color .12s var(--iv-ease);
}
.iv_post-prose a:hover { color: var(--iv-accent-2); }

.iv_post-prose strong { color: var(--iv-ink); font-weight: 700; }

.iv_post-prose ul,
.iv_post-prose ol {
	padding-left: 1.5em;
	margin: 1.2em 0;
}
.iv_post-prose li { margin: 0.4em 0; }
.iv_post-prose ul li::marker { color: var(--iv-accent); }

.iv_post-prose blockquote {
	margin: 1.8em 0;
	padding: 8px 0 8px 24px;
	border-left: 4px solid var(--iv-accent);
	font-family: var(--iv-font-display);
	font-size: 1.375rem;
	line-height: 1.4;
	color: var(--iv-ink);
	font-style: italic;
}
.iv_post-prose blockquote cite {
	display: block;
	margin-top: 12px;
	font-family: var(--iv-font-body);
	font-style: normal;
	font-size: 0.875rem;
	color: var(--iv-ink-muted);
	font-weight: 600;
}

.iv_post-prose figure {
	margin: 2em 0;
}
.iv_post-prose img,
.iv_post-prose figure img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: var(--iv-radius-md);
}
.iv_post-prose figcaption {
	margin-top: 10px;
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
	text-align: center;
}

.iv_post-prose pre,
.iv_post-prose code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	background: var(--iv-stone-100);
	color: var(--iv-ink);
	border-radius: 6px;
}
.iv_post-prose code { padding: 2px 6px; font-size: 0.875em; }
.iv_post-prose pre {
	padding: 18px 20px;
	overflow-x: auto;
	font-size: 0.875rem;
	line-height: 1.6;
}
.iv_post-prose pre code { background: transparent; padding: 0; }

.iv_post-prose table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	margin: 1.5em 0;
	font-size: 0.9375rem;
}
.iv_post-prose table th,
.iv_post-prose table td {
	padding: 12px 16px;
	border-bottom: 1px solid var(--iv-stone-100);
	text-align: left;
}
.iv_post-prose table th { background: var(--iv-warm-50); font-weight: 700; color: var(--iv-ink); }
.iv_post-prose table tr:last-child th,
.iv_post-prose table tr:last-child td { border-bottom: none; }

.iv_post-prose hr {
	border: none;
	height: 1px;
	background: var(--iv-stone-100);
	margin: 2.5em 0;
}

/* ---------- Author byline ---------- */
.iv_post-byline {
	margin-top: var(--iv-s-5);
	padding: var(--iv-s-3);
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	display: flex;
	gap: 18px;
	align-items: flex-start;
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}
.iv_post-byline-avatar {
	border-radius: 50%;
	flex: 0 0 72px;
	width: 72px;
	height: 72px;
}
.iv_post-byline-body { min-width: 0; }
.iv_post-byline-body .iv_eyebrow {
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	font-weight: 700;
	display: block;
	margin-bottom: 4px;
}
.iv_post-byline-body strong {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	color: var(--iv-ink);
	display: block;
	margin-bottom: 4px;
}
.iv_post-byline-body p {
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	margin: 0;
	line-height: 1.55;
}

/* ---------- Related posts ---------- */
.iv_related-posts {
	background: var(--iv-warm-50);
	border-top: 1px solid var(--iv-stone-100);
	padding-block: clamp(48px, 6vw, 80px);
}
.iv_related-head {
	text-align: center;
	margin-bottom: var(--iv-s-4);
}
.iv_related-head .iv_eyebrow {
	color: var(--iv-accent-deep);
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 700;
	display: block;
	margin-bottom: 8px;
}
.iv_related-head h2 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.625rem, 2.5vw + 0.5rem, 2.25rem);
	color: var(--iv-ink);
	margin: 0;
}
.iv_related-posts .iv_grid-3 {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
@media (min-width: 700px) { .iv_related-posts .iv_grid-3 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .iv_related-posts .iv_grid-3 { grid-template-columns: 1fr 1fr 1fr; } }

/* =========================================================================
   HOMEPAGE (front-page.php)
   ========================================================================= */

.iv_home > section + section { /* sane default vertical rhythm */ }

/* ---------- Section heads (shared) — left-aligned for editorial feel ---------- */
.iv_home-section-head {
	max-width: 720px;
	margin: 0 0 var(--iv-s-4);
	text-align: left;
}
.iv_home-section-head .iv_eyebrow {
	display: inline-block;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-accent-deep);
	margin-bottom: 12px;
}
.iv_home-section-head h2 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.875rem, 3.5vw + 0.5rem, 2.875rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--iv-ink);
	margin: 0 0 14px;
}
.iv_home-section-head p {
	font-size: 1.0625rem;
	color: var(--iv-ink-soft);
	margin: 0;
	line-height: 1.55;
	max-width: 60ch;
}
.iv_home-section-head--light .iv_eyebrow { color: var(--iv-gold); }
.iv_home-section-head--light h2 { color: #fff; }
.iv_home-section-head--light p { color: rgba(255, 255, 255, 0.7); }
.iv_home-section-head--row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	max-width: none;
}
@media (min-width: 700px) {
	.iv_home-section-head--row { flex-direction: row; align-items: flex-end; }
}

/* ============================ 1. HERO ============================ */
/* ============================ 1. HERO V2 ============================
 * Boujee pattern: full-width hero with bg image (or warm fallback),
 * dark overlay for contrast, content stack + 4 bordered trust boxes.
 * No side-by-side split, no illustration column.
 */
.iv_home-hero {
	position: relative;
	min-height: clamp(560px, 72vh, 760px);
	display: flex;
	align-items: center;
	overflow: hidden;
	color: #fff;
	/* Warm sunset-style fallback when no bg image is uploaded — looks
	 * like a cozy interior glow. Replaced visually by an <img> when set. */
	background:
		radial-gradient(ellipse at 72% 28%, rgba(245, 129, 36, 0.65) 0%, transparent 55%),
		radial-gradient(ellipse at 18% 82%, rgba(251, 192, 21, 0.32) 0%, transparent 55%),
		linear-gradient(135deg, #2e2620 0%, #1a1410 50%, #2e2620 100%);
}
.iv_home-hero::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	animation: iv_grad-shift 14s linear infinite;
	z-index: 3;
}
/* Background image — fills the whole hero, sits BEHIND the overlay. */
.iv_home-hero-bg {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	z-index: 0;
}
/* Dark overlay — stacked so the LEFT side (text zone) is heavily
 * darkened while the right side stays lighter (the photo breathes
 * through). Plus a base 45% darken across everything. */
.iv_home-hero-overlay {
	position: absolute;
	inset: 0;
	background:
		/* Horizontal: dark left (text zone) → fading lighter right
		 * (right stops 0.40 → 0.28 = ~30% more transparent, client 2026-07-04) */
		linear-gradient(90deg,
			rgba(15, 10, 6, 0.85) 0%,
			rgba(15, 10, 6, 0.65) 35%,
			rgba(15, 10, 6, 0.28) 70%,
			rgba(15, 10, 6, 0.28) 100%),
		/* Vertical: subtle top, heavier bottom near trust boxes */
		linear-gradient(180deg,
			rgba(15, 10, 6, 0.35) 0%,
			rgba(15, 10, 6, 0.45) 60%,
			rgba(15, 10, 6, 0.75) 100%);
	z-index: 1;
}

.iv_home-hero-inner {
	position: relative;
	z-index: 2;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: clamp(40px, 6vw, 80px);
	padding: clamp(48px, 8vw, 96px) var(--iv-gutter);
}

/* === Hero content === */
.iv_home-hero-content {
	max-width: 720px;
}
.iv_home-hero-eyebrow {
	display: inline-block;
	font-size: 0.75rem !important;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--iv-accent) !important;
	margin-bottom: 16px;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
}
.iv_home-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2.25rem, 4.5vw + 0.75rem, 4.5rem);
	line-height: 1.02;
	letter-spacing: -0.025em;
	color: #ffffff !important;
	margin: 0 0 20px;
	max-width: 14ch;
	text-shadow:
		0 2px 10px rgba(0, 0, 0, 0.75),
		0 4px 28px rgba(0, 0, 0, 0.55);
}
.iv_home-hero-sub {
	font-size: clamp(1.0625rem, 0.5vw + 0.9rem, 1.1875rem);
	color: #ffffff !important;
	line-height: 1.55;
	margin: 0 0 var(--iv-s-3);
	max-width: 56ch;
	text-shadow:
		0 1px 8px rgba(0, 0, 0, 0.75),
		0 2px 16px rgba(0, 0, 0, 0.5);
}
.iv_home-hero-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
/* 3 kerngetallen onder de CTA's — V2 dark hero. The `ul.` prefix
 * out-specifies the legacy light-hero .iv_home-hero-stats rules
 * further down (dl/dt/dd markup, kept for reference). */
ul.iv_home-hero-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 36px;
	list-style: none;
	margin: var(--iv-s-3) 0 0;
	padding: 16px 0 0;
	border-top: 1px solid rgba(255, 255, 255, 0.22);
	max-width: 520px;
}
ul.iv_home-hero-stats li { min-width: 0; }
ul.iv_home-hero-stats strong {
	display: block;
	font-size: clamp(1.375rem, 1.5vw + 0.75rem, 1.75rem);
	font-weight: 800;
	color: #ffffff;
	line-height: 1;
	letter-spacing: -0.01em;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
}
ul.iv_home-hero-stats span {
	display: block;
	margin-top: 4px;
	font-size: 0.75rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.8);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}
.iv_home-hero-cta .iv_btn {
	padding: 14px 22px !important;
	font-size: 0.9375rem !important;
	font-weight: 700 !important;
	border-radius: 999px !important;
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
}
/* Light-outline variant — white border + white text, fills white on hover.
 * `.iv_home-hero a.iv_btn-outline` selector for extra specificity, plus
 * !important to win against the base .iv_btn-outline (color: ink). */
.iv_btn-outline-light,
.iv_home-hero a.iv_btn-outline,
.iv_home-hero .iv_btn-outline-light {
	background: transparent !important;
	color: #fff !important;
	border: 1.5px solid rgba(255, 255, 255, 0.55) !important;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), border-color .15s var(--iv-ease);
}
.iv_btn-outline-light:hover,
.iv_home-hero a.iv_btn-outline:hover,
.iv_home-hero .iv_btn-outline-light:hover {
	background: #fff !important;
	color: var(--iv-ink) !important;
	border-color: #fff !important;
}

/* === Hero trust boxes — 4 bordered cards at the bottom === */
.iv_home-hero-trust {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}
@media (min-width: 540px)  { .iv_home-hero-trust { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px)  { .iv_home-hero-trust { grid-template-columns: repeat(4, 1fr); gap: 14px; } }

.iv_home-hero-trust-card {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 18px;
	background: rgba(20, 14, 10, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 14px;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	transition: border-color .18s var(--iv-ease), background .18s var(--iv-ease), transform .18s var(--iv-ease);
}
.iv_home-hero-trust-card:hover {
	border-color: rgba(245, 129, 36, 0.55);
	background: rgba(245, 129, 36, 0.08);
	transform: translateY(-2px);
}
.iv_home-hero-trust-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 10px;
	background: rgba(245, 129, 36, 0.18);
	color: var(--iv-accent);
}
.iv_home-hero-trust-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.25;
}
.iv_home-hero-trust-text strong {
	color: #fff;
	font-weight: 700;
	font-size: 0.9375rem;
}
.iv_home-hero-trust-text span {
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.75rem;
	margin-top: 3px;
}

/* === DEAD CSS — old split-layout hero (kept harmless, no markup renders these) === */
.iv_home-hero-inner--split {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(40px, 5vw, 64px);
	align-items: center;
	position: relative;
	z-index: 1;
}
@media (min-width: 900px) {
	.iv_home-hero-inner--split {
		grid-template-columns: 1.15fr 1fr;
	}
}
.iv_home-hero-copy { max-width: 560px; }
.iv_home-hero-eyebrow {
	display: inline-block;
	font-size: 0.6875rem !important;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-accent);
	margin-bottom: 14px;
}
.iv_home-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2.25rem, 4.5vw + 0.5rem, 4rem);
	line-height: 1.02;
	letter-spacing: -0.025em;
	color: var(--iv-ink);
	margin: 0 0 18px;
}
.iv_home-hero-sub {
	font-size: clamp(1.0625rem, 0.5vw + 0.875rem, 1.1875rem);
	color: var(--iv-ink-soft);
	line-height: 1.55;
	margin: 0 0 var(--iv-s-3);
	max-width: 52ch;
}
.iv_home-hero-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: var(--iv-s-4);
}
.iv_home-hero-cta .iv_btn {
	padding: 14px 22px !important;
	font-size: 0.9375rem !important;
	font-weight: 700 !important;
	border-radius: 999px !important;
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
}
.iv_home-hero-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	padding: 18px 0 0;
	border-top: 1px solid var(--iv-stone-200);
	margin: 0;
	max-width: 480px;
}
.iv_home-hero-stats > div { min-width: 0; }
.iv_home-hero-stats dt {
	font-family: var(--iv-font-display);
	font-size: clamp(1.25rem, 2vw + 0.5rem, 1.75rem);
	color: var(--iv-accent);
	letter-spacing: -0.01em;
	line-height: 1;
}
.iv_home-hero-stats dd {
	margin: 4px 0 0;
	font-size: 0.75rem;
	color: var(--iv-ink-muted);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Hero illustration */
.iv_home-hero-media {
	position: relative;
	min-height: 460px;
	aspect-ratio: 1 / 1;
	max-width: 560px;
	margin: 0 auto;
}
@media (min-width: 900px) {
	.iv_home-hero-media { min-height: 500px; }
}
.iv_home-hero-glow {
	position: absolute;
	inset: 10% -5% -5% 5%;
	background: radial-gradient(circle at 50% 50%, var(--iv-accent) 0%, var(--iv-gold) 30%, transparent 65%);
	opacity: 0.55;
	filter: blur(40px);
	pointer-events: none;
	animation: iv_glow_pulse 6s ease-in-out infinite;
}
@keyframes iv_glow_pulse {
	0%, 100% { opacity: 0.55; transform: scale(1); }
	50%      { opacity: 0.7;  transform: scale(1.04); }
}
.iv_home-hero-panel {
	position: absolute;
	top: 20%; left: 12%;
	width: 76%; aspect-ratio: 4 / 3;
	border-radius: 18px;
	background:
		linear-gradient(135deg, rgba(255,255,255,0.95) 0%, var(--iv-paper) 60%, var(--iv-warm-50) 100%);
	box-shadow:
		0 20px 50px rgba(245, 129, 36, 0.18),
		0 8px 20px rgba(0, 0, 0, 0.06),
		inset 0 0 0 1px rgba(255, 255, 255, 0.8);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 22px;
	color: var(--iv-accent);
	overflow: hidden;
}
.iv_home-hero-panel-grid {
	position: absolute;
	inset: 14px;
	background-image:
		linear-gradient(rgba(245, 129, 36, 0.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(245, 129, 36, 0.06) 1px, transparent 1px);
	background-size: 24px 24px;
	border-radius: 10px;
	pointer-events: none;
}
.iv_home-hero-panel-label {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
	color: var(--iv-ink);
	margin-top: auto;
	font-size: 0.875rem;
}
.iv_home-hero-panel-label .iv_eyebrow {
	font-size: 0.625rem !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-accent-deep);
}
.iv_home-hero-panel-label strong { font-weight: 700; color: var(--iv-ink); }
.iv_home-hero-waves {
	position: absolute;
	top: 22px; left: 22px; right: 22px;
	height: 60px;
	color: var(--iv-accent);
	z-index: 1;
}
/* Floating chips */
.iv_home-hero-chip {
	position: absolute;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 14px;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
	padding: 10px 14px;
	font-size: 0.8125rem;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	z-index: 2;
	animation: iv_chip_float 4s ease-in-out infinite;
}
.iv_home-hero-chip--save {
	top: 12%; right: 0;
}
.iv_home-hero-chip--save .iv_home-hero-chip-num {
	font-family: var(--iv-font-display);
	font-size: 1.5rem;
	color: var(--iv-accent);
	line-height: 1;
}
.iv_home-hero-chip--save .iv_home-hero-chip-label {
	color: var(--iv-ink-muted);
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.iv_home-hero-chip--star {
	bottom: 8%; left: 0;
	animation-delay: -2s;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
}
.iv_home-hero-chip--star > span:first-child {
	color: var(--iv-gold);
	letter-spacing: 1px;
	font-size: 0.875rem;
}
.iv_home-hero-chip--star > span:last-child {
	color: var(--iv-ink);
	font-weight: 600;
	font-size: 0.8125rem;
}
@keyframes iv_chip_float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}

/* ============================ 2. TRUST STRIP ============================ */
.iv_home-trust {
	padding: clamp(28px, 3vw, 40px) 0;
	background: var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-100);
}
.iv_home-trust-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}
@media (min-width: 540px)  { .iv_home-trust-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 980px)  { .iv_home-trust-grid { grid-template-columns: repeat(4, 1fr); gap: 22px; } }
.iv_home-trust-grid li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 4px 0;
}
.iv_home-trust-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	color: var(--iv-accent);
	border-radius: 50%;
}
.iv_home-trust-grid li > div { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.iv_home-trust-grid li strong {
	color: var(--iv-ink);
	font-weight: 700;
	font-size: 0.9375rem;
}
.iv_home-trust-grid li span {
	color: var(--iv-ink-muted);
	font-size: 0.8125rem;
	margin-top: 2px;
}

/* =========================== 3. PER RUIMTE =========================== */
.iv_home-cats {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-paper);
}
.iv_home-cats-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
@media (min-width: 540px) { .iv_home-cats-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) { .iv_home-cats-grid { grid-template-columns: repeat(3, 1fr); } }
/* Tidii-style uniform image card.
 * Every tile is a portrait 4:5 card with a full-bleed image, a dark
 * gradient overlay from bottom (so white text always reads), a small
 * accent-icon chip in the top-left, and a name + CTA at the bottom.
 * On hover: image scales 1.06×, overlay darkens + tints orange, the
 * "Bekijk panelen →" CTA slides up into view. */
.iv_home-cat {
	position: relative;
	aspect-ratio: 4 / 5;
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	background:
		radial-gradient(circle at 70% 25%, rgba(245,129,36,0.32) 0%, transparent 55%),
		linear-gradient(135deg, var(--iv-ink) 0%, var(--iv-ink-soft) 100%);
	box-shadow: 0 4px 12px rgba(0,0,0,0.06);
	transition: transform .3s var(--iv-ease), box-shadow .3s var(--iv-ease);
}
.iv_home-cat:hover {
	transform: translateY(-4px);
	box-shadow: 0 24px 50px rgba(0,0,0,0.16);
}
.iv_home-cat a {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 22px;
	text-decoration: none;
	color: #fff;
	overflow: hidden;
}
/* The image — sits behind everything */
.iv_home-cat-img {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
	z-index: 0;
	transition: transform .7s var(--iv-ease);
}
.iv_home-cat:hover .iv_home-cat-img { transform: scale(1.06); }
/* Dark gradient overlay — always present, darkens on hover */
.iv_home-cat a::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.05) 35%, rgba(0,0,0,0.78) 100%);
	z-index: 1;
	transition: background .35s var(--iv-ease);
}
.iv_home-cat:hover a::before {
	background:
		linear-gradient(180deg, rgba(245,129,36,0.14) 0%, rgba(0,0,0,0.32) 40%, rgba(0,0,0,0.86) 100%);
}
/* Icon chip — top-left, consistent across all tiles */
.iv_home-cat-icon {
	position: absolute;
	top: 18px;
	left: 18px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	background: rgba(255,255,255,0.92);
	border-radius: 10px;
	color: var(--iv-accent);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: transform .3s var(--iv-ease);
}
.iv_home-cat:hover .iv_home-cat-icon {
	transform: scale(1.06);
}
/* Body wrapper — name + CTA in a stack at the bottom */
.iv_home-cat-body {
	position: relative;
	z-index: 2;
}
.iv_home-cat-name {
	font-family: var(--iv-font-display);
	font-size: 1.625rem;
	line-height: 1.1;
	color: #fff !important;
	margin: 0;
	letter-spacing: -0.01em;
	transition: transform .3s var(--iv-ease);
}
/* Product count — inline next to the name, body font, slightly muted */
.iv_home-cat-count {
	display: inline;
	font-family: var(--iv-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.65);
	letter-spacing: 0;
	text-transform: none;
	font-variant-numeric: tabular-nums;
	margin-left: 6px;
	vertical-align: baseline;
}
.iv_home-cat-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 700;
	font-size: 0.875rem;
	color: var(--iv-gold);
	margin-top: 0;
	max-height: 0;
	opacity: 0;
	transform: translateY(8px);
	overflow: hidden;
	transition: max-height .35s var(--iv-ease), opacity .25s var(--iv-ease) .05s, transform .3s var(--iv-ease);
}
.iv_home-cat:hover .iv_home-cat-cta {
	max-height: 24px;
	opacity: 1;
	transform: translateY(0);
	margin-top: 10px;
}
.iv_home-cat-cta svg { transition: transform .2s var(--iv-ease); }
.iv_home-cat:hover .iv_home-cat-cta svg { transform: translateX(4px); }
.iv_home-cat:hover .iv_home-cat-name { transform: translateY(-2px); }

/* No-image variant: keep the same dark-warm fallback bg from the .iv_home-cat
 * rule; just bump the radial accent a touch so the tile doesn't look totally
 * uniform when many sit side by side. */
.iv_home-cat.no-image {
	background:
		radial-gradient(circle at 70% 25%, rgba(245,129,36,0.38) 0%, transparent 55%),
		radial-gradient(circle at 15% 90%, rgba(251,192,21,0.14) 0%, transparent 60%),
		linear-gradient(135deg, var(--iv-ink) 0%, #1a1a1a 100%);
}

.iv_home-cats-more { text-align: center; margin-top: var(--iv-s-4); }

/* =========================== 4. BESTSELLERS =========================== */
.iv_home-bestsellers {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-warm-50);
}
/* Selector needs to out-specify the generic `.woocommerce ul.products`
 * archive grid (0,2,1) — the bestsellers ul sits inside a div.woocommerce
 * wrapper, so both rule sets match. 6 products render as 2 rows of 3. */
.woocommerce ul.products.iv_home-product-grid,
.iv_home-product-grid.products {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: 22px !important;
	margin: 0 0 var(--iv-s-3) !important;
	padding: 0 !important;
	list-style: none !important;
}
@media (min-width: 600px) {
	.woocommerce ul.products.iv_home-product-grid,
	.iv_home-product-grid.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1024px) {
	.woocommerce ul.products.iv_home-product-grid,
	.iv_home-product-grid.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
.iv_home-bestsellers-cta { text-align: center; margin-top: var(--iv-s-3); }

/* ========================= 5. WAAROM INFRAROOD =========================
 * Deep warm brown/black gradient — stays in the warm brand palette
 * (option B). Intimate, premium, no off-brand cool tones. */
.iv_home-why {
	position: relative;
	padding: clamp(64px, 8vw, 112px) 0;
	background:
		linear-gradient(135deg, #1a1410 0%, #2e2620 45%, #1a1410 100%);
	color: rgba(255, 255, 255, 0.85);
	overflow: hidden;
}
/* Very subtle vignette so edges feel softer */
.iv_home-why::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 50% 100%, rgba(0,0,0,0.25) 0%, transparent 60%);
	pointer-events: none;
}
.iv_home-why > * { position: relative; z-index: 1; }
.iv_home-why-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
@media (min-width: 700px)  { .iv_home-why-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .iv_home-why-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; } }
.iv_home-why-card {
	position: relative;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--iv-radius-lg);
	padding: 28px 24px 24px;
	transition: border-color .18s var(--iv-ease), transform .18s var(--iv-ease), background .18s var(--iv-ease);
}
.iv_home-why-card:hover {
	border-color: var(--iv-accent);
	background: rgba(245, 129, 36, 0.06);
	transform: translateY(-3px);
}
.iv_home-why-num {
	position: absolute;
	top: 16px; right: 18px;
	font-family: var(--iv-font-display);
	font-size: 2.5rem;
	color: rgba(255, 255, 255, 0.08);
	line-height: 1;
	font-weight: 400;
}
.iv_home-why-icon {
	display: inline-flex;
	width: 52px; height: 52px;
	background: rgba(245, 129, 36, 0.15);
	color: var(--iv-accent);
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	margin-bottom: 16px;
}
.iv_home-why-card h3 {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	color: #fff;
	margin: 0 0 10px;
	line-height: 1.2;
}
.iv_home-why-card p {
	margin: 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.9375rem;
	line-height: 1.55;
}

/* ============================ 6. STATS ============================ */
.iv_home-stats {
	padding: clamp(48px, 6vw, 80px) 0;
	background: var(--iv-warm-50);
}
.iv_home-stats-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin: 0;
	text-align: center;
}
@media (min-width: 800px) { .iv_home-stats-grid { grid-template-columns: repeat(4, 1fr); } }
.iv_home-stats-grid > div {
	padding: 12px;
	border-right: 1px solid var(--iv-stone-200);
}
.iv_home-stats-grid > div:last-child { border-right: none; }
@media (max-width: 799px) {
	.iv_home-stats-grid > div:nth-child(2n) { border-right: none; }
}
.iv_home-stats-grid dt {
	font-family: var(--iv-font-display);
	font-size: clamp(1.875rem, 3vw + 0.5rem, 2.625rem);
	color: var(--iv-accent);
	line-height: 1;
	letter-spacing: -0.01em;
}
.iv_home-stats-grid dd {
	margin: 8px 0 0;
	font-size: 0.8125rem;
	color: var(--iv-ink-soft);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-weight: 600;
}

/* =========================== 7. BLOG TEASER =========================== */
.iv_home-blog {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-paper);
}
.iv_home-blog-all {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--iv-accent) !important;
	font-weight: 700;
	font-size: 0.9375rem;
	text-decoration: none;
}
.iv_home-blog-all svg { transition: transform .15s var(--iv-ease); }
.iv_home-blog-all:hover svg { transform: translateX(3px); }
.iv_home-blog-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
/* Default (trio) — full 3-up grid at desktop. solo + duo stay LEFT-aligned
 * to match the editorial section-head alignment above the grid. */
@media (min-width: 700px) {
	.iv_home-blog-grid--trio { grid-template-columns: 1fr 1fr; }
	.iv_home-blog-grid--duo  { grid-template-columns: 1fr 1fr; max-width: 820px; }
	.iv_home-blog-grid--solo { grid-template-columns: minmax(0, 440px); justify-content: start; }
}
@media (min-width: 1000px) {
	.iv_home-blog-grid--trio { grid-template-columns: 1fr 1fr 1fr; }
}

/* ============================= 8. FAQ ============================= */
.iv_home-faq {
	padding: clamp(56px, 7vw, 96px) 0 clamp(40px, 5vw, 64px);
	background: var(--iv-warm-50);
}
.iv_home-faq-inner { max-width: 820px; }
.iv_home-faq-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.iv_home-faq-item {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md);
	overflow: hidden;
	transition: border-color .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_home-faq-item:has(details[open]) {
	border-color: var(--iv-accent);
	box-shadow: 0 6px 24px rgba(245, 129, 36, 0.08);
}
.iv_home-faq-item details > summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 18px 22px;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--iv-ink);
	cursor: pointer;
	list-style: none;
	transition: background .12s var(--iv-ease);
}
.iv_home-faq-item details > summary::-webkit-details-marker { display: none; }
.iv_home-faq-item details > summary:hover { background: var(--iv-warm-50); }
.iv_home-faq-item details[open] > summary { background: var(--iv-warm-50); }
.iv_home-faq-chevron {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px; height: 32px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 50%;
	color: var(--iv-ink-soft);
	transition: transform .2s var(--iv-ease), background .12s var(--iv-ease), color .12s var(--iv-ease);
}
.iv_home-faq-item details[open] .iv_home-faq-chevron {
	transform: rotate(180deg);
	background: var(--iv-accent);
	border-color: var(--iv-accent);
	color: #fff;
}
.iv_home-faq-answer {
	padding: 6px 22px 22px;
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.65;
}
.iv_home-faq-answer p:first-child { margin-top: 0; }
.iv_home-faq-answer a { color: var(--iv-accent); }

/* =========================================================================
   HOMEPAGE — POLISH PASS
   ========================================================================= */

/* --- Section head accent line under the H2 (left-aligned with title) --- */
.iv_home-section-head h2::after {
	content: "";
	display: block;
	width: 48px;
	height: 3px;
	margin: 14px 0 0;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
	border-radius: 999px;
}
.iv_home-section-head--light h2::after {
	background: linear-gradient(90deg, var(--iv-accent) 0%, var(--iv-gold) 100%);
}

/* --- Hero illustration — refined panel ---
 * New elements: brand wordmark in the top corner, live-power readout chip,
 * a temp chip ("21°C comfort"). Makes the panel mock feel like a real
 * product instead of a generic rectangle. */
.iv_home-hero-panel-brand {
	position: absolute;
	top: 18px; left: 18px;
	z-index: 2;
	font-family: var(--iv-font-display);
	font-size: 1.125rem;
	color: var(--iv-accent);
	letter-spacing: -0.01em;
	line-height: 1;
}
.iv_home-hero-panel-brand span {
	font-size: 0.625rem;
	color: var(--iv-ink-muted);
	margin-left: 1px;
	font-family: var(--iv-font-body);
	font-weight: 600;
	vertical-align: top;
}
.iv_home-hero-panel-readout {
	position: absolute;
	top: 18px; right: 18px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	padding: 4px 10px 4px 8px;
	font-size: 0.6875rem;
	font-weight: 700;
	color: var(--iv-ink);
	letter-spacing: 0.04em;
}
.iv_home-hero-panel-readout-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--iv-accent);
	box-shadow: 0 0 0 0 rgba(245, 129, 36, 0.5);
	animation: iv_pulse-dot 1.8s ease-in-out infinite;
}
@keyframes iv_pulse-dot {
	0%, 100% { box-shadow: 0 0 0 0 rgba(245, 129, 36, 0.6); }
	50%      { box-shadow: 0 0 0 6px rgba(245, 129, 36, 0); }
}

/* Third floating chip — temperature reading */
.iv_home-hero-chip--temp {
	top: 50%;
	right: -8%;
	transform: translateY(-50%);
	animation-delay: -1.2s;
}
.iv_home-hero-chip--temp .iv_home-hero-chip-temp-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--iv-accent);
	display: inline-block;
	margin-right: 2px;
}
.iv_home-hero-chip--temp strong {
	font-family: var(--iv-font-display);
	font-size: 1.0625rem;
	color: var(--iv-accent);
}

/* --- Per ruimte: stronger hover state --- */
.iv_home-cat {
	border: 1px solid transparent;
}
.iv_home-cat:hover { border-color: var(--iv-accent); }
.iv_home-cat::after {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: linear-gradient(135deg, transparent 50%, rgba(245, 129, 36, 0.06) 100%);
	opacity: 0;
	pointer-events: none;
	transition: opacity .22s var(--iv-ease);
}
.iv_home-cat:hover::after { opacity: 1; }

/* Slaapkamer (dark) tile — bump CTA contrast for legibility */
.iv_home-cat--ink .iv_home-cat-cta {
	color: var(--iv-gold) !important;
	font-weight: 800;
}
.iv_home-cat--ink:hover { border-color: var(--iv-gold); }
.iv_home-cat--gold .iv_home-cat-cta { color: var(--iv-ink) !important; }

/* --- Stats: mini icons next to each big number --- */
.iv_home-stats-grid > div {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.iv_home-stats-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 50%;
	color: var(--iv-accent);
	margin-bottom: 8px;
}

/* --- Reveal-on-scroll: stagger sections slightly so they don't all
 *     animate in at the same instant when long scrolls trigger many at once. */
section[data-reveal] {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity .55s var(--iv-ease), transform .55s var(--iv-ease);
}
section[data-reveal].is-visible {
	opacity: 1;
	transform: none;
}
@media (prefers-reduced-motion: reduce) {
	section[data-reveal] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* =========================================================================
   CONTENT TONE CONTROLS — A+ / reset floating cluster
   ========================================================================= */

/* The scale variable, applied ONLY to editorial content (never to nav,
 * header, footer, CTAs, etc — those stay at their designed sizes). */
:root { --iv-content-scale: 1; }

.iv_post-prose,
.entry-content,
.iv_archive-body,
.iv_cat-hero-intro,
.woocommerce-Tabs-panel,
.iv_specs-table,
.iv_specs-custom,
.single-product .product .summary,
.single-product .woocommerce-product-details__short-description,
.iv_downloads-list {
	font-size: calc(1em * var(--iv-content-scale));
	transition: font-size .25s var(--iv-ease);
}

/* Floating control cluster */
.iv_tone-controls {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 40;
	display: inline-flex;
	gap: 4px;
	padding: 5px;
	background: rgba(255, 255, 255, 0.94);
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.10);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.iv_tone-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: transparent;
	border: none;
	color: var(--iv-ink-soft);
	cursor: pointer;
	display: grid;
	place-items: center;
	font-family: var(--iv-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	transition: background .15s var(--iv-ease), color .15s var(--iv-ease), transform .15s var(--iv-ease);
	padding: 0;
}
.iv_tone-btn:hover {
	background: var(--iv-warm-50);
	color: var(--iv-accent);
}
.iv_tone-btn:active { transform: scale(0.94); }
.iv_tone-btn sup {
	font-size: 0.625em;
	margin-left: 1px;
	font-weight: 800;
}
/* Highlight the reset button when text is currently toned up — gives
 * a quiet "you can undo this" affordance. */
html.iv-toned .iv_tone-btn--reset {
	color: var(--iv-accent);
	background: var(--iv-accent-soft);
}

/* Don't compete with WP admin bar on logged-in users */
.admin-bar .iv_tone-controls { bottom: 60px; }

/* Hide on print */
@media print { .iv_tone-controls { display: none !important; } }

/* "Built by" credit in footer legal tier */
.iv_footer-builtby {
	color: rgba(255, 255, 255, 0.4);
	margin-left: 4px;
}
.iv_footer-builtby a {
	color: rgba(255, 255, 255, 0.65);
	text-decoration: none;
	border-bottom: 1px dotted rgba(255, 255, 255, 0.25);
	transition: color .15s var(--iv-ease), border-color .15s var(--iv-ease);
}
.iv_footer-builtby a:hover {
	color: var(--iv-accent);
	border-bottom-color: var(--iv-accent);
}

/* =========================================================================
   HOMEPAGE V2 (inherited from infra-blunor)
   New sections + hero variant with photo override + USP checkmark row
   ========================================================================= */

/* ---------- Hero — USP checkmark row (between intro and CTAs) ---------- */
.iv_home-hero-usps {
	list-style: none;
	margin: 0 0 var(--iv-s-3);
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
}
.iv_home-hero-usps li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.9375rem;
	color: var(--iv-ink-soft);
	font-weight: 500;
}
.iv_home-hero-usp-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px; height: 22px;
	border-radius: 50%;
	background: var(--iv-accent-soft);
	color: var(--iv-accent);
}

/* ---------- Hero — photo override (replaces CSS panel mock) ---------- */
.iv_home-hero-media.has-photo {
	aspect-ratio: 4 / 5;
	border-radius: var(--iv-radius-lg);
	overflow: hidden;
	box-shadow:
		0 30px 60px rgba(245, 129, 36, 0.15),
		0 8px 20px rgba(0, 0, 0, 0.08);
}
.iv_home-hero-photo {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
}

/* =========================================================================
   3. HOE WERKT INFRAROOD — 3-step explainer
   ========================================================================= */
.iv_home-how {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-paper);
}
.iv_home-how-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	counter-reset: how;
}
@media (min-width: 700px)  { .iv_home-how-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .iv_home-how-grid { grid-template-columns: 1fr 1fr 1fr; } }
.iv_home-how-step {
	position: relative;
	padding: 28px 24px 24px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	transition: border-color .18s var(--iv-ease), transform .18s var(--iv-ease), box-shadow .18s var(--iv-ease);
}
.iv_home-how-step:hover {
	border-color: var(--iv-accent);
	transform: translateY(-3px);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.06);
}
.iv_home-how-num {
	position: absolute;
	top: 16px; right: 18px;
	font-family: var(--iv-font-display);
	font-size: 2.5rem;
	color: var(--iv-accent-soft);
	line-height: 1;
}
.iv_home-how-step h3 {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	margin: 0 0 10px;
	color: var(--iv-ink);
	line-height: 1.25;
	max-width: 80%; /* leave room for the numeral */
}
.iv_home-how-step p {
	margin: 0;
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.6;
}

/* =========================================================================
   7. TOEPASSINGEN — use-case chip strip
   ========================================================================= */
.iv_home-uses {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-warm-50);
}
.iv_home-uses-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.iv_home-uses-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 18px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 999px;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--iv-ink);
	transition: border-color .15s var(--iv-ease), transform .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_home-uses-chip:hover {
	border-color: var(--iv-accent);
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(245, 129, 36, 0.10);
}
.iv_home-uses-dot {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--iv-accent);
	display: inline-block;
}

/* =========================================================================
   8. 15+ JAAR ERVARING — dark warm band, two-column layout
   ========================================================================= */
.iv_home-exp {
	position: relative;
	padding: clamp(64px, 8vw, 112px) 0;
	background:
		linear-gradient(135deg, #1a1410 0%, #2e2620 50%, #1a1410 100%);
	color: rgba(255, 255, 255, 0.85);
	overflow: hidden;
}
.iv_home-exp::after {
	content: "";
	position: absolute;
	right: -120px; bottom: -120px;
	width: 380px; height: 380px;
	border-radius: 50%;
	background: var(--iv-grad-warm);
	opacity: 0.10;
	filter: blur(50px);
	pointer-events: none;
}
.iv_home-exp-inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(32px, 4vw, 56px);
	align-items: start;
	position: relative;
	z-index: 1;
}
@media (min-width: 900px) {
	.iv_home-exp-inner { grid-template-columns: 1.15fr 1fr; }
}
.iv_home-exp-eyebrow {
	display: inline-block;
	color: var(--iv-gold) !important;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.iv_home-exp-title {
	font-family: var(--iv-font-display);
	font-size: clamp(1.875rem, 3.5vw + 0.5rem, 2.875rem);
	color: #fff;
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 18px;
}
.iv_home-exp-title::after {
	content: "";
	display: block;
	width: 48px; height: 3px;
	margin: 14px 0 0;
	background: linear-gradient(90deg, var(--iv-accent), var(--iv-gold));
	border-radius: 999px;
}
.iv_home-exp-body {
	color: #fff;
	font-size: 1.0625rem;
	line-height: 1.65;
}
/* Direct rule on the p — the base `p { color: var(--iv-ink-soft) }` beats
 * color inherited from the wrapper, so the wrapper color alone isn't enough. */
.iv_home-exp-body p { margin: 0 0 1em; color: #fff; }
.iv_home-exp-body p:last-child { margin-bottom: 0; }
.iv_home-exp-projects {
	list-style: none;
	margin: 0;
	padding: 24px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--iv-radius-lg);
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.iv_home-exp-projects li {
	display: flex;
	align-items: center;
	gap: 10px;
	color: rgba(255, 255, 255, 0.88);
	font-size: 0.9375rem;
	font-weight: 500;
}
.iv_home-exp-projects-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px; height: 24px;
	border-radius: 50%;
	background: rgba(245, 129, 36, 0.18);
	color: var(--iv-accent);
	flex: 0 0 auto;
}

/* =========================================================================
   9. TESTIMONIALS — review cards on cream bg
   ========================================================================= */
.iv_home-reviews {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-paper);
}
.iv_home-reviews-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
@media (min-width: 800px) {
	.iv_home-reviews-grid { grid-template-columns: 1fr 1fr; }
}
.iv_home-review {
	padding: 28px 28px 24px;
	background: var(--iv-warm-50);
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-lg);
	position: relative;
	transition: border-color .15s var(--iv-ease), transform .15s var(--iv-ease), box-shadow .15s var(--iv-ease);
}
.iv_home-review:hover {
	border-color: var(--iv-accent);
	transform: translateY(-3px);
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.06);
}
.iv_home-review::before {
	content: "“";
	position: absolute;
	top: -8px; left: 18px;
	font-family: var(--iv-font-display);
	font-size: 4rem;
	line-height: 1;
	color: var(--iv-accent);
	opacity: 0.25;
}
.iv_home-review-stars {
	color: var(--iv-gold);
	letter-spacing: 2px;
	font-size: 1rem;
	margin-bottom: 12px;
}
.iv_home-review-stars-dim {
	color: var(--iv-stone-200);
}
.iv_home-review-body {
	margin: 0 0 16px;
	font-family: var(--iv-font-display);
	font-size: 1.125rem;
	line-height: 1.5;
	color: var(--iv-ink);
	font-style: italic;
	font-weight: 400;
	border: none;
	padding: 0;
}
.iv_home-review-body p { margin: 0; }
.iv_home-review-by {
	display: flex;
	flex-direction: column;
	gap: 2px;
	color: var(--iv-ink-soft);
}
.iv_home-review-by strong {
	color: var(--iv-ink);
	font-family: var(--iv-font-body);
	font-weight: 700;
	font-size: 0.9375rem;
}
.iv_home-review-by span {
	font-size: 0.8125rem;
	color: var(--iv-ink-muted);
}

/* =========================================================================
   10. INFRAROOD + ZONNEPANELEN — callout band
   ========================================================================= */
.iv_home-solar {
	padding: clamp(56px, 7vw, 96px) 0;
	background: var(--iv-warm-50);
}
.iv_home-solar-inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	max-width: 880px;
	align-items: start;
}
@media (min-width: 700px) {
	.iv_home-solar-inner {
		grid-template-columns: 96px 1fr;
		gap: 32px;
	}
}
.iv_home-solar-icon {
	width: 88px; height: 88px;
	display: grid;
	place-items: center;
	background: var(--iv-accent-soft);
	color: var(--iv-accent);
	border-radius: var(--iv-radius-lg);
	flex: 0 0 auto;
}
.iv_home-solar-copy .iv_eyebrow {
	display: inline-block;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-accent-deep);
	margin-bottom: 10px;
}
.iv_home-solar-copy h2 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.25rem);
	color: var(--iv-ink);
	line-height: 1.15;
	letter-spacing: -0.02em;
	margin: 0 0 14px;
}
.iv_home-solar-body {
	color: var(--iv-ink-soft);
	font-size: 1.0625rem;
	line-height: 1.6;
	margin-bottom: var(--iv-s-3);
}
.iv_home-solar-body p { margin: 0 0 1em; }
.iv_home-solar-body p:last-child { margin-bottom: 0; }

/* =====================================================================
   GUIDE TEMPLATE — page-guide.php (8 "Over infrarood verwarming" pages)
   Layout: hero + 2-col shell (sticky TOC + 720px prose) + related row.
   ===================================================================== */

.iv_guide-hero {
	position: relative;
	padding: clamp(60px, 8vw, 110px) 0 clamp(20px, 3vw, 40px);
	background:
		radial-gradient(ellipse at 80% 0%, var(--iv-accent-soft) 0%, transparent 60%),
		var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-200);
	overflow: hidden;
}
.iv_guide-hero .iv_eyebrow {
	color: var(--iv-accent-deep);
}
.iv_guide-hero-inner {
	position: relative;
	z-index: 2;
}
.iv_guide-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 3.5vw + 1rem, 3.5rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--iv-ink);
	margin: 14px 0 18px;
	max-width: 22ch;
}
.iv_guide-hero-lead {
	font-size: clamp(1.0625rem, 0.5vw + 0.95rem, 1.25rem);
	color: var(--iv-ink-soft);
	line-height: 1.5;
	max-width: 60ch;
	margin: 0;
}

/* ---- Hero variant: background image set via CMB2 ---- */
.iv_guide-hero--has-image {
	padding: clamp(80px, 10vw, 140px) 0 clamp(50px, 6vw, 80px);
	min-height: clamp(380px, 50vh, 540px);
	background: var(--iv-ink); /* fallback color if image fails */
	border-bottom: none;
}
.iv_guide-hero-bg {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	z-index: 0;
}
.iv_guide-hero-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		/* horizontal — heavy left (text zone), lighter right */
		linear-gradient(90deg,
			rgba(15, 10, 6, 0.78) 0%,
			rgba(15, 10, 6, 0.58) 40%,
			rgba(15, 10, 6, 0.40) 75%,
			rgba(15, 10, 6, 0.45) 100%),
		/* vertical — slight top, heavier bottom for legibility */
		linear-gradient(180deg,
			rgba(15, 10, 6, 0.30) 0%,
			rgba(15, 10, 6, 0.30) 60%,
			rgba(15, 10, 6, 0.60) 100%);
}
.iv_guide-hero--has-image .iv_guide-hero-title {
	color: #ffffff;
	text-shadow:
		0 2px 10px rgba(0, 0, 0, 0.65),
		0 4px 28px rgba(0, 0, 0, 0.45);
}
.iv_guide-hero--has-image .iv_guide-hero-lead {
	color: rgba(255, 255, 255, 0.92);
	text-shadow:
		0 1px 8px rgba(0, 0, 0, 0.65),
		0 2px 16px rgba(0, 0, 0, 0.4);
}
.iv_guide-hero--has-image .iv_eyebrow {
	color: var(--iv-accent);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.55);
}

.iv_guide-section { padding-top: clamp(28px, 3.5vw, 56px); }

.iv_guide-shell {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(28px, 3vw, 56px);
}
@media (min-width: 980px) {
	/* Mid-laptop: TOC left + prose fills the rest. CTA rail joins on wide. */
	.iv_guide-shell {
		grid-template-columns: 220px minmax(0, 1fr);
		gap: clamp(40px, 4vw, 56px);
	}
	/* Hide rail at this breakpoint — there's not enough room for 3 cols. */
	.iv_guide-shell .iv_guide-rail { display: none; }
}
@media (min-width: 1200px) {
	/* Wide: 3-column layout — TOC / prose / sticky CTA rail.
	 * 220 + 56 + minmax(0, 1fr) + 56 + 260 fills the 1200px container nicely. */
	.iv_guide-shell {
		grid-template-columns: 220px minmax(0, 1fr) 260px;
		gap: 56px;
	}
	.iv_guide-shell .iv_guide-rail { display: block; }
}

/* ---- TOC sidebar ----
 * NOTE: No `order` override — source order (TOC first, prose second)
 * places the TOC in column 1 (220px) on desktop and stacks it ABOVE the
 * prose on mobile, which is the intended layout.
 */
.iv_guide-toc {
	min-width: 0;
}
.iv_guide-toc-sticky {
	border-left: 2px solid var(--iv-stone-200);
	padding-left: 18px;
}
@media (min-width: 980px) {
	/* Stick only on desktop — on mobile the TOC sits inline above the prose. */
	.iv_guide-toc-sticky {
		position: sticky;
		top: calc(var(--iv-header-h, 80px) + 24px);
	}
}
.iv_guide-toc-label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	margin-bottom: 12px;
}
.iv_guide-toc-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	counter-reset: iv-toc;
}
.iv_guide-toc-list li {
	counter-increment: iv-toc;
}
.iv_guide-toc-list a {
	display: block;
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.4;
	text-decoration: none;
	padding: 4px 0;
	transition: color 0.15s ease;
}
.iv_guide-toc-list a::before {
	content: counter(iv-toc, decimal-leading-zero);
	display: inline-block;
	margin-right: 8px;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--iv-accent);
	font-variant-numeric: tabular-nums;
}
.iv_guide-toc-list a:hover { color: var(--iv-accent); }
.iv_guide-toc-list a.is-active {
	color: var(--iv-accent);
	font-weight: 600;
}

/* ---- Right-rail sticky CTA (visible on wide screens, ≥1200px) ---- */
.iv_guide-rail {
	display: none; /* default: hidden until grid breakpoint enables it */
	min-width: 0;
}
.iv_guide-rail-sticky {
	position: sticky;
	top: calc(var(--iv-header-h, 80px) + 24px);
}
.iv_guide-rail-card {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.10) 0%, transparent 60%),
		var(--iv-stone-100);
	border: 1px solid var(--iv-stone-200);
	border-radius: 16px;
	padding: 22px 22px 18px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.iv_guide-rail-card .iv_eyebrow { color: var(--iv-accent-deep); }
.iv_guide-rail-title {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	line-height: 1.2;
	letter-spacing: -0.015em;
	color: var(--iv-ink);
	margin: 0;
}
.iv_guide-rail-sub {
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--iv-ink-soft);
	margin: 0 0 4px;
}
.iv_guide-rail-cta {
	width: 100%;
	justify-content: center;
	white-space: nowrap; /* keep "Vraag advies" on one line */
}
.iv_guide-rail-phone {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--iv-ink);
	font-weight: 600;
	font-size: 0.9375rem;
	text-decoration: none;
	padding: 6px 0;
	border-top: 1px solid var(--iv-stone-200);
	margin-top: 4px;
}
.iv_guide-rail-phone:hover { color: var(--iv-accent); }

/* ---- Prose body — reuse the post-prose style for consistency ---- */
.iv_guide-prose {
	max-width: 720px;
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--iv-ink-soft);
}
.iv_guide-prose > * + * { margin-top: 1.1em; }
.iv_guide-prose p { margin: 0; color: var(--iv-ink-soft); }
.iv_guide-prose > p:first-of-type {
	font-size: 1.125rem;
	color: var(--iv-ink);
}
.iv_guide-prose > p:first-of-type::first-letter {
	float: left;
	font-family: var(--iv-font-display);
	font-size: 4.25em;
	line-height: 0.85;
	padding: 4px 10px 0 0;
	color: var(--iv-accent);
}
.iv_guide-prose h2,
.iv_guide-prose h3,
.iv_guide-prose h4 {
	font-family: var(--iv-font-display);
	color: var(--iv-ink);
	line-height: 1.15;
	letter-spacing: -0.02em;
	margin-top: 2.2em;
	margin-bottom: 0.5em;
	scroll-margin-top: calc(var(--iv-header-h, 80px) + 16px);
}
.iv_guide-prose h2 { font-size: 1.875rem; }
.iv_guide-prose h3 { font-size: 1.5rem; }
.iv_guide-prose h4 { font-size: 1.25rem; }
.iv_guide-prose a {
	color: var(--iv-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.iv_guide-prose a:hover { color: var(--iv-accent-2); }
.iv_guide-prose strong { color: var(--iv-ink); font-weight: 700; }
.iv_guide-prose ul,
.iv_guide-prose ol {
	padding-left: 1.2em;
	margin: 0;
}
.iv_guide-prose ul li,
.iv_guide-prose ol li { margin-bottom: 0.5em; }

/* =====================================================================
   GENERIC PAGE TEMPLATE — page.php
   Used by Contact + any flat page that doesn't pick a custom template.
   Single-column 720px prose layout (no TOC, no CTA rail).
   ===================================================================== */
.iv_page-section { padding-top: clamp(28px, 3.5vw, 56px); }
.iv_page-shell {
	max-width: 720px;
	margin: 0 auto;
}
.iv_page-prose { /* extends .iv_guide-prose — no extra rules needed yet */ }
.iv_page-lead {
	font-size: clamp(1.0625rem, 0.5vw + 0.95rem, 1.25rem);
	color: var(--iv-ink);
	line-height: 1.5;
	margin: 0 0 1.4em;
	font-weight: 500;
}

/* =====================================================================
   CONTACT PAGE — page-contact.php
   Contact info is the headline. Prose body is supporting content below.
   ===================================================================== */

/* ---- Hero (small, clean) ---- */
.iv_contact-hero {
	padding: clamp(48px, 6vw, 90px) 0 clamp(20px, 3vw, 40px);
	background:
		radial-gradient(ellipse at 80% 0%, var(--iv-accent-soft) 0%, transparent 60%),
		var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-200);
}
.iv_contact-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 3.5vw + 1rem, 3.5rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--iv-ink);
	margin: 0 0 16px;
}
.iv_contact-hero-lead {
	font-size: clamp(1.0625rem, 0.5vw + 0.95rem, 1.25rem);
	color: var(--iv-ink-soft);
	line-height: 1.5;
	max-width: 60ch;
	margin: 0;
}

/* ---- BIG contact card (priority block) ---- */
.iv_contact-card-wrap {
	padding: clamp(32px, 4vw, 56px) 0 clamp(20px, 3vw, 40px);
	background: var(--iv-paper);
}
.iv_contact-card {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(28px, 3vw, 48px);
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.07) 0%, transparent 55%),
		var(--iv-stone-100);
	border: 1px solid var(--iv-stone-200);
	border-radius: 18px;
	padding: clamp(24px, 3vw, 40px);
}
@media (min-width: 880px) {
	.iv_contact-card { grid-template-columns: 1.3fr 1fr; }
}

/* Left: phone/email/address + buttons */
.iv_contact-card-primary .iv_eyebrow { color: var(--iv-accent-deep); margin-bottom: 18px; display: block; }
.iv_contact-card-list {
	list-style: none;
	padding: 0;
	margin: 0 0 24px;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.iv_contact-card-row {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}
.iv_contact-card-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--iv-accent-soft);
	color: var(--iv-accent);
}
.iv_contact-card-label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--iv-ink-muted);
	margin-bottom: 2px;
}
.iv_contact-card-value {
	display: block;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--iv-ink);
	line-height: 1.4;
	text-decoration: none;
}
a.iv_contact-card-value:hover { color: var(--iv-accent); }
.iv_contact-card-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 6px;
}

/* Right: hours + business data */
.iv_contact-card-meta {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-top: 4px;
}
@media (min-width: 880px) {
	.iv_contact-card-meta {
		border-left: 1px solid var(--iv-stone-200);
		padding-left: clamp(28px, 3vw, 48px);
	}
}
.iv_contact-card-hours .iv_eyebrow,
.iv_contact-card-business .iv_eyebrow {
	color: var(--iv-accent-deep);
	margin-bottom: 12px;
	display: block;
}
.iv_contact-hours-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
}
.iv_contact-hours-table th,
.iv_contact-hours-table td {
	padding: 8px 0;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--iv-stone-200);
}
.iv_contact-hours-table tr:last-child th,
.iv_contact-hours-table tr:last-child td { border-bottom: none; }
.iv_contact-hours-table th {
	font-weight: 700;
	color: var(--iv-ink);
	width: 30%;
}
.iv_contact-hours-table td { color: var(--iv-ink-soft); }
.iv_contact-card-business dl {
	margin: 0;
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 6px 14px;
	font-size: 0.9375rem;
}
.iv_contact-card-business dt {
	font-weight: 700;
	color: var(--iv-ink);
}
.iv_contact-card-business dd {
	margin: 0;
	color: var(--iv-ink-soft);
	font-variant-numeric: tabular-nums;
}

.iv_contact-body {
	padding-top: clamp(32px, 4vw, 56px);
}

/* ---- Contact body prose — full container width to match the card above ---- */
.iv_contact-prose {
	max-width: none; /* override .iv_guide-prose 720px cap */
}
/* Paragraphs + headings still wrap at a readable measure (~70ch) so prose
   text stays easy to read even though the parent is wider. */
.iv_contact-prose > p,
.iv_contact-prose > h2,
.iv_contact-prose > h3,
.iv_contact-prose > h4 {
	max-width: 72ch;
}
/* Premium components — let them expand to fill the wider container. */
.iv_contact-prose > .iv_usp-grid,
.iv_contact-prose > .iv_service-cards-grid,
.iv_contact-prose > details.iv_faq {
	max-width: none;
}
/* USP grid: 4 columns on wide screens (was 2) — fills the box width */
@media (min-width: 960px) {
	.iv_contact-prose > .iv_usp-grid { grid-template-columns: repeat(4, 1fr); }
}
/* Service cards: 4 columns when there's room (was 2) */
@media (min-width: 1100px) {
	.iv_contact-prose > .iv_service-cards-grid { grid-template-columns: repeat(4, 1fr); }
}

/* =====================================================================
   USP GRID — premium checklist tiles
   Used wherever the parser detects 3+ consecutive "✔ …" paragraphs.
   ===================================================================== */
.iv_guide-prose .iv_usp-grid,
.iv_page-prose  .iv_usp-grid {
	list-style: none;
	padding: 0;
	margin: 1.4em 0;
	display: grid;
	gap: 12px;
	grid-template-columns: 1fr;
}
@media (min-width: 600px) {
	.iv_guide-prose .iv_usp-grid,
	.iv_page-prose  .iv_usp-grid { grid-template-columns: 1fr 1fr; }
}
.iv_guide-prose .iv_usp-grid li,
.iv_page-prose  .iv_usp-grid li {
	position: relative;
	padding: 14px 16px 14px 48px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 12px;
	color: var(--iv-ink);
	font-weight: 500;
	font-size: 0.9375rem;
	line-height: 1.45;
	margin-bottom: 0;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.iv_guide-prose .iv_usp-grid li:hover,
.iv_page-prose  .iv_usp-grid li:hover {
	border-color: var(--iv-accent);
	box-shadow: 0 8px 22px -16px rgba(245, 129, 36, 0.4);
}
.iv_guide-prose .iv_usp-grid li::before,
.iv_page-prose  .iv_usp-grid li::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 14px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--iv-accent-soft);
	transform: translateY(-50%);
}
.iv_guide-prose .iv_usp-grid li::after,
.iv_page-prose  .iv_usp-grid li::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 19px;
	width: 6px;
	height: 11px;
	border-right: 2px solid var(--iv-accent);
	border-bottom: 2px solid var(--iv-accent);
	transform: translateY(-65%) rotate(45deg);
}

/* =====================================================================
   SERVICE CARDS GRID — "Waarmee kunnen wij je helpen?"
   Each H4 inside the section becomes a premium card with the questions/
   topics underneath as a styled list.
   ===================================================================== */
.iv_guide-prose .iv_service-cards-grid,
.iv_page-prose  .iv_service-cards-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
	margin: 1.6em 0;
}
@media (min-width: 720px) {
	.iv_guide-prose .iv_service-cards-grid,
	.iv_page-prose  .iv_service-cards-grid { grid-template-columns: 1fr 1fr; }
}
.iv_guide-prose .iv_service-card,
.iv_page-prose  .iv_service-card {
	position: relative;
	padding: 28px 24px 24px;
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.07) 0%, transparent 55%),
		var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 16px;
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
	overflow: hidden;
}
.iv_guide-prose .iv_service-card::before,
.iv_page-prose  .iv_service-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 48px;
	height: 4px;
	background: var(--iv-grad-warm);
	background-size: 200% 100%;
}
.iv_guide-prose .iv_service-card:hover,
.iv_page-prose  .iv_service-card:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 16px 36px -22px rgba(245, 129, 36, 0.4);
}
.iv_guide-prose .iv_service-card-title,
.iv_page-prose  .iv_service-card-title {
	font-family: var(--iv-font-display);
	font-size: 1.375rem;
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: var(--iv-ink);
	margin: 0 0 14px;
	scroll-margin-top: 0;
}
.iv_guide-prose .iv_service-card-body,
.iv_page-prose  .iv_service-card-body {
	color: var(--iv-ink-soft);
	font-size: 0.9375rem;
	line-height: 1.55;
}
.iv_guide-prose .iv_service-card-body p,
.iv_page-prose  .iv_service-card-body p {
	margin: 0 0 0.7em;
	padding: 0;
}
.iv_guide-prose .iv_service-card-body p:last-child,
.iv_page-prose  .iv_service-card-body p:last-child { margin-bottom: 0; }
/* Inside cards, questions/topics list use a clean ul, not the usp-grid. */
.iv_guide-prose .iv_service-card-body p:not(:has(*)),
.iv_page-prose  .iv_service-card-body p:not(:has(*)) {
	position: relative;
	padding-left: 18px;
}
.iv_guide-prose .iv_service-card-body p:not(:has(*))::before,
.iv_page-prose  .iv_service-card-body p:not(:has(*))::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.65em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--iv-accent);
}

/* =====================================================================
   ACCORDION (<details><summary>) — used by FAQ-style content
   Drop a <details><summary>Question?</summary>Answer</details> anywhere
   inside a .iv_guide-prose / .iv_page-prose article and it auto-styles.
   ===================================================================== */
.iv_guide-prose details,
.iv_page-prose details {
	border: 1px solid var(--iv-stone-200);
	border-radius: 12px;
	background: var(--iv-paper);
	padding: 0;
	margin: 12px 0;
	overflow: hidden;
	transition: border-color 0.2s ease;
}
.iv_guide-prose details[open],
.iv_page-prose details[open] {
	border-color: var(--iv-accent);
	box-shadow: 0 8px 24px -16px rgba(245, 129, 36, 0.35);
}
.iv_guide-prose details > summary,
.iv_page-prose details > summary {
	list-style: none;
	cursor: pointer;
	padding: 18px 56px 18px 22px;
	font-family: var(--iv-font-body);
	font-weight: 600;
	font-size: 1.0625rem;
	color: var(--iv-ink);
	line-height: 1.35;
	position: relative;
	transition: color 0.15s ease;
}
.iv_guide-prose details > summary::-webkit-details-marker,
.iv_page-prose details > summary::-webkit-details-marker { display: none; }
.iv_guide-prose details > summary::after,
.iv_page-prose details > summary::after {
	content: '';
	position: absolute;
	right: 22px;
	top: 50%;
	width: 12px;
	height: 12px;
	border-right: 2px solid var(--iv-ink-muted);
	border-bottom: 2px solid var(--iv-ink-muted);
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.25s var(--iv-ease, ease), border-color 0.15s ease;
}
.iv_guide-prose details[open] > summary::after,
.iv_page-prose details[open] > summary::after {
	transform: translateY(-30%) rotate(-135deg);
	border-color: var(--iv-accent);
}
.iv_guide-prose details > summary:hover,
.iv_page-prose details > summary:hover { color: var(--iv-accent); }
.iv_guide-prose details > *:not(summary),
.iv_page-prose details > *:not(summary) {
	padding: 0 22px 18px;
	margin: 0 0 0.8em;
	color: var(--iv-ink-soft);
	line-height: 1.6;
}
.iv_guide-prose details > *:not(summary):last-child,
.iv_page-prose details > *:not(summary):last-child { margin-bottom: 0; padding-bottom: 22px; }
.iv_guide-prose details p + p,
.iv_page-prose details p + p { margin-top: 0.6em; }

/* ---- Tables in guide content ----
 * Mirrors the product specs tab styling (warm-50 header row, stone-100
 * dividers, rounded outer border). Wrap in horizontal scroll on narrow
 * screens so wide tables never break the layout.
 */
.iv_guide-prose .iv_table-scroll {
	overflow-x: auto;
	margin: 1.6em 0;
}
.iv_guide-prose table,
.iv_guide-prose .iv_table-scroll > table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--iv-stone-200);
	border-radius: var(--iv-radius-md, 10px);
	overflow: hidden;
	font-size: 0.9375rem;
	margin: 1.6em 0;
	background: var(--iv-paper);
}
.iv_guide-prose .iv_table-scroll > table { margin: 0; }
.iv_guide-prose table th,
.iv_guide-prose table td {
	padding: 12px 16px;
	text-align: left;
	border-bottom: 1px solid var(--iv-stone-100);
	vertical-align: top;
	line-height: 1.5;
}
.iv_guide-prose table tr:last-child th,
.iv_guide-prose table tr:last-child td { border-bottom: none; }
.iv_guide-prose table th {
	background: var(--iv-warm-50);
	font-weight: 700;
	color: var(--iv-ink);
	font-family: var(--iv-font-body);
}
.iv_guide-prose table td { color: var(--iv-ink-soft); }
/* When the docx had no header row, mammoth emits the first row as <tr><td>…
   We treat the first row as a header IF every cell in it is wrapped in
   <strong>. Done via :has() — modern browsers; degrades gracefully otherwise. */
.iv_guide-prose table tr:first-child:has(td > strong:only-child) td {
	background: var(--iv-warm-50);
	font-weight: 700;
	color: var(--iv-ink);
}

/* ---- Related guides row ---- */
.iv_guide-related { background: var(--iv-stone-100); }
.iv_guide-related .iv_section-heading {
	margin-bottom: clamp(20px, 2vw, 32px);
}
.iv_guide-related-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}
@media (min-width: 640px)  { .iv_guide-related-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 980px)  { .iv_guide-related-grid { grid-template-columns: repeat(3, 1fr); } }

.iv_guide-related-card { display: flex; }
.iv_guide-related-link {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 18px;
	width: 100%;
	padding: 22px 22px 18px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 14px;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.iv_guide-related-link:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 12px 30px -18px rgba(245, 129, 36, 0.45);
}
.iv_guide-related-title {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	line-height: 1.2;
	color: var(--iv-ink);
	margin: 0;
}
.iv_guide-related-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--iv-accent);
}

/* ---- Final CTA ---- */
.iv_guide-cta {
	text-align: center;
}
.iv_guide-cta .iv_container {
	max-width: 720px;
}
.iv_guide-cta h2 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.75rem, 2vw + 1rem, 2.5rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 8px 0 14px;
}
.iv_guide-cta p {
	font-size: 1.0625rem;
	line-height: 1.55;
	opacity: 0.88;
	margin: 0 auto 28px;
	max-width: 60ch;
}
.iv_guide-cta .iv_actions-row {
	justify-content: center;
}

/* =====================================================================
   COOKIE CONSENT BANNER
   Slides up from the bottom on first visit. Auto-removes after a choice.
   ===================================================================== */
.iv_cc {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 9999;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 16px;
	box-shadow: 0 16px 48px -16px rgba(20, 12, 4, 0.35);
	padding: 18px 20px;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.25s ease, transform 0.25s ease;
	max-width: min(720px, calc(100vw - 32px));
	margin: 0 auto;
}
.iv_cc.is-shown {
	opacity: 1;
	transform: translateY(0);
}
.iv_cc-inner {
	display: grid;
	gap: 14px;
	grid-template-columns: 1fr;
}
@media (min-width: 720px) {
	.iv_cc-inner {
		grid-template-columns: 1fr auto;
		align-items: center;
		gap: 18px;
	}
}
.iv_cc-title {
	display: block;
	font-family: var(--iv-font-display);
	font-size: 1.0625rem;
	color: var(--iv-ink);
	margin: 0 0 4px;
}
.iv_cc-copy p {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--iv-ink-soft);
}
.iv_cc-copy a {
	color: var(--iv-accent);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.iv_cc-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.iv_cc-actions .iv_btn {
	flex: 1;
	justify-content: center;
	white-space: nowrap;
}
@media (min-width: 720px) {
	.iv_cc-actions .iv_btn { flex: 0 0 auto; }
}

/* =====================================================================
   KENNISBANK — auto-archive of all guides + advies pages
   ===================================================================== */
.iv_kennisbank-section { padding-bottom: clamp(36px, 4vw, 64px); }
.iv_kennisbank-section:last-of-type { padding-bottom: 0; }
.iv_kennisbank-heading {
	max-width: 720px;
	margin-bottom: clamp(24px, 3vw, 40px);
}
.iv_kennisbank-heading h2 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.75rem, 2vw + 1rem, 2.25rem);
	color: var(--iv-ink);
	letter-spacing: -0.02em;
	margin: 8px 0 8px;
}
.iv_kennisbank-heading p {
	color: var(--iv-ink-soft);
	font-size: 1.0625rem;
	line-height: 1.55;
	margin: 0;
}
.iv_kennisbank-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}
@media (min-width: 720px)  { .iv_kennisbank-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .iv_kennisbank-grid { grid-template-columns: repeat(3, 1fr); } }
.iv_kennisbank-card { display: flex; }
.iv_kennisbank-link {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 14px;
	width: 100%;
	padding: 24px 22px 20px;
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.06) 0%, transparent 60%),
		var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 14px;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.iv_kennisbank-link:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 14px 32px -22px rgba(245, 129, 36, 0.45);
}
.iv_kennisbank-card-title {
	font-family: var(--iv-font-display);
	font-size: 1.25rem;
	line-height: 1.2;
	letter-spacing: -0.015em;
	color: var(--iv-ink);
	margin: 0;
}
.iv_kennisbank-card-excerpt {
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--iv-ink-soft);
	margin: 0;
}
.iv_kennisbank-card-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--iv-accent);
}

/* =====================================================================
   VERWARMINGSADVIES CALCULATOR — page-templates/page-calculator.php
   ===================================================================== */

/* ---- Hero ---- */
.iv_calc-hero {
	padding: clamp(48px, 6vw, 90px) 0 clamp(20px, 3vw, 36px);
	background:
		radial-gradient(ellipse at 80% 0%, var(--iv-accent-soft) 0%, transparent 60%),
		var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-200);
}
.iv_calc-hero-title {
	font-family: var(--iv-font-display);
	font-size: clamp(2rem, 3vw + 1rem, 3rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--iv-ink);
	margin: 12px 0 14px;
	max-width: 22ch;
}
.iv_calc-hero-lead {
	font-size: clamp(1.0625rem, 0.5vw + 0.95rem, 1.1875rem);
	color: var(--iv-ink-soft);
	line-height: 1.5;
	max-width: 60ch;
	margin: 0;
}

.iv_calc-section { padding-top: clamp(28px, 3.5vw, 56px); }

/* ---- The main calculator card ---- */
.iv_calc-card {
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 18px;
	padding: clamp(24px, 3vw, 40px);
	box-shadow: 0 24px 56px -32px rgba(20, 12, 4, 0.18);
	max-width: 1200px; /* +30% from 920 per client request 2026-06-30 */
	margin: 0 auto;
}
.iv_calc-step + .iv_calc-step {
	margin-top: clamp(24px, 3vw, 40px);
	padding-top: clamp(24px, 3vw, 40px);
	border-top: 1px solid var(--iv-stone-100);
}
.iv_calc-step-head { display: flex; gap: 14px; align-items: flex-start; margin: 0 0 18px; }
.iv_calc-step-num {
	flex: 0 0 36px; width: 36px; height: 36px; border-radius: 999px;
	background: var(--iv-accent-soft); color: var(--iv-accent);
	font-family: var(--iv-font-display); font-size: 1.125rem; font-weight: 700;
	display: inline-flex; align-items: center; justify-content: center;
}
.iv_calc-step-title { font-family: var(--iv-font-display); font-size: 1.25rem; letter-spacing: -0.015em; color: var(--iv-ink); margin: 0 0 4px; line-height: 1.2; }
.iv_calc-step-hint { font-size: 0.9375rem; color: var(--iv-ink-muted); line-height: 1.5; margin: 0; }

/* Dimensions row */
.iv_calc-dims { display: grid; grid-template-columns: 1fr; gap: 14px; align-items: end; }
@media (min-width: 720px) {
	.iv_calc-dims { grid-template-columns: 1fr auto 1fr auto 1fr 1fr; gap: 12px; }
}
.iv_calc-dims label { display: flex; flex-direction: column; gap: 6px; }
.iv_calc-dims label span { font-size: 0.8125rem; font-weight: 600; color: var(--iv-ink-muted); letter-spacing: 0.02em; }
.iv_calc-dims input {
	border: 1px solid var(--iv-stone-200); border-radius: 12px;
	padding: 12px 14px; font-size: 1.0625rem; font-weight: 600;
	color: var(--iv-ink); background: var(--iv-paper);
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.iv_calc-dims input:focus {
	border-color: var(--iv-accent);
	box-shadow: 0 0 0 3px rgba(245, 129, 36, 0.18);
	outline: none;
}
.iv_calc-x { display: none; font-size: 1.5rem; color: var(--iv-ink-muted); padding-bottom: 12px; }
@media (min-width: 720px) { .iv_calc-x { display: inline-flex; align-items: center; justify-content: center; } }
.iv_calc-m3 {
	display: flex; flex-direction: column; gap: 4px;
	padding: 10px 14px; background: var(--iv-warm-50); border-radius: 12px;
	border: 1px solid var(--iv-stone-200); text-align: center;
}
.iv_calc-m3-label { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--iv-ink-muted); }
.iv_calc-m3 strong { font-family: var(--iv-font-display); font-size: 1.5rem; color: var(--iv-accent); line-height: 1; }
.iv_calc-warn {
	margin: 14px 0 0; padding: 12px 14px; background: #fff4cc;
	border: 1px solid #e0c160; border-radius: 10px;
	font-size: 0.875rem; color: #6b4f00; line-height: 1.5;
}

/* Radio cards */
.iv_calc-radios { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 720px) { .iv_calc-radios { grid-template-columns: repeat(3, 1fr); } }
.iv_calc-radios-grid { grid-template-columns: 1fr 1fr; }
@media (min-width: 720px) { .iv_calc-radios-grid { grid-template-columns: repeat(4, 1fr); } }
.iv_calc-radio { cursor: pointer; }
.iv_calc-radio input { position: absolute; opacity: 0; pointer-events: none; }
.iv_calc-radio-card {
	display: block; padding: 14px 16px;
	background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 12px;
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
	height: 100%;
}
.iv_calc-radio-card strong { display: block; font-size: 0.9375rem; color: var(--iv-ink); margin-bottom: 4px; }
.iv_calc-radio-card small { display: block; font-size: 0.8125rem; color: var(--iv-ink-muted); line-height: 1.45; }
.iv_calc-radio:hover .iv_calc-radio-card { border-color: var(--iv-accent); }
.iv_calc-radio input:checked + .iv_calc-radio-card {
	border-color: var(--iv-accent);
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.10) 0%, transparent 60%),
		var(--iv-paper);
	box-shadow: 0 0 0 2px var(--iv-accent-soft), 0 10px 24px -16px rgba(245, 129, 36, 0.4);
}

/* Submit row */
.iv_calc-submit-row {
	margin-top: clamp(28px, 3vw, 44px);
	padding-top: clamp(20px, 2.5vw, 32px);
	border-top: 1px solid var(--iv-stone-100);
	text-align: center;
}
.iv_calc-submit-row .iv_btn-lg { font-size: 1rem; padding: 14px 32px; min-width: 280px; justify-content: center; }
.iv_calc-submit-note { font-size: 0.875rem; color: var(--iv-ink-muted); margin: 10px 0 0; }
.iv_calc-error {
	margin: 14px auto 0; padding: 12px 16px;
	background: #fff5f5; border: 1px solid #f3c2c2;
	border-radius: 10px; color: #931616;
	font-size: 0.9375rem; max-width: 480px;
}
.iv_calc-spinner {
	display: inline-block; width: 14px; height: 14px;
	border: 2px solid currentColor; border-bottom-color: transparent;
	border-radius: 50%;
	animation: iv_calc-spin 0.7s linear infinite;
	vertical-align: -2px; margin-right: 6px;
}
@keyframes iv_calc-spin { to { transform: rotate(360deg); } }

/* ---- Results ---- */
.iv_calc-results { max-width: 1100px; margin: clamp(32px, 4vw, 56px) auto 0; }

.iv_calc-summary { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 0 0 clamp(20px, 2.5vw, 32px); }
@media (min-width: 720px) { .iv_calc-summary { grid-template-columns: repeat(3, 1fr); } }
.iv_calc-summary-card {
	padding: 18px 20px;
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.08) 0%, transparent 60%),
		var(--iv-paper);
	border: 1px solid var(--iv-stone-200);
	border-radius: 14px;
	text-align: center;
}
.iv_calc-summary-num {
	font-family: var(--iv-font-display);
	font-size: clamp(1.5rem, 2vw + 0.5rem, 2.25rem);
	color: var(--iv-accent); line-height: 1; margin-bottom: 6px;
}
.iv_calc-summary-label {
	font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.06em;
	text-transform: uppercase; color: var(--iv-ink-muted);
}

/* Sort tabs */
.iv_calc-tabs {
	display: flex; gap: 4px; background: var(--iv-stone-100);
	padding: 6px; border-radius: 14px; margin: 0 0 22px; flex-wrap: wrap;
}
.iv_calc-tab {
	flex: 1 1 auto; min-width: 0; padding: 10px 16px;
	background: transparent; border: none; border-radius: 10px;
	font-size: 0.9375rem; font-weight: 600; color: var(--iv-ink-soft);
	cursor: pointer; transition: background 0.18s ease, color 0.18s ease;
}
.iv_calc-tab:hover { color: var(--iv-ink); }
.iv_calc-tab.is-active {
	background: var(--iv-paper); color: var(--iv-ink);
	box-shadow: 0 4px 10px -6px rgba(20, 12, 4, 0.2);
}

/* Result cards grid */
.iv_calc-cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 720px)  { .iv_calc-cards { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .iv_calc-cards { grid-template-columns: repeat(3, 1fr); } }

/* NOTE: keep this class name scoped to the calculator results, not the
   page-wide .iv_calc-card form wrapper above. CSS resolves by the more
   specific parent (.iv_calc-cards > .iv_calc-card). */
.iv_calc-cards .iv_calc-card {
	position: relative; display: flex; flex-direction: column;
	background: var(--iv-paper); border: 1px solid var(--iv-stone-200);
	border-radius: 16px; overflow: hidden;
	padding: 0;
	box-shadow: none;
	max-width: none;
	margin: 0;
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.iv_calc-cards .iv_calc-card:hover {
	transform: translateY(-2px);
	border-color: var(--iv-accent);
	box-shadow: 0 18px 36px -22px rgba(245, 129, 36, 0.4);
}
.iv_calc-card-badge {
	position: absolute; top: 12px; left: 12px; z-index: 2;
	background: var(--iv-accent-deep); color: #fff;
	font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.08em;
	text-transform: uppercase; padding: 4px 10px; border-radius: 999px;
}
.iv_calc-card-link {
	display: block; background: var(--iv-stone-100);
	aspect-ratio: 4 / 3; overflow: hidden;
}
.iv_calc-card-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.iv_calc-card-img img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.3s ease; }
.iv_calc-card-link:hover .iv_calc-card-img img { transform: scale(1.04); }
.iv_calc-card-body { padding: 18px 18px 16px; display: flex; flex-direction: column; flex: 1; gap: 8px; }
.iv_calc-card-brand {
	display: inline-block; font-size: 0.6875rem; font-weight: 700;
	letter-spacing: 0.12em; text-transform: uppercase; color: var(--iv-accent);
}
.iv_calc-card-title { font-family: var(--iv-font-display); font-size: 1.0625rem; line-height: 1.2; margin: 0; }
.iv_calc-card-title a { color: var(--iv-ink); text-decoration: none; }
.iv_calc-card-title a:hover { color: var(--iv-accent); }
.iv_calc-card-config {
	display: flex; align-items: center; flex-wrap: wrap;
	gap: 6px 12px; margin: 4px 0; font-size: 0.875rem;
}
.iv_calc-card-count { font-family: var(--iv-font-display); font-size: 1.25rem; color: var(--iv-accent); font-weight: 700; }
.iv_calc-card-watt {
	background: var(--iv-warm-50); color: var(--iv-ink);
	padding: 2px 10px; border-radius: 999px;
	font-weight: 700; font-size: 0.8125rem;
}
.iv_calc-card-unitprice { color: var(--iv-ink-muted); font-size: 0.8125rem; margin-left: auto; }
.iv_calc-card-meta { font-size: 0.8125rem; color: var(--iv-ink-muted); line-height: 1.4; }
.iv_calc-card-foot {
	margin-top: auto; padding-top: 12px;
	border-top: 1px solid var(--iv-stone-100);
	display: flex; align-items: center; gap: 10px;
}
.iv_calc-card-total { display: flex; flex-direction: column; gap: 1px; margin-right: auto; }
.iv_calc-card-total-label {
	font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em;
	text-transform: uppercase; color: var(--iv-ink-muted);
}
.iv_calc-card-total-val { font-family: var(--iv-font-display); font-size: 1.125rem; color: var(--iv-ink); font-weight: 700; }
.iv_calc-card-cta { padding: 8px 14px !important; font-size: 0.8125rem !important; white-space: nowrap; }

.iv_calc-empty {
	list-style: none; padding: 32px; text-align: center;
	color: var(--iv-ink-muted); background: var(--iv-stone-100);
	border-radius: 14px; grid-column: 1 / -1;
}

/* Closer CTA */
.iv_calc-cta {
	margin: clamp(32px, 4vw, 56px) 0 0;
	padding: clamp(24px, 3vw, 40px);
	background:
		radial-gradient(ellipse at 100% 0%, rgba(245, 129, 36, 0.12) 0%, transparent 60%),
		var(--iv-stone-100);
	border-radius: 18px; text-align: center;
}
.iv_calc-cta h3 {
	font-family: var(--iv-font-display);
	font-size: clamp(1.375rem, 1.5vw + 0.75rem, 1.875rem);
	color: var(--iv-ink); margin: 0 0 10px;
}
.iv_calc-cta p { color: var(--iv-ink-soft); font-size: 1rem; line-height: 1.55; max-width: 60ch; margin: 0 auto 22px; }
.iv_calc-cta .iv_actions-row { justify-content: center; }

/* Trust strip */
.iv_calc-trust {
	max-width: 920px; margin: clamp(28px, 3vw, 44px) auto 0;
	display: grid; grid-template-columns: 1fr; gap: 8px;
	padding: 18px 22px; background: var(--iv-stone-100);
	border-radius: 12px; font-size: 0.875rem; color: var(--iv-ink-soft);
}
@media (min-width: 800px) { .iv_calc-trust { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
.iv_calc-trust div { display: flex; align-items: center; gap: 8px; }
.iv_calc-trust span { color: var(--iv-accent); font-weight: 700; }

/* ============================================================
 * Verbruik- & kostencalculator (/verbruikscalculator/)
 * Reuses .iv_calc-* form styles; these cover the extras.
 * ============================================================ */
.iv_calc-field { margin-top: 6px; }
.iv_calc-select select {
	width: 100%; max-width: 420px; padding: 12px 14px;
	border: 1px solid var(--iv-stone-200); border-radius: 10px;
	background: var(--iv-paper); font: inherit; color: var(--iv-ink);
}
.iv_calc-select select:focus-visible { outline: 2px solid var(--iv-accent); outline-offset: 1px; }

.iv_vcalc-results { margin-top: 36px; }
.iv_vcalc-summary {
	display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 22px;
}
@media (min-width: 640px) { .iv_vcalc-summary { grid-template-columns: 1fr 1fr; } }

.iv_vcalc-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 640px) { .iv_vcalc-grid { grid-template-columns: 1fr 1fr; } }
.iv_vcalc-stat {
	padding: 20px 22px; border: 1px solid var(--iv-stone-200);
	border-radius: 14px; background: var(--iv-warm-50);
}
.iv_vcalc-stat-label { display: block; font-size: 0.8125rem; color: var(--iv-ink-muted); }
.iv_vcalc-stat-value { display: block; margin-top: 4px; font-size: 1.5rem; font-weight: 700; color: var(--iv-ink); }

.iv_vcalc-cost {
	margin-top: 18px; padding: 24px; border-radius: 16px;
	background: var(--iv-stone-100); border: 1px solid var(--iv-stone-200);
}
.iv_vcalc-cost-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.iv_vcalc-cost-head label { font-weight: 600; color: var(--iv-ink); }
#iv_vcalc-price-out { font-weight: 700; color: var(--iv-accent); font-variant-numeric: tabular-nums; }
input[type="range"][data-iv-vcalc-price] {
	width: 100%; margin: 16px 0 22px; accent-color: var(--iv-accent); cursor: pointer;
}
.iv_vcalc-cost-out { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.iv_vcalc-cost-block {
	padding: 18px; border-radius: 12px; background: var(--iv-paper);
	border: 1px solid var(--iv-stone-200); text-align: center;
}
.iv_vcalc-cost-label { display: block; font-size: 0.8125rem; color: var(--iv-ink-muted); }
.iv_vcalc-cost-value { display: block; margin-top: 4px; font-size: 1.75rem; font-weight: 800; color: var(--iv-ink); }

.iv_vcalc-product { margin-top: 20px; }
.iv_vcalc-product-card {
	display: flex; align-items: center; gap: 16px; padding: 14px 16px;
	border: 1px solid var(--iv-stone-200); border-radius: 14px;
	background: var(--iv-paper); text-decoration: none; color: inherit;
	transition: box-shadow .18s ease, transform .18s ease;
}
.iv_vcalc-product-card:hover { box-shadow: 0 10px 30px rgba(0,0,0,.08); transform: translateY(-2px); }
.iv_vcalc-product-card img { width: 84px; height: 84px; object-fit: contain; border-radius: 8px; flex: none; }
.iv_vcalc-product-body { display: flex; flex-direction: column; gap: 2px; }
.iv_vcalc-product-brand { font-size: 0.75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--iv-accent); font-weight: 700; }
.iv_vcalc-product-name { font-size: 1.0625rem; color: var(--iv-ink); }
.iv_vcalc-product-meta { font-size: 0.875rem; color: var(--iv-ink-muted); }
.iv_vcalc-product-cta { margin-left: auto; font-weight: 600; color: var(--iv-accent); white-space: nowrap; }
@media (max-width: 560px) { .iv_vcalc-product-cta { display: none; } }

.iv_vcalc-disclaimer { margin-top: 18px; font-size: 0.8125rem; color: var(--iv-ink-muted); line-height: 1.5; }

/* ============================================================
 * Keuzewijzer wizard (/test-keuzewijzer/)
 * ============================================================ */
.iv_kw { max-width: 860px; margin: 0 auto; }

.iv_kw-progress {
	display: flex; gap: 6px; list-style: none; margin: 0 0 24px; padding: 0; flex-wrap: wrap;
}
.iv_kw-progress-item {
	display: flex; align-items: center; gap: 8px; flex: 1 1 auto;
	font-size: 0.8125rem; color: var(--iv-ink-muted); opacity: .55;
}
.iv_kw-progress-item.is-active, .iv_kw-progress-item.is-done { opacity: 1; }
.iv_kw-progress-num {
	display: inline-flex; align-items: center; justify-content: center;
	width: 26px; height: 26px; border-radius: 50%; flex: none;
	background: var(--iv-stone-200); color: var(--iv-ink-soft);
	font-weight: 700; font-size: 0.8125rem;
}
.iv_kw-progress-item.is-active .iv_kw-progress-num { background: var(--iv-accent-deep); color: #fff; }
.iv_kw-progress-item.is-done .iv_kw-progress-num { background: var(--iv-ink); color: #fff; }
.iv_kw-progress-label { white-space: nowrap; }
@media (max-width: 600px) { .iv_kw-progress-label { display: none; } }

.iv_kw-card {
	padding: 28px; border: 1px solid var(--iv-stone-200);
	border-radius: 18px; background: var(--iv-paper);
	box-shadow: 0 12px 40px rgba(0,0,0,.05);
}
.iv_kw-step-title { font-family: var(--iv-font-display); font-size: 1.5rem; margin: 0 0 6px; color: var(--iv-ink); }
.iv_kw-step-hint { margin: 0 0 18px; color: var(--iv-ink-muted); font-size: 0.9375rem; }

.iv_kw-choices { display: grid; grid-template-columns: 1fr; gap: 12px; }
.iv_kw-choices-grid { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .iv_kw-choices-grid { grid-template-columns: repeat(3, 1fr); } }
.iv_kw-choice { cursor: pointer; }
.iv_kw-choice input { position: absolute; opacity: 0; pointer-events: none; }
.iv_kw-choice-card {
	display: flex; flex-direction: column; gap: 4px; height: 100%;
	padding: 16px 18px; border: 2px solid var(--iv-stone-200);
	border-radius: 12px; background: var(--iv-paper); transition: border-color .15s ease, background .15s ease;
}
.iv_kw-choice-card strong { color: var(--iv-ink); }
.iv_kw-choice-card small { color: var(--iv-ink-muted); font-size: 0.8125rem; line-height: 1.4; }
.iv_kw-choice:hover .iv_kw-choice-card { border-color: var(--iv-accent); }
.iv_kw-choice input:checked + .iv_kw-choice-card { border-color: var(--iv-accent); background: var(--iv-accent-soft); }
.iv_kw-choice input:focus-visible + .iv_kw-choice-card { outline: 2px solid var(--iv-accent); outline-offset: 2px; }

.iv_kw-prefs { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 560px) { .iv_kw-prefs { grid-template-columns: 1fr 1fr; } }
.iv_kw-pref { display: flex; flex-direction: column; gap: 6px; }
.iv_kw-pref span { font-weight: 600; color: var(--iv-ink); font-size: 0.9375rem; }
.iv_kw-pref select {
	padding: 12px 14px; border: 1px solid var(--iv-stone-200);
	border-radius: 10px; background: var(--iv-paper); font: inherit; color: var(--iv-ink);
}

.iv_kw-nav { display: flex; gap: 12px; margin-top: 26px; }
.iv_kw-nav [data-iv-kw-next], .iv_kw-nav [data-iv-kw-submit] { margin-left: auto; }
/* .iv_btn sets display:inline-flex, which overrides the UA [hidden] rule;
   force nav buttons (and the success panel) to honour the hidden attribute. */
.iv_kw-nav .iv_btn[hidden], .iv_kw [hidden] { display: none !important; }

.iv_kw-result-summary { margin-bottom: 16px; }
.iv_kw-summary-line { padding: 14px 16px; background: var(--iv-warm-50); border-radius: 12px; color: var(--iv-ink-soft); }
.iv_kw-matches { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 12px; }
.iv_kw-match { position: relative; border: 1px solid var(--iv-stone-200); border-radius: 14px; overflow: hidden; }
.iv_kw-match.is-top { border-color: var(--iv-accent); }
.iv_kw-match-badge {
	position: absolute; top: 0; right: 0; z-index: 1;
	background: var(--iv-accent-deep); color: #fff; font-size: 0.6875rem; font-weight: 700;
	padding: 4px 10px; border-bottom-left-radius: 10px; letter-spacing: .03em;
}
.iv_kw-match-link { display: flex; align-items: center; gap: 16px; padding: 14px 16px; text-decoration: none; color: inherit; }
.iv_kw-match-link img { width: 72px; height: 72px; object-fit: contain; flex: none; border-radius: 8px; }
.iv_kw-match-body { display: flex; flex-direction: column; gap: 2px; }
.iv_kw-match-brand { font-size: 0.72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--iv-accent); font-weight: 700; }
.iv_kw-match-meta { font-size: 0.875rem; color: var(--iv-ink-muted); }
.iv_kw-nomatch { padding: 16px; background: var(--iv-stone-100); border-radius: 12px; color: var(--iv-ink-soft); }

.iv_kw-offerte { margin-top: 8px; padding-top: 24px; border-top: 1px solid var(--iv-stone-200); }
.iv_kw-offerte h3 { font-family: var(--iv-font-display); font-size: 1.25rem; margin: 0 0 6px; color: var(--iv-ink); }
.iv_kw-offerte p { margin: 0 0 18px; color: var(--iv-ink-muted); font-size: 0.9375rem; }
.iv_kw-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; position: relative; }
.iv_kw-fields label { display: flex; flex-direction: column; gap: 6px; }
.iv_kw-fields label span { font-weight: 600; color: var(--iv-ink); font-size: 0.875rem; }
.iv_kw-field-full { grid-column: 1 / -1; }
.iv_kw-fields input, .iv_kw-fields textarea {
	padding: 12px 14px; border: 1px solid var(--iv-stone-200);
	border-radius: 10px; background: var(--iv-paper); font: inherit; color: var(--iv-ink);
}
.iv_kw-fields input:focus-visible, .iv_kw-fields textarea:focus-visible { outline: 2px solid var(--iv-accent); outline-offset: 1px; }
@media (max-width: 560px) { .iv_kw-fields { grid-template-columns: 1fr; } }
.iv_kw-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.iv_kw-done { text-align: center; padding: 48px 24px; }
.iv_kw-done-icon {
	width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: var(--iv-accent); color: #fff; font-size: 2rem; font-weight: 700;
}
.iv_kw-done h2 { font-family: var(--iv-font-display); font-size: 1.5rem; color: var(--iv-ink); margin: 0 0 22px; }

/* ============================================================
   DEALER NETWORK — /dealer-netwerk/ (BEHA dealer-map pattern)
   ============================================================ */
.iv_dn-hero { padding: clamp(56px, 7vw, 96px) 0 clamp(28px, 3vw, 44px); background: var(--iv-warm-50); }
.iv_dn-hero-title { font-family: var(--iv-font-display); font-size: clamp(2rem, 4vw + 0.5rem, 3.25rem); line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 14px; color: var(--iv-ink); max-width: 20ch; }
.iv_dn-hero-intro { font-size: 1.0625rem; line-height: 1.6; color: var(--iv-ink-soft); max-width: 62ch; margin: 0; }

.iv_dn-map-section { padding: clamp(32px, 4vw, 56px) 0 clamp(56px, 7vw, 96px); background: var(--iv-warm-50); }
.iv_dn-wrap { background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 18px; padding: clamp(20px, 3vw, 40px); display: grid; grid-template-columns: 1fr 1.35fr; gap: clamp(20px, 3vw, 40px); align-items: stretch; }
@media (max-width: 880px) { .iv_dn-wrap { grid-template-columns: 1fr; } }

.iv_dn-side-title { font-family: var(--iv-font-display); font-size: 1.5rem; margin: 0 0 8px; }
.iv_dn-side-text { color: var(--iv-ink-soft); font-size: 0.9375rem; margin: 0 0 18px; }
.iv_dn-search { display: flex; gap: 8px; margin-bottom: 18px; }
.iv_dn-search input { flex: 1; min-width: 0; padding: 12px 16px; border: 1.5px solid var(--iv-stone-200); border-radius: 999px; font-family: inherit; font-size: 0.9375rem; outline: none; transition: border-color 0.2s ease; background: #fff; }
.iv_dn-search input:focus { border-color: var(--iv-accent); }
.iv_dn-filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.iv_dn-filter { padding: 8px 14px; border-radius: 999px; background: #fff; border: 1.5px solid var(--iv-stone-200); font-size: 0.8125rem; font-weight: 700; cursor: pointer; transition: all 0.2s ease; font-family: inherit; color: var(--iv-ink-soft); }
.iv_dn-filter:hover { border-color: var(--iv-ink); color: var(--iv-ink); }
.iv_dn-filter.is-active { background: var(--iv-ink); color: #fff; border-color: var(--iv-ink); }
.iv_dn-count { font-size: 0.8125rem; color: var(--iv-ink-muted); margin-bottom: 12px; font-weight: 600; }
.iv_dn-count b { color: var(--iv-ink); }
.iv_dn-list { list-style: none; padding: 0 6px 0 0; margin: 0; display: flex; flex-direction: column; gap: 8px; max-height: 520px; overflow-y: auto; }
.iv_dn-list::-webkit-scrollbar { width: 6px; }
.iv_dn-list::-webkit-scrollbar-thumb { background: var(--iv-stone-200); border-radius: 3px; }
.iv_dn-item { padding: 14px 16px; border-radius: 12px; background: var(--iv-warm-50); border: 1px solid transparent; display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 0.9375rem; cursor: pointer; transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.25s ease; }
.iv_dn-item:hover, .iv_dn-item.is-active { border-color: var(--iv-accent); transform: translateX(4px); box-shadow: 0 6px 14px rgba(245, 129, 36, 0.14); }
.iv_dn-item b { color: var(--iv-ink); display: block; margin-bottom: 2px; }
.iv_dn-item-loc { color: var(--iv-ink-muted); font-size: 0.8125rem; }
.iv_dn-item-tag { font-size: 0.625rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; background: var(--iv-accent-soft); color: var(--iv-accent-deep); flex-shrink: 0; }
.iv_dn-item.is-hidden { display: none; }
.iv_dn-empty { padding: 22px; text-align: center; color: var(--iv-ink-soft); font-size: 0.9375rem; background: var(--iv-warm-50); border-radius: 12px; }

.iv_dn-canvas { position: relative; background: #fff; border-radius: 14px; border: 1px solid var(--iv-stone-200); overflow: visible; min-height: 520px; }
.iv_dn-svg { width: 100%; height: 100%; display: block; border-radius: 14px; overflow: hidden; }
.iv_dn-pin { position: absolute; transform: translate(-50%, -50%); z-index: 1; }
.iv_dn-pin.is-active, .iv_dn-pin.is-pinned { z-index: 20; }
.iv_dn-pin-dot { width: 18px; height: 18px; background: var(--iv-accent); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 4px 12px rgba(245, 129, 36, 0.4); cursor: pointer; padding: 0; display: block; transition: transform 0.25s ease, background 0.2s ease; animation: ibDnPulse 3s ease infinite; }
.iv_dn-pin:hover .iv_dn-pin-dot, .iv_dn-pin.is-active .iv_dn-pin-dot, .iv_dn-pin.is-pinned .iv_dn-pin-dot { transform: scale(1.5); animation: none; background: var(--iv-accent-2); }
@keyframes ibDnPulse { 0%, 100% { box-shadow: 0 4px 12px rgba(245, 129, 36, 0.4), 0 0 0 0 rgba(245, 129, 36, 0.45); } 50% { box-shadow: 0 4px 12px rgba(245, 129, 36, 0.4), 0 0 0 12px rgba(245, 129, 36, 0); } }
@media (prefers-reduced-motion: reduce) { .iv_dn-pin-dot { animation: none; } }

.iv_dn-pop { position: absolute; bottom: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(6px); width: 240px; padding: 16px; background: #2e2620; color: #fff; border-radius: 12px; box-shadow: 0 14px 34px rgba(0, 0, 0, 0.32); text-align: left; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s; z-index: 21; }
.iv_dn-pop::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #2e2620; }
.iv_dn-pin:hover .iv_dn-pop, .iv_dn-pin.is-pinned .iv_dn-pop { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.iv_dn-pin.is-pinned .iv_dn-pop { pointer-events: auto; }
.iv_dn-pop-name { font-weight: 800; font-size: 0.9375rem; line-height: 1.25; padding-right: 20px; }
.iv_dn-pop-loc { color: rgba(255, 255, 255, 0.66); font-size: 0.78rem; margin-top: 2px; }
.iv_dn-pop-tag { display: inline-block; margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: rgba(245, 129, 36, 0.22); color: #fbc98f; font-size: 0.5625rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; vertical-align: middle; }
.iv_dn-pop-actions { display: flex; flex-direction: column; gap: 2px; margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, 0.12); }
.iv_dn-pop-actions a { display: flex; align-items: center; gap: 9px; padding: 7px 8px; margin: 0 -8px; border-radius: 8px; color: rgba(255, 255, 255, 0.9); text-decoration: none; font-size: 0.8125rem; font-weight: 600; transition: background 0.15s ease, color 0.15s ease; }
.iv_dn-pop-actions a:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.iv_dn-pop-actions a svg { flex-shrink: 0; color: var(--iv-accent); }
.iv_dn-pop-actions a.iv_dn-pop-route { color: #fbc98f; }
.iv_dn-pop-close { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; border: 0; background: transparent; color: rgba(255, 255, 255, 0.5); cursor: pointer; border-radius: 50%; display: none; align-items: center; justify-content: center; font-size: 16px; line-height: 1; }
.iv_dn-pin.is-pinned .iv_dn-pop-close { display: inline-flex; }
.iv_dn-pop-close:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }

.iv_dn-join { padding: clamp(56px, 7vw, 96px) 0; background: linear-gradient(135deg, #1a1410 0%, #2e2620 55%, #1a1410 100%); color: rgba(255, 255, 255, 0.85); }
.iv_dn-join-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (max-width: 880px) { .iv_dn-join-inner { grid-template-columns: 1fr; } }
.iv_dn-join .iv_eyebrow { color: var(--iv-gold) !important; }
.iv_dn-join-title { font-family: var(--iv-font-display); font-size: clamp(1.75rem, 3vw + 0.5rem, 2.5rem); color: #fff; line-height: 1.12; margin: 0 0 14px; }
.iv_dn-join-text { color: rgba(255, 255, 255, 0.85); font-size: 1rem; line-height: 1.65; margin: 0; }
.iv_dn-join-form { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 16px; padding: clamp(20px, 3vw, 32px); }
.iv_dn-join-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .iv_dn-join-grid { grid-template-columns: 1fr; } }
.iv_dn-join-form label { display: flex; flex-direction: column; gap: 6px; font-size: 0.8125rem; font-weight: 600; color: rgba(255, 255, 255, 0.8); }
.iv_dn-join-form input, .iv_dn-join-form textarea { padding: 11px 14px; border: 1.5px solid rgba(255, 255, 255, 0.18); border-radius: 10px; background: rgba(255, 255, 255, 0.06); color: #fff; font-family: inherit; font-size: 0.9375rem; outline: none; transition: border-color 0.2s ease; }
.iv_dn-join-form input:focus, .iv_dn-join-form textarea:focus { border-color: var(--iv-accent); }
.iv_dn-join-message { margin: 14px 0 18px; }
.iv_dn-join-result { margin-top: 12px; font-size: 0.9375rem; min-height: 1.4em; }
.iv_dn-join-result.is-busy { color: rgba(255, 255, 255, 0.7); }
.iv_dn-join-result.is-ok { color: #7ee2a1; }
.iv_dn-join-result.is-err { color: #ff9d9d; }

/* ============================================================
   LEAD FORMS — /contact/ form section + /offerte-aanvragen/
   ============================================================ */
.iv_lead-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .iv_lead-form-grid { grid-template-columns: 1fr; } }
.iv_lead-form label { display: flex; flex-direction: column; gap: 6px; font-size: 0.8125rem; font-weight: 600; color: var(--iv-ink-soft); }
.iv_lead-form input, .iv_lead-form select, .iv_lead-form textarea { padding: 11px 14px; border: 1.5px solid var(--iv-stone-200); border-radius: 10px; background: #fff; color: var(--iv-ink); font-family: inherit; font-size: 0.9375rem; outline: none; transition: border-color 0.2s ease; width: 100%; }
.iv_lead-form input:focus, .iv_lead-form select:focus, .iv_lead-form textarea:focus { border-color: var(--iv-accent); }
.iv_lead-form-message { margin: 14px 0 18px; }
.iv_lead-form-result { margin-top: 12px; font-size: 0.9375rem; min-height: 1.4em; }
.iv_lead-form-result.is-busy { color: var(--iv-ink-muted); }
.iv_lead-form-result.is-ok { color: #1a7f37; font-weight: 600; }
.iv_lead-form-result.is-err { color: #b3261e; font-weight: 600; }

/* Contact page form section */
.iv_ct-form { background: var(--iv-warm-50); padding: clamp(48px, 6vw, 80px) 0; }
.iv_ct-form-inner { display: grid; grid-template-columns: 1fr 1.35fr; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (max-width: 880px) { .iv_ct-form-inner { grid-template-columns: 1fr; } }
.iv_ct-form-title { font-family: var(--iv-font-display); font-size: clamp(1.625rem, 2.5vw + 0.5rem, 2.25rem); line-height: 1.12; margin: 0 0 12px; color: var(--iv-ink); }
.iv_ct-form-text { color: var(--iv-ink-soft); font-size: 1rem; line-height: 1.6; margin: 0; }
.iv_ct-form-card, .iv_of-form-card { background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 16px; padding: clamp(20px, 3vw, 32px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04); }

/* Offerte page */
.iv_of-hero { background: var(--iv-warm-50); padding: clamp(56px, 7vw, 96px) 0; }
.iv_of-hero-inner { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
@media (max-width: 880px) { .iv_of-hero-inner { grid-template-columns: 1fr; } }
.iv_of-title { font-family: var(--iv-font-display); font-size: clamp(2rem, 4vw + 0.5rem, 3.25rem); line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 14px; color: var(--iv-ink); }
.iv_of-intro { font-size: 1.0625rem; line-height: 1.6; color: var(--iv-ink-soft); margin: 0 0 22px; }
.iv_of-usps { list-style: none; padding: 0; margin: 0 0 22px; display: flex; flex-direction: column; gap: 10px; }
.iv_of-usps li { display: flex; align-items: center; gap: 10px; font-size: 0.9375rem; font-weight: 600; color: var(--iv-ink); }
.iv_of-usp-check { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--iv-accent-soft); color: var(--iv-accent-deep); flex-shrink: 0; }
.iv_of-alt { font-size: 0.9375rem; color: var(--iv-ink-soft); }
.iv_of-alt a { color: var(--iv-accent-deep); font-weight: 700; }

/* ============================================================
   VERMOGEN-CALCULATORS — 3 benodigd-vermogen landing pages
   ============================================================ */
.iv_vc-hero { background: var(--iv-warm-50); padding: clamp(56px, 7vw, 96px) 0 clamp(24px, 3vw, 40px); }
.iv_vc-title { font-family: var(--iv-font-display); font-size: clamp(1.875rem, 3.5vw + 0.5rem, 3rem); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 14px; color: var(--iv-ink); max-width: 24ch; }
.iv_vc-intro { font-size: 1.0625rem; line-height: 1.6; color: var(--iv-ink-soft); max-width: 62ch; margin: 0; }

.iv_vc-body { background: var(--iv-warm-50); padding: clamp(24px, 3vw, 48px) 0 clamp(56px, 7vw, 96px); }
.iv_vc-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(20px, 3vw, 40px); align-items: start; }
@media (max-width: 880px) { .iv_vc-grid { grid-template-columns: 1fr; } }

.iv_vc-form { background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 16px; padding: clamp(20px, 3vw, 32px); box-shadow: 0 14px 38px rgba(0, 0, 0, 0.07); display: flex; flex-direction: column; gap: 16px; }
.iv_vc-radios { border: 0; padding: 0; margin: 0; }
.iv_vc-radios legend { font-size: 0.8125rem; font-weight: 700; color: var(--iv-ink); margin-bottom: 10px; }
/* flex-direction row + input width auto: the shared .iv_lead-form rules
 * (column labels, 100%-width inputs) otherwise stack the radio dot above
 * its text (client-reported). */
.iv_vc-radios label { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1.5px solid var(--iv-stone-200); border-radius: 10px; margin-bottom: 8px; cursor: pointer; font-size: 0.875rem; font-weight: 500; color: var(--iv-ink-soft); transition: border-color 0.2s ease, background 0.2s ease; }
.iv_vc-radios input[type="radio"] { width: auto; }
.iv_vc-radios label:has(input:checked) { border-color: var(--iv-accent); background: var(--iv-accent-soft); color: var(--iv-ink); }
.iv_vc-radios input { margin-top: 3px; accent-color: var(--iv-accent-deep); flex-shrink: 0; }
.iv_vc-radios-inline { display: block; }
.iv_vc-radios-inline label { display: inline-flex; margin-right: 8px; padding: 8px 18px; }

.iv_vc-result { background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 16px; padding: clamp(20px, 3vw, 32px); box-shadow: 0 14px 38px rgba(0, 0, 0, 0.07); position: sticky; top: 96px; }
/* Pre-calculation placeholder — the right half is ALWAYS visible */
.iv_vc-placeholder-watt { font-family: var(--iv-font-display); font-size: clamp(2.5rem, 4vw + 1rem, 3.75rem); line-height: 1; color: var(--iv-stone-200); margin: 6px 0 10px; }
.iv_vc-placeholder-text { font-size: 0.9375rem; color: var(--iv-ink-soft); line-height: 1.6; margin: 0 0 16px; }
.iv_vc-placeholder-steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.iv_vc-placeholder-steps li { display: flex; align-items: center; gap: 10px; font-size: 0.875rem; color: var(--iv-ink-muted); }
.iv_vc-placeholder-steps li b { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--iv-accent-soft); color: var(--iv-accent-deep); font-size: 0.75rem; flex-shrink: 0; }
.iv_vc-result-watt { font-family: var(--iv-font-display); color: var(--iv-ink); margin: 6px 0 8px; }
.iv_vc-result-watt b { font-size: clamp(2.5rem, 4vw + 1rem, 3.75rem); line-height: 1; font-weight: 400; }
.iv_vc-result-watt span { font-size: 1.25rem; color: var(--iv-ink-muted); }
.iv_vc-result-note { font-size: 0.875rem; color: var(--iv-ink-muted); line-height: 1.55; margin: 0 0 18px; }
.iv_vc-products-title { font-family: var(--iv-font-body); font-size: 0.9375rem; font-weight: 800; letter-spacing: 0.02em; margin: 0 0 10px; color: var(--iv-ink); }
.iv_vc-products-list { list-style: none; padding: 0; margin: 0 0 18px; display: flex; flex-direction: column; gap: 8px; }
.iv_vc-products-list a { display: block; padding: 12px 14px; border: 1px solid var(--iv-stone-200); border-radius: 10px; background: var(--iv-warm-50); text-decoration: none; transition: border-color 0.2s ease, transform 0.2s ease; }
.iv_vc-products-list a:hover { border-color: var(--iv-accent); transform: translateX(3px); }
.iv_vc-product-name { display: block; font-weight: 700; font-size: 0.875rem; color: var(--iv-ink); margin-bottom: 2px; }
.iv_vc-product-meta { display: block; font-size: 0.78rem; color: var(--iv-ink-muted); }
.iv_vc-empty { font-size: 0.875rem; color: var(--iv-ink-soft); background: var(--iv-warm-100); border-radius: 10px; padding: 14px; margin: 0 0 18px; }
/* Result-panel e-mail capture — the action that actually sends the result
   (moved here from the left form so the two right-panel buttons read clearly:
   send-me-the-result, then request-a-quote). */
.iv_vc-mail { border-top: 1px solid var(--iv-stone-200); padding-top: 16px; margin: 4px 0 16px; }
.iv_vc-mail-label { display: block; font-size: 0.8125rem; font-weight: 700; color: var(--iv-ink); margin-bottom: 8px; }
.iv_vc-mail-row { display: flex; gap: 8px; flex-wrap: wrap; }
.iv_vc-mail-row input[type="email"] { flex: 1 1 180px; min-width: 0; padding: 11px 13px; border: 1.5px solid var(--iv-stone-200); border-radius: 10px; font-family: inherit; font-size: 0.9375rem; color: var(--iv-ink); background: #fff; }
.iv_vc-mail-row input[type="email"]:focus { outline: none; border-color: var(--iv-accent); box-shadow: 0 0 0 3px var(--iv-accent-soft); }
.iv_vc-mail-row .iv_btn { flex: 0 0 auto; justify-content: center; white-space: nowrap; }
.iv_vc-mail-msg { font-size: 0.8125rem; line-height: 1.5; margin: 10px 0 0; }
.iv_vc-mail-msg.is-ok { color: #1c7c3f; }
.iv_vc-mail-msg.is-error { color: #b3261e; }

.iv_vc-result-ctas { display: flex; flex-direction: column; gap: 8px; }
.iv_vc-result-ctas .iv_btn { justify-content: center; }

.iv_vc-siblings { padding: clamp(36px, 5vw, 64px) 0; background: #fff; border-top: 1px solid var(--iv-stone-200); }
.iv_vc-sibling-links { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.iv_vc-sibling-links a { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.9375rem; color: var(--iv-accent-deep); text-decoration: none; }
.iv_vc-sibling-links a:hover { text-decoration: underline; }

/* ============================================================
   DOWNLOADS — /downloads/ (Catalogus + Handleidingen)
   ============================================================ */
.iv_dl-hero { background: var(--iv-warm-50); padding: clamp(56px, 7vw, 96px) 0 clamp(24px, 3vw, 40px); }
.iv_dl-title { font-family: var(--iv-font-display); font-size: clamp(2rem, 4vw + 0.5rem, 3.25rem); line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 14px; color: var(--iv-ink); }
.iv_dl-intro { font-size: 1.0625rem; line-height: 1.6; color: var(--iv-ink-soft); max-width: 62ch; margin: 0; }
.iv_dl-body { background: var(--iv-warm-50); padding: clamp(24px, 3vw, 48px) 0 clamp(56px, 7vw, 96px); }
.iv_dl-group + .iv_dl-group { margin-top: clamp(32px, 4vw, 56px); }
.iv_dl-group-title { font-family: var(--iv-font-display); font-size: clamp(1.5rem, 2vw + 0.5rem, 2rem); margin: 0 0 18px; color: var(--iv-ink); }
/* Max 3 per row (client: 4 gets too congested) */
.iv_dl-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 600px)  { .iv_dl-list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .iv_dl-list { grid-template-columns: repeat(3, 1fr); } }
.iv_dl-card-ext { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; height: 52px; border-radius: 12px; background: var(--iv-accent-soft); color: var(--iv-accent-deep); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.04em; flex-shrink: 0; }
.iv_dl-card-body { flex: 1; min-width: 0; }
.iv_dl-card-body b { display: block; color: var(--iv-ink); font-size: 0.9375rem; line-height: 1.35; margin-bottom: 2px; }
.iv_dl-card-desc { display: block; font-size: 0.8125rem; color: var(--iv-ink-soft); line-height: 1.45; }
.iv_dl-card-size { display: block; font-size: 0.75rem; color: var(--iv-ink-muted); margin-top: 3px; }
.iv_dl-card-icon { color: var(--iv-accent-deep); flex-shrink: 0; }
.iv_dl-empty { background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 14px; padding: clamp(28px, 4vw, 48px); text-align: center; max-width: 560px; margin: 0 auto; }
.iv_dl-empty p { color: var(--iv-ink-soft); margin: 0 0 18px; }

/* Downloads — category tabs (v1.12.0) */
.iv_dl-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.iv_dl-tab { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border-radius: 999px; background: #fff; border: 1.5px solid var(--iv-stone-200); font-size: 0.875rem; font-weight: 700; cursor: pointer; transition: all 0.2s ease; font-family: inherit; color: var(--iv-ink-soft); }
.iv_dl-tab:hover { border-color: var(--iv-ink); color: var(--iv-ink); }
.iv_dl-tab.is-active { background: var(--iv-ink); color: #fff; border-color: var(--iv-ink); }
.iv_dl-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--iv-accent-soft); color: var(--iv-accent-deep); font-size: 0.6875rem; font-weight: 800; }
.iv_dl-tab.is-active .iv_dl-tab-count { background: rgba(255, 255, 255, 0.18); color: #fff; }
.iv_dl-card-cat { display: inline-block; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--iv-accent-deep); margin-bottom: 2px; }

/* Site-wide header lead CTA (v1.14.0 — client: verwarmingsplan button prominent everywhere) */
.iv_header-cta { display: none; }
@media (min-width: 1100px) {
	.iv_header-cta { display: inline-flex; padding: 10px 18px !important; font-size: 0.875rem !important; border-radius: 999px !important; white-space: nowrap; }
}

/* Downloads v1.15.0 — optional cover image on cards + description line breaks */
.iv_dl-card-thumb { display: block; width: 64px; aspect-ratio: 3 / 4; border-radius: 8px; overflow: hidden; border: 1px solid var(--iv-stone-200); background: var(--iv-warm-50); flex-shrink: 0; }
.iv_dl-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.iv_dl-card-desc { white-space: pre-line; }

/* Downloads v1.16.0 — 160-char teaser + details modal */
/* Equal-height boxes per row (client request 2026-08-21): the grid rows
   already stretch the <li>s — flex makes the white card fill its <li>. */
.iv_dl-card { display: flex; }
.iv_dl-card-inner { flex: 1; display: flex; align-items: center; gap: 14px; padding: 18px; background: #fff; border: 1px solid var(--iv-stone-200); border-radius: 14px; cursor: pointer; transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.25s ease; }
.iv_dl-card-inner:hover, .iv_dl-card-inner:focus-visible { border-color: var(--iv-accent); transform: translateY(-3px); box-shadow: 0 10px 24px rgba(245, 129, 36, 0.12); }
.iv_dl-card-icon { color: var(--iv-accent-deep); flex-shrink: 0; display: inline-flex; padding: 8px; border-radius: 8px; transition: background 0.2s ease; }
.iv_dl-card-icon:hover { background: var(--iv-accent-soft); }
.iv_dl-modal { position: fixed; inset: 0; z-index: 9000; display: flex; align-items: center; justify-content: center; padding: 20px; }
/* display:flex would override the [hidden] UA style and leave an invisible
 * click-blocking overlay on the page — force it. */
.iv_dl-modal[hidden] { display: none; }
.iv_dl-modal-overlay { position: absolute; inset: 0; background: rgba(26, 20, 16, 0.6); }
.iv_dl-modal-dialog { position: relative; background: #fff; border-radius: 16px; max-width: 560px; width: 100%; max-height: 86vh; overflow-y: auto; box-shadow: 0 24px 64px rgba(0, 0, 0, 0.3); display: flex; flex-direction: column; }
@media (min-width: 640px) { .iv_dl-modal-dialog:has([data-iv-dlm-media]:not([hidden])) { flex-direction: row; max-width: 720px; } }
.iv_dl-modal-media { flex: 0 0 240px; background: var(--iv-warm-50); }
.iv_dl-modal-media img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 200px; }
.iv_dl-modal-body { padding: clamp(20px, 3vw, 32px); }
.iv_dl-modal-title { font-family: var(--iv-font-display); font-size: 1.4rem; line-height: 1.2; margin: 6px 0 12px; color: var(--iv-ink); }
.iv_dl-modal-desc { white-space: pre-line; font-size: 0.9375rem; line-height: 1.6; color: var(--iv-ink-soft); margin: 0 0 12px; }
.iv_dl-modal-meta { font-size: 0.8125rem; color: var(--iv-ink-muted); margin: 0 0 18px; }
.iv_dl-modal-close { position: absolute; top: 10px; right: 10px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.9); color: var(--iv-ink); font-size: 20px; line-height: 1; cursor: pointer; z-index: 2; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); }
.iv_dl-modal-close:hover { background: #fff; color: var(--iv-accent-deep); }

/* =========================================================================
   HEADER v2 (industrial-blunor 0.9.0) — one calm row, advice CTA always visible.
   Overrides the inherited two-row infra header above.
   ========================================================================= */
.iv_hdr {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--iv-paper);
	border-bottom: 1px solid var(--iv-stone-200);
}
.admin-bar .iv_hdr { top: 32px; }
.iv_hdr-inner {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 76px;
}
.iv_hdr .iv_brand,
.iv_hdr .custom-logo-link { flex: none; }
.iv_hdr .iv_brand img,
.iv_hdr .custom-logo { max-height: 46px; width: auto; }
.iv_hdr-nav { display: none; flex: 1 1 auto; min-width: 0; }
.iv_hdr .iv_primary-menu { flex-wrap: nowrap; justify-content: center; }
.iv_hdr .iv_primary-menu > li > a {
	padding: 27px 10px;
	font-family: var(--iv-font-body);
	font-size: .9375rem;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--iv-ink);
	white-space: nowrap;
}
.iv_hdr .iv_primary-menu > li.menu-item-has-children > a { padding-right: 24px; }
.iv_hdr .iv_primary-menu > li.menu-item-has-children > a::before { right: 9px; }
.iv_hdr .iv_primary-menu > li:hover > a,
.iv_hdr .iv_primary-menu > li:focus-within > a { color: var(--iv-accent-deep); background: transparent; }
.iv_hdr .iv_primary-menu > .current-menu-item > a,
.iv_hdr .iv_primary-menu > .current-menu-parent > a,
.iv_hdr .iv_primary-menu > .current-menu-ancestor > a,
.iv_hdr .iv_primary-menu > .current_page_parent > a,
.iv_hdr .iv_primary-menu > .current_page_ancestor > a { color: var(--iv-ink); background: transparent; }
.iv_hdr .iv_primary-menu > li > a::after { height: 2px; bottom: -1px; }
.iv_hdr .iv_primary-menu ul { top: 100%; }

.iv_hdr-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; flex: none; }
.iv_hdr-phone {
	display: none;
	align-items: center;
	gap: 8px;
	margin-right: 8px;
	font-weight: 600;
	font-size: .9375rem;
	color: var(--iv-ink);
	text-decoration: none;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.iv_hdr-phone svg { color: var(--iv-accent-deep); }
.iv_hdr-phone:hover { color: var(--iv-accent-deep); }
.iv_hdr-cta { display: none; margin-left: 8px; padding: 12px 20px; white-space: nowrap; }

@media (min-width: 768px) { .iv_hdr-cta { display: inline-flex; } }
@media (min-width: 1200px) {
	.iv_hdr-nav { display: block; }
	.iv_hdr .iv_menu-toggle { display: none; }
}
@media (min-width: 1600px) { .iv_hdr-phone { display: inline-flex; } }
@media (max-width: 1199px) { .iv_hdr .iv_menu-toggle { display: inline-flex; } }
@media (max-width: 767px) {
	.iv_hdr-inner { min-height: 64px; gap: 12px; }
	.iv_hdr .iv_brand img, .iv_hdr .custom-logo { max-height: 38px; }
}

/* The inherited second row is gone. */
.iv_header-top, .iv_header-nav { display: none !important; }

/* Mobile sticky CTA bar */
.iv_sticky-cta {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	z-index: 45;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 52px;
	padding: 0 20px;
	border-radius: var(--iv-radius-pill);
	background: var(--iv-accent-deep);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.iv_sticky-cta:hover, .iv_sticky-cta:focus-visible { background: var(--iv-accent-deep-2); color: #fff; }
@media (min-width: 768px) { .iv_sticky-cta { display: none; } }
@media (max-width: 767px) { body { padding-bottom: 76px; } }
/* Header v2: the orange tab only on hover/focus (anchor items read as "current" on home). */
.iv_hdr .iv_primary-menu > li > a::after { transform: scaleX(0) !important; }
.iv_hdr .iv_primary-menu > li:hover > a::after,
.iv_hdr .iv_primary-menu > li:focus-within > a::after { transform: scaleX(1) !important; }
/* Sticky CTA hides while an in-page advice CTA (hero) is on screen. */
.iv_sticky-cta { transition: transform .25s var(--iv-ease), opacity .25s var(--iv-ease); }
.iv_sticky-cta.is-hidden { transform: translateY(140%); opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .iv_sticky-cta { transition: none; } }

/* Header v2.2 — same content column as the page (logo aligns with the hero text), always
   ONE row: the full menu from 1440px (where it fits), the menu button below that. */
.iv_hdr .iv_primary-menu { justify-content: safe center; }
.iv_hdr .iv_primary-menu > li > a { padding-inline: 10px; }
.iv_hdr-nav { display: none !important; min-width: 0; }
.iv_hdr .iv_menu-toggle { display: inline-flex !important; }
.iv_hdr-phone { display: none !important; }
@media (min-width: 1440px) {
	.iv_hdr-nav { display: block !important; }
	.iv_hdr .iv_menu-toggle { display: none !important; }
}

/* Header: active states. Top level = current page or its parent; dropdown = current page. */
body:not(.home) .iv_hdr .iv_primary-menu > :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a { color: var(--iv-accent-deep) !important; font-weight: 600; }
body:not(.home) .iv_hdr .iv_primary-menu > :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a::after { transform: scaleX(1) !important; }
.iv_hdr .iv_primary-menu ul .current-menu-item > a { background: var(--iv-accent-soft); color: var(--iv-accent-deep); font-weight: 600; padding-left: 16px; }
.iv_hdr .iv_primary-menu ul .current-menu-item > a::before { opacity: 1; }
/* Mobile drawer too. */
.iv_mobile-primary .current-menu-item > a { color: var(--iv-accent-deep) !important; font-weight: 600; }

/* Header v3 hovers — own identity (infra uses a sliding orange underline + light dropdown):
   top level = segmented heat bar grows in under the item; dropdown = dark anthracite panel,
   items get an orange bar + slide on hover. */
.iv_hdr .iv_primary-menu > li > a::after {
	left: 10px !important; right: auto !important; bottom: 18px !important;
	width: 34px; height: 3px !important;
	background:
		linear-gradient(var(--iv-ink-soft), var(--iv-ink-soft)) 0 0 / 6px 100% no-repeat,
		linear-gradient(var(--iv-gold), var(--iv-gold)) 10px 0 / 9px 100% no-repeat,
		linear-gradient(var(--iv-accent), var(--iv-accent)) 23px 0 / 11px 100% no-repeat !important;
	transform: scaleX(0) !important; transform-origin: left !important;
	transition: transform .25s var(--iv-ease) !important;
}
.iv_hdr .iv_primary-menu > li:hover > a::after,
.iv_hdr .iv_primary-menu > li:focus-within > a::after,
body:not(.home) .iv_hdr .iv_primary-menu > :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a::after { transform: scaleX(1) !important; }
.iv_hdr .iv_primary-menu > li:hover > a { color: var(--iv-ink) !important; }
.iv_hdr .iv_primary-menu ul {
	background: var(--iv-ink) !important;
	border: 0 !important;
	border-top: 3px solid var(--iv-accent) !important;
	border-radius: 0 0 var(--iv-radius-md) var(--iv-radius-md) !important;
	box-shadow: 0 20px 40px rgba(0, 0, 0, .28) !important;
	padding: 10px !important;
}
.iv_hdr .iv_primary-menu ul a { color: rgba(255, 255, 255, .82) !important; border-left: 3px solid transparent; border-radius: 0 !important; background: none !important; padding-left: 14px !important; }
.iv_hdr .iv_primary-menu ul a::before { display: none !important; }
.iv_hdr .iv_primary-menu ul a:hover,
.iv_hdr .iv_primary-menu ul a:focus-visible { color: #fff !important; border-left-color: var(--iv-accent); background: rgba(255, 255, 255, .06) !important; padding-left: 20px !important; }
.iv_hdr .iv_primary-menu ul .current-menu-item > a { color: #fff !important; border-left-color: var(--iv-accent); background: rgba(245, 129, 36, .16) !important; padding-left: 20px !important; }

/* Footer extras (from the live footer). */
.iv_footer-extra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 40px; margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--iv-stone-200); }
.iv_footer-connect { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.iv_footer-connect .iv_footer-title { margin: 0; }
.iv_footer-menu--inline { display: flex; gap: 18px; margin: 0; }
.iv_footer-certs { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin: 0; padding: 0; list-style: none; }
.iv_footer-certs img { display: block; height: 40px; width: auto; filter: grayscale(1); opacity: .75; }
.iv_footer-credit { margin-left: 12px; opacity: .8; }
.iv_footer-credit a { color: inherit; text-decoration: underline; }

/* Footer extras fix (0.16.4): logos are white artwork → render dark on the light footer;
   social links in one row; dealer button keeps white text over the footer link colour. */
.iv_footer-menu--inline { flex-direction: row !important; flex-wrap: wrap; align-items: center; padding: 0; list-style: none; }
.iv_footer-menu--inline > li { margin: 0 !important; padding: 0 !important; }
.iv_site-footer .iv_footer-dealer, .iv_site-footer .iv_footer-dealer:hover, .iv_site-footer .iv_footer-dealer:focus-visible { color: #fff !important; }
.iv_footer-certs img { filter: brightness(0); opacity: .45; transition: opacity .2s; }
.iv_footer-certs li:hover img { opacity: .8; }