/* =====================================================================
   Phartenaas — responsive.css
   Breakpoint overrides: 768 / 1024 / 1280
   Laatste laag — gebruikt om conflict-situaties fijn af te stellen.
   ===================================================================== */

/* ---------- Mobile (<768): base in andere files ---------- */

/* ---------- Tablet 768+ ---------- */
@media (min-width: 768px) {
	.section__header {
		margin-bottom: var(--s-64);
	}

	.card {
		padding: var(--s-48) var(--s-32) var(--s-32);
	}
}

/* ---------- Desktop 1024+ ---------- */
@media (min-width: 1024px) {
	.hero--framed {
		padding: var(--s-120) 0 var(--s-80);
	}

	.section {
		padding: var(--s-120) 0;
	}

	.section--tight {
		padding: var(--s-64) 0;
	}
}

/* ---------- Wide 1280+ ---------- */
@media (min-width: 1280px) {
	.container {
		padding-left: var(--s-40);
		padding-right: var(--s-40);
	}
}

/* ---------- Small mobile refinements ---------- */
@media (max-width: 480px) {
	h1 {
		font-size: 2rem;
	}

	h2 {
		font-size: 1.5rem;
	}

	.hero--framed {
		min-height: auto;
		padding: var(--s-48) 0 var(--s-40);
	}

	.btn-row {
		flex-direction: column;
		align-items: stretch;
	}

	.btn-row .btn-secondary,
	.btn-row .btn-tertiary {
		text-align: center;
	}

	.section {
		padding: var(--s-48) 0;
	}

	.step-flow__item {
		padding: var(--s-24);
	}

	.ph-form__wrap {
		padding: var(--s-24);
	}

	.menu-items__item {
		grid-template-columns: 1fr;
	}

	.menu-items__price {
		text-align: left;
		margin-top: var(--s-4);
	}
}

/* ---------- Avoid horizontal overflow from grids ---------- */
.grid,
.two-col {
	min-width: 0;
}

.grid > *,
.two-col > * {
	min-width: 0;
}