/* ------------------------------
   View Transitions
-------------------------------- */
@view-transition {
	navigation: auto;
}

/* Prevent white flash during transitions */
::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: 0.3s;
	background: #f7f7f3;
}

.hero,
.about-hero__box {
	view-transition-name: hero-morph;
}

.site-header {
	view-transition-name: site-header;
}

.logo__left {
	view-transition-name: logo-spin-icon;
}

::view-transition-old(hero-morph),
::view-transition-new(hero-morph) {
	animation-duration: 0.5s;
	animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	mix-blend-mode: normal;
	overflow: clip;
}

::view-transition-old(site-header),
::view-transition-new(site-header) {
	animation: none;
}

::view-transition-old(logo-spin-icon) {
	animation: none;
	opacity: 0;
}

::view-transition-new(logo-spin-icon) {
	animation: none;
}

::view-transition-group(site-header) {
	z-index: 2;
}

::view-transition-group(hero-morph) {
	z-index: 1;
}

/* ------------------------------
   Globals
-------------------------------- */
:root {
	--color-primary: #000;
	--color-secondary: #444;
	--color-highlight: #e9c123;
	--margin-inline-countainer: 0.5rem;
	--container-max-width: 1340px;
	--border-radius: 30px;

	/* Spacing scale */
	--space-xs: 0.25rem;
	--space-sm: 0.5rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2rem;
	--space-2xl: 3rem;
	--space-3xl: 4rem;
	--space-4xl: 6rem;

	/* Shadows */
	--shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
	--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);

	/* Fluid type */
	--text-hero: clamp(2rem, 5vw + 1rem, 3.65rem);
	--text-section: clamp(1.75rem, 3vw + 0.5rem, 2.25rem);
	--text-body-lg: clamp(1.05rem, 1vw + 0.5rem, 1.2rem);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 1);
	border-radius: 5px;
	transition:
		background-color 0.3s ease,
		width 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.5);
	width: 12px;
}

* {
	scrollbar-color: rgba(0, 0, 0, 0.5) transparent;
}

/* ------------------------------
   Base / Reset
-------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

/* Fallback font with size-adjust to reduce layout shift while custom fonts load */
@font-face {
	font-family: "United Sans Condensed Fallback";
	src: local("Arial Narrow"), local("Arial");
	size-adjust: 85%;
	ascent-override: 100%;
	descent-override: 22%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Inter Fallback";
	src: local("Arial");
	size-adjust: 107%;
	ascent-override: 90%;
	descent-override: 22%;
	line-gap-override: 0%;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: "Inter", sans-serif;
	font-size: 16px;
	line-height: 1.9rem;
	color: #000;
	background-color: #f5f4f7;
}

img {
	max-width: 100%;
	display: block;
}

/* Global focus-visible indicator for keyboard navigation */
:focus-visible {
	outline: 2px solid var(--color-highlight);
	outline-offset: 2px;
}

:focus:not(:focus-visible) {
	outline: none;
}

/* Reduced motion: disable all animations/transitions globally */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

.no-padding {
	padding: 0 !important;
}

.bg--pattern {
	background-color: #fff;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #f0f0f0 0, #f0f0f0 1.5px, transparent 1.5px, transparent 50%);
}

.bg--pattern-reverse {
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.05) 0, rgba(255, 255, 255, 0.05) 1.5px, #000 0, #000 50%);
	position: relative;
	z-index: 2;
}

.bg--white {
	background-color: #fff;
}

.bg--white-gradient {
	background: #f5f4f7;
	background: linear-gradient(0deg, rgba(245, 244, 247, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.bg--black {
	background-color: #000;
}

.bg--gray {
	background: #f5f4f7;
}

.bg--shadow {
	position: relative;
	z-index: 2;
	box-shadow: var(--shadow-sm);
}

.bg--rounded {
	border-radius: 9999px;
}

.text-center {
	text-align: center;
}

.text-white {
	color: #fff !important;
}

.text-black {
	color: #000;
}

.section-lead {
	padding: 5em 1em 0 1em;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.section-title {
	padding: 0;
	margin: 0;
	font-size: var(--text-hero);
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	letter-spacing: 1px;
	line-height: 1;
	color: #000;
	max-width: 600px;
}

.section-title-secondary {
	padding: 0;
	margin: 0;
	font-size: var(--text-section);
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	line-height: 1;
	color: #000;
	max-width: 600px;
}

.title-smaller {
	font-size: 2.25rem !important;
}

.section-description {
	font-size: var(--text-body-lg);
	font-weight: 400;
	font-family: "Inter", sans-serif;
	color: #888;
	padding: 0;
	margin: 0;
	max-width: 600px;
}

.description-sm {
	font-size: 1.1rem !important;
	max-width: 450px;
	padding-top: 0.5rem !important;
	line-height: 1.35 !important;
}

.info-tooltip-trigger {
	cursor: help;
	position: relative;
	z-index: 2;
}

.info-tooltip-trigger:hover ~ .info-tooltip__text {
	visibility: visible;
	opacity: 1;
}

.info-tooltip-trigger:hover .info-tooltip i {
	color: #000;
}

.info-tooltip {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin-left: -0.5rem;
	vertical-align: baseline;
	transform: translateY(-0.16em);
}

.info-tooltip i {
	font-size: 0.35em;
	color: #93979e;
	transition: color 0.2s;
	line-height: 1;
}

.info-tooltip__text {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	bottom: calc(100% + 10px);
	left: 50%;
	transform: translateX(-50%);
	width: 450px;
	padding: 2rem;
	border-radius: 18px;
	background: #fff;
	color: #555;
	font-family: "Inter", sans-serif;
	letter-spacing: -0.01px;
	font-size: 0.95rem;
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
	box-shadow: var(--shadow-lg);
	transition:
		opacity 0.2s,
		visibility 0.2s;
	z-index: 9999;
	pointer-events: none;
}

.info-tooltip__highlight {
	color: #000;
}

/* ------------------------------
   Utilities
-------------------------------- */
.container {
	max-width: var(--container-max-width);
	padding-inline: 2.5rem;
	margin-inline: auto;
}

.btn {
	display: inline-flex;
	align-items: center;
	padding: 0.45rem 1.4rem;
	border-radius: 12px;
	text-decoration: none;
	font-weight: 500;
	font-size: 0.95rem;
	white-space: nowrap;
	position: relative;
}

.btn--primary {
	background: #000;
	color: #fff;
}

.btn--secondary {
	background: var(--color-highlight);
	color: #000;
	font-weight: 700 !important;
}

.btn--outline {
	background: none;
	color: #fff;
	border: 2px solid #fff;
	padding: 0.4rem 1.4rem;
}

.btn--outline-dark {
	background: #fff;
	color: #000;
	border: 2px solid #000;
	transition:
		background 200ms ease,
		color 200ms ease;
}

.btn--outline-gray {
	background: #fff;
	color: #555;
	border: 2px solid #777;
	opacity: 0.5;
	transition:
		background 200ms ease,
		color 200ms ease,
		opacity 200ms ease;
}

.btn--outline-gray::after {
	color: #555 !important;
}

.btn--outline-dark:hover {
	background: #000;
	color: #fff;
}

.btn--outline-gray:hover {
	background: #000;
	color: #fff;
	border: 2px solid #000;
	opacity: 1;
}

.btn--outline-gray:hover::after {
	color: var(--color-highlight) !important;
}

.btn--outline-dark::after {
	color: #000;
}

.btn--outline-dark:hover::after {
	color: var(--color-highlight) !important;
}

.btn--outline:hover::after,
.btn--primary:hover::after {
	color: var(--color-highlight) !important;
}

.btn--text {
	padding: 0;
	color: #000;
}

.btn::after {
	content: "\f061";
	font-family: "Font Awesome 6 Free";
	color: var(--color-highlight);
	font-size: 1.2rem;
	font-weight: 900;
	right: 0px;
	top: 40%;
	margin-left: 1rem;
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	flex-shrink: 0;
	transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn:hover::after {
	transform: translate(6px, 0);
}

.btn--secondary::after {
	color: #000 !important;
}

/* ------------------------------
   Header
-------------------------------- */
.header__inner {
	padding-block: 2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 120px;
	width: 100%;
	max-width: var(--container-max-width);
	background: transparent;
	border-radius: 0;
	box-shadow: none;
	transition:
		padding-block 300ms ease,
		min-height 300ms ease,
		border-radius 300ms ease,
		box-shadow 300ms ease,
		background-color 300ms ease;
}

.logo span {
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	font-size: 2.25rem;
	line-height: 1;
}

.logo-text {
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 600;
	font-size: 2rem;
	line-height: 1;
	padding: 0;
	margin: 0;
}

.logo__wrapper {
	display: flex;
	align-items: center;
	flex-direction: row;
	transition: transform 300ms ease;
	transform-origin: left center;
}

.logo__left {
	display: flex;
	padding-right: 0.6rem;
	align-items: center;
}

.logo-icon {
	position: relative;
	z-index: 1;
}

.logo__right {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 5px;
}

.logo__left img {
	height: 84px;
	width: auto;
	transform-origin: left center;
}

/* Inline SVG logo */
.logo-icon {
	height: 75px;
	width: auto;
}

.logo-ring {
	transform-origin: 50% 50%;
	will-change: transform;
}

/* Logo spin – triggered on every navigation via .logo-spin class */
.logo-spin .logo-ring--1 {
	animation: spin-cw 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.02s both;
}

.logo-spin .logo-ring--2 {
	animation: spin-ccw 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.06s both;
}

.logo-spin .logo-ring--3 {
	animation: spin-cw 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.1s both;
}

.logo-spin .logo-ring--4 {
	animation: spin-ccw 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.14s both;
}

@keyframes logo-drop {
	0% {
		transform: translateX(-40px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes spin-cw {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

@keyframes spin-ccw {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(-360deg);
	}
}

.logo--partners {
	display: inline-flex;
	width: fit-content;
	align-items: center;
	margin-bottom: 0.25rem;
	gap: 4px;
	scale: 0.85;
	transform-origin: left;
}

.logo--partners a {
	display: flex;
	align-items: center;
	flex: 1;
	font-weight: 600;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	line-height: 1;
	color: #fff;
	text-decoration: none;
	padding: 8px 16px;
	border-radius: 6px;
	background-color: #000;
}

.logo--partners a i {
	font-weight: 600;
	font-size: 0.7rem;
	padding-right: 4px;
	color: #fff;
	transition: color 100ms ease;
}

.logo--partners a:hover i {
	color: var(--color-highlight);
}

.site-header {
	position: relative;
	z-index: 1000;
	display: flex;
	justify-content: center;
}

/* ------------------------------
   Nav Dropdown
-------------------------------- */

.main-nav {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.nav-list {
	display: flex;
	gap: 3rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-list a,
.nav-list button.nav-link {
	text-decoration: none;
	color: inherit;
	font-family: "Inter", sans-serif;
	font-weight: 600;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 4px;
	position: relative;
}

.nav-list > li > a::before {
	content: "";
	position: absolute;
	bottom: 0px;
	left: 50%;
	width: 100%;
	height: 3px;
	background: #111;
	transition: opacity 150ms ease-in-out;
	transform: translateX(-50%);
	border-radius: 1px;
	opacity: 0;
}

.nav-list > li > a:hover::before {
	opacity: 1;
}

.nav-item--has-dropdown.nav-item--persist > .nav-link::before {
	opacity: 1;
}

.nav-dropdown__submenu li a span {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: #f0f0f0;
	color: #333;
	transition:
		background 150ms ease,
		color 150ms ease;
}

.nav-dropdown__submenu li a span i {
	font-size: 1rem;
}

.nav-item {
	position: relative;
}

.nav-item--has-dropdown > .nav-link {
	position: relative;
	background: none;
	border: none;
	padding: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
}

.nav-dropdown {
	position: absolute;
	top: calc(100% + 16px);
	left: 50%;
	transform: translateX(-50%) translateY(10px);
	background: #fff;
	border-radius: 12px;
	box-shadow: var(--shadow-lg);
	padding: 0.75rem 0;
	min-width: 275px;
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 150ms ease,
		transform 150ms ease,
		visibility 150ms;
	z-index: 1000;
}

.nav-dropdown__arrow {
	position: absolute;
	top: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 16px;
	height: 16px;
	background: #fff;
	transform: translateX(-50%) rotate(45deg);
	box-shadow: -3px -3px 6px rgba(0, 0, 0, 0.05);
}

.nav-dropdown ul {
	list-style: none;
	padding-inline: 0.75rem;
	margin: 0;
}

.nav-dropdown li a {
	display: block;
	padding: 0.75rem 0.75rem;
	text-decoration: none;
	color: #000;
	font-weight: 500;
	font-size: 0.97rem;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 1rem;
	transition:
		background 150ms ease,
		color 150ms ease;
	border-radius: 8px;
}

.nav-dropdown li a:hover {
	background: #000;
	color: #fff;
}

.nav-dropdown li a:hover span {
	background: #fff;
	color: #000;
}

.nav-dropdown li a.nav-dropdown__link--active {
	background: #000;
	color: #fff;
}

.nav-dropdown li a.nav-dropdown__link--active span {
	background: #fff;
	color: #000;
}

.nav-item--has-dropdown:hover .nav-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

.nav-item--has-dropdown.nav-item--persist .nav-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

.nav-caret {
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 6px solid currentColor;
	transform-origin: center;
	transition: transform 0.25s ease;
}

.nav-item--has-dropdown:hover .nav-caret {
	transform: rotate(180deg);
}

.nav-item--has-dropdown.nav-item--persist .nav-caret {
	transform: rotate(180deg);
}

.nav-item--has-dropdown.nav-item--closing > .nav-link::before {
	opacity: 0;
}

.nav-item--has-dropdown.nav-item--closing .nav-caret {
	transform: rotate(0deg);
}

.nav-item--has-dropdown.nav-item--closing .nav-dropdown {
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(10px);
}

.nav-locked .nav-item--has-dropdown:hover .nav-dropdown {
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(10px);
}

.nav-locked .nav-item--has-dropdown:hover .nav-caret {
	transform: rotate(0deg);
}

.nav-locked .nav-item--has-dropdown:hover > .nav-link::before {
	opacity: 0;
}

.nav-item--has-dropdown::after {
	content: "";
	position: absolute;
	left: -12px;
	right: -12px;
	top: -12px;
	bottom: -24px;
}

/* ------------------------------
   Hero
-------------------------------- */
.hero {
	margin-top: 2rem;
	background-color: #000;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
	position: relative;
	overflow: hidden;
	margin-inline: auto;
	border-radius: var(--border-radius);
	max-width: var(--container-max-width);
}

.hero__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	padding: 6rem 2rem;
	gap: 4rem;
	position: relative;
	z-index: 2;
}

.hero__content-wrap {
	display: flex;
	justify-content: flex-end;
	width: 100%;
}

.hero__content {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
	max-width: 366px;
	width: 100%;
}

.hero__content h1 {
	font-size: 3.5rem;
	line-height: 1;
	max-width: 600px;
	letter-spacing: 1px;
}

.hero__content p {
	padding: 0;
	margin: 1.5rem 0 0.5rem;
	font-size: 1.05rem;
	color: rgba(255, 255, 255, 0.9);
	max-width: 520px;
	line-height: 1.7;
}

.hero__badges {
	display: none;
	gap: 1rem;
	margin: 1.5rem 0 0 0;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	position: relative;
	padding: 0.5rem 2rem;
	background-color: #1e2225;
	border-radius: 8px;
}

/* .hero__badges::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 3px;
	background: #fff;
	border-radius: 3px;
} */

.hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 400;
	color: rgba(255, 255, 255, 1);
}

.hero__badge:not(:last-child)::after {
	content: "·";
	margin-left: 0.5rem;
	color: rgba(255, 255, 255, 0.7);
	font-size: 2rem;
}

.hero__badge strong {
	display: inline-block;
	color: var(--color-highlight);
	font-weight: 800;
}

.hero__badge-bounce {
	animation: heroBadgeBounce 280ms ease-out;
	transform-origin: center;
}

@keyframes heroBadgeBounce {
	0% {
		transform: scale(1);
	}
	45% {
		transform: scale(1.18);
	}
	75% {
		transform: scale(0.96);
	}
	100% {
		transform: scale(1);
	}
}

.hero__button {
	padding-top: 1rem;
	display: flex;
	gap: 1rem;
	justify-content: flex-end;
}

.hero__image {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.hero__image img {
	width: 100%;
	max-width: 450px;
	object-fit: contain;
}

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

/* ------------------------------
   Features
-------------------------------- */

.features__grid {
	padding: 4.5rem 0.5rem 10rem 0.5rem;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3rem;
}

.feature {
	background-color: #fff;
	text-align: center;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.bg--feature {
	padding: 2rem 1.75rem 2rem 1.75rem;
	border-radius: 15px;
	margin: 0.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
}

.feature__icon {
	margin-bottom: 1rem;
	margin-top: -90px;
	display: inline-flex;
}

.feature__title {
	margin: 0;
	padding: 0;
	line-height: 1;
	font-size: 2.25rem;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
}

.feature__title span {
	background: #fff;
	padding: 0 0.5em;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	display: inline;
}

.feature__description {
	font-size: 1rem;
	line-height: 1.25;
	font-weight: 400;
	color: #555;
	padding: 1rem;
	padding-top: 0;
	border-radius: 20px;
}

.feature__description span {
	background: #fff;
	padding: 0.1em 0.5em;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	display: inline;
	line-height: inherit;
}

.feature__checklist {
	list-style: none;
	padding: 0.5rem 1.25rem;
	margin: 1.5rem 0 auto 0;
	text-align: left;
	width: 100%;
	background: #fff;
	border-radius: 10px;
}

.feature__checklist li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.85rem 0;
	font-size: 0.95rem;
	color: #444;
	line-height: 1.5;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.feature__checklist li:last-child {
	border-bottom: none;
}

.feature__checklist li i {
	color: var(--color-highlight);
	font-size: 0.8rem;
	margin-top: 0.3rem;
	flex-shrink: 0;
}

.feature__checklist + .btn {
	margin-top: 1.5rem;
}

/* ------------------------------
   Showcase (Tabbed Cluster Display)
-------------------------------- */
.showcase {
	max-width: var(--container-max-width);
	margin-inline: auto;
	margin-top: 0;
	margin-bottom: 6rem;
	background: #fff;
	border-radius: var(--border-radius);
	box-shadow: 0 0px 6px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	position: relative;
	z-index: 3;
}

/* Tab row (top, outside showcase) */
.showcase__tabs {
	display: flex;
	flex-direction: row;
	justify-content: center;
	max-width: 600px;
	margin: auto;
	margin-top: 2rem;
	background: transparent;
	border-bottom: none;
	position: relative;
	z-index: 1;
	border: 1px solid #cecece3d;
	border-bottom: none;
	border-radius: 20px 20px 0 0;
}

.showcase__tab {
	flex: 1;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1.14rem 1.75rem;
	border: 1px solid transparent;
	background: #ebeaed;
	cursor: pointer;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.5rem;
	letter-spacing: 0.25px;
	color: #a3a3a3;
	position: relative;
	outline: none;
	transition:
		color 0.25s ease,
		background 0.25s ease;
}

.showcase__tab span {
	margin: 0;
}

.showcase__tab:first-child {
	border-radius: 20px 0 0 0;
}

.showcase__tab:last-child {
	border-radius: 0 20px 0 0;
}

.showcase__tab:not(:last-child) {
	border-right: 1px solid rgba(0, 0, 0, 0.06);
}

.showcase__tab:hover {
	color: #000;
}

.showcase__tab--active:hover {
	color: #000;
	background: #fff;
	border: 1px solid transparent;
}

.showcase__tab:hover .showcase__tab-icon {
	opacity: 1;
}

.showcase__tab--active {
	color: #000;
	position: relative;
	background: #fff;
}

.showcase__tab-icon {
	width: 40px;
	height: 40px;
	object-fit: contain;
	opacity: 0.4;
	transition: opacity 0.25s ease;
}

.showcase__tab--active .showcase__tab-icon {
	opacity: 1;
}

/* Stage – panel container */
.showcase__stage {
	position: relative;
	min-height: 380px;
}

/* Subtle circular timer */
.showcase__timer {
	position: absolute;
	top: 2rem;
	right: 2rem;
	width: 50px;
	height: 50px;
	z-index: 10;
	background-color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 9999px;
}

.showcase__timer-circle {
	position: absolute;
	width: 100%;
	height: 100%;
	padding: 4px;
	transform: rotate(-90deg);
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.08));
}

.showcase__timer-bg {
	fill: none;
	stroke: #8989899e;
	stroke-width: 6;
}

.showcase__timer-progress {
	fill: none;
	stroke: #e9c123;
	stroke-width: 6;
	stroke-linecap: round;
	stroke-dasharray: 283;
	stroke-dashoffset: 283;
	opacity: 1;
	transition: stroke-dashoffset 0.05s linear;
}

.showcase__timer-icon {
	position: relative;
	z-index: 2;
	font-size: 0.85rem;
	color: #f0f0f0;
}

/* Panels */
.showcase__panel {
	display: none;
	grid-template-columns: 2fr 1fr;
	gap: 0;
	align-items: stretch;
}

.showcase__panel--active {
	display: grid;
}

.showcase__panel[hidden] {
	display: none !important;
}

/* Panel main content animations */
.showcase__panel--active .cluster-flow__heading {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.05s forwards;
}

.showcase__panel--active .cluster-flow__label {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.1s forwards;
}

.showcase__panel--active .cluster-flow__desc {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.15s forwards;
}

.showcase__panel--active .cluster-flow__keywords {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.2s forwards;
}

.showcase__panel--active .cluster-flow__sources {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.25s forwards;
}

.showcase__panel--active .showcase__panel-sidebar .btn {
	opacity: 0;
	transform: translateY(20px);
	animation: slideUpFade 0.25s ease-out 0.85s forwards;
}

@keyframes slideUpFade {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Sidebar animations - start after main column */
.showcase__panel--active .showcase__sidebar-title {
	opacity: 0;
	animation: fadeIn 0.15s ease-out 0.48s forwards;
}

/* List item emphasis animation */
.showcase__panel--active .showcase__expect-list li {
	opacity: 0;
	transform: scale(0.95);
	animation: listItemEmphasis 0.2s ease-out forwards;
}

.showcase__panel--active .showcase__expect-list li:nth-child(1) {
	animation-delay: 0.55s;
}

.showcase__panel--active .showcase__expect-list li:nth-child(2) {
	animation-delay: 0.62s;
}

.showcase__panel--active .showcase__expect-list li:nth-child(3) {
	animation-delay: 0.69s;
}

.showcase__panel--active .showcase__expect-list li:nth-child(4) {
	animation-delay: 0.76s;
}

@keyframes listItemEmphasis {
	from {
		opacity: 0;
		transform: scale(0.95);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/* Panel main content (left) */
.showcase__panel-main {
	padding: 6rem 4rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.25rem;
}

/* Panel sidebar (right) */
.showcase__panel-sidebar {
	background: #000;
	color: #fff;
	padding: 10rem 2rem 6rem 4rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	overflow: hidden;
	border-radius: 0 20px 20px 0;
}

.showcase__panel-sidebar .btn {
	align-self: flex-start;
	margin-top: auto;
}

.showcase__panel-sidebar::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.05;
	background-size: 22px 22px;
	background-image: repeating-linear-gradient(45deg, #fff 0, #fff 2px, transparent 2px, transparent 50%);
	pointer-events: none;
}

.showcase__sidebar-title {
	margin: 0 0 1.5rem 0;
	padding: 0;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 600;
	letter-spacing: 0.25px;
	font-size: 1.75rem;
	color: var(--color-highlight);
	position: relative;
	z-index: 1;
}

.showcase__expect-list {
	list-style: none;
	padding: 0;
	margin: 0;
	position: relative;
	z-index: 1;
}

.showcase__expect-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	padding: 0.85rem 0;
	font-size: 1rem;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.9);
	line-height: 1.5;
}

.showcase__expect-list li:last-child {
	border-bottom: none;
}

.showcase__expect-list-check {
	color: #000;
	font-size: 1.1rem;
	flex-shrink: 0;
	background: #e9c123;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

/* Heading: icon stacked above title */
.cluster-flow__heading {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
}

.cluster-flow__heading-icon {
	width: 150px;
	object-fit: contain;
	flex-shrink: 0;
}

/* Keywords */
.cluster-flow__keywords {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.5rem;
}

.cluster-flow__keyword {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.35rem 0.85rem;
	border-radius: 11px;
	background: #f0f0f0;
	font-family: "Inter", sans-serif;
	font-size: 0.82rem;
	font-weight: 600;
	color: #444;
}

.cluster-flow__keyword i {
	font-size: 0.7rem;
	color: #999;
}

.cluster-flow__sources {
	margin-top: 0.25rem;
}

.cluster-flow__sources a {
	font-family: "Inter", sans-serif;
	font-size: 0.82rem;
	font-weight: 600;
	color: #999;
	text-decoration: none;
	transition: color 150ms ease;
}

.cluster-flow__sources a:hover {
	color: #000;
	text-decoration: underline;
}

.cluster-flow__label {
	font-family: "Inter", sans-serif;
	font-size: 0.82rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #c39c00;
	margin-bottom: 0;
}

.cluster-flow__title {
	margin: 0;
	padding: 0;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	font-size: 2.6rem;
	line-height: 1;
	color: #000;
	letter-spacing: 0.5px;
}

.cluster-flow__desc {
	margin: 1rem 0 1rem 0;
	color: #333;
	font-size: 1.05rem;
	line-height: 1.85;
	max-width: 760px;
}

/* ------------------------------
   Partnership
-------------------------------- */
.partnership {
	margin-inline: auto;
	padding-top: 2rem;
	position: relative;
	z-index: 0;
}

.partnership::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 8rem;
	opacity: 0.8;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #e0e0e0 0, #e0e0e0 1.5px, transparent 1.5px, transparent 50%);
	/* fade out bottom edge */
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 0) 100%);
	pointer-events: none;
	z-index: 0;
}

.partnership__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding-block: 6rem 8rem;
	gap: 2rem;
	position: relative;
	z-index: 1;
}

.partnership__title {
	padding-block: 1rem 0.25rem;
}

.partnership__content {
	padding-top: 2rem;
	display: flex;
	flex-direction: column;
	padding-right: 2rem;
}

.partnership__image {
	display: flex;
	align-items: center;
	justify-content: center;
}

.partnership__buttonholder {
	padding-top: 2rem;
	display: flex;
	flex-direction: row;
	gap: 1rem;
}

.bar--divider {
	height: 5px;
	background-color: #000;
	width: 100px;
	margin-block: 1.25rem;
}

.partnership__excerpt {
	padding: 0.25rem 0 0;
	margin: 0;
	color: #333;
	font-size: 1.05rem;
	line-height: 1.85;
}

/* ------------------------------
   Footer
-------------------------------- */
.site-footer {
	margin-inline: 1.5rem;
	border-radius: 30px 30px 0 0;
	background-color: #000;
	padding-block: 6rem 2rem;
}

.footer__grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 2rem;
}

.col-center {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.col-right {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.footer__col h4 {
	margin-top: 0;
	margin-bottom: 0.5rem;
	color: var(--color-highlight);
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	font-size: 1.5rem;
}

.footer__description {
	padding: 0;
	margin: 1.5rem 0 0.5rem;
	font-size: 1.05rem;
	color: rgba(255, 255, 255, 0.9);
	max-width: 520px;
	line-height: 1.7;
}

.footer__col ul {
	list-style: none;
	padding: 0;
	margin: 0;
	color: #fff;
	text-align: left;
}

.footer__legal {
	margin-top: 2.5rem;
	padding-top: 3rem;
	text-align: center;
}

.footer__legal p {
	margin: 0;
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.85rem;
	line-height: 1.6;
}

.footer__col ul li {
	line-height: 2.5;
}

.footer__col a {
	color: #fff;
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-size: 0.95rem;
	font-weight: 400;
}

.footer__col a:hover {
	text-decoration: underline;
}

/* Page Loader */
#page-loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}

.loader {
	border: 6px solid #f3f3f3;
	border-top: 6px solid var(--color-highlight);
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 0.8s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

#page-content {
	outline: none;
}

/* Only use opacity transition when View Transitions aren't available */
@supports not (view-transition-name: none) {
	#page-content {
		transition: opacity 0.3s ease;
	}
}

/* Secondary pages layout styles */
.page-section-header {
	padding-top: 8rem;
	padding-bottom: 0rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-bottom: -4.3rem;
}

/* Cluster Hero – wraps icon, title, description with nav arrows */
.cluster-hero {
	display: flex;
	justify-content: center;
	width: 100%;
	position: relative;
}

.cluster-hero__content {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	min-width: 0;
}

.cluster-hero__title-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	width: 100%;
	position: relative;
}

.cluster-hero__arrow {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid rgba(0, 0, 0, 0.1);
	color: #000;
	font-size: 1.1rem;
	text-decoration: none;
	flex-shrink: 0;
	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
	cursor: pointer;
	z-index: 1;
}

.cluster-hero__arrow:hover {
	background: #000;
	color: #fff;
	border-color: #000;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.cluster-hero__arrow:active {
	opacity: 0.7;
}

.arrow-tooltip {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	bottom: calc(100% + 10px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	padding: 0.5rem 1rem;
	border-radius: 10px;
	background: #fff;
	color: #555;
	font-family: "Inter", sans-serif;
	font-size: 0.85rem;
	font-weight: 500;
	box-shadow: var(--shadow-lg);
	transition:
		opacity 0.2s,
		visibility 0.2s;
	z-index: 9999;
	pointer-events: none;
}

.cluster-hero__arrow:hover .arrow-tooltip {
	visibility: visible;
	opacity: 1;
}

/* Cluster hero slide animations */
@keyframes clusterSlideOutLeft {
	from {
		transform: translateX(0);
		opacity: 1;
	}
	to {
		transform: translateX(-80px);
		opacity: 0;
	}
}
@keyframes clusterSlideInFromRight {
	from {
		transform: translateX(80px);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}
@keyframes clusterSlideOutRight {
	from {
		transform: translateX(0);
		opacity: 1;
	}
	to {
		transform: translateX(80px);
		opacity: 0;
	}
}
@keyframes clusterSlideInFromLeft {
	from {
		transform: translateX(-80px);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}

.cluster-hero__content--slide-out-left {
	animation: clusterSlideOutLeft 0.25s ease-in forwards;
}
.cluster-hero__content--slide-in-right {
	animation: clusterSlideInFromRight 0.3s ease-out forwards;
}
.cluster-hero__content--slide-out-right {
	animation: clusterSlideOutRight 0.25s ease-in forwards;
}
.cluster-hero__content--slide-in-left {
	animation: clusterSlideInFromLeft 0.3s ease-out forwards;
}

.dashboard__icon {
	margin-top: -3rem;
	margin-bottom: 1rem;
	display: inline-flex;
}

.dashboard__icon img {
	width: 200px;
}

.dashboard__maincontrol {
	margin-top: 2.75rem;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	border-radius: 18px;
	position: relative;
	z-index: 5;
	background: #fff;
	overflow: hidden;
	width: 100%;
	max-width: 650px;
}

/* Sliding black indicator over buttons */
.dashboard__maincontrol::before {
	content: "";
	position: absolute;
	top: 0;
	left: calc(var(--active-index, 0) * 33.3333%);
	width: 33.3333%;
	height: 100%;
	background: #000;
	border-radius: 0;
	transition:
		left 0.5s cubic-bezier(0.25, 1, 0.5, 1),
		border-radius 0.5s cubic-bezier(0.25, 1, 0.5, 1);
	z-index: 1;
	pointer-events: none;
}

/* Match border-radius to position */
.dashboard__maincontrol[style*="--active-index: 0"]::before {
	border-radius: 18px 0 0 18px;
}
.dashboard__maincontrol[style*="--active-index: 1"]::before {
	border-radius: 0;
}
.dashboard__maincontrol[style*="--active-index: 2"]::before {
	border-radius: 0 18px 18px 0;
}

.maincontrol__button {
	min-height: 140px;
	min-width: 180px;
	background-color: transparent;
	border-right: 2px solid rgba(0, 0, 0, 0.1);
	border-radius: 0;
	color: #000;
	font-family: "Inter", sans-serif;
	font-size: 1.25rem;
	font-weight: 600;
	cursor: pointer;
	position: relative;
	z-index: 2;
	transition:
		background-color 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		transform 0.3s ease;
}

.maincontrol__button.maincontrol__selected {
	background-color: transparent;
	border-color: transparent;
}

.maincontrol__button:hover:not(.maincontrol__selected) {
	background-color: #fafaf5;
	transform: translateY(-2px);
}

.maincontrol__button:hover:not(.maincontrol__selected) a span {
	color: #000 !important;
}

.maincontrol__button:hover:not(.maincontrol__selected) img {
	filter: none;
	transform: scale(1.06);
}

.maincontrol__button:last-child {
	border-right: none;
}

.maincontrol__button:first-child {
	border-radius: 18px 0 0 18px;
}

.maincontrol__button:last-child {
	border-radius: 0 18px 18px 0;
}

.maincontrol__button.maincontrol__selected a span {
	color: #fff !important;
}

.maincontrol__button a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 2rem;
	text-decoration: none;
	color: #000;
	height: 100%;
}

.maincontrol__button a span {
	margin-top: 0;
	font-size: 1rem;
	font-weight: 600;
	color: #777;
	transition:
		color 0.35s ease,
		letter-spacing 0.35s ease;
}

.maincontrol__button img {
	width: 70px;
	transition: transform 0.3s ease;
}

/* ---- Embed Styles ---- */

/* Carousel slide animations for embed content */
@keyframes slideOutLeft {
	from {
		transform: translateX(0);
		opacity: 1;
	}
	to {
		transform: translateX(-60px);
		opacity: 0;
	}
}
@keyframes slideInRight {
	from {
		transform: translateX(60px);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}
@keyframes slideOutRight {
	from {
		transform: translateX(0);
		opacity: 1;
	}
	to {
		transform: translateX(60px);
		opacity: 0;
	}
}
@keyframes slideInLeft {
	from {
		transform: translateX(-60px);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}

.embed__content--slide-out-left {
	animation: slideOutLeft 0.25s ease-in forwards;
}
.embed__content--slide-in-right {
	animation: slideInRight 0.3s ease-out forwards;
}
.embed__content--slide-out-right {
	animation: slideOutRight 0.25s ease-in forwards;
}
.embed__content--slide-in-left {
	animation: slideInLeft 0.3s ease-out forwards;
}

.embed__content {
	max-width: var(--container-max-width);
	margin-inline: auto;
	position: relative;
	z-index: 0;
	min-height: 800px;
}

.embed__inner {
	max-width: var(--container-max-width);
	display: flex;
	padding-block: 3.75rem 6rem;
	position: relative;
	z-index: 1;
}

.embed__frame {
	margin: auto;
	margin-top: 4.5rem;
	border-radius: 20px;
	background-color: #fff;
	overflow: hidden;
	width: max(100%, 1256px);
}

.embed__frame-wrap {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: auto;
}

.embed__frame-header {
	background-color: #000;
	padding-block: 1.15rem;
	padding-inline: 1.75rem;
	color: #fff;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 600;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;
}

.embed__frame-header-left {
	flex: 1;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;
}

.embed__frame-header-right {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
	gap: 0.5rem;
}

.embed__bean {
	height: 5px;
	width: 15px;
	border-radius: 5px;
	background-color: var(--color-highlight);
}

.embed__pill {
	height: 10px;
	width: 10px;
	border-radius: 10px;
	background-color: var(--color-highlight);
}

/* ---- Embed Menubar (file-menu style) ---- */
.embed__menubar {
	display: flex;
	align-items: center;
	gap: 0;
	position: relative;
	background-color: #fff;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #eee 0, #eee 1.5px, transparent 1.5px, transparent 50%);
	padding: 0 0.75rem;
	border-bottom: 2px solid #e0e0e0;
}

.embed__menubar::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(to right, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, 0) 75%);
	pointer-events: none;
	z-index: 0;
}

.embed__menubar > * {
	position: relative;
	z-index: 1;
}

.menubar__trigger {
	background: none;
	border: none;
	outline: none;
	color: #333;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 500;
	padding: 0.5rem 0.85rem;
	cursor: pointer;
	transition:
		background-color 0.15s ease,
		color 0.15s ease;
	border-radius: 6px 6px 0 0;
}

.menubar__trigger:hover,
.menubar__item.menubar__open .menubar__trigger {
	background: #f5f4f7;
	color: #000;
}

.menubar__dropdown {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	background: #fff;
	border-radius: 0 0 8px 8px;
	padding: 0.35rem 0;
	z-index: 100;
	border: 1px solid #e0e0e0;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}

.menubar__item.menubar__open > .menubar__dropdown {
	display: block;
}

.menubar__action {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	width: 100%;
	padding: 0.5rem 1rem;
	background: none;
	border: none;
	outline: none;
	color: #444;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 400;
	text-decoration: none;
	cursor: pointer;
	transition:
		background-color 0.12s ease,
		color 0.12s ease;
	text-align: left;
}

.menubar__action i {
	width: 1.1rem;
	text-align: center;
	font-size: 0.85rem;
	color: #111;
	opacity: 1;
}

.menubar__action:hover {
	background: #f0f0f0;
	color: #000;
}

.menubar__action:hover i {
	color: #111;
}

.embed__frame-content {
	padding-inline: 0.5rem;
	padding-block: 2rem 0.5rem;
}

.embed__frame-border {
	background-color: #fff;
	overflow: hidden;
	padding-top: 1rem;
	margin-top: 0.25rem;
}

.embed__frame-border tableau-viz,
.embed__frame-border iframe {
	display: block;
	max-width: 1440px;
	width: 100%;
	min-width: 0;
	margin-inline: auto;
}

.embed__frame-content tableau-viz {
	overflow: hidden;
	background-color: #fff;
}

/* ------------------------------
   About Hero
-------------------------------- */
.about-hero {
	max-width: var(--container-max-width);
	margin-inline: auto;
	padding-block: 1rem;
}

.about-hero__grid {
	display: grid;
	grid-template-columns: 2fr 1fr;
}

.about-hero__box {
	border-radius: var(--border-radius);
	overflow: hidden;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.about-hero__main {
	background-color: #000;
	position: relative;
	overflow: hidden;
}

.about-hero__sidebar {
	position: relative;
	z-index: 1;
	padding: 1rem;
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 10px solid #fff;
	background-color: #fff;
}

.about-hero__sidebar-toggle {
	display: none;
}

.about-hero__pattern {
	position: absolute;
	top: 0;
	right: 0;
	width: 200px;
	height: 100%;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.12) 0, rgba(255, 255, 255, 0.12) 1.5px, transparent 1.5px, transparent 50%);
	mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	pointer-events: none;
	z-index: 0;
}

.about-hero__inner {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	padding: 5rem;
	gap: 2rem;
	height: 80%;
	position: relative;
	z-index: 1;
}

.about-hero__content {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.about-section-title {
	font-size: 4.1rem !important;
}

.about-hero__content p {
	color: #efefef;
	font-size: 1.15rem;
	line-height: 1.7;
	max-width: 540px;
	margin: 0;
}

.about-hero__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background-color: rgba(237, 194, 56, 0.15);
	margin-bottom: 0.25rem;
}

.about-hero__badge i {
	font-size: 1.6rem;
	color: var(--color-highlight);
}

.about-hero__breadcrumb {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-top: 0.5rem;
	font-size: 0.95rem;
}

.about-hero__breadcrumb a {
	color: #fff;
	text-decoration: none;
	transition: color 150ms ease;
}

.about-hero__breadcrumb a:hover {
	color: var(--color-highlight);
	text-decoration: underline;
}

.about-hero__breadcrumb i {
	font-size: 0.6rem;
	color: #ccc;
}

.about-hero__breadcrumb span {
	color: #ccc;
	font-weight: 500;
}

/* Decorative concentric rings */
.about-hero__graphic {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-right: 1rem;
}

.about-hero__ring {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: 2px solid rgba(237, 194, 56, 0.12);
}

.about-hero__ring--outer {
	width: 200px;
	height: 200px;
	animation: ring-pulse 4s ease-in-out infinite;
}

.about-hero__ring--mid {
	width: 140px;
	height: 140px;
	border-color: rgba(237, 194, 56, 0.22);
	animation: ring-pulse 4s ease-in-out 0.4s infinite;
}

.about-hero__ring--inner {
	width: 80px;
	height: 80px;
	border-color: var(--color-highlight);
	background: rgba(237, 194, 56, 0.08);
}

@keyframes ring-pulse {
	0%,
	100% {
		transform: scale(1);
		opacity: 1;
	}
	50% {
		transform: scale(1.06);
		opacity: 0.7;
	}
}

.about-hero__sidebar-title {
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.3rem;
	color: #111;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 1.25rem;
	padding-bottom: 1rem;
	border-bottom: 2px solid #e5e5e5;
}

.about-hero__nav {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	flex: 1;
	background-color: #fff;
	border-radius: 20px;
}

.about-hero__nav-link {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.85rem 1rem;
	border-radius: 20px;
	text-decoration: none;
	background-color: #fff;
	color: #000;
	transition:
		background 150ms ease,
		transform 100ms ease;
}

.about-hero__nav-link:hover {
	background: #f5f5f5;
}

.about-hero__nav-link--active:hover {
	background: #222;
}

.about-hero__nav-link--active {
	background: #000;
	color: #fff;
}

.about-hero__nav-link--active .about-hero__nav-icon {
	background: #fff;
	color: #111;
}

.about-hero__nav-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: #f0f0f0;
	color: #333;
	font-size: 0.9rem;
	transition: background 150ms ease;
}

.about-hero__nav-icon i {
	font-size: 1.35rem !important;
}

.about-hero__nav-link:hover .about-hero__nav-icon {
	background: #e5e5e5;
}

.about-hero__nav-link--active:hover .about-hero__nav-icon {
	background: #fff;
}

.about-hero__nav-link strong {
	display: block;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.2;
}

.about-hero__nav-link small {
	display: block;
	font-size: 0.9rem;
	color: #777;
	line-height: 1.3;
	margin-top: 2px;
	font-family: "Inter", sans-serif;
}

.about-hero__nav-link--active small {
	color: rgba(255, 255, 255, 0.7);
}

/* ------------------------------
   About Body (shared across about pages)
-------------------------------- */
.about-body {
	max-width: var(--container-max-width);
	margin-inline: auto;
}

.about-body__inner {
	padding-block: 2.25rem 8rem;
}

.about-body__lead {
	padding: 4rem 1rem 0 1rem;
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 3rem;
}

.about-body__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2.5rem;
}

.about-body__grid--3 {
	grid-template-columns: repeat(3, 1fr);
}

.about-body__card {
	background: #fff;
	border-radius: 26px;
	padding: 2.5rem;
	position: relative;
	isolation: isolate;
	overflow: hidden;
	transition:
		border-color 200ms ease,
		box-shadow 200ms ease;
}

.about-body__card::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 70%;
	background: repeating-linear-gradient(45deg, #e0e0e0 0, #e0e0e0 1.5px, transparent 1.5px, transparent 50%);
	background-size: 14px 14px;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
	mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
	pointer-events: none;
	z-index: -1;
}

.about-body__card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: #000;
	color: var(--color-highlight);
	font-size: 1.2rem;
	margin-bottom: 1.25rem;
}

.about-body__card-icon--img {
	width: 110px;
	height: 110px;
	background: none;
}

.about-body__card-icon--img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.about-body__card h3 {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 2rem;
	font-weight: 700;
	letter-spacing: 0.25px;
	margin: 0;
	color: #111;
}

.about-body__card p {
	margin: 0;
	color: #555;
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.7;
	padding: 0.5rem 0 1.25rem;
}

/* Team cards layout */
.team-cards__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	padding-bottom: 6rem;
}

.team-card {
	background-color: #fff;
	border-radius: 30px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	transition:
		transform 250ms ease,
		box-shadow 250ms ease;
	position: relative;
	padding: 2.5rem;
}

.team-card::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	background: repeating-linear-gradient(45deg, #e0e0e0 0, #e0e0e0 1.5px, transparent 1.5px, transparent 50%);
	background-size: 14px 14px;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
	mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
	pointer-events: none;
	z-index: 0;
}

.team-card__body {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1;
	position: relative;
	z-index: 1;
}

.team-card__avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 65px;
	height: 60px;
	border-radius: 9999px 9999px 0 0;
	background: #111;
	color: var(--color-highlight);
	font-size: 1.25rem;
	margin-bottom: -0.75rem;
}

.team-card__avatar i {
	font-size: 2rem;
}

.team-card__role {
	display: inline-block;
	position: relative;
	z-index: 1;
	padding: 0.5rem 1rem;
	background: #000;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 600;
	border-radius: 8px;
	letter-spacing: 0.3px;
	line-height: 1.5;
	width: fit-content;
}

.team-card__name {
	font-family: "Inter", sans-serif;
	font-size: 1.25rem;
	font-weight: 700;
	margin: 1rem 0;
	color: #111;
	line-height: 1.3;
}

.team-card__title {
	margin: 0;
	padding: 0.5rem 0;
	color: #6f6f6f;
	font-weight: 500;
	font-size: 0.9rem;
	line-height: 1.55;
	flex: 1;
	width: 100%;
}

.team-card__link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 1.25rem;
	font-size: 0.9rem;
	font-weight: 500;
	color: #555;
	text-decoration: none;
	position: relative;
	padding: 0.35rem 1.2rem;
	border-radius: 14px;
	background-color: #fff;
	box-shadow:
		var(--shadow-sm),
		inset 0 0 0 rgba(0, 0, 0, 0);
	transition:
		background-color 150ms ease,
		color 150ms ease,
		box-shadow 100ms ease;
}

.team-card__link:hover {
	box-shadow:
		var(--shadow-sm),
		inset -1px 2px rgba(0, 0, 0, 0.1);
	color: #000;
}

.team-card__link i {
	font-size: 0.7rem;
}

/* ------------------------------
   Documentation / Data Sources
-------------------------------- */
.docs-layout {
	display: grid;
	padding-top: 1rem;
	grid-template-columns: 2fr 3fr;
	gap: 3rem;
	align-items: start;
}

.docs-layout__graphic {
	padding: 2.5rem;
	border-radius: 30px;
	background-image: repeating-linear-gradient(45deg, #e0e0e0 0, #e0e0e0 1.5px, transparent 1.5px, transparent 50%);
	background-size: 15px 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 320px;
	position: relative;
}

.docs-layout__graphic::after {
	content: "Data Sources";
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 99;
	background: #fff;
	color: #111;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.5rem;
	letter-spacing: 1px;
	padding: 0.3rem 1rem;
	border-radius: 9999px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.docs-layout__graphic-inner {
	border-radius: 20px;
	padding: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.docs-layout__image {
	width: 100%;
	height: auto;
	max-width: 400px;
	object-fit: contain;
}

.docs {
	max-width: 860px;
}

.docs__header {
	padding-bottom: 3rem;
}

.docs__page-title {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 2.5rem;
	font-weight: 800;
	letter-spacing: 0.5px;
	margin: 0 0 0.75rem;
	color: #111;
	line-height: 1.1;
}

.docs__intro {
	color: #111;
	background-color: #fff;
	padding: 1rem 1.75rem;
	border-radius: 0 16px 16px 0;
	border-left: 10px solid #000;
	font-size: 1.05rem;
	line-height: 1.7;
	margin: 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.docs__entries {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.docs__entry {
	display: flex;
	gap: 2rem;
	padding: 3rem 0;
	border-bottom: 1px solid #ccc;
}

.docs__entry:first-child {
	padding-top: 0;
}

.docs__entry:last-child {
	border-bottom: none;
}

.docs__entry-content {
	flex: 1;
	min-width: 0;
}

.docs__entry-heading {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
	flex-wrap: wrap;
}

.docs__entry-abbr {
	display: inline-block;
	padding: 0.3rem 0.75rem;
	background: #000;
	color: #fff;
	font-size: 0.9rem;
	font-weight: 700;
	border-radius: 6px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	line-height: 1.5;
	white-space: nowrap;
}

.docs__entry-name {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 1.65rem;
	font-weight: 700;
	margin: 0;
	color: #111;
	line-height: 1;
}

.docs__entry-text {
	margin: 0;
	color: #555;
	font-size: 1rem;
	line-height: 1.7;
	font-weight: 400;
}

/* Docs load-in animations (mirrors news spotlight) */

/* Left column: graphic panel */
.docs-layout__graphic {
	opacity: 0;
	animation: newsPatternReveal 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.05s forwards;
}

.docs-layout__graphic-inner {
	opacity: 0;
	animation: newsSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s forwards;
}

.docs-layout__graphic::after {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.18s forwards;
}

/* Right column: header + entries cascade */
.docs__header {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s forwards;
}

.docs__entries > :nth-child(1) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.15s forwards;
}

.docs__entries > :nth-child(2) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.22s forwards;
}

.docs__entries > :nth-child(3) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.29s forwards;
}

.docs__entries > :nth-child(4) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.36s forwards;
}

.docs__entries > :nth-child(5) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.43s forwards;
}

.docs__entries > :nth-child(6) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.5s forwards;
}

.docs__entries > :nth-child(7) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.57s forwards;
}

/* ------------------------------
   Partners & Disclaimer
-------------------------------- */
.partners {
	padding-top: 2rem;
}

.partners .section-title-secondary {
	margin-bottom: 0.25rem;
}

.partners__subtitle {
	font-size: 1.05rem;
	color: #777;
	margin: 0 0 2.5rem;
	line-height: 1.6;
}

.partners__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.partner-card {
	background: #fff;
	border-radius: 30px;
	padding: 2.5rem;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	transition:
		transform 250ms ease,
		box-shadow 250ms ease;
}

.partner-card__logo-wrap {
	margin-bottom: 1.5rem;
}

.partner-card__logo {
	max-height: 50px;
	width: auto;
	object-fit: contain;
}

.partner-card__name {
	font-family: "Inter", sans-serif;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.3px;
	margin: 0 0 0.75rem;
	color: #111;
	line-height: 1.3;
}

.partner-card__description {
	margin: 0;
	color: #555;
	font-weight: 400;
	font-size: 0.95rem;
	line-height: 1.7;
	flex: 1;
}

.partner-card__link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 1.5rem;
	font-size: 0.9rem;
	font-weight: 500;
	color: #555;
	text-decoration: none;
	padding: 0.4rem 1.1rem;
	border-radius: 9999px;
	background-color: #fff;
	border: 1px solid #e0e0e0;
	width: fit-content;
	transition:
		background-color 150ms ease,
		color 150ms ease;
}

.partner-card__link:hover {
	background-color: #f5f5f5;
	color: #000;
}

.partner-card__link i {
	font-size: 0.7rem;
}

/* Disclaimer */
.disclaimer {
	padding-top: 3rem;
}

.disclaimer__card {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6rem;
	align-items: start;
	background: #fff;
	border-radius: 30px;
	padding: 2.5rem;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.disclaimer__title {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 1.5rem;
	font-weight: 700;
	text-transform: uppercase;
	color: #111;
	margin: 0 0 1rem;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.disclaimer__title i {
	font-size: 1.5rem;
}

.disclaimer__text {
	color: #444;
	font-size: 0.95rem;
	line-height: 1.7;
	margin: 0;
}

/* ------------------------------
   FAQ Section
-------------------------------- */
.faq {
	max-width: var(--container-max-width);
	margin-inline: auto;
	position: relative;
	z-index: 0;
}

.faq__inner {
	padding-block: 4rem 8rem;
	position: relative;
	z-index: 1;
}

.faq__lead {
	padding: 4rem 1rem 0 1rem;
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 3rem;
}

/* FAQ categories */
.faq__category {
	margin-bottom: 5rem;
}

.faq__category-header {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}

.faq__category-label {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 1.65rem;
	font-weight: 700;
	letter-spacing: 0.5px;
	margin: 0;
	color: #111;
}

.faq__collapse-all {
	margin-left: auto;
	font-size: 0.85rem;
	font-weight: 600;
	color: #999;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	transition: color 200ms ease;
	white-space: nowrap;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	font-family: inherit;
}

.faq__collapse-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 6px;
	background: #f0f0ec;
	color: #000;
	font-size: 0.7rem;
	transition:
		background 200ms ease,
		color 200ms ease;
}

.faq__collapse-all:hover {
	color: #000;
}

.faq__collapse-all:hover .faq__collapse-icon {
	background: #000;
	color: #fff;
}

/* Accordion items */
.faq__list {
	display: flex;
	gap: 1.25rem;
}

.faq__col {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.faq__item {
	border-radius: 16px;
	background: #fff;
	overflow: hidden;
	transition:
		border-color 200ms ease,
		box-shadow 200ms ease;
}

.faq__question {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.75rem 1.75rem 1.25rem;
	cursor: pointer;
	user-select: none;
	font-family: "Inter", sans-serif;
	font-size: 1.1rem;
	line-height: 1.3;
	font-weight: 600;
	color: #000;
	transition: background 150ms ease;
	position: relative;
	overflow: hidden;
}

.faq__question::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #000 0, #000 1.5px, transparent 1.5px, transparent 50%);
	opacity: 0;
	pointer-events: none;
	z-index: 0;
	transform: scale(0.8);
	transition:
		opacity 300ms ease,
		transform 300ms ease;
}

.faq__item[open] .faq__question::before {
	opacity: 0.03;
	transform: scale(1);
}
.faq__question::-webkit-details-marker {
	display: none;
}

.faq__question::marker {
	content: "";
}

.faq__question-inner {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 1;
	min-width: 0;
	position: relative;
	z-index: 1;
	padding-right: 1rem;
}

.faq__number {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: #000;
	color: var(--color-highlight);
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 700;
}

.faq__item[open] .faq__number {
	background: #000;
	color: #fff;
}

.faq__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 31px;
	height: 31px;
	border-radius: 8px;
	background: #ffffff;
	color: #000;
	font-size: 0.85rem;
	position: relative;
	z-index: 1;
	transition:
		transform 200ms ease,
		background 200ms ease,
		color 200ms ease;
}

.faq__item:hover .faq__icon {
	background: #000;
	color: #fff;
}

.faq__item[open] .faq__icon {
	transform: rotate(45deg);
	background: #000;
	color: #fff;
}

.faq__answer {
	padding: 1.5rem 3rem 3rem;
	color: #444;
	font-size: 1rem;
	line-height: 1.8;
	position: relative;
}

.faq__answer p {
	margin: 0 0 0.75rem;
	position: relative;
	z-index: 1;
}

.faq__answer p:last-child {
	margin-bottom: 0;
}

.faq__answer strong {
	color: #111;
	font-weight: 600;
}

.faq__answer a {
	color: #000;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.faq__answer a:hover {
	color: #555;
}

.faq__answer ul,
.faq__answer ol {
	margin: 0.75rem 0;
	padding-left: 0.25rem;
	list-style: none;
}

.faq__answer ol {
	counter-reset: faq-ol;
}

.faq__answer li {
	margin-bottom: 0.6rem;
	line-height: 1.65;
	padding-left: 1.75rem;
	position: relative;
}

.faq__answer li:last-child {
	margin-bottom: 0;
}

.faq__answer ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55rem;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: var(--color-highlight);
}

.faq__answer ol li::before {
	counter-increment: faq-ol;
	content: counter(faq-ol);
	position: absolute;
	left: 0;
	top: 0;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 0.85rem;
	color: #000;
	background: var(--color-highlight);
	width: 22px;
	height: 22px;
	border-radius: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

/* CTA strip */
.faq__cta {
	margin-top: 4rem;
}

.faq__cta-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding: 3rem 3.5rem;
	border-radius: 26px;
	background: #000;
	box-shadow: var(--shadow-sm);
	position: relative;
	overflow: hidden;
}

.faq__cta-inner::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.04;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #fff 0, #fff 1.5px, transparent 1.5px, transparent 50%);
	pointer-events: none;
}

.faq__cta-content {
	position: relative;
	z-index: 1;
}

.faq__cta-content .section-title {
	font-size: 2rem;
	font-weight: 700 !important;
}

.faq__cta-content p {
	margin: 0.5rem 0 0;
	color: #ccc;
	font-size: 1rem;
}

.faq__cta-actions {
	display: flex;
	gap: 1rem;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}

/* ------------------------------
   404 Error Page
-------------------------------- */
.error-hero__grid {
	border-radius: 20px;
	overflow: hidden;
}

.error-hero__inner {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	padding: 5rem;
	gap: 2rem;
	position: relative;
	z-index: 1;
}

.error-hero__content {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.error-hero__content p {
	color: #efefef;
	font-size: 1.15rem;
	line-height: 1.7;
	max-width: 540px;
	margin: 0;
}

.error-hero__code {
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	font-size: 7rem;
	line-height: 1;
	color: var(--color-highlight);
	opacity: 0.15;
	letter-spacing: 4px;
	margin-bottom: -1.5rem;
}

.error-hero__actions {
	display: flex;
	gap: 1rem;
	padding-top: 1rem;
}

/* ------------------------------
   News Spotlight (Resources Page)
-------------------------------- */
.news-spotlight {
	padding-block: 2rem 0;
}

.news-spotlight__grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 4rem;
	align-items: start;
}

/* Left graphic box */
.news-spotlight__graphic {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2.5rem;
	align-self: start;
	position: relative;
}

.news-spotlight__graphic::before {
	content: "";
	position: absolute;
	height: 100%;
	left: 0px;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, #e0e0e0 0, #e0e0e0 1.5px, transparent 1.5px, transparent 50%);
	border-radius: 20px;
	z-index: 0;
	top: 0px;
	width: 100%;
}

.news-spotlight__graphic img {
	max-width: 100%;
	height: auto;
	object-fit: contain;
	position: relative;
	z-index: 1;
}

.news-spotlight__graphic::after {
	content: "Recent News";
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 2;
	background: #fff;
	color: #111;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.5rem;
	letter-spacing: 1px;
	padding: 0.3rem 1rem;
	border-radius: 9999px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.news-spotlight__heading {
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 800;
	font-size: 1.5rem;
	line-height: 1;
	color: #000;
	margin: 0 0 1.5rem 0;
}

.news-spotlight__cards {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	margin-top: 1rem;
}

.news-spotlight__divider {
	border: none;
	height: 3px;
	background-color: #d0d0d07f;
	margin: 0;
	border-radius: 99px;
}

.news-spotlight__card {
	display: block;
}

.news-spotlight__body {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.news-spotlight__meta {
	font-size: 0.9rem;
	color: #999;
	font-weight: 400;
}

.news-spotlight__title {
	font-family: "Inter", sans-serif;
	font-weight: 600;
	font-size: 1.1rem;
	line-height: 1.25;
	color: #000;
	margin: 0;
}

.news-spotlight__excerpt {
	font-size: 1rem;
	color: #555;
	line-height: 1.55;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.news-spotlight__card .btn {
	align-self: flex-start;
	margin-top: 0.35rem;
	font-size: 0.9rem;
	padding: 0.35rem 1.1rem;
}

/* News Spotlight load-in animations */
@keyframes newsSlideIn {
	from {
		opacity: 0;
		transform: translateX(-30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes newsSlideUp {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes newsPatternReveal {
	from {
		opacity: 0;
		transform: scale(0.92);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* Left column: graphic slides in from left */
.news-spotlight__graphic img {
	opacity: 0;
	animation: newsSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s forwards;
}

.news-spotlight__graphic::before {
	opacity: 0;
	animation: newsPatternReveal 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0.05s forwards;
}

.news-spotlight__graphic::after {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.18s forwards;
}

/* Right column: cascading slide-up */
.news-spotlight__cards > :nth-child(1) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s forwards;
}

.news-spotlight__cards > :nth-child(2) {
	opacity: 0;
	animation: newsSlideUp 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0.22s forwards;
}

.news-spotlight__cards > :nth-child(3) {
	opacity: 0;
	animation: newsSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.3s forwards;
}

/* ------------------------------
   Resources Page
-------------------------------- */

/* Layout */
.resources {
	max-width: var(--container-max-width);
	margin-inline: auto;
}

.resources__inner {
	padding-block: 4.5rem 8rem;
	display: flex;
	flex-direction: column;
	gap: 4rem;
}

.resources__layout {
	display: block;
}

/* Filter Sidebar */
.resources__filters {
	position: sticky;
	top: 2rem;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
}

.filters__header {
	background: #000;
	padding: 1rem 1.5rem;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.filters__header-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: rgba(237, 194, 56, 0.15);
	color: var(--color-highlight);
	font-size: 0.875rem;
}

.filters__header h3 {
	margin: 0;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.25rem;
	letter-spacing: 1px;
	color: #fff;
}

.filters__body {
	padding: 1.25rem 1.5rem 1.5rem;
}

.filters__group {
	margin-bottom: 1.5rem;
}

.filters__group:last-child {
	margin-bottom: 0;
}

.filters__group-title {
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.5px;
	color: #999;
	margin: 0 0 0.25rem;
}

.filters__group label {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.35rem 0.65rem;
	border-radius: 8px;
	cursor: pointer;
	transition: background 150ms ease;
	font-family: "Inter", sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	color: #333;
}

.filters__group label:hover {
	background: #f5f5f5;
}

.filters__group label input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	border: 2px solid #ccc;
	border-radius: 5px;
	cursor: pointer;
	position: relative;
	flex-shrink: 0;
	transition: all 150ms ease;
}

.filters__group label input[type="checkbox"]:checked {
	background: #000;
	border-color: #000;
}

.filters__group label input[type="checkbox"]:checked::after {
	content: "\f00c";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 0.625rem;
	color: var(--color-highlight);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.filters__type-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 6px;
	font-size: 0.875rem;
	flex-shrink: 0;
}

/* ------------------------------
   Contact Page
-------------------------------- */
.contact {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 4rem;
	align-items: start;
}

.contact__heading {
	font-family: "United Sans Condensed", "United Sans Condensed Fallback", sans-serif;
	font-size: 2.4rem;
	font-weight: 800;
	line-height: 1.1;
	margin: 0 0 1rem;
}

.contact__desc {
	color: #444;
	line-height: 1.8;
	margin: 0 0 2.5rem;
}

.contact__details {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.contact__detail {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}

.contact__detail-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: #000;
	color: var(--color-highlight);
	font-size: 1rem;
	flex-shrink: 0;
}

.contact__detail div {
	display: flex;
	flex-direction: column;
	gap: 0;
	line-height: 1.4;
}

.contact__detail strong {
	font-size: 1rem;
	color: #000;
	line-height: 1.3;
}

.contact__detail span {
	font-size: 1rem;
	color: #efefef;
	text-decoration: none;
	transition: color 0.2s ease;
}

.contact__link {
	font-size: 1rem;
	color: #555;
	text-decoration: none;
	transition: color 0.2s ease;
}

.contact__link:hover {
	color: #000;
	text-decoration: underline;
}

/* Form */
.contact__form {
	background: #fff;
	border-radius: 16px;
	padding: 2.5rem;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.contact__form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
}

.contact__field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.contact__field label {
	font-size: 1rem;
	font-weight: 600;
	color: #333;
}

.contact__field input,
.contact__field textarea,
.contact__field select {
	width: 100%;
	padding: 0.7rem 0.9rem;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	color: #000;
	background: #f8f8f8;
	border: 1.5px solid #e0e0e0;
	border-radius: 10px;
	outline: none;
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}

.contact__field input:focus,
.contact__field textarea:focus,
.contact__field select:focus {
	border-color: #000;
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
}

.contact__field input::placeholder,
.contact__field textarea::placeholder {
	color: #aaa;
}

.contact__field textarea {
	resize: vertical;
	min-height: 100px;
}

/* Custom select wrapper */
.contact__select-wrap {
	position: relative;
}

.contact__select-wrap select {
	appearance: none;
	-webkit-appearance: none;
	padding-right: 2.5rem;
	cursor: pointer;
}

.contact__select-icon {
	position: absolute;
	right: 0.9rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1rem;
	color: #999;
	pointer-events: none;
}

/* Captcha */
.contact__captcha {
	padding-top: 0.25rem;
}

.contact__captcha .g-recaptcha {
	transform-origin: 0 0;
}

/* ------------------------------
   Help Guide Page
-------------------------------- */

/* Guide Hero */
.guide-hero {
	max-width: var(--container-max-width);
	padding-inline: 2.5rem;
	margin-inline: auto;
	padding-block: 1rem;
	position: relative;
}

.guide-hero__inner {
	background: #000;
	border-radius: var(--border-radius);
	overflow: hidden;
	padding: 5rem;
	position: relative;
	z-index: 1;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.guide-hero__inner::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.12) 0, rgba(255, 255, 255, 0.12) 1.5px, transparent 1.5px, transparent 50%);
	mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 60%);
	-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 60%);
	pointer-events: none;
	z-index: 0;
}

.guide-hero__breadcrumb {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 1.25rem;
	font-size: 0.95rem;
	position: relative;
	z-index: 1;
}

.guide-hero__breadcrumb a {
	color: #fff;
	text-decoration: none;
	transition: color 150ms ease;
}

.guide-hero__breadcrumb a:hover {
	color: var(--color-highlight);
	text-decoration: underline;
}

.guide-hero__breadcrumb i {
	font-size: 0.6rem;
	color: #ccc;
}

.guide-hero__breadcrumb span {
	color: #ccc;
	font-weight: 500;
}

.guide-hero__title {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 3.75rem;
	font-weight: 800;
	color: #fff;
	letter-spacing: 0.5px;
	margin: 0;
	line-height: 1.15;
	position: relative;
	z-index: 1;
}

.guide-hero__subtitle {
	color: #f3f3f3;
	font-size: 1.15rem;
	line-height: 1.7;
	margin: 0 0 1.5rem;
	max-width: 700px;
	position: relative;
	z-index: 1;
}

.guide-hero__download {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.65rem 1.5rem;
	background: var(--color-highlight);
	color: #000;
	font-weight: 600;
	font-size: 0.95rem;
	border-radius: 8px;
	text-decoration: none;
	transition: opacity 150ms ease;
	position: relative;
	z-index: 1;
}

.guide-hero__download:hover {
	opacity: 0.85;
}

.guide-hero__actions {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex-wrap: wrap;
	position: relative;
	z-index: 1;
}

/* Guide Page Motion */
.is-guide .guide-hero__breadcrumb,
.is-guide .guide-hero__title,
.is-guide .guide-hero__subtitle,
.is-guide .guide-hero__download {
	opacity: 0;
	transform: translateX(-28px);
	animation: guide-slide-in-left 520ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.is-guide .guide-hero__breadcrumb {
	animation-delay: 80ms;
}

.is-guide .guide-hero__title {
	animation-delay: 140ms;
}

.is-guide .guide-hero__subtitle {
	animation-delay: 200ms;
}

.is-guide .guide-hero__download {
	animation-delay: 260ms;
}

.is-guide .guide-hero__actions .guide-mobile-nav-toggle {
	opacity: 0;
	transform: translateX(-28px);
	animation: guide-slide-in-left 520ms cubic-bezier(0.22, 1, 0.36, 1) 300ms forwards;
}

.is-guide .guide-content {
	opacity: 1;
	transform: none;
	animation: none;
}

.is-guide .guide-content > * {
	opacity: 0;
	transform: translateY(20px);
	animation: guide-rise-up 520ms cubic-bezier(0.22, 1, 0.36, 1) 320ms forwards;
}

.is-guide .guide-content > *:nth-child(2) {
	animation-delay: 380ms;
}

.is-guide .guide-content > *:nth-child(3) {
	animation-delay: 440ms;
}

.is-guide .guide-content > *:nth-child(4) {
	animation-delay: 500ms;
}

.is-guide .guide-content > *:nth-child(5) {
	animation-delay: 560ms;
}

.is-guide .guide-content > .guide-intro {
	transform: translateX(-28px);
	animation: guide-slide-in-left 520ms cubic-bezier(0.22, 1, 0.36, 1) 320ms forwards;
}

@keyframes guide-slide-in-left {
	from {
		opacity: 0;
		transform: translateX(-28px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes guide-rise-up {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.is-guide .guide-hero__breadcrumb,
	.is-guide .guide-hero__title,
	.is-guide .guide-hero__subtitle,
	.is-guide .guide-hero__download,
	.is-guide .guide-content,
	.is-guide .guide-content > * {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Guide Layout */
.guide-layout {
	padding-block: 2.5rem 6rem;
	display: flex;
	gap: 3rem;
	align-items: flex-start;
}

/* Guide Content */
.guide-content {
	flex: 1;
	min-width: 0;
	max-width: 900px;
}

/* Guide Sidebar */
.guide-sidebar {
	width: 300px;
	flex-shrink: 0;
	margin-right: 1.5rem;
	background-color: #fff;
	padding: 1rem;
	border-radius: 1rem;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
	position: sticky;
	top: 2rem;
	align-self: flex-start;
}

.guide-sidebar__heading {
	font-family: "Inter", sans-serif;
	font-size: 0.9rem;
	font-weight: 700;
	color: #777;
	margin: 0 0 0.2rem;
	padding-left: 0.5rem;
}

.guide-sidebar__nav + .guide-sidebar__heading {
	margin-top: 1.75rem;
}

.guide-sidebar__heading i {
	font-size: 0.7rem;
	color: inherit;
	margin-right: 0.2rem;
}

.guide-sidebar__nav {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.guide-sidebar__link {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.5rem 0.75rem;
	border-radius: 10px;
	text-decoration: none;
	color: #777;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.3;
	transition:
		background 150ms ease,
		color 150ms ease;
}

.guide-sidebar__link:hover {
	background: #fff;
	color: #000;
	font-weight: 600;
}

.guide-sidebar__link--active {
	background: #000;
	color: #fff;
	font-weight: 600;
}

.guide-sidebar__link--active:hover {
	background: #000;
	color: #fff;
	cursor: default;
}

.guide-sidebar__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 45px;
	height: 45px;
	border-radius: 8px;
	background: #111;
	flex-shrink: 0;
}

.guide-sidebar__icon img {
	width: auto;
	height: auto;
	max-width: 40px;
	max-height: 40px;
	object-fit: contain;
}

.guide-sidebar__icon i {
	font-size: 0.85rem;
	color: #fff;
}

.guide-sidebar__link--active .guide-sidebar__icon {
	background: var(--color-highlight);
}

.guide-sidebar__link--active .guide-sidebar__icon i {
	color: #111;
}

/* Mobile guide nav elements are enabled in responsive.css */
.guide-mobile-nav-toggle,
.guide-mobile-nav-backdrop {
	display: none;
}

/* Guide Intro */
.guide-intro {
	color: #111;
	background-color: #fff;
	padding: 1.75rem;
	border-radius: 0 16px 16px 0;
	border-left: 10px solid #000;
	font-size: 1rem;
	margin: 0;
	margin-bottom: 3rem;
	margin-top: 1rem;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

/* TOC (top, 3-column) */
.guide-toc {
	margin-bottom: 5rem;
}

.guide-toc__heading {
	font-family: "Inter", sans-serif;
	font-size: 0.9em;
	font-weight: 700;
	margin: 0 0 0.75rem;
	color: #555555ba;
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.guide-toc__heading i {
	font-size: 0.7rem;
	color: #555555ba;
}

.guide-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	columns: 3;
	column-gap: 2rem;
	counter-reset: toc;
}

.guide-toc__list--2col {
	columns: 2;
}

.guide-toc__list li {
	counter-increment: toc;
	break-inside: avoid;
}

.guide-toc__list a {
	display: block;
	padding: 0.25rem 0;
	font-size: 0.95rem;
	font-weight: 500;
	color: #111;
	text-decoration: none;
	transition: color 150ms ease;
	line-height: 1.5;
}

.guide-toc__list a::before {
	content: counter(toc, decimal-leading-zero) ".";
	font-weight: 600;
	color: #999;
	display: inline-block;
	width: 2rem;
	font-variant-numeric: tabular-nums;
}

.guide-toc__list a:hover {
	color: #000;
	font-weight: 600;
}

.guide-toc__list a:hover::before {
	color: #555;
}

/* Guide Section */
.guide-section {
	padding-bottom: 4rem;
	margin-bottom: 4rem;
	border-bottom: 2px solid #e0e0e0;
	scroll-margin-top: 4.5rem;
}

.guide-section:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

/* Section with image: title → image → text stacked */
.guide-section__image {
	margin-bottom: 1.75rem;
}

.guide-section__image img {
	display: block;
	width: 100%;
	height: auto;
}

.guide-footnote {
	font-size: 0.9rem !important;
	line-height: 1.5 !important;
	opacity: 0.7;
	font-style: normal;
	margin: -0.5rem 0 1.5rem !important;
}

.guide-section__subtitle {
	padding-top: 2rem;
}

.guide-section__title {
	font-family: "United Sans Condensed", sans-serif;
	font-size: 2rem;
	font-weight: 800;
	letter-spacing: 0.4px;
	margin: 0 0 2rem;
	color: #000;
	line-height: 1.25;
}

.guide-section p {
	font-size: 1.1rem;
	line-height: 1.85;
	color: #111;
	margin: 0 0 2rem;
}

.guide-section p:last-child {
	margin-bottom: 0;
}

.guide-section ul,
.guide-section ol {
	margin: -1rem 0 2rem 1.25rem;
	padding: 0;
	font-size: 1.1rem;
	line-height: 1.85;
	color: #111;
}

.guide-section ul li,
.guide-section ol li {
	margin-bottom: 0.65rem;
}

.guide-section a {
	color: #444;
	text-decoration: underline;
	text-underline-offset: 3px;
	font-weight: 500;
	transition: color 150ms ease;
}

.guide-section a:hover {
	color: #000;
}

/* Quadrant Graph */
.quadrant-graph {
	margin: 1.5rem 0 4rem;
	max-width: 800px;
	border-radius: 50px;
	border: 5px solid #000;
	overflow: hidden;
}

.quadrant-graph svg {
	width: 100%;
	height: auto;
	display: block;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
}

/* Guide Callout */
.guide-callout {
	display: flex;
	gap: 1rem;
	background-color: #fff;
	padding: 1.25rem 1.5rem;
	border-radius: 8px;
	font-size: 1.1rem;
	line-height: 1.7;
	margin-bottom: 5rem;
	align-items: flex-start;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.guide-callout > i {
	flex-shrink: 0;
	font-size: 1.2rem;
	margin-top: 0.25rem;
}

.guide-callout p {
	margin: 0;
}

.guide-callout--info > i {
	color: var(--color-highlight);
}

.guide-callout--warn {
	background: #fffdf0;
	border-left: 4px solid #edc238;
	color: #5a4500;
}

.guide-callout--warn > i {
	color: #edc238;
}

.guide-callout--warn strong {
	display: block;
	margin-bottom: 0.25rem;
	color: #111;
	font-size: 1.05rem;
}

.guide-callout--warn p {
	color: #555;
}

.guide-steps {
	background: #fff;
	border-radius: 12px;
	margin: 1.5rem 0 3rem 0 !important;
	counter-reset: steps;
	list-style: none;
}

.guide-steps li {
	counter-increment: steps;
	padding: 0.5rem 0 0.5rem 3.25rem;
	position: relative;
	font-size: 1.1rem;
	line-height: 1.7;
	color: #111;
}

.guide-steps li::before {
	content: counter(steps);
	position: absolute;
	left: 1rem;
	width: 1.6rem;
	height: 1.6rem;
	background: #000;
	color: #fff;
	font-weight: 700;
	font-size: 0.85rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 0.6rem;
}

.guide-steps li + li {
	border-top: 1px solid #f0f0f0;
}

/* ------------------------------
   Print Styles
-------------------------------- */
@media print {
	/* Remove all page margins and padding */
	@page {
		margin: 0;
		size: auto;
	}

	body {
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Hide everything except embed content */
	.site-header,
	.site-footer,
	.page-section-header,
	.embed__menubar,
	.embed__frame-header,
	.mobile-menu-overlay,
	.mobile-menu-drawer,
	.hamburger-btn,
	.main-nav,
	.dashboards,
	.desktop-alert {
		display: none !important;
	}

	/* Show and style embed content */
	#page-content {
		margin: 0 !important;
		padding: 0 !important;
	}

	.embed__content {
		display: block !important;
		margin: 0 !important;
		padding: 0 !important;
		background: #fff !important;
		min-height: auto !important;
		page-break-before: avoid !important;
		page-break-after: avoid !important;
	}

	.embed__inner {
		min-width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
		display: block !important;
	}

	.embed__frame {
		margin: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.embed__frame-wrap {
		width: 100% !important;
	}

	.embed__frame-content {
		padding: 0 !important;
		width: 100% !important;
	}

	.embed__frame-border {
		padding: 0 !important;
		margin: 0 !important;
		width: 100% !important;
		overflow: hidden !important;
	}

	/* Scale Tableau and iframes to fit print page (1440px -> ~750px) */
	tableau-viz,
	.embed__frame-border iframe {
		width: 1440px !important;
		max-width: none !important;
		transform: scale(0.52) !important;
		transform-origin: top left !important;
		margin: 0 !important;
	}

	/* Ensure print quality */
	* {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}
}

/* Submit button */
.contact__submit {
	align-self: flex-start;
	padding: 0.65rem 2rem;
	font-size: 1rem;
	margin-top: 0.5rem;
	cursor: pointer;
	border: none;
}

/* Form status messages */
.contact__status {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	padding: 1.1rem 1.25rem;
	padding-right: 2.5rem;
	border-radius: 12px;
	font-family: "Inter", sans-serif;
	line-height: 1.5;
	background: #000;
	position: relative;
}

.contact__status-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	flex-shrink: 0;
	font-size: 0.8rem;
	margin-top: 1px;
}

.contact__status-icon i {
	font-size: 1.25rem;
}

.contact__status--success .contact__status-icon {
	background: var(--color-highlight);
	color: #111;
}

.contact__status--error .contact__status-icon {
	background: #c0392b;
	color: #fff;
}

.contact__status-body strong {
	display: block;
	font-size: 1rem;
	color: #fff;
}

.contact__status-body p {
	margin: 0;
	font-size: 1rem;
	color: #fff;
}

.contact__status--animate {
	animation: contactStatusIn 0.35s ease-out;
}

.contact__status--fade-out {
	animation: contactStatusOut 0.3s ease-in forwards;
}

.contact__status-close {
	position: absolute;
	top: 10px;
	right: 12px;
	background: none;
	border: none;
	color: #fff;
	font-size: 1.25rem;
	cursor: pointer;
	line-height: 1;
	padding: 2px 6px;
	border-radius: 4px;
	transition: color 0.15s ease;
}

.contact__status-close:hover {
	color: var(--color-highlight);
}

@keyframes contactStatusIn {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes contactStatusOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-6px);
	}
}

/* Responsive */
@media (max-width: 860px) {
	.contact {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.contact__form-row {
		grid-template-columns: 1fr;
	}
}

.filters__type-icon--pdf,
.filters__type-icon--report,
.filters__type-icon--slides,
.filters__type-icon--video,
.filters__type-icon--data {
	background: #f0f0f0;
	color: #333;
}

.filters__clear {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 100%;
	padding: 0.7rem;
	border: 2px solid #eee;
	border-radius: 10px;
	background: none;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	color: #999;
	cursor: pointer;
	transition: all 150ms ease;
	margin-top: 0.25rem;
}

.filters__clear:hover {
	border-color: #000;
	color: #000;
}

/* Downloads Table */
.resources__table-wrap {
	background: #fff;
	border-radius: 16px;
	overflow: visible;
}

.table__header {
	background: #000;
	padding: 1rem 1.75rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	position: relative;
	overflow: visible;
	border-radius: 16px 16px 0 0;
}

.table__header::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 70%;
	height: 100%;
	background-size: 15px 15px;
	background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.12) 0, rgba(255, 255, 255, 0.12) 1.5px, transparent 1.5px, transparent 50%);
	mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	pointer-events: none;
	z-index: 0;
	border-radius: 0 16px 0 0;
}

.table__header-left {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	position: relative;
	z-index: 1;
}

.table__header-left h3 {
	margin: 0;
	font-family: "United Sans Condensed", sans-serif;
	font-weight: 700;
	font-size: 1.25rem;
	letter-spacing: 1px;
	color: #fff;
}

.table__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.2rem 0.65rem;
	border-radius: 20px;
	background: rgba(237, 194, 56, 0.15);
	color: var(--color-highlight);
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 700;
}

/* Filter Dropdown */
.table__filter-wrap {
	position: relative;
	z-index: 2;
}

.table__filter-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: #000;
	border: 2px solid rgba(255, 255, 255, 0.5);
	border-radius: 8px;
	padding: 0.5rem 1rem;
	color: #fff;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 150ms ease;
	line-height: 1;
}

.table__filter-toggle:hover {
	border-color: rgba(255, 255, 255, 0.4);
}

.table__filter-toggle.active {
	background: var(--color-highlight);
	border-color: var(--color-highlight);
	color: #000;
}

.table__filter-toggle i {
	font-size: 0.875rem;
	line-height: 1;
}

.table__filter-toggle span {
	line-height: 1;
}

.table__filter-count {
	display: none;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--color-highlight);
	color: #000;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1;
}

.table__filter-toggle.active .table__filter-count {
	background: #000;
	color: var(--color-highlight);
}

/* Filter Panel (dropdown menu) */
.table__filter-panel {
	position: absolute;
	top: calc(100% + 0.5rem);
	right: 0;
	width: 280px;
	background: #fff;
	border-radius: 12px;
	box-shadow:
		0 8px 30px rgba(0, 0, 0, 0.15),
		0 1px 4px rgba(0, 0, 0, 0.08);
	padding: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition:
		opacity 0.2s ease,
		transform 0.2s ease,
		visibility 0.2s;
	z-index: 10;
}

.table__filter-panel.open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.filter-panel__group {
	padding: 0.85rem 1.15rem 0.75rem;
	border-bottom: 1px solid #f0f0f0;
}

.filter-panel__group:last-of-type {
	border-bottom: none;
}

.filter-panel__label {
	margin: 0 0 0.4rem;
	font-family: "Inter", sans-serif;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #aaa;
}

.filter-panel__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem;
}

.filter-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.3rem 0.65rem;
	border-radius: 6px;
	border: 2px solid #c7c7c7;
	background: #fff;
	color: #999;
	font-family: "Inter", sans-serif;
	font-size: 0.92rem;
	font-weight: 500;
	/* letter-spacing: 1px; */
	cursor: pointer;
	transition: all 120ms ease;
	white-space: nowrap;
}

.filter-pill i {
	font-size: 0.7rem;
}

.filter-pill:hover {
	border-color: #ccc;
	color: #555;
	background: #fafafa;
}

.filter-pill.active {
	background: #000;
	border-color: #000;
	color: #fff;
}

.filter-pill.active:hover {
	background: #222;
	border-color: #222;
}

.filter-panel__actions {
	padding: 0.65rem 1.15rem;
	border-top: 1px solid #f0f0f0;
}

.filter-panel__reset {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: none;
	border: none;
	font-family: "Inter", sans-serif;
	font-size: 0.78rem;
	font-weight: 600;
	color: #999;
	cursor: pointer;
	padding: 0.3rem 0.4rem;
	border-radius: 6px;
	transition: all 150ms ease;
}

.filter-panel__reset:hover {
	color: #333;
	background: rgba(0, 0, 0, 0.05);
}

.filter-panel__reset i {
	font-size: 0.7rem;
}

/* Table */
.resources__table {
	width: 100%;
	border-collapse: collapse;
}

.resources__table thead th {
	padding: 1rem 1.75rem;
	text-align: left;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.5px;
	color: #999;
	border-bottom: 2px solid #f0f0f0;
	white-space: nowrap;
}

.resources__table thead th.th-sortable {
	cursor: pointer;
	user-select: none;
	transition: color 150ms ease;
}

.resources__table thead th.th-sortable:hover {
	color: #333;
}

.resources__table thead th.th-sortable--active {
	color: #111;
}

.resources__table thead th .sort-icon {
	margin-left: 0.35rem;
	font-size: 0.75rem;
	opacity: 0.4;
	transition: opacity 150ms ease;
}

.resources__table thead th.th-sortable:hover .sort-icon {
	opacity: 0.7;
}

.resources__table thead th.th-sortable--active .sort-icon {
	opacity: 1;
	color: var(--color-highlight);
}

.resources__table thead th:last-child {
	text-align: center;
}

.resources__table thead th:first-child,
.resources__table tbody td:first-child {
	padding-right: 1.5rem;
	width: 1%;
}

.resources__table thead th:nth-child(2) {
	padding-left: 0.75rem;
}

.resources__table tbody tr {
	transition: background 150ms ease;
}

.resources__table tbody tr:hover {
	background: #fafaf8;
}

.resources__table tbody td {
	padding: 1.15rem 1.75rem;
	border-bottom: 1px solid #f0f0f0;
	font-family: "Inter", sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	color: #777;
	vertical-align: middle;
}

.resources__table tbody tr:last-child td {
	border-bottom: none;
}

/* Links / Resources variant */
.resources__table--links td:first-child,
.resources__table--links th:first-child {
	padding-right: 0.75rem;
	width: 1%;
}

.resources__table--links td:nth-child(2) {
	padding-left: 0.75rem;
}

.resource-desc {
	font-size: 0.85rem;
	line-height: 1.75;
	color: #666;
	margin: 0.5rem 0 0;
	font-weight: 400;
	max-width: 800px;
}

/* Type Badge */
.type-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.75rem;
	border-radius: 8px;
	font-size: 0.875rem;
	font-weight: 600;
	white-space: nowrap;
}

.type-badge i {
	font-size: 0.875rem;
}

.type-badge--pdf,
.type-badge--report,
.type-badge--slides,
.type-badge--video,
.type-badge--data,
.type-badge--datamap {
	background: #f0f0f0;
	color: #333;
}

/* Resource Title Cell */
.resource-title {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.resource-title strong {
	font-weight: 600;
	color: #000;
	font-size: 1rem;
	line-height: 1.3;
}

.resource-title span {
	font-size: 0.9rem;
	font-weight: 400;
	color: #777;
	line-height: 1.3;
}

/* Resource Meta Cells */
.resource-size,
.resource-date {
	font-size: 0.875rem;
	color: #777;
	white-space: nowrap;
}

/* Download Button */
.dl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.5rem 1.1rem;
	border-radius: 8px;
	background: #000;
	color: #fff;
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	white-space: nowrap;
	transition: all 150ms ease;
	border: none;
	cursor: pointer;
}

.dl-btn i {
	color: var(--color-highlight);
	font-size: 0.875rem;
	transition: transform 200ms ease;
}

.dl-btn:hover {
	background: #222;
}

.dl-btn:hover i {
	transform: translateY(2px);
}

/* Table Footer */
.table__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.75rem;
	border-top: 2px solid #f0f0f0;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	color: #999;
}

.table__footer-pages {
	display: flex;
	align-items: center;
	gap: 0.35rem;
}

.table__page-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	border: none;
	background: none;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	color: #999;
	cursor: pointer;
	transition: all 150ms ease;
}

.table__page-btn:hover {
	background: #f0f0f0;
	color: #000;
}

.table__page-btn--active {
	background: #000;
	color: #fff;
}

.table__page-btn--active:hover {
	background: #222;
	color: #fff;
}

/* Resources Responsive */
@media (max-width: 900px) {
	.table__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.75rem;
	}
}