/* General FAQ. The intro sits in the Simple page hero.
   Category links match the Why Kaya subnav. The bar pins under the site header. */

@media (prefers-reduced-motion: no-preference) {
	html:has(body.kaya-faq) {
		scroll-behavior: smooth;
	}
}

body.kaya-faq {
	/* Body overflow:hidden (Salient) makes this the scrollport and stops sticky.
	   Visible lets the bar pin to the viewport. The mobile menu still locks scroll. */
	overflow: visible;
	--kaya-faq-sticky-top: 8.75rem;
	--kaya-faq-nav-h: min(5rem, 4.1666666667vw);
}

body.kaya-faq.kaya-mobile-nav-open {
	overflow: hidden;
}

body.admin-bar.kaya-faq {
	--kaya-faq-sticky-top: calc(8.75rem + 32px);
}

body.kaya-faq,
body.kaya-faq #ajax-content-wrap {
	background-color: var(--kaya-white);
}

body.kaya-faq #page-header-wrap,
body.kaya-faq .page-header-no-bg {
	display: none;
}

body.kaya-faq #ajax-content-wrap > .container-wrap {
	margin-top: 0;
	padding-top: 0;
	max-width: none;
	background-color: var(--kaya-white);
}

body.kaya-faq .kaya-dest-hero--simple {
	margin-bottom: 0;
}

body.kaya-faq .kaya-dest-hero--simple .kaya-dest-hero__body {
	width: min(46rem, 100%);
	max-width: 46rem;
	margin: 0;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--kaya-white);
}

.kaya-faq {
	margin-top: 0;
}

.kaya-faq-nav {
	position: sticky;
	top: var(--kaya-faq-sticky-top);
	z-index: 30;
	margin-top: 0;
	background-color: var(--kaya-white);
	border-bottom: 1px solid color-mix(in srgb, var(--kaya-brown) 12%, transparent);
}

body.kaya-faq .kaya-wk-subnav ul,
body.kaya-faq .kaya-wk-subnav li {
	list-style: none;
	margin: 0;
	background: none;
}

body.kaya-faq .kaya-wk-subnav li {
	padding: 0;
}

body.kaya-faq .kaya-wk-subnav li::before,
body.kaya-faq .kaya-wk-subnav li::after,
body.kaya-faq .kaya-wk-subnav li::marker {
	content: none;
	display: none;
}

body.kaya-faq .kaya-wk-subnav__list {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	width: 100%;
	max-width: 120rem;
	height: var(--kaya-faq-nav-h);
	margin: 0 auto;
	padding: 0 min(6.25rem, 5.2083333333vw);
	gap: 0;
	list-style: none;
	overflow-x: auto;
}

body.kaya-faq .kaya-wk-subnav__item {
	flex: 0 0 auto;
	padding: 0;
}

body.kaya-faq .kaya-wk-subnav__link {
	display: inline-block;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	font-size: min(0.75rem, 0.625vw);
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--kaya-maroon);
	white-space: nowrap;
}

body.kaya-faq .kaya-wk-subnav__link:hover,
body.kaya-faq .kaya-wk-subnav__link:focus-visible {
	text-decoration: none;
	color: var(--kaya-maroon);
}

body.kaya-faq .kaya-wk-subnav__link.is-active {
	text-decoration: underline;
	text-decoration-color: var(--kaya-orange);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.45em;
	color: var(--kaya-maroon);
}

body.kaya-faq .kaya-wk-subnav__link:focus-visible {
	outline: 2px solid var(--kaya-orange);
	outline-offset: 3px;
}

.kaya-faq__cats {
	padding-bottom: min(5rem, 4.1666666667vw);
}

.kaya-faq-cat {
	scroll-margin-top: calc(var(--kaya-faq-sticky-top) + var(--kaya-faq-nav-h));
	padding-top: min(4.5rem, 3.75vw);
}

.kaya-faq-cat__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: 120rem;
	margin: 0 auto;
	padding: 0 min(6.25rem, 5.2083333333vw);
}

.kaya-faq-cat__title {
	margin: 0 0 min(2rem, 1.6666666667vw);
	font-family: "Montserrat", sans-serif;
	font-weight: 900;
	font-size: min(2.5rem, 2.0833333333vw);
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--kaya-maroon);
}

body.kaya-faq .kaya-faq-cat .kaya-dest-faqs {
	padding: 0;
	background-color: transparent;
}

body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__inner {
	width: 100%;
	gap: 0;
}

body.kaya-faq .kaya-home-dash {
	--kaya-dash-h: auto;
	--kaya-dash-pad: min(1.5rem, 1.25vw);
	--kaya-dash-leaf-w: min(120.643125rem, 100.5463541667vw);
	--kaya-dash-leaf-h: min(6.936125rem, 5.7801041667vw);
	--kaya-dash-shift: min(-0.3125rem, -0.2604166667vw);

	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: min(1.5rem, 1.25vw) 0 0;
	padding: var(--kaya-dash-pad) 0 min(2.5rem, 2.0833333333vw);
	overflow: hidden;
	background-color: var(--kaya-white);
	line-height: 0;
	pointer-events: none;
}

body.kaya-faq .kaya-home-dash img {
	display: block;
	width: var(--kaya-dash-leaf-w);
	height: var(--kaya-dash-leaf-h);
	max-width: none;
	margin-left: var(--kaya-dash-shift);
	object-fit: fill;
}

@media (max-width: 782px) {
	body.admin-bar.kaya-faq {
		--kaya-faq-sticky-top: calc(8.75rem + 46px);
	}
}

@media (max-width: 1200px) {
	body.kaya-faq {
		--kaya-faq-nav-h: 64px;
	}

	body.kaya-faq .kaya-wk-subnav__list {
		justify-content: flex-start;
		gap: 24px;
		width: 100%;
		max-width: none;
		height: 64px;
		margin: 0;
		padding: 0 48px 0 20px;
		overflow-x: auto;
		scroll-snap-type: x proximity;
		scroll-padding-inline: 20px;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-x;
	}

	body.kaya-faq .kaya-wk-subnav__list::-webkit-scrollbar {
		display: none;
	}

	body.kaya-faq .kaya-wk-subnav__item {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}

	body.kaya-faq .kaya-wk-subnav__link {
		font-size: 12px;
	}
}

@media only screen and (max-width: 999px) {
	body.kaya-faq .kaya-dest-hero--simple {
		height: auto;
		min-height: 0;
	}

	body.kaya-faq .kaya-dest-hero--simple .kaya-dest-hero__inner {
		padding-bottom: 96px;
	}

	body.kaya-faq .kaya-dest-hero--simple .kaya-dest-hero__body {
		width: 100%;
		max-width: none;
		font-size: 16px;
		line-height: 24px;
	}

	body.kaya-faq .kaya-faq-cat {
		padding-top: 40px;
	}

	body.kaya-faq .kaya-faq-cat__inner {
		padding: 0 20px;
	}

	body.kaya-faq .kaya-faq-cat__title {
		font-size: 32px;
		line-height: 32px;
	}

	body.kaya-faq .kaya-faq__cats {
		padding-bottom: 64px;
	}

	body.kaya-faq .kaya-home-dash {
		display: block;
		height: auto;
		margin-top: 8px;
		padding: 13px 0 28px;
	}

	body.kaya-faq .kaya-home-dash img {
		width: 1245px;
		height: auto;
		margin-left: -668px;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs,
	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__inner,
	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__row,
	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__list,
	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__item {
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__item {
		padding: 0;
		overflow: hidden;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__question {
		box-sizing: border-box;
		align-items: center;
		min-height: 48px;
		padding: 16px;
		gap: 16px;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__question-text {
		flex: 1 1 auto;
		min-width: 0;
		font-size: 16px;
		line-height: 1.45;
		white-space: normal;
		overflow-wrap: break-word;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__chevron {
		flex: 0 0 20px;
		width: 20px;
		height: 20px;
		overflow: hidden;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__chevron img {
		width: 20px;
		height: 13px;
		max-width: 20px;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__answer {
		margin: 0;
		padding: 0 16px 16px;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__answer,
	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__answer p {
		font-size: 16px;
		line-height: 1.5;
		overflow-wrap: break-word;
	}

	body.kaya-faq .kaya-faq-cat .kaya-dest-faqs__answer p:first-child {
		margin-top: 0;
	}
}
