/* ==========================================================================
   The Foskey Wedding — responsive
   ========================================================================== */

@media ( max-width: 1020px ) {
	.fw-gallery { grid-template-columns: repeat( 3, 1fr ); }
}

@media ( max-width: 900px ) {
	.fw-story-grid { grid-template-columns: 1fr; justify-items: center; }
	.fw-story-grid .fw-prose { max-width: 40rem; }

	.fw-registry-grid { grid-template-columns: repeat( 2, 1fr ); }

	.fw-nav-toggle { display: block; margin-left: auto; }
	.fw-nav { width: 100%; }
	.fw-menu {
		display: none;
		position: absolute; top: var(--fw-header-h); left: 0; right: 0;
		flex-direction: column; gap: 0;
		background: var(--fw-surface);
		border-bottom: 1px solid var(--fw-line);
		padding: 0.8rem 1.5rem 1.2rem;
	}
	.fw-menu.is-open { display: flex; }
	.fw-menu a {
		display: block; padding: 0.85rem 0;
		font-size: 0.78rem; border-bottom: none;
	}
}

@media ( max-width: 620px ) {
	:root { --fw-header-h: 3.9rem; }
	.fw-section { padding: 4.5rem 1.2rem; }
	.fw-form { padding: 1.6rem 1.2rem; }
	.fw-form-grid { grid-template-columns: 1fr; gap: 0.2rem; }
	.fw-brand-text { display: none; }
	.fw-gallery { grid-template-columns: repeat( 2, 1fr ); }
	.fw-registry-grid { grid-template-columns: 1fr; }
	.fw-countdown { gap: 1.4rem; }
	.fw-count-unit { min-width: 4.2rem; }
	.fw-hero-rule { display: none; }
	.fw-event { padding-left: 2.4rem; }
}