/*!
 * XWHITE — Global Responsive Corrections
 * -----------------------------------------------------------------------
 * Breakpoints: 1280 / 1024 / 768 / 560 / 380.
 * Only global breakpoint fixes live here — section-specific responsive
 * rules belong to sections.css.
 *
 * @package XWhite
 * @since   1.0.0
 */

/* Never allow horizontal overflow anywhere */
html,
body {
	overflow-x: clip;
}

/* =========================================================================
   <= 1280px — laptop
   ========================================================================= */

@media (max-width: 1280px) {
	:root {
		--xw-section-pad: clamp(3.5rem, 8vw, 6rem);
	}

	.xw-nav a {
		padding: .6em .65em;
		letter-spacing: .08em;
	}

	.xw-header__inner {
		gap: 1.25rem;
	}
}

/* =========================================================================
   <= 1024px — tablet landscape: nav swaps to mobile menu
   ========================================================================= */

@media (max-width: 1024px) {
	/* Hide desktop nav + CTA, show burger */
	.xw-header__nav {
		display: none;
	}

	.xw-header__cta {
		display: none;
	}

	.xw-header__toggle {
		display: inline-flex;
	}

	.xw-header__inner {
		min-height: 72px;
	}

	.xw-header.is-scrolled .xw-header__inner {
		min-height: 62px;
	}

	/* Footer 5 → 2 columns */
	.xw-footer__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.xw-footer__col--brand {
		grid-column: 1 / -1;
	}
}

/* =========================================================================
   <= 768px — tablet portrait
   ========================================================================= */

@media (max-width: 768px) {
	:root {
		--xw-section-pad: clamp(3rem, 10vw, 4.5rem);
	}

	body {
		font-size: .9375rem;
	}

	.xw-container {
		padding-inline: 1.25rem;
	}

	.xw-section__heading {
		margin-bottom: 2.25rem;
	}

	/* Alignments collapse on small screens */
	.alignleft,
	.alignright {
		float: none;
		margin: 1.25rem auto;
	}

	.gallery,
	.gallery-columns-4,
	.gallery-columns-5 {
		grid-template-columns: repeat(2, 1fr);
	}

	.xw-footer__bottom {
		flex-direction: column;
		text-align: center;
		justify-content: center;
	}

	.xw-footer__legal {
		justify-content: center;
	}
}

/* =========================================================================
   <= 560px — phones: footer stacks to one column
   ========================================================================= */

@media (max-width: 560px) {
	/* Typography floors */
	h1 { font-size: clamp(2.125rem, 9vw, 2.75rem); }
	h2 { font-size: clamp(1.75rem, 7.5vw, 2.25rem); }
	h3 { font-size: 1.5rem; }
	h4 { font-size: 1.25rem; }

	.xw-container {
		padding-inline: 1rem;
	}

	.xw-footer__grid {
		grid-template-columns: 1fr;
		gap: 2.25rem;
	}

	.xw-btn {
		font-size: .875rem;
		padding: .8em 1.35em;
	}

	.xw-pagination .page-numbers {
		min-width: 40px;
		height: 40px;
	}

	.xw-page-header {
		padding-top: calc(72px + 3rem);
	}
}

/* =========================================================================
   <= 380px — small phones
   ========================================================================= */

@media (max-width: 380px) {
	h1 { font-size: 1.875rem; }
	h2 { font-size: 1.625rem; }

	.xw-section__tagline {
		font-size: .75rem;
		letter-spacing: .16em;
	}

	.xw-header__logo-text {
		font-size: 1.05rem;
	}

	.xw-header__logo-mark {
		width: 36px;
		height: 36px;
		font-size: 1.25rem;
	}

	.xw-header__toggle {
		width: 42px;
		height: 42px;
	}

	.xw-mobile-nav a {
		font-size: 1.5rem;
	}

	.gallery,
	.gallery-columns-2 {
		grid-template-columns: 1fr;
	}

	.xw-btn {
		width: 100%;
	}
}
