/**
 * Wider viewports keep the designed column widths; below that, tracks go fluid.
 */

@media (min-width: 1322px) {
	.emm-services__grid {
		grid-template-columns: 626px 626px;
	}

	.emm-gallery__tabs {
		grid-template-columns: repeat(4, 303px);
	}

	.emm-gallery__tab {
		width: 303px;
	}

	.emm-why__grid {
		grid-template-columns: repeat(4, 302px);
	}

	.emm-reviews__grid {
		grid-template-columns: repeat(3, 406px);
	}

	.emm-footer__grid {
		grid-template-columns: repeat(4, 284px);
		justify-content: space-between;
		column-gap: 0;
	}
}

.emm-why-card,
.emm-quote {
	width: 100%;
	max-width: none;
}

.emm-footer__logo img {
	width: min(283px, 100%);
	height: auto;
	max-height: 56px;
}

.emm-cta__form,
.emm-jotform {
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
}

.emm-about__badge {
	flex-wrap: wrap;
	padding-inline: clamp(16px, 4vw, 64px);
}

.emm-about__photo {
	justify-self: end;
}

/* Feature bands: fluid two columns until the hamburger layout. */
@media (max-width: 1321px) {
	.emm-feature--gold .emm-feature__row {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: center;
		gap: clamp(24px, 3vw, 48px);
	}

	.emm-feature--gold .emm-feature__copy,
	.emm-feature--gold .emm-ba {
		max-width: none;
		width: 100%;
		min-width: 0;
	}

	.emm-feature--gold h2 {
		font-size: clamp(28px, 3.2vw, 40px);
		line-height: 1.2;
	}

	.emm-feature--gold .emm-feature__copy > p,
	.emm-feature--gold .emm-feature__copy > .emm-richtext {
		font-size: 16px;
		line-height: 1.6;
	}
}

/* Interior band needs more width than cuisine before the 960px image track fits. */
@media (max-width: 1679px) {
	.emm-feature--dark h2 {
		font-size: clamp(28px, 3.2vw, 40px);
		line-height: 1.2;
	}

	.emm-feature--dark .emm-feature__copy > p,
	.emm-feature--dark .emm-feature__copy > .emm-richtext {
		font-size: 16px;
		line-height: 1.6;
	}

	.emm-feature--dark {
		height: auto;
		min-height: 0;
		padding: 0;
	}

	.emm-feature--dark .emm-feature__row {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		max-width: none;
		width: 100%;
		margin: 0;
		min-height: 0;
		gap: 0;
		align-items: stretch;
	}

	.emm-feature--dark .emm-feature__media {
		height: auto;
		min-height: 480px;
		border-radius: 0;
	}

	.emm-feature--dark .emm-feature__copy {
		width: auto;
		max-width: none;
		min-width: 0;
		margin-left: 0;
		padding: clamp(32px, 4vw, 48px) clamp(24px, 3.5vw, 48px);
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}

/* —— Laptop / small desktop: stack bands, keep two-up cards —— */
@media (max-width: 1279px) {
	.emm-hero {
		min-height: 0;
	}

	.emm-hero__inner {
		padding: 160px 0 64px;
	}

	.emm-cta,
	.emm-about,
	.emm-services,
	.emm-projects,
	.emm-why,
	.emm-reviews,
	.emm-footer,
	.emm-feature--gold,
	.emm-feature--dark {
		height: auto;
		min-height: 0;
	}

	.emm-why__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.emm-reviews__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.emm-gallery__tabs {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.emm-footer__grid {
		column-gap: 32px;
	}
}

/* —— Tablet / hamburger nav —— */
@media (max-width: 1024px) {
	.emm-nav-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		z-index: 40;
		margin-left: auto;
	}

	.emm-header {
		position: fixed;
	}

	.emm-nav-backdrop {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 20;
		border: 0;
		padding: 0;
		margin: 0;
		background: rgba(16, 10, 12, 0.55);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 360ms ease, visibility 360ms ease;
	}

	body.emm-nav-open .emm-nav-backdrop {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	.emm-nav {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto;
		z-index: 30;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
		width: min(360px, 86vw);
		padding: calc(var(--emm-header-h) + 12px) 28px 32px;
		background: var(--emm-black);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		transform: translate3d(100%, 0, 0);
		visibility: hidden;
		pointer-events: none;
		box-shadow: none;
		transition:
			transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
			visibility 420ms cubic-bezier(0.22, 1, 0.36, 1),
			box-shadow 420ms ease;
	}

	.admin-bar .emm-nav {
		top: var(--wp-admin--admin-bar--height, 32px);
	}

	.emm-nav.is-open {
		transform: translate3d(0, 0, 0);
		visibility: visible;
		pointer-events: auto;
		box-shadow: -16px 0 40px rgba(0, 0, 0, 0.35);
	}

	.emm-nav__list,
	.emm-nav .menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
		width: 100%;
		padding-bottom: 8px;
	}

	.emm-nav__list a,
	.emm-nav__link {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 8px 0;
		opacity: 0;
		transform: translateX(18px);
		transition:
			opacity 320ms ease,
			transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
	}

	.emm-nav.is-open .emm-nav__list a,
	.emm-nav.is-open .emm-nav__link {
		opacity: 1;
		transform: translateX(0);
	}

	.emm-nav.is-open .emm-nav__list li:nth-child(1) a { transition-delay: 80ms; }
	.emm-nav.is-open .emm-nav__list li:nth-child(2) a { transition-delay: 130ms; }
	.emm-nav.is-open .emm-nav__list li:nth-child(3) a { transition-delay: 180ms; }
	.emm-nav.is-open .emm-nav__list li:nth-child(4) a { transition-delay: 230ms; }
	.emm-nav.is-open .emm-nav__list li:nth-child(5) a { transition-delay: 280ms; }
	.emm-nav.is-open .emm-nav__list li:nth-child(6) a { transition-delay: 330ms; }

	.emm-btn--gold-nav {
		align-self: stretch;
		width: 100%;
		max-width: none;
		height: 48px;
		opacity: 0;
		transform: translateX(18px);
		transition:
			opacity 320ms ease,
			transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
			filter var(--emm-duration) var(--emm-ease),
			box-shadow var(--emm-duration) var(--emm-ease),
			background-image var(--emm-duration) var(--emm-ease);
	}

	.emm-nav.is-open .emm-btn--gold-nav {
		opacity: 1;
		transform: translateX(0);
		transition-delay: 280ms;
	}

	.emm-logo img {
		width: min(240px, 62vw);
		height: auto;
	}

	body.emm-nav-open {
		overflow: hidden;
	}

	.emm-about__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.emm-about__photo {
		justify-self: stretch;
		max-width: none;
	}

	.emm-services__grid {
		grid-template-columns: 1fr;
	}

	.emm-cta__inner {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.emm-cta {
		height: auto;
		min-height: 0;
		padding-block: 72px;
	}

	.emm-feature--gold .emm-feature__row,
	.emm-feature--dark .emm-feature__row {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.emm-feature--dark {
		padding: 64px var(--emm-gutter);
	}

	.emm-feature--dark .emm-feature__row {
		max-width: var(--emm-content-wide);
		margin: 0 auto;
		width: 100%;
		min-height: 0;
	}

	.emm-feature--dark .emm-feature__media {
		height: auto;
		min-height: 0;
		aspect-ratio: 16 / 10;
		border-radius: var(--emm-radius-img);
		overflow: hidden;
	}

	.emm-feature--dark .emm-feature__copy {
		padding: 0;
	}

	.emm-ba {
		max-width: none;
	}

	.emm-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 820px) {
	.emm-hero__inner {
		padding-top: 128px;
		padding-bottom: 48px;
	}

	.emm-hero h1 {
		font-size: clamp(32px, 7vw, 44px);
		line-height: 1.2;
	}

	.emm-hero__lead {
		font-size: 16px;
		line-height: 1.6;
	}

	.emm-about,
	.emm-services,
	.emm-feature,
	.emm-projects,
	.emm-why,
	.emm-reviews,
	.emm-cta,
	.emm-footer {
		padding-block: 64px;
	}

	.emm-feature--dark {
		padding-block: 64px;
	}

	.emm-about h2,
	.emm-services__intro h2,
	.emm-feature h2,
	.emm-projects__intro h2,
	.emm-why__intro h2,
	.emm-reviews__intro h2,
	.emm-cta h2 {
		font-size: clamp(28px, 6vw, 36px);
		line-height: 1.2;
	}

	.emm-reviews__grid,
	.emm-why__grid,
	.emm-footer__grid {
		grid-template-columns: 1fr 1fr;
	}

	.emm-service-card {
		max-width: none;
		height: auto;
		min-height: 400px;
	}

	.emm-ba {
		max-width: none;
	}

	.emm-creds {
		gap: 20px 24px;
	}

	.emm-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}

	.emm-gallery__tab {
		padding: 16px 8px;
		font-size: 15px;
		min-height: 44px;
	}
}

@media (max-width: 640px) {
	.emm-hero__inner {
		padding-top: 112px;
		padding-bottom: 40px;
	}

	.emm-footer__grid {
		grid-template-columns: 1fr;
	}

	.emm-btn--gold,
	.emm-btn--ghost,
	.emm-btn--white,
	.emm-btn--gold-sm,
	.emm-btn--solid {
		min-width: 0;
		width: 100%;
		white-space: normal;
		height: auto;
		min-height: 48px;
		padding-block: 12px;
	}

	.emm-gallery__tabs {
		grid-template-columns: 1fr 1fr;
	}

	.emm-gallery__tab {
		padding: 12px 8px;
		font-size: 14px;
		letter-spacing: 0;
	}

	.emm-eyebrow {
		font-size: 13px;
		letter-spacing: 0.16em;
	}

	.emm-about__badge strong {
		font-size: 36px;
		line-height: 1.1;
	}

	.emm-projects__intro,
	.emm-services__intro {
		margin-bottom: 40px;
	}

	.emm-projects__more {
		margin-top: 40px;
	}
}

@media (max-width: 430px) {
	.emm-gallery__tabs {
		grid-template-columns: 1fr;
	}

	.emm-hero__fade {
		width: 100%;
	}

	.emm-about__badge {
		gap: 8px;
		padding-block: 16px;
	}

	.emm-about__badge span {
		font-size: 12px;
	}
}

@media (max-width: 360px) {
	.emm-hero h1 {
		font-size: 28px;
	}

	.emm-cred {
		width: 100%;
	}
}
