/* Lignomat FAQ hub (/faq/) -- on-brand: primary #337ab7, dark #2e6da4 */

.faq-wrap {
	max-width: 880px;
	margin: 0 auto;
	padding: 24px 20px 64px;
}

/* Hero ------------------------------------------------------------------ */
.faq-hero {
	margin-bottom: 28px;
}
.faq-title {
	font-size: 2.4rem;
	line-height: 1.15;
	margin: 0 0 12px;
	font-weight: 700;
}
.faq-title-light { color: #337ab7; }
.faq-title-dark  { color: #2e6da4; }
.faq-intro {
	font-size: 1.05rem;
	line-height: 1.6;
	color: #555;
	max-width: 62ch;
	margin: 0;
}
.faq-intro a { color: #337ab7; text-decoration: underline; }

/* Category quick-nav ---------------------------------------------------- */
.faq-toc {
	margin: 26px 0 34px;
}
.faq-toc ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.faq-toc li { margin: 0; }
.faq-toc a {
	display: inline-block;
	padding: 7px 14px;
	background: #f0f5fa;
	border: 1px solid #d8e3ef;
	border-radius: 999px;
	color: #2e6da4;
	font-size: .9rem;
	font-weight: 600;
	text-decoration: none;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.faq-toc a:hover,
.faq-toc a:focus {
	background: #337ab7;
	border-color: #337ab7;
	color: #fff;
}

/* Sections -------------------------------------------------------------- */
.faq-section {
	margin: 0 0 40px;
	scroll-margin-top: 90px;
}
.faq-cat-title {
	font-size: 1.5rem;
	color: #2e6da4;
	margin: 0 0 6px;
	padding-bottom: 8px;
	border-bottom: 3px solid #e3ebf3;
	font-weight: 700;
}
.faq-cat-desc {
	color: #666;
	margin: 0 0 16px;
	font-size: .98rem;
}

/* Q&A disclosure -------------------------------------------------------- */
.faq-list { margin-top: 16px; }

.faq-item {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	background: #fff;
	margin: 0 0 12px;
	overflow: hidden;
	scroll-margin-top: 90px;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.faq-item[open] {
	border-color: #cfe0f0;
	box-shadow: 0 1px 6px rgba(51, 122, 183, .08);
}
.faq-item:target {
	border-color: #337ab7;
	box-shadow: 0 0 0 3px rgba(51, 122, 183, .18);
}

.faq-question {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	font-size: 1.06rem;
	font-weight: 600;
	color: #23527c;
	position: relative;
}
.faq-question::-webkit-details-marker { display: none; }
.faq-question:hover { color: #337ab7; }

.faq-question-text { flex: 1 1 auto; }

/* +/- indicator */
.faq-question::after {
	content: "";
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	position: relative;
	background:
		linear-gradient(#337ab7, #337ab7),
		linear-gradient(#337ab7, #337ab7);
	background-position: center;
	background-size: 100% 2px, 2px 100%;
	background-repeat: no-repeat;
	transition: transform .2s ease;
}
.faq-item[open] .faq-question::after {
	transform: rotate(90deg);
	background-size: 100% 2px, 2px 0; /* becomes a minus */
}

.faq-permalink {
	flex: 0 0 auto;
	color: #b7c6d6;
	font-weight: 700;
	text-decoration: none;
	opacity: 0;
	transition: opacity .15s ease, color .15s ease;
}
.faq-item:hover .faq-permalink,
.faq-item:target .faq-permalink { opacity: 1; }
.faq-permalink:hover { color: #337ab7; }

.faq-answer {
	padding: 2px 18px 18px;
	color: #3a3a3a;
	line-height: 1.65;
}
.faq-answer > *:first-child { margin-top: 0; }
.faq-answer > *:last-child { margin-bottom: 0; }
.faq-answer a { color: #337ab7; text-decoration: underline; }
.faq-answer ul,
.faq-answer ol { padding-left: 22px; }
.faq-answer li { margin-bottom: 6px; }

/* Responsive ------------------------------------------------------------ */
@media (max-width: 600px) {
	.faq-wrap { padding: 16px 14px 48px; }
	.faq-title { font-size: 1.9rem; }
	.faq-question { padding: 14px 14px; font-size: 1rem; }
	.faq-answer { padding: 2px 14px 16px; }
}