/* ==========================================================================
   AnswersPin brand system — derived from logo (red + ink)
   Logo: crimson red block + dark ink "p!n" + white type
   ========================================================================== */

:root {
	/* ---- Logo core ---- */
	--brand-red: #c81f32;
	--brand-red-hover: #a81828;
	--brand-red-deep: #8f1422;
	--brand-ink: #11202f;
	--brand-ink-soft: #1a3044;
	--brand-ink-muted: #3d4f5f;

	/* ---- Primary (logo red) ---- */
	--primary-color: var(--brand-red);
	--primary-hover: var(--brand-red-hover);
	--primary-deep: var(--brand-red-deep);
	--primary-soft: rgba(200, 31, 50, 0.08);
	--primary-soft-2: rgba(200, 31, 50, 0.12);
	--primary-border: rgba(200, 31, 50, 0.18);

	/* ---- Secondary / ink (logo dark) ---- */
	--secondary-color: var(--brand-ink);
	--secondary-muted: #4b5563;
	--secondary-soft: rgba(17, 32, 47, 0.05);

	/* ---- Surfaces (keep content areas clean white) ---- */
	--color-white: #ffffff;
	--color-surface: #ffffff;
	--color-surface-alt: #f7f8fa;
	--color-surface-brand: #fff7f8;
	--color-surface-ink: #16222d;

	/* ---- Text ---- */
	--text-heading: var(--brand-ink);
	--text-body: #4b5563;
	--text-muted: #6b7280;
	--text-subtle: #9ca3af;
	--text-inverse: #ffffff;
	--text-link: var(--brand-red);
	--text-link-hover: var(--brand-red-hover);

	/* ---- Typography ---- */
	--font-heading: "Urbanist", ui-sans-serif, system-ui, sans-serif;
	--font-body: "Poppins", ui-sans-serif, system-ui, sans-serif;

	/* ---- Borders & elevation ---- */
	--border-color: rgba(17, 32, 47, 0.08);
	--border-strong: rgba(17, 32, 47, 0.14);
	--border-brand: var(--primary-border);
	--shadow-sm: 0 1px 2px rgba(17, 32, 47, 0.04);
	--shadow-card: 0 4px 20px rgba(17, 32, 47, 0.06);
	--shadow-elevated: 0 12px 32px rgba(17, 32, 47, 0.1);

	/* ---- Legacy aliases (keep existing CSS working) ---- */
	--answerpin-brand-red: var(--primary-color);
	--answerpin-brand-red-strong: var(--primary-color);
	--answerpin-brand-red-deep: var(--primary-hover);
	--answerpin-brand-red-soft: var(--primary-soft);
	--answerpin-brand-red-soft-2: var(--primary-soft-2);
	--answerpin-brand-red-border: var(--primary-border);
	--answerpin-brand-ink: var(--secondary-color);
	--answerpin-brand-ink-soft: var(--brand-ink-soft);
	--answerpin-brand-ink-deep: var(--secondary-color);
	--answerpin-brand-ink-muted: var(--secondary-muted);
	--answerpin-brand-text: var(--text-inverse);

	/* ---- GA semantic tokens ---- */
	--ga-bg-page: var(--color-white);
	--ga-bg-elevated: var(--color-white);
	--ga-bg-section: var(--color-white);
	--ga-bg-section-alt: var(--color-surface-alt);
	--ga-bg-surface: var(--color-white);
	--ga-bg-surface-soft: var(--color-surface-alt);
	--ga-bg-input: var(--color-white);
	--ga-bg-header: var(--color-white);
	--ga-bg-hero: var(--color-white);
	--ga-bg-cta: var(--brand-ink);
	--ga-bg-brand-soft: var(--color-surface-brand);
	--ga-text: var(--text-body);
	--ga-text-muted: var(--text-muted);
	--ga-text-subtle: var(--text-subtle);
	--ga-text-heading: var(--text-heading);
	--ga-text-inverse: var(--text-inverse);
	--ga-border: var(--border-color);
	--ga-border-strong: var(--border-strong);
	--ga-shadow-sm: var(--shadow-sm);
	--ga-shadow-card: var(--shadow-card);
	--ga-link: var(--text-link);
	--ga-link-hover: var(--text-link-hover);
	--ga-accent: var(--primary-color);
	--ga-prose: var(--text-body);
}

/* --------------------------------------------------------------------------
   Base page — pure white, brand typography
   -------------------------------------------------------------------------- */
html {
	color-scheme: light;
	background: var(--color-white);
}

body.answerpin-theme,
body.bg-midnight,
.answerpin-theme {
	background-color: var(--color-white) !important;
	color: var(--ga-text);
	font-family: "Urbanist", ui-sans-serif, system-ui, sans-serif;
}

.answerpin-theme ::selection {
	background: var(--primary-soft-2);
	color: var(--text-heading);
}

/* --------------------------------------------------------------------------
   Site container — 88rem (matches Community page)
   -------------------------------------------------------------------------- */
.ga-community-shell,
.ga-community-hero__inner,
.ga-community-hub__wrap {
	width: 100%;
	max-width: 88rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1rem;
	padding-right: 1rem;
	box-sizing: border-box;
}

@media (min-width: 640px) {
	.ga-community-shell,
	.ga-community-hero__inner,
	.ga-community-hub__wrap {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
}

@media (min-width: 1024px) {
	.ga-community-shell,
	.ga-community-hero__inner,
	.ga-community-hub__wrap {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* Headings — premium ink */
.answerpin-theme h1,
.answerpin-theme h2,
.answerpin-theme h3,
.answerpin-theme h4,
.answerpin-theme h5,
.answerpin-theme h6,
.ga-tq-title,
.ga-categories__title,
.ga-home-blog__title,
.ga-expert-panel__title,
.ga-how-it-works__title,
.ga-ask-choice__title,
.ga-testimonials__title,
.ga-cl-heading {
	color: var(--ga-text-heading);
}

.answerpin-theme p,
.answerpin-theme li,
.answerpin-theme .ga-blog-prose,
.answerpin-theme .prose {
	color: var(--ga-text);
	font-family: var(--font-body);
}

/* Site-wide paragraphs use Poppins */
body p,
.answerpin-theme p,
main p,
.ga-blog-prose p,
.prose p {
	font-family: "Poppins", ui-sans-serif, system-ui, sans-serif !important;
}

/* Links */
.answerpin-theme a:not(.answerpin-btn-gradient):not([class*="btn"]):hover {
	color: var(--ga-link);
}

/* --------------------------------------------------------------------------
   Buttons — brand red CTAs
   -------------------------------------------------------------------------- */
.answerpin-btn-gradient,
a.answerpin-btn-gradient,
.ga-community-hub-hero__btn--primary,
.ga-cat-archive-hero__btn--primary,
.ga-categories-page__ask-link,
.ga-community-hub-hero__search-btn,
.ga-expert-card__cta,
.ga-ask-choice-btn--public,
.ga-ask-choice-btn--private,
.ga-home-cta-btn,
.ga-contact-page__tab--active,
.ga-tq-tab--active,
.ga-community-hub-tab--active,
.ga-categories-page__footer-cta .answerpin-btn-gradient {
	background: var(--primary-color) !important;
	background-image: none !important;
	color: var(--color-white) !important;
	border: none;
	box-shadow: 0 4px 14px rgba(200, 31, 50, 0.22) !important;
	transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.answerpin-btn-gradient:hover,
a.answerpin-btn-gradient:hover,
.ga-community-hub-hero__btn--primary:hover,
.ga-cat-archive-hero__btn--primary:hover,
.ga-categories-page__ask-link:hover,
.ga-community-hub-hero__search-btn:hover,
.ga-expert-card__link:hover .ga-expert-card__cta,
.ga-ask-choice-btn--public:hover,
.ga-ask-choice-btn--private:hover,
.ga-home-cta-btn:hover {
	background: var(--primary-hover) !important;
	box-shadow: 0 6px 18px rgba(200, 31, 50, 0.28) !important;
}

/* --------------------------------------------------------------------------
   Header — white, ink nav, red accents
   -------------------------------------------------------------------------- */
.answerpin-site-header {
	background: var(--color-white) !important;
	background-color: var(--color-white) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	box-shadow: var(--shadow-sm) !important;
	border-bottom: 1px solid var(--border-color) !important;
}

.answerpin-site-header nav a,
.answerpin-site-header .text-slate-300 {
	color: var(--text-heading) !important;
	font-size: 16px !important;
}

.answerpin-site-header nav a:hover {
	color: var(--primary-color) !important;
}

.answerpin-site-header .answerpin-btn-gradient,
.answerpin-site-header a.answerpin-btn-gradient {
	color: var(--color-white) !important;
	font-size: 16px !important;
}

.answerpin-site-header input[type="search"] {
	background: var(--color-surface-alt) !important;
	color: var(--text-heading) !important;
	border: 1px solid var(--border-color) !important;
	font-size: 16px !important;
}

.answerpin-site-header input[type="search"]::placeholder {
	color: var(--text-subtle) !important;
	font-size: 16px !important;
}

#ga-mobile-nav {
	background: var(--color-white) !important;
	border-color: var(--border-color) !important;
}

#ga-mobile-nav a {
	color: var(--text-heading) !important;
	font-size: 16px !important;
}

#ga-mobile-nav input[type="search"],
#ga-mobile-nav .answerpin-btn-gradient {
	font-size: 16px !important;
}

#ga-mobile-nav a:hover {
	background: var(--color-surface-alt) !important;
	color: var(--primary-color) !important;
}

/* --------------------------------------------------------------------------
   Cards — white, subtle border, soft shadow
   -------------------------------------------------------------------------- */
.ga-card,
.ga-tq-card,
.ga-home-blog-card,
.ga-cat-card,
.ga-expert-card,
.ga-cl-discussion-card,
.ga-testimonial-card,
.ga-ask-choice-card,
.ga-q-archive-card__link {
	background: var(--color-white) !important;
	border: 1px solid var(--border-color) !important;
	box-shadow: var(--shadow-card) !important;
}

.ga-card:hover,
.ga-tq-card:hover,
.ga-home-blog-card:hover,
.ga-cat-card:hover,
.ga-cl-discussion-card:hover {
	border-color: var(--primary-border) !important;
	box-shadow: var(--shadow-elevated) !important;
}

.ga-cat-browse-card {
	background: #ffffff !important;
	border: 1px solid rgba(17, 32, 47, 0.12) !important;
	box-shadow: none !important;
}

.ga-cat-browse-card:hover {
	border-color: rgba(200, 31, 50, 0.45) !important;
	box-shadow: 0 12px 28px -18px rgba(17, 32, 47, 0.28) !important;
}

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
.answerpin-theme input[type="text"],
.answerpin-theme input[type="email"],
.answerpin-theme input[type="search"],
.answerpin-theme input[type="tel"],
.answerpin-theme input[type="password"],
.answerpin-theme textarea,
.answerpin-theme select {
	background: var(--color-white) !important;
	border: 1px solid var(--border-strong) !important;
	color: var(--text-heading) !important;
	box-shadow: var(--shadow-sm);
}

.answerpin-theme input:focus,
.answerpin-theme textarea:focus,
.answerpin-theme select:focus {
	border-color: var(--primary-color) !important;
	box-shadow: 0 0 0 3px var(--primary-soft) !important;
	outline: none;
}

/* --------------------------------------------------------------------------
   Badges & accents
   -------------------------------------------------------------------------- */
.ga-badge,
.ga-hero-badge,
.answerpin-hero-cat-pill,
.answerpin-hero-verified-pill,
.answerpin-hero-verified-badge {
	background: var(--primary-soft) !important;
	color: var(--primary-color) !important;
	border-color: var(--primary-border);
}

/* --------------------------------------------------------------------------
   Section backgrounds — sparse, brand-aware
   White by default; soft alt / ink only where intentional
   -------------------------------------------------------------------------- */
.ga-home-section--light {
	background: var(--color-white) !important;
	color: var(--text-heading) !important;
}

.ga-home-section--muted {
	background: var(--color-surface-alt) !important;
	color: var(--text-heading) !important;
}

/* Only homepage uses this class — keep ink here */
body.home .ga-home-section--hero {
	background: var(--color-surface-ink) !important;
	color: var(--color-white) !important;
}

/* Homepage expert band — soft surface, not brand-ink */
.ga-home-section--dark,
.ga-home-section--dark.ga-section-navy,
.ga-home-section--dark.ga-section-black {
	background: var(--color-surface-alt) !important;
	color: var(--text-heading) !important;
}

.ga-home-section--cta {
	background: var(--color-white) !important;
	color: var(--text-heading) !important;
}

.ga-home-section--dark h2,
.ga-home-section--dark h3 {
	color: var(--ga-text-heading) !important;
}

.ga-home-section--light h2,
.ga-home-section--light h3,
.ga-home-section--muted h2,
.ga-home-section--muted h3 {
	color: var(--ga-text-heading) !important;
}

/* All page sections/heroes → white (except homepage hero) */
.ga-section-navy,
.ga-section-black,
.bg-navy,
.bg-midnight,
body.bg-midnight {
	background: var(--color-white) !important;
	background-image: none !important;
	color: var(--ga-text) !important;
}

.ga-section-black:not(.ga-home-section--hero),
.ga-section-navy:not(.ga-home-section--hero):not(.answerpin-hero-section) {
	background: var(--color-white) !important;
	color: var(--ga-text) !important;
}

/* ONLY homepage hero keeps brand-ink */
body.home .answerpin-hero-section.ga-home-section--hero,
body.home .ga-home-section--hero.answerpin-hero-glow,
body.home .answerpin-hero-section.answerpin-hero-glow {
	background-color: var(--color-surface-ink) !important;
	background-image: radial-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px) !important;
	background-size: 16px 16px !important;
	color: var(--color-white) !important;
}

/* Inner page heroes — white + ink text */
.ga-section-navy.answerpin-hero-glow:not(.answerpin-hero-section),
.ga-ask-hero,
.ga-community-hero,
.ga-cat-archive-hero,
.ga-experts-page-hero,
.ga-contact-page-hero,
.ga-q-hero,
.ga-page-hero {
	background: var(--color-white) !important;
	color: var(--text-heading) !important;
	border-bottom-color: var(--border-color) !important;
}

.ga-ask-hero h1,
.ga-community-hero h1,
.ga-cat-archive-hero h1,
.ga-experts-page-hero h1,
.ga-contact-page-hero h1,
.ga-q-hero h1,
.ga-page-hero h1,
.ga-section-navy.answerpin-hero-glow:not(.answerpin-hero-section) h1 {
	color: var(--text-heading) !important;
}

.ga-ask-hero .text-white,
.ga-community-hero .text-white,
.ga-cat-archive-hero .text-white,
.ga-experts-page-hero .text-white,
.ga-contact-page-hero .text-white,
.ga-q-hero .text-white,
.ga-section-navy.answerpin-hero-glow:not(.answerpin-hero-section) .text-white {
	color: var(--text-heading) !important;
}

.ga-ask-hero .text-slate-400,
.ga-ask-hero .text-slate-300,
.ga-ask-hero .text-slate-500,
.ga-community-hero .text-slate-400,
.ga-community-hero .text-slate-300,
.ga-community-hero .text-slate-500,
.ga-cat-archive-hero .text-slate-400,
.ga-cat-archive-hero .text-slate-300,
.ga-experts-page-hero .text-slate-400,
.ga-contact-page-hero .text-slate-400,
.ga-contact-page-hero .text-slate-500,
.ga-q-hero .text-slate-400,
.ga-page-hero .text-slate-400,
.ga-section-navy.answerpin-hero-glow:not(.answerpin-hero-section) .text-slate-400 {
	color: var(--text-muted) !important;
}

.ga-community-hub-hero__btn--ghost {
	background: var(--color-white) !important;
	border: 1px solid var(--border-strong) !important;
	color: var(--text-heading) !important;
}

.ga-community-hub-hero__btn--ghost:hover {
	border-color: var(--primary-border) !important;
	color: var(--primary-color) !important;
}

/* Remove leftover decorative glows on non-home heroes */
.answerpin-hero-glow:not(.answerpin-hero-section)::before,
.answerpin-hero-glow:not(.answerpin-hero-section)::after,
.answerpin-hero-orbit,
.answerpin-hero-mesh,
.ga-site-footer-glow,
.ga-ask-hero::after {
	background: transparent !important;
	background-image: none !important;
}

/* --------------------------------------------------------------------------
   Footer — community / blog (ink stage + join CTA)
   -------------------------------------------------------------------------- */
.ga-site-footer {
	background: var(--color-surface-ink, #16222d) !important;
	color: rgba(255, 255, 255, 0.68) !important;
	border-top: none !important;
	background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px) !important;
	background-size: 16px 16px !important;
}

.ga-site-footer-glow {
	background: transparent !important;
	background-image: none !important;
}

.ga-site-footer__cta {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.ga-site-footer__cta-inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.35rem;
	padding-top: 2.25rem;
	padding-bottom: 2.25rem;
}

@media (min-width: 900px) {
	.ga-site-footer__cta-inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 2rem;
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
	}
}

.ga-site-footer__cta-copy {
	max-width: 36rem;
}

.ga-site-footer__cta-eyebrow {
	margin: 0;
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--primary-color) !important;
}

.ga-site-footer__cta-title {
	margin: 0.45rem 0 0;
	font-size: clamp(1.35rem, 2.2vw, 1.75rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #ffffff !important;
}

.ga-site-footer__cta-text {
	margin: 0.55rem 0 0;
	font-size: 0.95rem;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.68) !important;
}

.ga-site-footer__cta-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem;
	flex-shrink: 0;
}

.ga-site-footer__btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	padding: 0.8rem 1.2rem !important;
	border-radius: 9999px !important;
	font-size: 0.9rem;
	font-weight: 750;
	text-decoration: none !important;
	transition:
		transform 0.18s ease,
		background 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease;
}

.ga-site-footer__btn--primary {
	background: var(--primary-color) !important;
	border: 1px solid var(--primary-color) !important;
	color: #ffffff !important;
	box-shadow: 0 10px 24px rgba(200, 31, 50, 0.28);
}

.ga-site-footer__btn--primary:hover {
	background: #a81928 !important;
	border-color: #a81928 !important;
	color: #ffffff !important;
	transform: translateY(-2px);
}

.ga-site-footer__btn--ghost {
	background: rgba(255, 255, 255, 0.06) !important;
	border: 1px solid rgba(255, 255, 255, 0.14) !important;
	color: #ffffff !important;
}

.ga-site-footer__btn--ghost:hover {
	background: rgba(255, 255, 255, 0.12) !important;
	border-color: rgba(255, 255, 255, 0.28) !important;
	color: #ffffff !important;
}

.ga-site-footer__main {
	padding: 2.75rem 0 2.5rem;
}

.ga-site-footer__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.25rem;
}

@media (min-width: 900px) {
	.ga-site-footer__grid {
		grid-template-columns: minmax(220px, 1.1fr) minmax(0, 1.6fr);
		gap: 3rem;
		align-items: start;
	}
}

.ga-site-footer__brand .answerpin-logo,
.ga-site-footer__brand a {
	display: inline-flex;
}

.ga-site-footer__tagline,
.ga-site-footer-tagline {
	margin: 1rem 0 0;
	max-width: 22rem;
	font-size: 0.925rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.62) !important;
}

.ga-site-footer__social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	margin-top: 1.25rem;
}

.ga-site-footer-social {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 0.75rem !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	background: rgba(255, 255, 255, 0.06) !important;
	color: rgba(255, 255, 255, 0.85) !important;
	transition:
		transform 0.18s ease,
		background 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease;
}

.ga-site-footer-social:hover {
	background: var(--primary-color) !important;
	border-color: var(--primary-color) !important;
	color: #ffffff !important;
	transform: translateY(-2px);
}

.ga-site-footer__nav {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.75rem;
}

@media (min-width: 560px) {
	.ga-site-footer__nav {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1.5rem;
	}
}

.ga-site-footer-heading {
	margin: 0 0 1rem;
	font-size: 1rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #ffffff !important;
}

.ga-site-footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ga-site-footer-links li + li {
	margin-top: 0.55rem;
}

.ga-site-footer-links a {
	display: inline-block;
	font-size: 0.95rem;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.72) !important;
	text-decoration: none;
	transition:
		color 0.15s ease,
		transform 0.15s ease;
}

.ga-site-footer-links a:hover {
	color: var(--primary-color) !important;
	transform: translateX(3px);
}

.ga-site-footer a {
	color: rgba(255, 255, 255, 0.65) !important;
}

.ga-site-footer a:hover {
	color: var(--primary-color) !important;
}

.ga-site-footer .ga-site-footer__btn--primary,
.ga-site-footer .ga-site-footer__btn--primary:hover {
	color: #ffffff !important;
}

.ga-site-footer .ga-site-footer__btn--ghost,
.ga-site-footer .ga-site-footer__btn--ghost:hover {
	color: #ffffff !important;
}

.ga-site-footer .ga-site-footer-social {
	color: rgba(255, 255, 255, 0.85) !important;
}

.ga-site-footer .ga-site-footer-social:hover {
	color: #ffffff !important;
}

.ga-site-footer-bar {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	background: rgba(0, 0, 0, 0.28) !important;
}

.ga-site-footer-bar__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	padding-top: 1.15rem;
	padding-bottom: 1.15rem;
}

@media (min-width: 640px) {
	.ga-site-footer-bar__inner {
		flex-direction: column;
	}
}

.ga-site-footer-bar__copy {
	margin: 0;
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.45);
	text-align: center;
}

@media (min-width: 640px) {
	.ga-site-footer-bar__copy {
		text-align: center;
	}
}

.ga-site-footer-bar__copy a {
	font-weight: 650;
	color: rgba(255, 255, 255, 0.7) !important;
}

.ga-site-footer-bar__copy a:hover {
	color: var(--primary-color) !important;
}

.ga-site-footer-legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.35rem 1rem;
	font-size: 0.8125rem;
}

.ga-site-footer-legal a {
	color: rgba(255, 255, 255, 0.5) !important;
	font-weight: 550;
	text-decoration: none;
}

.ga-site-footer-legal a:hover {
	color: var(--primary-color) !important;
}

@media (prefers-reduced-motion: reduce) {
	.ga-site-footer__btn,
	.ga-site-footer-social,
	.ga-site-footer-links a {
		transition: none;
	}

	.ga-site-footer__btn--primary:hover,
	.ga-site-footer-social:hover {
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Tabs & interactive chrome
   -------------------------------------------------------------------------- */
.ga-tq-tab,
.ga-community-hub-tab {
	color: var(--text-muted);
	background: var(--color-white);
	border: 1px solid var(--border-color);
}

.ga-tq-tab:hover,
.ga-community-hub-tab:hover {
	color: var(--text-heading);
	border-color: var(--primary-border);
}

.ga-tq-tab--active,
.ga-community-hub-tab--active {
	background: var(--primary-color) !important;
	color: var(--color-white) !important;
	border-color: var(--primary-color) !important;
}

/* --------------------------------------------------------------------------
   Primary red backgrounds → always white text (site-wide)
   -------------------------------------------------------------------------- */
.answerpin-btn-gradient,
.answerpin-btn-gradient.text-white,
a.answerpin-btn-gradient,
a.answerpin-btn-gradient.text-white,
main .answerpin-btn-gradient,
main .answerpin-btn-gradient.text-white,
.ga-card .answerpin-btn-gradient,
.ga-card .answerpin-btn-gradient.text-white,
.ga-section-navy .answerpin-btn-gradient,
.ga-section-black .answerpin-btn-gradient,
.ga-profile-page .answerpin-btn-gradient,
.ga-profile-edit .answerpin-btn-gradient,
.ga-community-hub-hero__btn--primary,
.ga-cat-archive-hero__btn--primary,
.ga-categories-page__ask-link,
.ga-community-hub-hero__search-btn,
.ga-expert-card__cta,
.ga-ask-choice-btn--public,
.ga-ask-choice-btn--private,
.ga-home-cta-btn,
.ga-tq-tab--active,
.ga-community-hub-tab--active,
.ga-contact-page__tab--active,
.bg-blue-600.text-white,
a.bg-blue-600,
.bg-violet-600.text-white,
a.bg-violet-600 {
	color: #ffffff !important;
}

.answerpin-btn-gradient:hover,
a.answerpin-btn-gradient:hover,
main .answerpin-btn-gradient:hover,
.ga-card .answerpin-btn-gradient:hover,
.ga-community-hub-hero__btn--primary:hover,
.ga-cat-archive-hero__btn--primary:hover,
.ga-categories-page__ask-link:hover,
.ga-community-hub-hero__search-btn:hover,
.ga-expert-card__link:hover .ga-expert-card__cta,
.ga-ask-choice-btn--public:hover,
.ga-ask-choice-btn--private:hover,
.ga-home-cta-btn:hover {
	color: #ffffff !important;
}

.answerpin-btn-gradient *,
a.answerpin-btn-gradient *,
.ga-community-hub-hero__btn--primary *,
.ga-cat-archive-hero__btn--primary *,
.ga-categories-page__ask-link *,
.ga-community-hub-hero__search-btn *,
.ga-expert-card__cta *,
.ga-ask-choice-btn--public *,
.ga-ask-choice-btn--private *,
.ga-home-cta-btn *,
.ga-tq-tab--active *,
.ga-community-hub-tab--active *,
.ga-contact-page__tab--active * {
	color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   Icons & reply accents
   -------------------------------------------------------------------------- */
.answerpin-hero-reply,
.ga-link-accent,
.text-brand-red {
	color: var(--primary-color) !important;
}