:root,
[data-bs-theme=light] {
	--header-height: 136px;

	--bs-primary: #070707;
	--bs-primary-rgb: 7, 7, 7;
	--bs-primary-text: #070707;
	--bs-primary-bg-subtle: #F0F0F0;
	--bs-primary-bg-subtle-rgb: 230, 230, 230;
	--bs-primary-border-subtle: #cccccc;
	--bs-primary-text-emphasis: #000000;

	--bs-secondary: #9B7D39;
	--bs-secondary-rgb: 155, 125, 57;
	--bs-secondary-text: #9B7D39;
	--bs-secondary-bg-subtle: #fff9ec;
	--bs-secondary-bg-subtle-rgb: 255, 249, 236;
	--bs-secondary-border-subtle: #f2e3c2;
	--bs-secondary-text-emphasis: #735c26;

	--custom-secondary-gradient: linear-gradient(269.89deg, #9B7D39 19.91%, #F2D899 60.27%, #9B7D39 75.01%);

	--bs-font-sans-serif: "EuclidCircularB", system-ui, -apple-system, Arial, sans-serif;
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-color: #000000;
	--bs-body-color-rgb: 0, 0, 0;
	--bs-body-font-size: 16px;
	--bs-body-font-weight: 400;
	--bs-body-line-height: 24px;

	--bs-body-bg-rgb: 242, 242, 242;
	--bs-body-bg: #ffffff;
	--bs-card-bg: #ffffff;

	--bs-heading-color: #000;
	--bs-emphasis-color: #000;
	--bs-emphasis-color-rgb: 0, 0, 0;

	--bs-secondary-color: rgba(0, 0, 0, 0.5);
	--bs-secondary-color-rgb: 0, 0, 0;
	--bs-secondary-bg: #e9ecef;
	--bs-secondary-bg-rgb: 233, 236, 239;
	--bs-tertiary-color: rgba(0, 0, 0, 0.5);
	--bs-tertiary-color-rgb: 0, 0, 0;
	--bs-tertiary-bg: #f9f9f9;
	--bs-tertiary-bg-rgb: 249, 249, 249;

	--bs-link-color: #070707;
	--bs-link-color-rgb: 7, 7, 7;
	--bs-link-decoration: underline;
	--bs-link-hover-color: #070707;
	--bs-link-hover-color-rgb: 7, 7, 7;

	--color-white: #ffffff;
	--theme-accent: var(--color-white);
	--gold-gradient: linear-gradient(180deg, #9B7D39 0%, #F2D899 49.52%, #9B7D39 100%);
	--silver-gradient: linear-gradient(180deg, rgba(123, 132, 142, 0.937255) 0%, #98A0A9 20.19%, #E4E8EC 47.6%, #98A0A9 73.56%, #7B848E 100%);

	--bs-border-width: 1.5px;
	--bs-border-style: solid;
	--bs-border-color: #c7c6c6;
	--bs-border-color-translucent: rgba(0, 0, 0, 0.175);
	--bs-border-radius: 0;
	--bs-border-radius-sm: 0.25rem;
	--bs-border-radius-lg: 0.5rem;
	--bs-border-radius-xl: 1rem;
	--bs-border-radius-2xl: 2rem;
	--bs-border-radius-pill: 50rem;

	--bs-box-shadow: 0 0.5rem 1rem rgba(var(--bs-body-color-rgb), 0.15);
	--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(var(--bs-body-color-rgb), 0.075);
	--bs-box-shadow-lg: 0 1rem 3rem rgba(var(--bs-body-color-rgb), 0.175);
	--bs-box-shadow-inset: inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075);

	--bs-form-control-bg: #ffffff;
	--bs-form-control-disabled-bg: var(--bs-secondary-bg);

	--figma-smart-easing: cubic-bezier(0.4, 0, 0.2, 1);
	--figma-duration: 0.3s;
	/* PRODUCT themes */
	--product-primary: #070707;
	--product-text: #070707;
	--chart-color: var(--product-primary);
	--banner-details-bg: var(--product-primary);
	--product-gradient: none;
	--card-bg: none;
	--slider-controls-bottom: clamp(2rem, 5vh, 4rem); /* 32px … 64px */
	--investor-circle-size: clamp(81px, min(15vh, 10vw), 150px);
	--modal-gap: clamp(16px, calc(var(--investor-circle-size) * 0.16), 24px); /* welcome + settings modal, from 992px */
	/* PRODUCT THEMES */


	--bs-gray-muted: #D9D9D9;
	--text-muted-gray: #9D9D9D;
	--text-custom-gray: #7C7C7C;
	--neg: #E6231E;
	--pos: #05AA4A;
	--space-64: 64px;
	--space-48: 48px;
	--space-40: 40px;
	--space-32: 32px;
	/* --- BUTTON TOKENS --- */
	--btn-font-family: var(--bs-font-sans-serif);
	--btn-font-size: 16px;
	--btn-font-weight: 600;
	--btn-line-height: 24px;
	--btn-height: 44px;
	--btn-width-min: 195px;
	--btn-width-max: 282px;
	--btn-padding: 10px 16px;
	--btn-transition: all var(--figma-duration) var(--figma-smart-easing);

	/* --- MOBILE DESIGN SYSTEM VARIABLES --- */
	--fs-h1: 32px;
	--lh-h1: 36px;
	--fs-h2: 29px;
	--lh-h2: 32px;
	--fs-h3: 26px;
	--lh-h3: 32px;
	--fs-h4: 23px;
	--lh-h4: 28px;
	--fs-h5: 20px;
	--lh-h5: 24px;

	--fs-body-big: 18px;
	--lh-body-big: 28px;
	--fs-body-standard: 16px;
	--lh-body-standard: 24px;
	--fs-body-small: 14px;
	--lh-body-small: 18px;
	--fs-body-xsmall: 12px;
	--lh-body-xsmall: 16px;
	--fs-body-semibold: 18px;
	--lh-body-semibold: 28px;
}

/* --- DESKTOP DESIGN SYSTEM OVERRIDES (1200px and up) --- */
@media (min-width: 1200px) {

	:root,
	[data-bs-theme=light] {
		/* headings grow from laptop size at 1200px to full desktop size at 1600px */
		--fs-h1: clamp(48px, calc(9px + 3.25vw), 61px);
		--lh-h1: clamp(54px, calc(12px + 3.5vw), 68px);
		--fs-h2: clamp(40px, calc(13px + 2.25vw), 49px);
		--lh-h2: clamp(45px, calc(18px + 2.25vw), 54px);
		--fs-h3: clamp(32px, calc(11px + 1.75vw), 39px);
		--lh-h3: clamp(36px, calc(12px + 2vw), 44px);
		--fs-h4: clamp(27px, calc(15px + 1vw), 31px);
		--lh-h4: clamp(32px, calc(20px + 1vw), 36px);
		--fs-h5: clamp(23px, calc(17px + 0.5vw), 25px);
		--lh-h5: clamp(28px, calc(22px + 0.5vw), 30px);

		--fs-body-big: 20px;
		--lh-body-big: 30px;
		--fs-body-standard: 16px;
		--lh-body-standard: 24px;
		--fs-body-small: 13px;
		--lh-body-small: 18px;
		--fs-body-xsmall: 10px;
		--lh-body-xsmall: 14px;
		--fs-body-semibold: 20px;
		--lh-body-semibold: 30px;
	}
}

@media (max-width: 992px) {

	:root,
	[data-bs-theme=light] {
		--header-height: 107px;
	}
}

html {
	scrollbar-gutter: stable;
}

.page-wrapper {
	width: 100%;
	/* max-width: 1440px; */
	margin-right: auto;
	margin-left: auto;
	position: relative;
}

body {
	background-color: #fff;
}

body.modal-open {
	padding-right: 0 !important;
	overflow: hidden;
}

#main {
	padding-top: var(--header-height);
	background: transparent;
}

section {
	background: transparent;
}

h1,
.h1 {
	font-size: var(--fs-h1);
	line-height: var(--lh-h1);
	font-weight: 600;
}

h2,
.h2 {
	font-size: var(--fs-h2);
	line-height: var(--lh-h2);
	font-weight: 600;
}

h3,
.h3 {
	font-size: var(--fs-h3);
	line-height: var(--lh-h3);
	font-weight: 600;
}

h4,
.h4 {
	font-size: var(--fs-h4);
	line-height: var(--lh-h4);
	font-weight: 600;
}

h5,
.h5 {
	font-size: var(--fs-h5);
	line-height: var(--lh-h5);
	font-weight: 600;
}

.fw-600 {
	font-weight: 600 !important;
}

.text-gold-gradient {
	background: var(--gold-gradient);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	font-weight: 600 !important;
}

.text-silver-gradient {
	background: var(--silver-gradient);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	font-weight: 600;
}

/* Custom Body Text Utilities */
.body-text-big {
	font-size: var(--fs-body-big);
	line-height: var(--lh-body-big);
	font-weight: 400;
}

.body-text-standard {
	font-size: var(--fs-body-standard);
	line-height: var(--lh-body-standard);
	font-weight: 400;
}

.body-text-small {
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	font-weight: 400;
}

.body-text-xsmall {
	font-size: var(--fs-body-xsmall);
	line-height: var(--lh-body-xsmall);
	font-weight: 400;
}

.body-text-semibold {
	font-size: var(--fs-body-semibold);
	line-height: var(--lh-body-semibold);
	font-weight: 600;
}

.product-theme {
	--chart-color: var(--product-primary);
}


.product-bg {
	background-color: var(--product-primary);
}


.product-gradient {
	background: var(--product-gradient);
}


.text-product {
	color: var(--product-text);
}

.fixed-nav-wrapper {
	position: fixed;
	/* max-width: 1440px; */
	top: 0;
	/* left: 50%;
	transform: translateX(-50%); */
	width: 100%;
	z-index: 1030;
	
}

/* .nav-footer {
	position: relative;
	 max-width: 1440px; 
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
} */

.top-navbar {
	height: 37px;
	background-color: var(--bs-body-bg);
	padding-top: 4px;
	padding-bottom: 4px;
}

.top-navbar .nav-link {
	font-size: var(--fs-body-small);
	color: var(--bs-body-color);
	text-decoration: none;
	padding: 0;
	line-height: var(--lh-body-small);
}

.top-navbar .nav-link:hover {
	color: var(--bs-link-color);
	font-weight: 500;
	transition: var(--btn-transition);
}

body.modal-open #main,
body.modal-open .fixed-nav-wrapper {
	filter: blur(20px);
}

body.filter-modal-open #main,
body.filter-modal-open .fixed-nav-wrapper {
	filter: none !important;
}

.lang-user-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 25px;
	padding-left: 4px;
	padding-right: 4px;
	border: var(--bs-primary-border-subtle);
	border-radius: 2px;
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-body-color);
	font-size: 13px;
	font-family: inherit;
	cursor: pointer;
}

.lang-user-btn>* {
	flex-shrink: 0;
}

.lang-user-btn:hover {
	background: var(--bs-gray-muted);
	transition: var(--btn-transition);
}

.divider-line-left {
	width: 1px;
	height: 16px;
	background-color: var(--bs-gray-muted);
	margin: 0 4px 0 4px;
}

.divider-line-right {
	width: 1px;
	height: 16px;
	background-color: var(--bs-gray-muted);
	margin: 0 4px 0 4px;
}

.main-navbar {
	background-color: var(--bs-primary);
	min-height: 106px;
	padding-top: 16px;
	padding-bottom: 16px;
}

.main-navbar .nav-link {
	color: var(--color-white) !important;
	font-family: var(--bs-body-font-family);
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: 0;
	padding: 0 !important;
	border-bottom: 1.5px solid transparent;
}

.main-navbar .nav-link:hover,
.main-navbar .nav-link.active {
	color: var(--color-white) !important;
}

.grey-line {
	color: var(--bs-gray-muted);
}

.mb-64 {
	margin-bottom: var(--space-64) !important;
}

.mb-48 {
	margin-bottom: var(--space-48) !important;
}

.mb-40 {
	margin-bottom: var(--space-40) !important;
}

.mt-40 {
	margin-top: var(--space-40) !important;
}

.mb-32 {
	margin-bottom: var(--space-32) !important;
}

.text-custom-gray {
	color: var(--text-custom-gray) !important;
}

.text-light-gray {
	color: var(--bs-gray-muted) !important;
}

.text-muted-gray {
	color: var(--text-muted-gray) !important;
}

.bg-primary {
	background-color: var(--bs-primary);
}

.neg {
	color: var(--neg) !important;
}

.pos {
	color: var(--pos) !important;
}

.investor-circle {
	position: relative;
	width: var(--investor-circle-size);
	height: var(--investor-circle-size);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.investor-btn {
	border: 0;
	outline: 0;
	background: transparent;
	appearance: none;
	-webkit-appearance: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 0;
	cursor: pointer;
}

.investor-circle::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background-image: url(/images/global.svg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	opacity: 0.5;
	transition: opacity var(--figma-duration) var(--figma-smart-easing);
}

.investor-btn:hover .investor-circle::before,
.investor-btn.active .investor-circle::before {
	opacity: 1;
}

.investor-btn .investor-circle:hover span,
.investor-btn.active span {
	font-weight: 600;
}

.investor-circle img {
	position: relative;
	z-index: 1;
	width: auto;
	height: clamp(40px, calc(var(--investor-circle-size) * 0.45), 67.5px);

}

.investor-btn:hover .investor-circle::before,
.investor-btn.active .investor-circle::before {
	opacity: 1;
}

.modal-choose-type {
	margin-top: var(--space-40) !important;
	margin-bottom: var(--space-40) !important;
}

@media (min-width: 992px) {
	.modal-choose-type {
		margin-top: clamp(24px, calc(var(--investor-circle-size) * 0.27), 40px) !important;
		margin-bottom: clamp(24px, calc(var(--investor-circle-size) * 0.27), 40px) !important;
	}

	#welcomeModal .modal-body.py-spacing {
		padding-top: clamp(32px, calc(20vh - 130px), 80px);
		padding-bottom: clamp(32px, calc(20vh - 130px), 80px);
	}

	/* Welcome + settings modal: same gaps, smaller on laptops */
	#welcomeModal .modal-choose-type .row.mt-4,
	#settingsModal .modal-choose-type .row.mt-4 {
		margin-top: var(--modal-gap) !important;
	}

	/* g-4 in the welcome modal adds 24px above the circles; the settings modal has none */
	#welcomeModal .modal-choose-type .row.g-4 {
		--bs-gutter-y: 0;
	}

	#welcomeModal .modal-body > .select-wrapper.mb-4,
	#settingsModal .modal-body > .select-wrapper.mb-4 {
		margin-bottom: var(--modal-gap) !important;
	}

	#settingsModal .modal-footer.mb-40 {
		margin-bottom: clamp(24px, calc(var(--investor-circle-size) * 0.27), 40px) !important;
	}
}


.select-wrapper {
	max-width: 504px;
	margin: 0 auto 1rem;
}

.select-wrapper label {
	display: block;
	text-align: left;
}

.form-select.country-select {
	padding-left: 34px;
	background-image: url('/images/Land-1.svg');
	background-repeat: no-repeat;
	background-position: 4px center;
	background-size: 22px 22px;
}

.form-select,
.form-control {
	font-family: var(--bs-font-sans-serif);
	font-size: var(--bs-body-font-size);
	font-weight: 600;
	line-height: var(--bs-body-line-height);
	color: var(--text-custom-gray) !important;
}

.hero-slide {
	/* fills the screen below the header, but never below 480px or above 683px */
	min-height: clamp(480px, calc(100svh - var(--header-height)), 683px);
	padding-top: clamp(32px, 6vh, 80px);
	padding-bottom: clamp(80px, 12vh, 140px);
	display: flex;
	align-items: center;
	background-size: cover;
	background-position: center 50% !important;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
}


.hero-slide .container {
	position: relative;
}

.hero-slide .hero-banner-nugget {
	position: absolute;
	bottom: -70px;
	z-index: 1;
	left: 66%;
	right: auto;
	/* width: clamp(420px, 40vw, 860px); */
	width: clamp(600px, 55vw, 1000px);
	height: auto;
}

@media (min-width: 1200px) {
	.hero-slide .hero-banner-nugget {
		bottom: -88px;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.hero-slide {
		min-height: clamp(460px, calc(100svh - var(--header-height)), 560px);
	}
}

@media (max-width: 767.98px) {
	.hero-slide .container {
		position: static;
	}

	.hero-slide {
		--nugget-h: 240px;
		padding-bottom: var(--nugget-h);
	}

	.hero-slide::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.25) 35%, rgba(0, 0, 0, 0.15) 60%, rgba(0, 0, 0, 0.45) 100%);
		z-index: 1;
		pointer-events: none;
	}

	.hero-slide .hero-banner-nugget {
		position: absolute;
		left: auto;
		right: 0;
		bottom: 0;
		width: 58vw;
		height: var(--nugget-h);
		object-fit: cover;
		object-position: left bottom;
		margin: 0;
		z-index: 1;
	}
}

@media (max-width: 575.98px) {
	.hero-slide .hero-banner-nugget {
		right: 0;
		left: auto;
		width: 85vw !important;
		object-position: left bottom;
		bottom: 0 !important;
	}
}

.hero-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(32px, 6vh, 80px);
	color: var(--color-white) !important;
}

.hero-slide .hero-content {
	position: relative;
	z-index: 2;
}

.hero-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(24px, 4vh, 64px);
}

.hero-copy {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.heroslide-1,
.product-banner-core {
	background-image: url('/images/EUWAX_Core_BG.webp');
}

.heroslide-2,
.product-banner-traceable {
	background-image: url('/images/EUWAX-Traceable_BG.webp');
}

.heroslide-3,
.product-banner-gold2 {
	background-image: url('/images/EUWAX-II_BG.webp');
}

.heroslide-4,
.product-banner-silver {
	background-image: url('/images/EUWAX_Core_BG.webp');
}

.text-box {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.btn-gold,
.btn-secondary,
.btn-outline-secondary,
.btn-buy,
.btn-silver,
.btn-outline-light {
	font-family: var(--btn-font-family);
	font-weight: var(--btn-font-weight);
	font-size: var(--btn-font-size);
	line-height: var(--btn-line-height);
	width: auto;
	min-width: var(--btn-width-min);
	max-width: var(--btn-width-max);
	height: var(--btn-height);
	padding: var(--btn-padding);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border-radius: var(--bs-border-radius);
	text-decoration: none;
	opacity: 1;
	cursor: pointer;
	transition: var(--btn-transition);
}

.btn-gold:disabled,
.btn-gold.disabled,
.btn-secondary:disabled,
.btn-secondary.disabled,
.btn-buy:disabled,
.btn-buy.disabled,
.btn-silver:disabled,
.btn-silver.disabled,
.btn-outline-light:disabled,
.btn-outline-light.disabled {
	opacity: 0.6;
	cursor: not-allowed;
	pointer-events: none;
}

.btn-gold {
	position: relative;
	overflow: hidden;
	background: linear-gradient(266.86deg,
			#9B7D39 0%,
			#D2B675 23.56%,
			#F2D899 50.43%,
			#CBB06E 74.04%,
			#9B7D39 100%);
	color: var(--bs-primary);
	border: 0;
	z-index: 1;
}

.btn-gold::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(271.93deg,
			#9B7D39 -15.88%,
			#D2B675 5.5%,
			#F2D899 40.48%,
			#CBB06E 89.7%,
			#9B7D39 118.85%);
	opacity: 0;
	transition: opacity var(--figma-duration) var(--figma-smart-easing);
	z-index: -1;
}

.btn-gold:hover::before {
	opacity: 1;
}

.btn-gold:hover {
	color: var(--bs-primary);
}

.btn-gold:disabled:hover,
.btn-gold.disabled:hover {
	background: linear-gradient(266.86deg, #9B7D39 0%, #D2B675 23.56%, #F2D899 50.43%, #CBB06E 74.04%, #9B7D39 100%);
}

.btn-gold:active {
	background: linear-gradient(271.93deg,
			#9B7D39 -15.88%,
			#D2B675 5.5%,
			#F2D899 40.48%,
			#CBB06E 89.7%,
			#9B7D39 118.85%) !important;
	color: var(--bs-primary) !important;
}

.btn-secondary {
	background: var(--bs-primary);
	color: var(--color-white);
	border: 1px solid var(--bs-primary);
}

.btn-secondary:hover {
	background: var(--bs-primary);
	border-color: var(--bs-primary);
}

.btn-secondary:focus {
	outline: none;
}

.btn-outline-secondary {
	background: transparent;
	color: var(--bs-primary);
	border: 1px solid var(--bs-primary);
}

.btn-outline-secondary:hover {
	background: var(--bs-primary);
	color: var(--color-white);
	border-color: var(--bs-primary);
}

.btn-outline-secondary:disabled,
.btn-outline-secondary.disabled {
	opacity: 0.5;
}

.btn-outline-secondary:disabled:hover,
.btn-outline-secondary.disabled:hover {
	background: transparent;
	color: var(--bs-primary);
	border-color: var(--bs-primary);
}

.btn-buy {
	background: #05AA4A;
	color: var(--color-white);
	border: 1px solid #ffffff;
}

.btn-buy:hover {
	background: #DDF2DD;
	color: #05AA4A;
	border: 1px solid #05AA4A;
}

.btn-silver {
	position: relative;
	overflow: hidden;
	isolation: isolate;

	background: linear-gradient(267.25deg,
			rgba(123, 132, 142, 0.937255) 0.13%,
			#98A0A9 12.12%,
			#E4E8EC 47.6%,
			#98A0A9 87.88%,
			#7B848E 99.87%);

	color: var(--bs-primary);
	border: 1px solid transparent;
}

.btn-silver:hover {
	color: var(--bs-primary);
}

.btn-silver::before {
	content: "";
	position: absolute;
	inset: 0;

	background: linear-gradient(272.17deg,
			rgba(123, 132, 142, 0.937255) -15.32%,
			#98A0A9 0.68%,
			#E4E8EC 48.04%,
			#98A0A9 101.79%,
			#7B848E 117.79%);

	opacity: 0;
	transition: opacity var(--figma-duration) var(--figma-smart-easing);
	z-index: -1;
}

.btn-silver:hover::before {
	opacity: 1;
}

.btn-outline-light:hover {
	background: var(--color-white);
	color: var(--bs-primary);
	border-color: var(--color-white);
}

.btn-chart {
	width: 56px;
	min-width: 56px;
	height: 34px;
	padding: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--btn-font-family);
	font-weight: var(--btn-font-weight);
	font-size: 14px;
	line-height: 18px;
	text-align: center;
	background-color: transparent;
	border: 1px solid var(--chart-color);
	color: var(--chart-color);
	border-radius: var(--bs-border-radius);
	opacity: 1;
	cursor: pointer;
	transition: var(--btn-transition);
	text-decoration: none !important;
}

.btn-chart:hover {
	opacity: 0.60;
	color: var(--color-white);
	border-color: var(--chart-color);
	background-color: var(--chart-color);
}

.btn-chart.active,
.btn-chart:active {
	background-color: var(--chart-color) !important;
	border-color: var(--chart-color) !important;
	color: var(--color-white) !important;
}

.chartimage {
	width: 100%;
}

.carousel-indicators {
	margin-bottom: var(--slider-controls-bottom);
}

.hero-slider {
	position: relative;
}

.hero-slider .carousel-control-prev,
.hero-slider .carousel-control-next {
	position: absolute;
	z-index: 5;
	width: 44px;
	height: 44px;
}

.hero-slider .carousel-control-prev-icon,
.hero-slider .carousel-control-next-icon {
	width: 24px;
	height: 24px;
	background-size: 24px 24px;
}

@media (max-width: 1399.98px) {

	.hero-slider .carousel-control-prev,
	.hero-slider .carousel-control-next {
		top: auto;
		bottom: var(--slider-controls-bottom);
		transform: none;
		align-items: end !important;
		justify-content: center;
	}

	.hero-slider .carousel-control-prev {
		left: 12px;
		right: auto;
	}

	.hero-slider .carousel-control-next {
		right: 12px;
		left: auto;
	}
}


@media (min-width: 1400px) and (max-width: 1599.98px) {

	.hero-slider .carousel-control-prev,
	.hero-slider .carousel-control-next {
		top: 50%;
		bottom: auto;
		transform: translateY(-50%);
	}

	.hero-slider .carousel-control-prev {
		left: 12px;
	}

	.hero-slider .carousel-control-next {
		right: 12px;
	}
}

@media (min-width: 1600px) {

	.hero-slider .carousel-control-prev,
	.hero-slider .carousel-control-next {
		top: 50%;
		bottom: auto;
		transform: translateY(-50%);
		width: 60px;
		height: 60px;
	}

	.hero-slider .carousel-control-prev {
		left: calc((100% - 1600px) / 2);
	}

	.hero-slider .carousel-control-next {
		right: calc((100% - 1600px) / 2);
	}
}

.carousel-indicators [data-bs-target] {
	width: 12px;
	height: 12px;
	border-radius: 50%;
}

.product-section,
.py-spacing {
	padding-top: 80px;
	padding-bottom: 80px;
}

.px-48 {
	padding-left: 48px;
	padding-right: 48px;
}

.gold-tabs {
	border-bottom: 1.5px solid #c7c6c6;
}

.gold-tabs .nav-link {
	border: none;
	background: transparent;
	color: var(--text-muted-gray);
	padding: 10px 0;
}

.gold-tabs .nav-link.active {
	color: var(--bs-primary);
	border-bottom: 2px solid var(--bs-primary);
}

.card {
	--bs-card-spacer-y: 2rem !important;
	--bs-card-spacer-x: 2rem !important;
	border: 0 !important;
}

.gold-card {
	position: relative;
	width: 100%;
	height: 470px !important;
	min-height: 470px;
	border: none;
	overflow: hidden;
	cursor: pointer;
	background-color: var(--bs-primary);
	display: flex;
	flex-direction: column;
}

.gold-card .card-visual {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	height: 270px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
	transition: height var(--figma-duration) var(--figma-smart-easing);
}

.gold-card .card-visual img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center bottom;
	transition: transform var(--figma-duration) var(--figma-smart-easing);
}

.gold-card .card-body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	background-color: var(--bs-primary);
	color: var(--color-white);
	padding: 32px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	transition: background-color var(--figma-duration) var(--figma-smart-easing),
		color var(--figma-duration) var(--figma-smart-easing);
}

.gold-card:hover .card-body,
.gold-card:focus-within .card-body {
	background-color: #f2f2f2;
	color: #111111;
}

.gold-card .extra-text {
	max-height: 0;
	opacity: 0;
	margin-top: 8px;
	overflow: hidden;
	transform: translateY(10px);
	transition:
		max-height var(--figma-duration) var(--figma-smart-easing),
		opacity var(--figma-duration) var(--figma-smart-easing),
		transform var(--figma-duration) var(--figma-smart-easing);
}

@media (min-width: 1200px) and (hover: hover) and (pointer: fine) {

	.gold-card:hover .card-visual img,
	.gold-card:focus-within .card-visual img {
		transform: translateY(-25px) scale(0.97);
	}
}

@media (hover: hover) and (pointer: fine) {

	.gold-card:hover .extra-text,
	.gold-card:focus-within .extra-text {
		max-height: 240px;
		opacity: 1;
		transform: translateY(0);
	}
}

.gold-card .wkn-row,
.silver-card .wkn-row {
	display: flex;
	align-items: center;
	gap: .5rem;
	margin-top: 16px;
}

.gold-card .wkn-label,
.silver-card .wkn-label {
	color: rgba(255, 255, 255, 1);
	font-size: var(--fs-body-standard);
	line-height: var(--lh-body-standard);
	font-weight: 400;
	transition: color var(--figma-duration) var(--figma-smart-easing);
}

.gold-card:hover .wkn-label,
.gold-card:focus-within .wkn-label,
.silver-card:hover .wkn-label,
.silver-card:focus-within .wkn-label {
	color: #000000;
}

.gold-card .copy-btn,
.silver-card .copy-btn {
	background: transparent;
	border: none;
	padding: 2px;
	line-height: 0;
	color: var(--color-white);
	cursor: pointer;
	transition: color var(--figma-duration) var(--figma-smart-easing);
}

.gold-card .copy-btn:hover,
.silver-card .copy-btn:hover {
	color: var(--color-white);
}

.gold-card:hover .copy-btn,
.gold-card:focus-within .copy-btn,
.silver-card:hover .copy-btn,
.silver-card:focus-within .copy-btn {
	color: #000000;
}

.gold-card:hover .copy-btn:hover,
.silver-card:hover .copy-btn:hover {
	color: #000000;
}

/* Visual Background Gradients */
.bg-gradient-core {
	background: radial-gradient(103.09% 103.09% at 29.9% 2.58%, #1D4D63 0%, #000000 100%);
}

.bg-gradient-traceable {
	background: radial-gradient(103.09% 103.09% at 29.9% 2.58%, #215D3B 0%, #000000 100%);
}

.bg-gradient-2 {
	background: radial-gradient(103.09% 103.09% at 29.9% 2.58%, #65257D 0%, #000000 100%);
}

.bg-gradient-silver {
	background: radial-gradient(103.09% 103.09% at 29.9% 2.58%, #1D4D63 0%, #000000 100%);

}

.bg-product-gradient {
	background: radial-gradient(117.49% 113.26% at 27.01% 0%, #215D3B 0%, rgba(0, 0, 0, 0) 100%),
		radial-gradient(95.32% 95.32% at -4.09% 44.05%, #1D4D63 0%, rgba(59, 156, 201, 0) 100%),
		radial-gradient(197.25% 523.62% at 73.4% -52.34%, #65257D 24.98%, rgba(0, 0, 0, 0) 100%),
		radial-gradient(109.65% 162.57% at 15.76% -18.42%, rgba(0, 0, 0, 0) 11.54%, #000000 70.19%);
}


/* CORE */
body.page-core {
	--product-primary: #1D4D63;
	--product-text: #1D4D63;

	--chart-color: #1D4D63;
	--banner-details-bg: #1D4D63;

	--product-gradient:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#1D4D63 0%,
			#000000 100%);

	--card-bg:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#1D4D63 0%,
			#000000 100%);
}

/* TRACEABLE */
body.page-traceable {

	--product-primary: #215D3B;
	--product-text: #215D3B;

	--chart-color: #215D3B;
	--banner-details-bg: #215D3B;

	--product-gradient:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#215D3B 0%,
			#000000 100%);

	--card-bg:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#215D3B 0%,
			#000000 100%);
}

/* GOLD 2 */
body.page-gold2 {

	--product-primary: #65257D;
	--product-text: #65257D;
	--chart-color: #65257D;
	--product-gradient:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#65257D 0%,
			#000000 100%);

	--card-bg:
		radial-gradient(103.09% 103.09% at 29.9% 2.58%,
			#65257D 0%,
			#000000 100%);
	--banner-details-bg: #65257D;
}

body[class*="page-"] .page-wrapper {
	background-repeat: no-repeat;
	background-position: left;
	background-size: cover;
	background-attachment: fixed;
}

/* Page-specific images */

body.page-default .page-wrapper {
	background-color: #ffffff;
}

body.page-global .page-wrapper {
	background-image: url('/images/global.svg');
}

body.page-core .page-wrapper {
	background-image: url('/images/Core-gradient.svg');
}

body.page-traceable .page-wrapper {
	background-image: url('/images/Traceable-gradient.svg');
}

body.page-gold2 .page-wrapper {
	background-image: url('/images/II-gradient.svg');
}

.card-bg {
	background-image: var(--card-bg);
	background-repeat: no-repeat;
	background-position: center right;
	background-size: cover;
}

body.page-global .card-bg {
	--card-bg: url('/images/global.svg');
}


.bg-gradient-white {
	background: linear-gradient(0deg, #ffffff, #ffffff),
		linear-gradient(180deg, #ffffff 56.25%, rgba(255, 255, 255, 0.3) 100%);
}

.smart-animate {
	transition:
		opacity var(--figma-duration) var(--figma-smart-easing),
		transform var(--figma-duration) var(--figma-smart-easing),
		grid-template-rows var(--figma-duration) var(--figma-smart-easing),
		visibility var(--figma-duration) var(--figma-smart-easing) !important;
}

.main-navbar .navbar-toggler {
	border: none;
	padding: 0;
	box-shadow: none !important;
}

.main-navbar .navbar-toggler-icon {
	background-image: none !important;
	position: relative;
	height: 2px;
	background: #ffffff;
}

.main-navbar .navbar-toggler-icon::before,
.main-navbar .navbar-toggler-icon::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	background: #ffffff;
	left: 0;
	transition: transform var(--figma-duration) var(--figma-smart-easing), top var(--figma-duration) var(--figma-smart-easing);
}

.main-navbar .navbar-toggler-icon::before {
	top: -8px;
}

.main-navbar .navbar-toggler-icon::after {
	top: 8px;
}

/* Morphing state to X */
.main-navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
	background: transparent !important;
}

.main-navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
	top: 0;
	transform: rotate(45deg);
}

.main-navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
	top: 0;
	transform: rotate(-45deg);
}

.main-navbar .dropdown-toggle::after {
	border: none !important;
	margin-left: 3px !important;
	vertical-align: middle !important;
	display: inline-block;
	width: 10px;
	height: 6px;
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7' fill='none'%3E%3Cpath d='M1 1L6 6L11 1' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	transition: transform var(--figma-duration) var(--figma-smart-easing);
}

.main-navbar .dropdown-toggle[aria-expanded="true"]::after {
	transform: rotate(180deg) !important;
}

.main-navbar .dropdown-toggle:hover::after,
.main-navbar .dropdown-toggle.active::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 7' fill='none'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Dropdown item active/hover state: vertical bar accent (Figma NavItem/Menu/Desktop) */
.main-products-group .custom-dropdown-item,
.utility-products-group .highlight-link,
.extra-products-group .highlight-link,
.sub-dropdown-collapse .sub-item {
	position: relative;
	padding-left: 8px;
}

.main-products-group .custom-dropdown-item::before,
.utility-products-group .highlight-link::before,
.extra-products-group .highlight-link::before,
.sub-dropdown-collapse .sub-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1.5px;
	height: 16px;
	background-color: rgba(255, 255, 255, 1);
	opacity: 0;
	transition: opacity var(--figma-duration) var(--figma-smart-easing);
}

.main-products-group .custom-dropdown-item:hover::before,
.main-products-group .custom-dropdown-item.active::before,
.utility-products-group .highlight-link:hover::before,
.utility-products-group .highlight-link.active::before,
.extra-products-group .highlight-link:hover::before,
.extra-products-group .highlight-link.active::before,
.extra-products-group .highlight-link[aria-expanded="true"]::before,
.sub-dropdown-collapse .sub-item:hover::before,
.sub-dropdown-collapse .sub-item.active::before {
	opacity: 1;
}

.extra-products-group .sub-dropdown-collapse {
	padding-left: 8px;
}


.dropdown-header-title {
	padding-left: 8px;
}

@media (min-width: 1200px) {
	.container {
		max-width: 1200px;
	}

	#welcomeModal .modal-dialog.modal-lg,
	#welcomeModal .modal-dialog.modal-xl {
		--bs-modal-width: 900px !important;
	}

	#settingsModal .modal-dialog {
		--bs-modal-width: 600px !important;
	}

	.gold-card {
		width: 383px;
	}

}

.custom-gap {
	display: flex;
	flex-direction: column;
	gap: 64px;
}

.etc-item {
	display: flex;
	flex-direction: column;
	height: 100%;
	gap: 16px;
}

.etc-number {
	margin: 0;
	color: var(--theme-accent);
}

.theme-gold.etc-section .etc-number {
	background: var(--gold-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.theme-silver.etc-section .etc-number {
	background: var(--silver-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.etc-line {
	width: 100%;
	height: 1.5px;
	background: var(--color-white);
	margin-bottom: 0;
}

.etc-title {
	color: var(--color-white);
	margin-bottom: 0;
}

.etc-item p {
	margin: 0;
	color: var(--color-white);
}

.word-break {
	word-break: break-word;
	hyphens: auto;
}


@media (max-width: 991.98px) {

	.etc-item {
		margin-bottom: 24px;
	}
}

.custom-textbox-group,
.custom-icon-grid-wrapper {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.custom-grid-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	height: 100%;
}

/* "Warum in ETCs investieren?": room for two heading lines, so all texts start at the same height */
@media (min-width: 768px) {
	.custom-grid-card h4 {
		min-height: calc(2 * var(--lh-h5));
	}
}

#steps-section-mobile {
	background: transparent;
}

.accordion {
	display: flex;
	flex-direction: column;
	gap: 24px;
	background: transparent;
	--bs-accordion-btn-focus-box-shadow: none;
	--bs-accordion-btn-focus-border-color: transparent;
}

.accordion-item {
	background-color: transparent !important;
	border: none;
	box-shadow: none;
}

.accordion-button {
	background-color: transparent !important;
	box-shadow: none;
	position: relative;
	padding-bottom: 0;
	font-weight: 600;
}

.accordion-button:not(.collapsed) {
	background-color: transparent !important;
	box-shadow: none;
}

.title-content {
	margin-bottom: 48px;
}

#steps-section-mobile .accordion-button::after {
	position: absolute;
	right: 0;
	bottom: 8px;
	margin-left: auto;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

#steps-section-mobile .accordion-button:not(.collapsed)::after {
	transform: rotate(-180deg);
}


#steps-section-desktop .custom-timeline-line::before {
	content: "";
	position: absolute;
	left: 12px;
	right: 12px;
	top: 68px;
	height: 1.5px;
	background-color: var(--color-white);
	z-index: 1;
}

#steps-section-desktop .custom-tab-btn {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	text-align: left;
	width: 100%;
}

#steps-section-desktop .custom-textbox {
	padding-top: 24px;
	position: relative;
	z-index: 2;
	white-space: normal;
	word-wrap: break-word;
	hyphens: auto;
}

#steps-section-desktop .custom-tab-btn .step-num,
#steps-section-desktop .custom-tab-btn .step-title {
	color: var(--text-muted-gray);
	transition: color var(--figma-duration) var(--figma-smart-easing);
}

#steps-section-desktop .custom-tab-btn:hover .step-num,
#steps-section-desktop .custom-tab-btn:hover .step-title,
#steps-section-desktop .custom-tab-btn.active .step-num,
#steps-section-desktop .custom-tab-btn.active .step-title {
	color: var(--color-white);
}

#steps-section-desktop #myTab {
	align-items: flex-start;
}

#steps-section-desktop .tab-pane {
	max-height: 0;
	opacity: 0;
	transform: translateY(6px);
	overflow: hidden;
	margin-top: 0;
	transition:
		max-height var(--figma-duration) var(--figma-smart-easing),
		opacity var(--figma-duration) var(--figma-smart-easing),
		transform var(--figma-duration) var(--figma-smart-easing),
		margin-top var(--figma-duration) var(--figma-smart-easing);
}

#steps-section-desktop .tab-pane.show.active {
	opacity: 1;
	transform: translateY(0);
	margin-top: 16px;
}

@media(max-width: 1199.98px) {
	#steps-section-desktop .custom-timeline-line::before {
		top: 36px;
	}
}

.faq-card {
	width: 100%;
	height: 364px;
}

/* === Scroll reveal base === */
.reveal {
	opacity: 0;
	transform: translateY(24px);
	transition:
		opacity var(--figma-duration) var(--figma-smart-easing),
		transform var(--figma-duration) var(--figma-smart-easing);
	will-change: opacity, transform;
}

.reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.reveal[data-delay="1"] {
	transition-delay: 0.05s;
}

.reveal[data-delay="2"] {
	transition-delay: 0.15s;
}

.reveal[data-delay="3"] {
	transition-delay: 0.25s;
}

.reveal[data-delay="4"] {
	transition-delay: 0.35s;
}

.reveal[data-delay="5"] {
	transition-delay: 0.45s;
}

.reveal[data-delay="6"] {
	transition-delay: 0.55s;
}

.reveal[data-delay="7"] {
	transition-delay: 0.65s;
}

.reveal[data-delay="8"] {
	transition-delay: 0.75s;
}

.reveal[data-delay="9"] {
	transition-delay: 0.85s;
}

.reveal[data-delay="10"] {
	transition-delay: 0.95s;
}


.icon-circle {
	position: relative;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url('/images/global.svg');
	background-repeat: no-repeat;
	background-position: center right;
	background-size: cover;
}

.footer-nav-gap {
	gap: 32px;
}
.flag-select {
  position: relative;
}
.flag-select .form-select {
  padding-left: 34px; 
}
.flag-circle {
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  pointer-events: none; /* clicks go through to the select */
  z-index: 2;
  background-size: cover;
  background-position: center;
}
/* Germany: black / red / gold */
.flag-de {
  background: linear-gradient(to bottom,
    #000 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%);
}
/* United Kingdom (simplified) */
.flag-en {
  background:
    linear-gradient(#c8102e, #c8102e) center / 100% 20% no-repeat,
    linear-gradient(#c8102e, #c8102e) center / 20% 100% no-repeat,
    linear-gradient(#fff, #fff) center / 100% 40% no-repeat,
    linear-gradient(#fff, #fff) center / 40% 100% no-repeat,
    #012169;
}
@media (max-width: 767.98px) {
	#etc-benefits .row .col-12 {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.custom-grid-card {
		align-items: center;
		text-align: center;
	}

	.custom-gap {
		gap: 40px;
	}

}

.table {
	border-collapse: collapse;
	width: 100%;
	--bs-table-striped-bg: var(--bs-primary-bg-subtle) !important;
}

.table th,
.table td {
	/* (59px - 24px line-height) / 2 = 17.5px */
	padding: clamp(10px, 2vh, 17.5px) clamp(12px, 1.6vw, 24px);
	vertical-align: middle;
	text-align: left;
	border-bottom: 0 !important;
}

.product-table .table thead th {
	border-bottom: 2px solid var(--bs-primary-bg-subtle);
	background-color: var(--color-white);
}

.product-table .table-striped>tbody>tr:nth-of-type(odd)>* {
	background-color: var(--bs-primary-bg-subtle);
	--bs-table-bg-type: var(--bs-primary-bg-subtle);
}

.product-table .table-striped>tbody>tr:nth-of-type(even)>* {
	background-color: var(--color-white);
	--bs-table-bg-type: var(--color-white);
}

.product-table th:first-child {
	font-weight: 600;
	width: 25%;
}

.product-table td {
	width: 25%;
}

.product-table td a {
	text-decoration: none;
	color: inherit;
}

.product-table td a:hover {
	text-decoration: underline;
}

.category-header {
	background: var(--bs-primary-bg-subtle);
	padding: 16px 10px;
	margin-top: 24px;
	margin-bottom: 18px;
	font-weight: 600;
}

.mobile-products {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.mobile-products::-webkit-scrollbar {
	display: none;
}

.mobile-products .d-flex {
	min-width: max-content;
}

.product-col {
	width: 230px;
	padding-right: 24px;
	padding-left: 10px;
}

.product-col img {
	height: auto;
	display: block;
}

.product-col a {
	color: inherit;
	text-decoration: none;
}

.product-col a:hover {
	text-decoration: underline;
}

.text-pic-overlay {
	position: relative;
	background-color: var(--bs-primary);
	overflow: hidden;
	isolation: isolate;
	--container-max-width: 1440px;
}

.text-pic-overlay::before,
.text-pic-overlay::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: max(0px, calc((100vw - var(--container-max-width)) / 2));
	width: min(100%, 900px);
}

.text-pic-overlay::before {
	z-index: 0;
	background-image: url("/images/gold-bg-product.svg");
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: 90% auto;
	opacity: 1; /* full brightness, no filter */
}

.text-pic-overlay::after {
	z-index: 1;
	background:
		/* dark behind the text, fades out toward the nuggets */
		linear-gradient(90deg,
			var(--bs-primary) 0%,
			rgba(7, 7, 7, .85) 30%,
			rgba(7, 7, 7, .45) 55%,
			rgba(7, 7, 7, 0) 80%),
		/* short fade at the top only, hides the image edge */
		linear-gradient(180deg,
			var(--bs-primary) 0%,
			rgba(7, 7, 7, 0) 40%);
}

.text-pic-overlay .container {
	position: relative;
	z-index: 2;
}

.list-stack {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.list-item {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-left: 20px;
	border-left-width: 1.5px;
	border-left-style: solid;
	border-left-color: var(--hairline);
}

.label-text,
.tax-price,
.sub-label {
	margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
	.text-pic-overlay::before {
		background-position: center bottom;
		background-size: 140% auto;
	}

	.text-pic-overlay::after {
		background:
			linear-gradient(180deg, var(--bs-primary) 0%, rgba(7, 7, 7, .55) 40%, rgba(7, 7, 7, .85) 70%, var(--bs-primary) 100%);
	}

	.list-stack {
		gap: 40px;
	}
}

.product-page .product-banner {
	background-size: cover;
	background-position: center 50% !important;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
	min-height: clamp(420px, calc(100svh - var(--header-height)), 595px);
}

.product-page .product-banner .container {
	position: relative;
}


.product-page .product-banner-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 64px;
	position: relative;
	z-index: 2;
}

.product-banner-nugget {
	position: absolute;
	bottom: 0;
	z-index: 1;
	left: 66%;
	right: auto;
	/* width: clamp(420px, 40vw, 860px); */
	width: clamp(600px, 55vw, 1000px);
	height: auto;
	bottom: -70px;
}

@media (min-width: 1200px) {
	.product-banner-nugget {
		bottom: -70px;
	}
	.main-footer{
		height: 88px;
	}
	.footer-bottom{
		height: 48px;
	}
}

@media (max-width: 767.98px) {
	.product-page .product-banner .container {
		position: static;
	}

	.product-page .product-banner {
		--nugget-h: 240px;
		padding-bottom: var(--nugget-h);
	}

	.product-banner::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.25) 35%, rgba(0, 0, 0, 0.15) 60%, rgba(0, 0, 0, 0.45) 100%);
		z-index: 1;
		pointer-events: none;
	}

	.product-page .product-banner-nugget {
		position: absolute;
		left: auto;
		right: 0;
		bottom: 0;
		width: 58vw;
		height: var(--nugget-h);
		object-fit: cover;
		object-position: left bottom;
		margin: 0;
		z-index: 1;
	}
	
}

@media (max-width: 575.98px) {
	.product-banner {
		--nugget-h: 200px;
	}

	.product-banner-nugget {
		right: 0;
		left: auto;
		width: 85vw !important;
		object-position: left bottom;
		bottom: 0 !important;
	}
}

.product-page .product-main {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.product-page .banner-details {
	background-color: var(--banner-details-bg);
	height: 151px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.product-page .banner-details p{
	margin-bottom: 0 !important;
}

.product-page .count-up {
	display: inline-block;
	min-width: 7ch;
	text-align: right;
}

.grid-cell-inner .cell-title,
.grid-cell-inner .cell-value {
	font-weight: 600 !important;
}

#downloads .form-control:focus,
#downloads .form-select:focus {
	border-color: var(--text-custom-gray);
	box-shadow: none;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus {
	border-color: var(--text-custom-gray);
	box-shadow: none;
	outline: none;
}

.filter-label {
	color: var(--text-custom-gray);
	margin-bottom: 8px;
	display: block;
}

.filter-chip {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--bs-primary-bg-subtle);
	padding: 8px;
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	margin-left: 8px;
}

.filter-chip button {
	border: none;
	background: transparent;
	padding: 0;
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
}

.reset-link {
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	color: var(--text-custom-gray);
	text-decoration: none;
	cursor: pointer;
	background: none;
	border: none;
}

.reset-link:hover {
	color: var(--bs-primary);
}

.results-count {
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	color: var(--text-custom-gray);
}

.btn-sort {
	min-width: 100px;
	height: 25px;
	border: 1px solid var(--bs-primary-bg-subtle);
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-primary);
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	font-weight: 400;
	transition: var(--btn-transition);
}

.btn-sort.active,
.btn-sort:hover {
	background: var(--bs-primary);
	color: var(--color-white);
	border-color: var(--bs-primary);
}

#downloads-table table>thead th {
	padding: clamp(10px, 2vh, 20px) clamp(12px, 1.6vw, 20px) clamp(6px, 1vh, 10px) clamp(12px, 1.6vw, 20px) !important;
	border-bottom: 1.5px solid var(--bs-body-color) !important;
	font-weight: 400 !important;
}

#downloads-table .table-striped>tbody>tr:nth-of-type(even)>* {
	background-color: var(--bs-primary-bg-subtle);
	--bs-table-bg-type: var(--bs-primary-bg-subtle);
}

#downloads-table .table-striped>tbody>tr:nth-of-type(odd)>* {
	background-color: var(--color-white);
	--bs-table-bg-type: var(--color-white);
}

#downloads-table table td.doc-label {
	font-weight: 600;
}

.product-dot {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--gold-gradient);
	margin-right: 8px;
	vertical-align: middle;
}

.product-cell {
	white-space: nowrap;
}

.btn-download {
	width: 150px;
	height: clamp(44px, 7vh, 59px);
	max-width: 150px;
	border: 1px solid var(--bs-primary);
	background: #fff;
	color: var(--bs-body-color);
	font-size: var(--fs-body-small);
	line-height: var(--lh-body-small);
	font-weight: 600;
	padding: 12px 20px;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	opacity: 1;
	text-decoration: none;
	white-space: nowrap;
	box-sizing: border-box;
	transition: var(--btn-transition);
}

.btn-download-sm {
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1.5px solid var(--bs-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--bs-primary);
	flex-shrink: 0;
	text-decoration: none;
	transition: var(--btn-transition);
}

.btn-download .size {
	color: var(--text-custom-gray);
	font-weight: 400;
}

.btn-download:hover,
.btn-download-sm:hover {
	background: var(--bs-primary);
	color: var(--color-white);
	border-color: var(--bs-primary);
}

.doc-card:nth-child(odd) {
	background: var(--bs-primary-bg-subtle);
}

.no-results {
	padding: 3rem 1rem;
	text-align: center;
	display: none;
}

#faqs .dropdown-item.active,
.dropdown-item:active {
	color: inherit;
	text-decoration: none;
	background-color: transparent !important;
}

#contactForm .form-wrapper .form-group+.form-group {
	margin-top: 24px;
}

#contactForm .form-group .form-label {
	color: var(--text-custom-gray) !important;
}

.disclaimer-scroll {
	max-height: 150px;
	overflow-y: auto;

	scrollbar-width: thin;
	scrollbar-color: #adb5bd transparent;
}

.disclaimer-scroll::-webkit-scrollbar {
	width: 5px;
}

.disclaimer-scroll::-webkit-scrollbar-track {
	background: transparent;
}

.disclaimer-scroll::-webkit-scrollbar-thumb {
	background-color: #adb5bd;
	border-radius: 10px;
}

.disclaimer-scroll::-webkit-scrollbar-thumb:hover {
	background-color: #6c757d;
}

@media(min-width: 992px) {
	.main-navbar .navbar-nav {
		gap: 32px;
		padding-top: 0;
	}

	.custom-dropdown-menu {
		border: none !important;
		margin-top: 40px !important;
		width: 481px;
		/* height: 230px; */
		padding: 32px !important;
		background: linear-gradient(180deg, #070707 0%, rgba(24, 24, 24, 0.7) 75.48%, rgba(7, 7, 7, 0.6) 100%);
		backdrop-filter: blur(32.5px);
		left: auto !important;
		right: auto !important;
		transform: translateX(-22%) !important;
		max-height: calc(100dvh - var(--header-height) - 16px);
		overflow-y: auto;
		overscroll-behavior: contain;      /* wheel never scrolls the page behind */
		scrollbar-width: thin;
		scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
	}

	.animate-dropdown .custom-dropdown-menu {
		display: block !important;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-10px);
		pointer-events: none;
		transition:
			opacity var(--figma-duration) var(--figma-smart-easing),
			transform var(--figma-duration) var(--figma-smart-easing),
			visibility 0s linear var(--figma-duration);
	}

	.animate-dropdown:hover .custom-dropdown-menu,
	.animate-dropdown:focus-within .custom-dropdown-menu,
	.animate-dropdown .custom-dropdown-menu:hover,
	.custom-dropdown-menu.show {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
		transition-delay: 0s;
	}

	.custom-dropdown-menu.show {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
	}

	.dropdown-columns-wrapper {
		display: flex;
		flex-direction: row;
		gap: 32px;
		height: 100%;
	}

	.dropdown-col {
		width: 192.5px;
		display: flex;
		flex-direction: column;
		gap: 24px;
	}

	.dropdown-links-list {
		display: flex !important;
		flex-direction: column !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.dropdown-links-list.main-products-group {
		gap: 24px;
	}

	.main-products-group .custom-dropdown-item {
		color: var(--color-white);
		font-weight: 600;
		text-decoration: none;
	}

	.utility-products-group .highlight-link,
	.extra-products-group .highlight-link {
		font-size: var(--fs-body-small);
		font-weight: 600;
		color: var(--color-white) !important;
		text-decoration: none !important;
		line-height: var(--lh-body-small);
	}


	.main-navbar .nav-link.active,
	.main-navbar .nav-link:hover {
		border-bottom: 1.5px solid var(--color-white) !important;
		color: var(--color-white) !important;
	}

	/* .main-navbar .custom-dropdown-item.active,
	.main-navbar .sub-item.active {
		border-bottom: 1.5px solid var(--color-white) !important;
		color: var(--color-white) !important;
	} */

	.sub-dropdown-collapse ul.dropdown-links-list {
		gap: 16px;
		margin-top: 16px !important;
	}

	.sub-dropdown-collapse .sub-item {
		font-size: var(--fs-body-small);
		font-weight: 400;
		color: var(--color-white) !important;
		text-decoration: none !important;
		line-height: var(--lh-body-small);
	}

	.silver-card {
		position: relative;
		width: 100%;
		height: 470px;
		overflow: hidden;
		border: none;
		border-radius: 0;
		cursor: pointer;
	}

	.silver-card-image {
		position: absolute;
		inset: 0;
	}

	.silver-card-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.silver-card .card-body {
		position: absolute;
		left: 0;
		top: 0;
		width: 400px;
		height: 100%;
		padding: 32px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		color: var(--color-white);
		z-index: 2;
		overflow: hidden;
		transition: color var(--figma-duration) var(--figma-smart-easing);
	}

	.silver-card .extra-text {
		max-height: 0;
		opacity: 0;
		overflow: hidden;
		transform: translateY(10px);
		transition: max-height var(--figma-duration) var(--figma-smart-easing),
			opacity var(--figma-duration) var(--figma-smart-easing),
			transform var(--figma-duration) var(--figma-smart-easing);
	}

	.silver-card .extra-text p {
		margin: 0;
	}

	.gold-card .card-body::before,
	.silver-card .card-body::before {
		content: "";
		position: absolute;
		inset: 0;
		background: var(--bs-primary-bg-subtle);
		transform: translateX(-100%);
		transition: transform var(--figma-duration) var(--figma-smart-easing);
		z-index: -1;
	}

	.silver-card:hover .card-body::before {
		transform: translateX(0);
	}

	.silver-card:hover .extra-text {
		max-height: 200px;
		opacity: 1;
		transform: translateY(0);
	}

	.silver-card:hover .card-body {
		color: #111;
	}

	.border-start-custom {
		border-left: 1px solid var(--text-muted-gray);
		padding-left: 24px !important;
		height: 100%;
	}

	.gap-40 {
		gap: clamp(25px, calc(var(--investor-circle-size) * 0.27), 40px) !important;
	}


}

@media (max-width: 991.98px) {
	.main-navbar .navbar-nav {
		gap: 16px;
		padding-top: 16px;
	}

	.main-navbar .navbar-nav .nav-link.dropdown-toggle {
		padding-left: 8px !important;
	}

	.main-navbar .navbar-nav .nav-link:not(.dropdown-toggle) {
		position: relative;
		padding-left: 8px !important;
	}

	.main-navbar .navbar-nav .nav-link:not(.dropdown-toggle)::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		margin: auto 0;
		width: 1.5px;
		height: 14px;
		background-color: rgba(255, 255, 255, 1);
		opacity: 0;
		transition: opacity var(--figma-duration) var(--figma-smart-easing);
	}

	.main-navbar .navbar-nav .nav-link:not(.dropdown-toggle):hover::before,
	.main-navbar .navbar-nav .nav-link:not(.dropdown-toggle).active::before {
		opacity: 1;
	}

	.custom-dropdown-menu {
		display: grid !important;
		grid-template-rows: 0fr;
		opacity: 0;
		visibility: hidden;
		overflow: hidden;
		transition: grid-template-rows var(--figma-duration) var(--figma-smart-easing),
			opacity var(--figma-duration) var(--figma-smart-easing),
			margin-top var(--figma-duration) var(--figma-smart-easing) !important;

		background: transparent !important;
		border: none;
		padding: 0 !important;
		width: 100% !important;
		position: static !important;
		margin-top: 0 !important;
	}

	.main-navbar .dropdown-toggle {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}

	.custom-dropdown-menu.show {
		grid-template-rows: 1fr;
		opacity: 1;
		visibility: visible;
		margin-top: 16px !important;
		padding-left: 16px !important;
		border-bottom: 1px solid var(--color-white);
		padding-bottom: 16px !important;
	}

	.dropdown-columns-wrapper {
		min-height: 0;
		width: 100% !important;
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	.dropdown-col {
		width: 100% !important;
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	.dropdown-links-list {
		display: flex !important;
		flex-direction: column !important;
		gap: 16px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.main-products-group .custom-dropdown-item,
	.utility-products-group .highlight-link,
	.extra-products-group .highlight-link,
	.sub-dropdown-collapse .sub-item {
		color: var(--color-white) !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		display: block;
		font-size: var(--fs-body-standard);
		line-height: var(--lh-body-standard);
	}

	/* .main-products-group .custom-dropdown-item.active {
		color: var(--bs-secondary) !important;
	} */

	.sub-dropdown-collapse ul.dropdown-links-list {
		gap: 16px !important;
		margin-top: 16px !important;
	}

	.navbar-brand img {
		width: 165px;
	}

	.main-navbar {
		min-height: 70px;
		padding-top: 12px;
		padding-bottom: 12px;
	}
	
	/* Height cap only; no padding on the animated element */
	#commoditiesNavbar {
		max-height: calc(100vh - var(--header-height));
		max-height: calc(100dvh - var(--header-height));
	}

	/* Only scroll when fully open, so Bootstrap's overflow:hidden still applies while animating */
	#commoditiesNavbar.show {
	overflow-x: hidden;   
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

#commoditiesNavbar.show::-webkit-scrollbar {
	display: none;
}

	/* Bottom spacing lives on the inner list, so it shrinks smoothly with the collapse */
	#commoditiesNavbar .navbar-nav {
		padding-bottom: 24px;
	}

	html.nav-open,
	html.nav-open body {
		overflow: hidden;
	}

	.icon-circle {
		width: 81px;
		height: 81px;
	}

	.icon-circle img {
		height: 40px;
	}

	.hero-slide {
		min-height: clamp(480px, calc(100svh - var(--header-height)), 620px);
	}

	.faq-card {
		height: 336px;
	}

	.product-section,
	.py-spacing {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.product-page .product-banner {
		min-height: 500px;
	}

	.product-page .grid-cell-inner {
		width: 100%;
	}

	.border-start-custom {
		border-bottom: 1px solid var(--text-muted-gray);
		padding-bottom: 16px !important;
	}

	.text-pic-overlay::before,
	.text-pic-overlay::after {
		left: 0;
		right: 0;
		width: 100%;
	}

	.text-pic-overlay::before {
		background-size: cover;
		background-position: center bottom;
	}

	.text-pic-overlay::after {
		background:
			linear-gradient(180deg,
				var(--bs-primary) 0%,
				rgba(7, 7, 7, .85) 45%,
				rgba(7, 7, 7, .4) 100%);
				
	}
}

@media (max-width: 576px) {

	.product-page .product-logo-gold2 {
		width: min(200px, 100%);
	}

	.btn-small {
		width: auto !important;
		min-width: 160px !important;
		flex: 1;
	}

	.hero-slide {
		min-height: 715px;
	}

}

/* CCM19 cookie banner: action buttons in the btn-secondary style */
#ccm-widget .ccm--save-settings,
#ccm-widget .ccm--decline-cookies:not(.ccm--reopen-only),
#ccm-widget [data-ccm-modal="ccm-control-panel"],
#ccm-control-panel .ccm--save-settings,
#ccm-control-panel .ccm-modal--close {
	font-family: var(--btn-font-family);
	font-weight: var(--btn-font-weight);
	font-size: var(--btn-font-size);
	line-height: var(--btn-line-height);
	min-height: var(--btn-height);
	padding: var(--btn-padding);
	border: 1px solid var(--bs-primary);
	border-radius: var(--bs-border-radius);
	color: var(--color-white);
	background: var(--bs-primary);
	text-decoration: none;
	cursor: pointer;
	transition: var(--btn-transition);
}

#ccm-widget .ccm--save-settings:hover,
#ccm-widget .ccm--decline-cookies:not(.ccm--reopen-only):hover,
#ccm-widget [data-ccm-modal="ccm-control-panel"]:hover,
#ccm-control-panel .ccm--save-settings:hover,
#ccm-control-panel .ccm-modal--close:hover {
	color: var(--color-white);
	border-color: var(--bs-primary);
	background: var(--bs-primary);
}

#ccm-widget .ccm--save-settings:focus-visible,
#ccm-widget .ccm--decline-cookies:not(.ccm--reopen-only):focus-visible,
#ccm-widget [data-ccm-modal="ccm-control-panel"]:focus-visible,
#ccm-control-panel .ccm--save-settings:focus-visible,
#ccm-control-panel .ccm-modal--close:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: 2px;
}

/* CCM19 cookie banner: links (Impressum, Datenschutz, ...) in black */
#ccm-widget a:link,
#ccm-widget a:visited,
#ccm-widget a:hover,
#ccm-widget a:focus,
#ccm-control-panel a:link,
#ccm-control-panel a:visited,
#ccm-control-panel a:hover,
#ccm-control-panel a:focus,
#ccm-widget--title .ccm--h1{
	color: var(--bs-primary);
}