/**
 * Oguey MVM — Page gamme (taxonomie product_category).
 *
 * Tout est scopé sous #oguey-tax-gamme avec !important, pour tenir face à
 * l'injection CSS globale d'Elementor.
 *
 * Arbitrages face à la maquette Figma « Portails et garde-corps » :
 *   - conteneur 1320 px du site, et non les 1499 px asymétriques du Figma ;
 *   - espacements ramenés sur l'échelle 4/8 (127 → 128, 22 → 24, 35 → 32,
 *     49 → 48, 19 → 20) ;
 *   - texte de carte à 14 px (--oguey-fs-card-p) et non 13 px ;
 *   - icônes normalisées à 64 px comme .oguey-atout__icon ;
 *   - AUCUNE majuscule forcée : le Figma affiche de fausses capitales
 *     (text-case UPPER) sur les étiquettes, on les ignore.
 */

/* ====================================================================
 * CONTENEUR
 *
 * Chaque gabarit du thème redéclare .oguey-container sous son propre
 * identifiant. Cette page ne le faisait pas : le contenu s'affichait donc
 * collé aux bords de la fenêtre, sans largeur maximale ni marge latérale.
 * ================================================================== */
#oguey-tax-gamme .oguey-container {
	width: 100% !important;
	max-width: var(--oguey-container-width) !important;
	margin-inline: auto !important;
	padding-inline: var(--oguey-container-padding) !important;
}

@media (max-width: 767px) {
	#oguey-tax-gamme .oguey-container {
		padding-inline: var(--oguey-container-padding-mobile) !important;
	}
}

/* ====================================================================
 * 1. HERO
 * ================================================================== */
#oguey-tax-gamme .oguey-gamme-hero__banner {
	position: relative !important;
	display: flex !important;
	align-items: flex-end !important;
	min-height: 420px !important;
	background-position: center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
}

#oguey-tax-gamme .oguey-gamme-hero__banner::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	background: linear-gradient(180deg, rgba(8, 35, 81, 0.15) 0%, rgba(8, 35, 81, 0.65) 100%) !important;
}

#oguey-tax-gamme .oguey-gamme-hero__inner {
	position: relative !important;
	z-index: 1 !important;
	width: 100% !important;
	max-width: var(--oguey-container-width) !important;
	margin: 0 auto !important;
	padding: 0 var(--oguey-container-padding) var(--oguey-space-16) !important;
}

#oguey-tax-gamme .oguey-gamme-hero__breadcrumb {
	margin: 0 0 var(--oguey-space-3) !important;
	font-family: var(--oguey-font-body) !important;
	font-size: 0.875rem !important;
	color: rgba(255, 255, 255, 0.85) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-hero__breadcrumb a {
	color: inherit !important;
	text-decoration: none !important;
}

#oguey-tax-gamme .oguey-gamme-hero__breadcrumb span {
	margin: 0 var(--oguey-space-2) !important;
}

#oguey-tax-gamme .oguey-gamme-hero__title {
	margin: 0 !important;
	max-width: 20ch !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-hero-h1) !important;
	line-height: var(--oguey-lh-tight) !important;
	color: #ffffff !important;
	text-transform: none !important;
}

/* ====================================================================
 * 2. INTRO — deux colonnes
 * ================================================================== */
#oguey-tax-gamme .oguey-gamme-intro {
	padding: var(--oguey-space-24) 0 !important;
	background: var(--oguey-color-bg) !important;
}

#oguey-tax-gamme .oguey-gamme-intro__inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
	gap: var(--oguey-space-16) !important;
	align-items: start !important;
}

#oguey-tax-gamme .oguey-gamme-intro__eyebrow {
	margin: 0 0 var(--oguey-space-3) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 0.875rem !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	color: var(--oguey-color-text-muted) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-intro__title {
	margin: 0 !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-section) !important;
	line-height: var(--oguey-lh-snug) !important;
	color: var(--oguey-color-heading) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-intro__body {
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-body) !important;
	line-height: var(--oguey-lh-body) !important;
	color: var(--oguey-color-text) !important;
}

#oguey-tax-gamme .oguey-gamme-intro__body p {
	margin: 0 0 var(--oguey-space-4) !important;
}

#oguey-tax-gamme .oguey-gamme-intro__col--body .oguey-btn {
	margin-top: var(--oguey-space-4) !important;
}

/* ====================================================================
 * 3. POURQUOI FAIRE APPEL — 4 colonnes, fond crème
 * ================================================================== */
#oguey-tax-gamme .oguey-gamme-pourquoi {
	padding: var(--oguey-space-24) 0 !important;
	background: var(--oguey-color-cream) !important;
}

#oguey-tax-gamme .oguey-gamme-pourquoi__head {
	max-width: 62ch !important;
	margin: 0 auto var(--oguey-space-20) !important;
	text-align: center !important;
}

#oguey-tax-gamme .oguey-gamme-pourquoi__title {
	margin: 0 0 var(--oguey-space-6) !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-section) !important;
	line-height: var(--oguey-lh-snug) !important;
	color: var(--oguey-color-heading) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-pourquoi__intro {
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-body) !important;
	line-height: var(--oguey-lh-body) !important;
	color: var(--oguey-color-text) !important;
}

#oguey-tax-gamme .oguey-gamme-pourquoi__grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: var(--oguey-space-12) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

/* Icône et textes centrés dans la colonne, comme sur la maquette. */
#oguey-tax-gamme .oguey-gamme-pourquoi__item {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
	gap: var(--oguey-space-4) !important;
}

#oguey-tax-gamme .oguey-gamme-pourquoi__item .oguey-atout__icon {
	justify-content: center !important;
}

/* Icônes normalisées : le Figma livre 58/64/56/49, écart de maquette. */
#oguey-tax-gamme .oguey-atout__icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 64px !important;
}

#oguey-tax-gamme .oguey-atout__icon img,
#oguey-tax-gamme .oguey-atout__icon svg {
	display: block !important;
	width: auto !important;
	height: 100% !important;
}

#oguey-tax-gamme .oguey-atout__title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 1.125rem !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	color: var(--oguey-neutral-950) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-atout__text {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-card-p) !important;
	line-height: var(--oguey-lh-normal) !important;
	color: var(--oguey-neutral-600) !important;
}

/* ====================================================================
 * 4. RANGÉES DE CARTES
 *
 * La colonne texte est ancrée sur le conteneur ; la rangée de cartes
 * déborde volontairement au-delà du bord droit, comme dans la maquette.
 * ================================================================== */
#oguey-tax-gamme .oguey-gamme-row {
	padding: var(--oguey-space-24) 0 0 !important;
	overflow: hidden !important;
}

#oguey-tax-gamme .oguey-gamme-row__inner {
	display: grid !important;
	grid-template-columns: minmax(0, 36%) minmax(0, 1fr) !important;
	gap: var(--oguey-space-16) !important;
	align-items: start !important;
	max-width: none !important;
	padding-right: 0 !important;
	padding-left: max(var(--oguey-container-padding), calc((100vw - var(--oguey-container-width)) / 2)) !important;
}

#oguey-tax-gamme .oguey-gamme-row__eyebrow {
	margin: 0 0 var(--oguey-space-3) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 0.875rem !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	color: var(--oguey-color-text-muted) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-row__title {
	margin: 0 0 var(--oguey-space-6) !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-section) !important;
	line-height: var(--oguey-lh-snug) !important;
	color: var(--oguey-color-heading) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-row__body {
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-body) !important;
	line-height: var(--oguey-lh-body) !important;
	color: var(--oguey-color-text) !important;
}

#oguey-tax-gamme .oguey-gamme-row__nav {
	display: flex !important;
	gap: var(--oguey-space-3) !important;
	margin-top: var(--oguey-space-8) !important;
}

#oguey-tax-gamme .oguey-gamme-nav {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 46px !important;
	height: 46px !important;
	padding: 0 !important;
	background: transparent !important;
	border: 1px solid var(--oguey-color-brand) !important;
	border-radius: var(--oguey-radius-none) !important;
	color: var(--oguey-color-brand) !important;
	cursor: pointer !important;
	transition: background var(--oguey-transition-fast), color var(--oguey-transition-fast) !important;
}

#oguey-tax-gamme .oguey-gamme-nav:hover,
#oguey-tax-gamme .oguey-gamme-nav:focus-visible {
	background: var(--oguey-color-brand) !important;
	color: #ffffff !important;
}

#oguey-tax-gamme .oguey-gamme-nav[disabled] {
	opacity: 0.35 !important;
	cursor: default !important;
}

#oguey-tax-gamme .oguey-gamme-row__carousel {
	display: flex !important;
	gap: var(--oguey-space-5) !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	scroll-behavior: smooth !important;
	scrollbar-width: none !important;
	padding-bottom: var(--oguey-space-2) !important;
}

#oguey-tax-gamme .oguey-gamme-row__carousel::-webkit-scrollbar {
	display: none !important;
}

/* ====================================================================
 * Carte de gamme
 * ================================================================== */
#oguey-tax-gamme .oguey-gamme-card {
	flex: 0 0 428px !important;
	max-width: 428px !important;
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-4) !important;
	padding: 0 var(--oguey-space-10) var(--oguey-space-8) !important;
	background: var(--oguey-color-bg) !important;
	border-radius: var(--oguey-radius-none) !important;
	scroll-snap-align: start !important;
}

#oguey-tax-gamme .oguey-gamme-card__media {
	display: block !important;
	margin: 0 calc(-1 * var(--oguey-space-10)) !important;
	aspect-ratio: 428 / 371 !important;
	overflow: hidden !important;
}

#oguey-tax-gamme .oguey-gamme-card__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform var(--oguey-transition-slow) !important;
}

#oguey-tax-gamme .oguey-gamme-card:hover .oguey-gamme-card__img {
	transform: scale(1.04) !important;
}

#oguey-tax-gamme .oguey-gamme-card__content {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: var(--oguey-space-3) !important;
}

/* Étiquette : le Figma la met en fausses capitales, on ne les reprend pas. */
#oguey-tax-gamme .oguey-gamme-card__badge {
	margin: 0 !important;
	padding: 9px !important;
	background: var(--oguey-color-brand) !important;
	border: 1px solid var(--oguey-color-brand) !important;
	border-radius: var(--oguey-radius-none) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 600 !important;
	font-size: 12px !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	line-height: 1.2 !important;
	color: #ffffff !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-card__title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-card-title) !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	line-height: var(--oguey-lh-snug) !important;
	color: var(--oguey-neutral-950) !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-card__text {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-card-p) !important;
	line-height: var(--oguey-lh-normal) !important;
	color: var(--oguey-neutral-600) !important;
}

#oguey-tax-gamme .oguey-gamme-card__cta {
	display: inline-flex !important;
	align-items: center !important;
	gap: var(--oguey-space-2) !important;
	margin-top: var(--oguey-space-2) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 600 !important;
	font-size: var(--oguey-fs-button) !important;
	color: var(--oguey-color-brand) !important;
	text-decoration: none !important;
	text-transform: none !important;
}

#oguey-tax-gamme .oguey-gamme-card__cta:hover {
	color: var(--oguey-color-link-hover) !important;
}

/* La FAQ de la page gamme réutilise désormais le composant de la fiche
 * produit (.oguey-product__faq, .oguey-faq, .oguey-hero__card-blue) : ses
 * anciennes règles propres ont été supprimées pour éviter toute divergence.
 */

/* ====================================================================
 * Adaptations tablette et mobile
 *
 * Cahier des charges §4.6 : aucun contenu stratégique masqué ou
 * simplifié sur mobile. Les grilles se replient, rien ne disparaît.
 * ================================================================== */
@media (max-width: 1024px) {
	#oguey-tax-gamme .oguey-gamme-pourquoi__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: var(--oguey-space-10) !important;
	}

	#oguey-tax-gamme .oguey-gamme-row__inner {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: var(--oguey-space-8) !important;
	}

	}

@media (max-width: 767px) {
	#oguey-tax-gamme .oguey-gamme-intro__inner {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: var(--oguey-space-8) !important;
	}

	#oguey-tax-gamme .oguey-gamme-pourquoi__grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	#oguey-tax-gamme .oguey-gamme-card {
		flex-basis: 82vw !important;
		max-width: 82vw !important;
		padding-right: var(--oguey-space-6) !important;
		padding-left: var(--oguey-space-6) !important;
	}

	#oguey-tax-gamme .oguey-gamme-card__media {
		margin: 0 calc(-1 * var(--oguey-space-6)) !important;
	}

	#oguey-tax-gamme .oguey-gamme-hero__banner {
		min-height: 320px !important;
	}
}

/* Même neutralisation de l'arrondi global d'Elementor sur la page gamme. */
#oguey-tax-gamme .oguey-gamme-card__media,
#oguey-tax-gamme .oguey-gamme-card__img,
#oguey-tax-gamme .oguey-gamme-hero__banner,
#oguey-tax-gamme img {
	border-radius: var(--oguey-radius-none) !important;
}

@media (max-width: 767px) {
	#oguey-tax-gamme .oguey-gamme-nav {
		width: 40px !important;
		height: 40px !important;
	}
	#oguey-tax-gamme .oguey-gamme-card__badge {
		font-size: 11px !important;
	}
}

/* ====================================================================
 * CARTE « D'AUTRES QUESTIONS ? »
 *
 * Composant repris à l'identique de la fiche produit. Ses règles sont
 * scopées sous #oguey-single-product, identifiant absent de cette page :
 * elles sont donc redéclarées ici, à valeurs identiques. Toute évolution
 * du composant doit être répercutée dans les deux fichiers.
 * ================================================================== */
#oguey-tax-gamme .oguey-hero__card-blue {
	position: relative !important;
	overflow: hidden !important;
	background-color: var(--oguey-color-brand-deep) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 60px 30px !important;
	width: 100% !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-leaf {
	position: absolute !important;
	width: 500px !important;
	height: 322px !important;
	top: -201px !important;
	left: -50px !important;
	pointer-events: none !important;
	opacity: 1 !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-inner {
	position: relative !important;
	z-index: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 71px !important;
	width: 100% !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-text {
	display: flex !important;
	flex-direction: column !important;
	gap: 30px !important;
	width: 100% !important;
	text-align: center !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 1.4375rem !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	text-transform: none !important;
	color: var(--oguey-color-cream) !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-desc {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1rem !important;
	line-height: 1.475 !important;
	color: var(--oguey-neutral-100) !important;
}

#oguey-tax-gamme .oguey-hero__card-blue-cta {
	flex: 0 0 auto !important;
}

@media (max-width: 767px) {
	#oguey-tax-gamme .oguey-hero__card-blue {
		padding: var(--oguey-space-10) var(--oguey-space-6) !important;
	}
	#oguey-tax-gamme .oguey-hero__card-blue-inner {
		gap: var(--oguey-space-10) !important;
	}
}

/* L'icône par défaut est un SVG en ligne : sa couleur suit le texte. */
#oguey-tax-gamme .oguey-atout__icon svg {
	width: auto !important;
	height: 100% !important;
	color: var(--oguey-neutral-950) !important;
}
