/* Shared FAQ accordion — native <details>/<summary>, no JS, grouped by
   category under an <h3> heading. Originally lived only in front-page.css
   (the homepage's own small FAQ section); moved to its own file
   2026-08-26 so the new /faq/ archive (archive-gm_faq.php) can reuse the
   exact same markup/styling for its much larger 136-item set without
   loading the rest of front-page.css's homepage-only rules (hero,
   learning center, bottom CTA, etc.) on an unrelated page. Selectors
   unchanged from the original — --gm-red/--gm-gray-md are defined in
   shared.css, loaded unconditionally site-wide, so they resolve
   correctly wherever this file is enqueued. */

/* /faq/ archive only (archive-gm_faq.php) — hero + category jump-nav.
   Not reused from .gm-service-hero (Services' own hero, left-aligned by
   default there) since Carlos asked specifically for this page's hero
   centered, without changing how /services/ looks. */
.gm-faq__hero {
	text-align: center;
}
.gm-faq__hero h1 {
	font-size: clamp( 28px, 5vw, 40px );
	margin-top: 0;
}
.gm-faq__hero-sub {
	font-size: 16px;
	color: var( --gm-gray-md );
	max-width: 640px;
	line-height: 1.6;
	margin: 0 auto 24px;
}

/* Jump-nav to each category section below — same pill-link visual
   language as the Learning Center's .gm-learning__categories
   (front-page.css), reimplemented here rather than shared cross-file so
   this page's CSS stays self-contained in faq-shared.css. */
.gm-faq__categories {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	max-width: 900px;
	margin: 0 auto 40px;
}
.gm-faq__categories a {
	padding: 8px 16px;
	border-radius: 999px;
	border: 1px solid #d8d8d8;
	color: var( --gm-gray-dk, #333 );
	text-decoration: none;
	font-size: 0.85rem;
}
.gm-faq__categories a:hover {
	border-color: var( --gm-red );
	color: var( --gm-red );
}

.gm-faq__category {
	max-width: 800px;
	margin: 0 auto 32px;
}
.gm-faq__category h3 {
	font-size: 1.2rem;
	color: var(--gm-red);
}
.gm-faq__item {
	border-bottom: 1px solid #e2e2e2;
	padding: 12px 0;
}
.gm-faq__item summary {
	cursor: pointer;
	font-weight: 600;
	list-style: none;
}
.gm-faq__item summary::-webkit-details-marker {
	display: none;
}
.gm-faq__item summary::before {
	content: "+";
	display: inline-block;
	width: 1.2em;
	color: var(--gm-red);
	font-weight: 700;
}
.gm-faq__item[open] summary::before {
	content: "\2212";
}
.gm-faq__item p {
	margin: 12px 0 0 1.2em;
	color: var(--gm-gray-md);
}
.gm-faq__accordion {
	margin-top: 16px;
}
