/* ==========================================================================
 * Responsive layer — mobile-first refinements.
 * ========================================================================== */

/* Tablet */
@media (max-width: 1024px) {
	.htg-hero__inner { grid-template-columns: 1fr; gap: 40px; }
	.htg-quiz__results-grid { grid-template-columns: 1fr; }
	.htg-tool--viz { grid-template-columns: 1fr; }
	.htg-tracker__board { grid-template-columns: repeat(2, 1fr); }
	.htg-newsletter-card { grid-template-columns: 1fr; padding: 36px; }
	.htg-footer__top { grid-template-columns: 1fr; gap: 32px; }
	.htg-footer__cols { grid-template-columns: repeat(2, 1fr); }
	.htg-continue__inner { grid-template-columns: 1fr; text-align: center; }
	.htg-continue__chips { justify-content: center; }
	.htg-continue__cta { justify-content: center; }
}

/* Mobile */
@media (max-width: 768px) {
	body { font-size: 16px; }
	.htg-container { padding: 0 18px; }
	.htg-section { padding: 60px 0; }
	.htg-section--newsletter { padding: 48px 0; }
	.htg-section__header { margin-bottom: 32px; }

	/* Header */
	.htg-header__inner { grid-template-columns: auto auto; gap: 12px; }
	.htg-nav { display: none; }
	.htg-nav.is-open {
		display: block; position: fixed; inset: 64px 0 0; background: var(--htg-paper);
		padding: 24px; z-index: 70; overflow-y: auto;
	}
	.htg-nav.is-open .htg-nav__list { flex-direction: column; align-items: stretch; gap: 4px; }
	.htg-nav.is-open .htg-nav__list a { padding: 14px 18px; border-radius: 12px; }
	.htg-menu-toggle { display: inline-flex; order: 3; }
	.htg-menu-toggle[aria-expanded="true"] .htg-menu-toggle__bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
	.htg-menu-toggle[aria-expanded="true"] .htg-menu-toggle__bar:nth-child(2) { opacity: 0; }
	.htg-menu-toggle[aria-expanded="true"] .htg-menu-toggle__bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
	.htg-search { display: none; }
	.htg-header__cta { display: none; }

	/* Hero */
	.htg-hero { padding: 64px 0 56px; min-height: auto; }
	.htg-hero__cta { width: 100%; }
	.htg-hero__cta .htg-btn { flex: 1; min-width: 180px; }
	.htg-hero__panel-card { padding: 22px; }

	/* Tools */
	.htg-tool { padding: 22px; }
	.htg-tool__row { grid-template-columns: 1fr; }
	.htg-quiz__results-grid { grid-template-columns: 1fr; }
	.htg-quiz__facts { grid-template-columns: 1fr; }
	.htg-archetype__facts { grid-template-columns: 1fr; }
	.htg-tracker__board { grid-template-columns: 1fr; }
	.htg-tracker__add { grid-template-columns: 1fr; }
	.htg-db__controls { grid-template-columns: 1fr; }

	/* Cards */
	.htg-cards { grid-template-columns: 1fr; }
	.htg-archetypes { grid-template-columns: 1fr; }
	.htg-trust__grid { grid-template-columns: 1fr; }

	/* Footer */
	.htg-footer { padding: 48px 0 32px; }
	.htg-footer__cols { grid-template-columns: 1fr; gap: 28px; }
	.htg-footer__bottom { flex-direction: column; text-align: center; }

	/* Mobile sticky CTA appears */
	.htg-mobile-sticky-cta { display: inline-flex; }

	/* 404 */
	.htg-404-affiliate { padding: 22px; }
	.htg-404__tool-ctas .htg-btn { flex: 1; }
}

/* Small mobile */
@media (max-width: 480px) {
	h1, .htg-hero__title { font-size: 2rem; }
	.htg-hero__lead { font-size: 1rem; }
	.htg-eyebrow { font-size: 11px; }
	.htg-disclosure-strip { font-size: 12px; }
	.htg-product-box__meta, .htg-product-box__poco { grid-template-columns: 1fr; }
	.htg-newsletter { flex-direction: column; }
	.htg-newsletter input, .htg-newsletter button { width: 100%; }
	.htg-quiz__option button { padding: 14px 16px; font-size: 14px; }
}

/* Very large screens — extra breathing */
@media (min-width: 1440px) {
	.htg-container { max-width: 1280px; }
}