.ah-zt {
	--ah-zt-accent: #e9386e;
	--ah-zt-active-text: #ffffff;
	--ah-zt-idle-bg: #d9d9d9;
	--ah-zt-idle-text: #a7a9ac;
	--ah-zt-rail: #ededee;
	--ah-zt-panel-bg: #ffffff;
	--ah-zt-cols: 3;
	--ah-zt-gap: 2px;
	--ah-zt-slide: 78%;
	border-radius: 0;
}

.ah-zt *,
.ah-zt *::before,
.ah-zt *::after {
	border-radius: 0;
}

.ah-zt__nav {
	display: grid;
	grid-template-columns: repeat(var(--ah-zt-cols), minmax(0, 1fr));
	align-items: stretch;
	gap: var(--ah-zt-gap);
	background: var(--ah-zt-rail);
}

/* ---------------------------------------------------------------------
 * Tabs are <button> elements, so Elementor's Site Settings > Buttons
 * (.elementor-kit-N button, specificity 0,1,1) would otherwise win over a
 * single class. Every selector below is at least 0,2,1 so the plugin's own
 * styling holds without needing !important.
 * ------------------------------------------------------------------ */

.ah-zt .ah-zt__nav button.ah-zt__tab {
	display: flex;
	align-items: flex-end;
	gap: .6rem;
	width: 100%;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 1rem 1.25rem;
	border: 0;
	border-radius: 0;
	background: var(--ah-zt-idle-bg);
	background-image: none;
	color: var(--ah-zt-idle-text);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 400;
	font-style: normal;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	text-align: left;
	text-decoration: none;
	text-shadow: none;
	box-shadow: none;
	fill: currentColor;
	cursor: pointer;
	overflow: visible;
	appearance: none;
	-webkit-appearance: none;
	transition: background-color .2s ease, color .2s ease;
}

.ah-zt .ah-zt__nav button.ah-zt__tab:hover,
.ah-zt .ah-zt__nav button.ah-zt__tab:focus {
	background: var(--ah-zt-idle-bg);
	background-image: none;
	color: var(--ah-zt-accent);
	border: 0;
	box-shadow: none;
	transform: none;
}

.ah-zt .ah-zt__nav button.ah-zt__tab[aria-selected="true"],
.ah-zt .ah-zt__nav button.ah-zt__tab[aria-selected="true"]:hover,
.ah-zt .ah-zt__nav button.ah-zt__tab[aria-selected="true"]:focus {
	background: var(--ah-zt-accent);
	background-image: none;
	color: var(--ah-zt-active-text);
}

.ah-zt .ah-zt__nav button.ah-zt__tab:focus {
	outline: none;
}

.ah-zt .ah-zt__nav button.ah-zt__tab:focus-visible {
	outline: 3px solid var(--ah-zt-accent);
	outline-offset: -3px;
}

/* Numeral sits on the same baseline as the last line of the label. */
.ah-zt .ah-zt__nav button.ah-zt__tab .ah-zt__num {
	flex: 0 0 auto;
	font-size: clamp(2.25rem, 4.5vw, 4.25rem);
	font-style: italic;
	font-weight: 700;
	line-height: .8;
	color: inherit;
	transform: translateY(.08em);
}

/* Never truncate: the label wraps to as many lines as it needs and the
   whole tab row grows to match the tallest one. */
.ah-zt .ah-zt__nav button.ah-zt__tab .ah-zt__label {
	flex: 1 1 auto;
	min-width: 0;
	font-size: .85rem;
	font-style: italic;
	font-weight: 700;
	line-height: 1.25;
	color: inherit;
	white-space: normal;
	overflow-wrap: break-word;
	word-break: normal;
	hyphens: auto;
	text-overflow: clip;
	-webkit-line-clamp: none;
}

.ah-zt__panel {
	padding: 2rem 2.5rem;
	border-left: 6px solid var(--ah-zt-accent);
	background: var(--ah-zt-panel-bg);
	contain: layout paint style;
}

.ah-zt__panel[hidden] {
	display: none;
}

.ah-zt__body > *:first-child {
	margin-top: 0;
}

.ah-zt__body img {
	max-width: 100%;
	height: auto;
}

.ah-zt__body h2,
.ah-zt__body h3,
.ah-zt__body h4 {
	font-style: italic;
	font-weight: 700;
}

.ah-zt__more {
	margin-bottom: 0;
}

.ah-zt__more a {
	color: var(--ah-zt-accent);
	font-weight: 700;
	text-decoration: none;
}

.ah-zt__more a:hover {
	text-decoration: underline;
}

.ah-zt-notice {
	padding: 1rem;
	border-left: 4px solid #d63638;
	background: #fcf0f1;
}

@media (max-width: 1024px) {
	.ah-zt__panel {
		padding: 1.75rem 2rem;
	}
}

/* ---------------------------------------------------------------------
 * Mobile: the tab row becomes a horizontal snap slider rather than a
 * stack, so all categories stay reachable without a wall of buttons.
 * ------------------------------------------------------------------ */

@media (max-width: 767px) {
	.ah-zt__nav {
		display: flex;
		grid-template-columns: none;
		flex-wrap: nowrap;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.ah-zt__nav::-webkit-scrollbar {
		display: none;
	}

	.ah-zt .ah-zt__nav button.ah-zt__tab {
		flex: 0 0 var(--ah-zt-slide);
		width: var(--ah-zt-slide);
		min-height: 6.5rem;
		padding: .85rem 1rem;
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}

	.ah-zt .ah-zt__nav button.ah-zt__tab .ah-zt__num {
		font-size: 2.75rem;
	}

	.ah-zt .ah-zt__nav button.ah-zt__tab .ah-zt__label {
		font-size: .8rem;
	}

	.ah-zt__panel {
		padding: 1.5rem 1.25rem;
		border-left-width: 4px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ah-zt .ah-zt__nav button.ah-zt__tab {
		transition: none;
	}

	.ah-zt__nav {
		scroll-behavior: auto;
	}
}
