/**
 * Unbox Front — ajustes responsivos. O layout base já é fluido (grid + clamp);
 * aqui ficam apenas os breakpoints de reorganização.
 */

/* ----- Tablets (≤1024px) ------------------------------------------------ */

@media (max-width: 1024px) {
	.ubf-grid--4 {
		grid-template-columns: repeat(2, 1fr);
	}

	.ubf-hero {
		grid-template-columns: 1fr;
	}

	.ubf-hero__lead {
		min-height: 320px;
	}

	.ubf-hero__side {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}

	.ubf-hero__side-card {
		flex-direction: column;
	}

	.ubf-hero__side-media {
		flex: none;
		width: 100%;
	}

	/* Fallback chrome: menu vira drawer com hambúrguer (nunca horizontal). */
	.ubf-fbheader__nav {
		display: none;
	}

	.ubf-fbheader__toggle {
		display: inline-flex;
	}
}

/* ----- Tablets pequenos / phablets (≤820px) ------------------------------ */

@media (max-width: 820px) {
	.ubf-grid--3 {
		grid-template-columns: repeat(2, 1fr);
	}

	.ubf-hero__side {
		grid-template-columns: 1fr;
	}

	.ubf-hero__side-card {
		flex-direction: row;
	}

	.ubf-hero__side-media {
		flex: 0 0 108px;
	}

	.ubf-home-section__inner {
		grid-template-columns: 1fr;
	}

	.ubf-cta__inner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ----- Phones (≤640px) ---------------------------------------------------- */

@media (max-width: 640px) {
	.ubf-grid--3,
	.ubf-grid--4 {
		grid-template-columns: 1fr;
	}

	.ubf-hero__lead {
		min-height: 280px;
	}

	.ubf-archive-head {
		align-items: stretch;
		flex-direction: column;
	}

	.ubf-searchbar {
		width: 100%;
	}

	.ubf-card--list {
		flex-direction: column;
	}

	.ubf-card--list .ubf-card__media {
		flex: none;
		width: 100%;
	}

	.ubf-card--list .ubf-card__body {
		padding: 14px 0 0;
	}

	.ubf-single__byline {
		flex-direction: column;
		align-items: flex-start;
	}

	.ubf-contact__row {
		grid-template-columns: 1fr;
		gap: 0;
	}

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

	.ubf-fbfooter__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
	}
}