/**
 * Salam — Responsive global
 * Aligné sur les frames Figma Desktop 1440px / Mobile ~465px.
 */

/* ── Grilles dynamiques ───────────────────────────────────────────── */

.salam-grid--products {
	grid-template-columns: var(--salam-grid-products);
}

.salam-grid--recipes {
	grid-template-columns: var(--salam-grid-recipes);
}

.gammes-grid {
	grid-template-columns: var(--salam-grid-gammes);
}

.instagram-grid {
	grid-template-columns: repeat(6, 1fr);
}

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

@media (max-width: 767px) {
	.instagram-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.5rem;
	}
}

/* iPad Mini, Air & Pro : le bandeau image ne dépasse pas 400px de haut. */
@media (min-width: 768px) and (max-width: 1366px) {
	.salam-page-hero--has-image {
		height: 400px;
		max-height: 400px;
		min-height: 0;
	}

	.salam-page-hero--has-image .salam-page-hero__image {
		width: 100%;
		height: 100%;
		max-height: 400px;
		object-fit: cover;
		object-position: center;
	}
}

/* ── Typographie responsive ───────────────────────────────────────── */

@media (max-width: 767px) {
	/* Fil d'Ariane — espacement uniforme sous le bandeau (réf. fiche produit). */
	body:not(.home) .salam-breadcrumb {
		margin-block: 0;
		padding-block: 1.5rem 0.5rem;
	}

	/* Le fil d'Ariane porte l'écart sous le bandeau : pas de padding-top en double. */
	body:not(.home) :is(
		.salam-breadcrumb-bar,
		.produits-archive__intro,
		.recettes-archive,
		.contact-page,
		.faq-page__section,
		.legal-page .salam-section,
		.salam-error .salam-section,
		.salam-search .salam-section,
		.page-content
	) {
		padding-top: 0;
	}

	.salam-section-title {
		margin-bottom: var(--salam-spacing-block);
	}

	.salam-page-hero__inner {
		padding-block: 2.5rem;
	}

	/* Main du bandeau interne — max 60px (ratio hand.svg 64×78). */
	.salam-mark.salam-page-hero__mark {
		height: 60px;
		width: calc(60px * 64 / 78);
		max-height: 60px;
	}

	.hero-carousel__content {
		padding-inline: 1.25rem;
	}

	.hero-carousel__subtitle {
		font-size: 1rem;
	}

	/* Titres de page (H1) — alignés sur la fiche produit mobile */
	.salam-page-title__heading.home-title,
	.archive-page__title,
	.page-content__title {
		font-size: var(--salam-font-size-page-hero);
	}
}

/* ── Filtres & formulaires ────────────────────────────────────────── */

@media (max-width: 767px) {
	.recipe-filters {
		flex-direction: column;
		align-items: stretch;
		padding: 1.25rem;
	}

	.recipe-filters__group {
		width: 100%;
		min-width: 0;
	}

	.contact-page__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.produit-single__hero {
		grid-template-columns: 1fr;
		gap: 2rem;
		padding-block: 2.5rem;
	}

	.produit-tabs__nav {
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.produit-tabs__nav::-webkit-scrollbar {
		display: none;
	}

	.produit-tabs__trigger {
		flex-shrink: 0;
		white-space: nowrap;
	}

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

	.salam-archive-header {
		padding-block: 2.5rem 1.5rem;
	}

	.faq-page__content,
	.legal-page__content {
		padding-inline: 0;
	}
}

@media (max-width: 479px) {
	.formats-grid {
		grid-template-columns: 1fr;
	}

	.gamme-block__filters {
		gap: 0.5rem 1rem;
	}

	.gamme-nav__list {
		justify-content: flex-start;
		overflow-x: auto;
		flex-wrap: nowrap;
		padding-bottom: 0.5rem;
		-webkit-overflow-scrolling: touch;
	}

	.gamme-nav__link {
		flex-shrink: 0;
	}
}

@media (max-width: 1023px) {
	.site-header .site-header__menu > .menu-item:last-child > a {
		width: 100%;
		justify-content: center;
		margin-top: 0.5rem;
	}
}