.accent {
	color: var(--kleur-accent);
	font-style: normal;
}

.sectie--dossier .accent,
.sectie--kurk .accent {
	color: var(--kleur-zegel);
}

.sectie--foto {
	background: #0a0a0a;
	color: var(--kleur-tekst-licht);
	overflow: hidden;
}

.sectie--foto::after {
	display: none !important;
}

.sectie-bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	overflow: hidden;
	pointer-events: none;
}

.sectie-bg-beeld {
	position: absolute;
	inset: -8% 0;
	width: 100%;
	height: 116%;
	max-width: none;
	object-fit: cover;
	filter: grayscale(0.75) brightness(0.32) contrast(1.15) blur(3px);
	transform: scale(1.06);
}

.sectie--kluis .sectie-bg-beeld,
.sectie--muur .sectie-bg-beeld {
	filter: grayscale(0.8) brightness(0.3) contrast(1.15) blur(2px);
}

.sectie--kamer .sectie-bg-beeld {
	filter: grayscale(0.75) brightness(0.3) contrast(1.1) blur(4px);
}

.sectie-bg-licht {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, #0a0a0a 0%, rgba(10, 10, 10, 0) 30%, rgba(10, 10, 10, 0) 70%, #0a0a0a 100%),
		radial-gradient(ellipse 55% 60% at 75% 25%, rgba(255, 255, 255, 0.018), transparent 70%),
		radial-gradient(ellipse 90% 90% at 50% 50%, transparent 45%, rgba(0, 0, 0, 0.7));
}

@supports (animation-timeline: view()) {
	.sectie-bg-beeld {
		animation: bg-parallax linear both;
		animation-timeline: view();
		animation-range: cover;
	}

	@keyframes bg-parallax {
		from {
			transform: translateY(-5%) scale(1.12);
		}
		to {
			transform: translateY(5%) scale(1.04);
		}
	}
}

.sectie--foto .sectie-titel,
.sectie--foto h2,
.sectie--foto h3:not(.stap-titel):not(.dossier-titel) {
	color: #fff;
	text-shadow: 0 4px 24px rgba(0, 0, 0, 0.6);
}

.sectie--foto .label {
	color: var(--kleur-messing-licht);
}

.sectie--foto .sectie-intro,
.sectie--foto .tekst {
	color: #d9cdb8;
}

.sectie--foto .tekst a:not(.knop) {
	color: var(--kleur-messing-licht);
}

.sectie--foto .briefje h3 {
	color: var(--kleur-inkt);
	text-shadow: none;
}

.sectie--foto .knop--rand-donker {
	color: var(--kleur-papier-licht);
}

.sectie--foto .knop--rand-donker:hover,
.sectie--foto .knop--rand-donker:focus-visible {
	color: var(--kleur-nacht);
}

.sectie--foto .faq-item {
	background: rgba(20, 20, 20, 0.7);
	border-color: rgba(255, 255, 255, 0.12);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: var(--kleur-tekst-licht);
}

.sectie--foto .faq-item[open] {
	background: rgba(24, 24, 24, 0.85);
}

.sectie--foto .faq-nr {
	color: var(--kleur-messing-licht);
}

.sectie--foto .faq-antwoord {
	color: #cbbfa9;
}

.sectie--foto .ervaringen-score strong {
	color: var(--kleur-messing-licht);
}

.sectie--foto .stappen-touw path {
	stroke: var(--kleur-messing);
}

.sectie--foto .polaroid {
	box-shadow: 0 40px 70px -20px rgba(0, 0, 0, 0.9);
}

.sectie--foto .contact-formulier {
	box-shadow: var(--schaduw-zwevend);
}

.sectie--foto.cijfers .cijfer-getal {
	text-shadow: 0 0 30px rgba(230, 181, 98, 0.35);
}

.sectie--foto .cijfer + .cijfer::before {
	background: rgba(255, 255, 255, 0.18);
}

.spellen-sectie .dossiers .dossier-papier {
	background-color: #161616;
	background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 40%);
	color: var(--kleur-tekst-licht);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 30px 50px -24px rgba(0, 0, 0, 0.9);
}

.spellen-sectie .dossiers .dossier-titel,
.spellen-sectie .dossiers .dossier-prijs {
	color: #fff;
}

.spellen-sectie .dossiers .dossier-tekst {
	color: #b9ab94;
}

.spellen-sectie .dossiers .dossier-voet {
	border-top-color: rgba(255, 255, 255, 0.12);
}

.spellen-sectie .dossiers .dossier-cta,
.spellen-sectie .dossiers .spel-meta .icoon {
	color: var(--kleur-messing-licht);
}

.spellen-sectie .dossiers .dossier-tab {
	background: var(--kleur-messing);
	color: var(--kleur-nacht);
}

.spellen-sectie .dossiers .dossier-foto {
	border-color: #222222;
}

.spellen-sectie .dossier--maatwerk .dossier-papier {
	background: rgba(28, 22, 18, 0.6);
	border-color: rgba(230, 181, 98, 0.35);
}

.spellen-sectie .dossier--maatwerk p {
	color: #cbbfa9;
}

.hero .accent {
	color: var(--kleur-accent);
}

.galerij + .hero {
	min-height: min(88svh, 820px);
	padding-top: clamp(4rem, 3rem + 4vw, 7rem);
}

.sectie-bg-beeld[src*="/uploads/"] {
	filter: grayscale(0.35) brightness(0.4) contrast(1.1);
}

.sectie--bureau::after,
.hero + .sectie::after {
	display: none !important;
}

.sectie--bureau {
	background-image: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(255, 255, 255, 0.014), transparent 70%), var(--hout-nerf), linear-gradient(180deg, var(--kleur-nacht), var(--kleur-hout) 30%, var(--kleur-hout) 70%, var(--kleur-nacht));
}

.galerij + .hero::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 30%;
	z-index: -1;
	background: linear-gradient(180deg, var(--kleur-nacht), transparent);
	pointer-events: none;
}

.galerij + .hero .hero-touw {
	display: none;
}

.hero .scheur {
	display: none;
}

.hero::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 22%;
	z-index: -1;
	background: linear-gradient(0deg, var(--kleur-nacht), transparent);
	pointer-events: none;
}
