/**
 * Oguey — single « Produit »
 * Styles du template `single-oguey_product.php` (fiche produit).
 *
 * Mêmes règles que le single réalisation :
 *   - tout scopé sous #oguey-single-product + !important
 *     (Elementor injecte des styles globaux qui gagnent sinon) ;
 *   - AUCUNE majuscule forcée sur les boutons / titres de carte ;
 *   - chargé uniquement sur ce template (enqueue conditionnel — cdc 4.5).
 *
 * Construit section par section. ÉTAPE 2 : hero + tabs nav.
 * Valeurs tirées des nodes Figma 605:3799 (hero) et 101:420 (tabs).
 */

#oguey-single-product *,
#oguey-single-product *::before,
#oguey-single-product *::after {
	box-sizing: border-box;
}

/* ====================================================================
   Conteneur centré — IL MANQUAIT dans ce fichier (bug : la présentation
   débordait pleine largeur faute de .oguey-container défini ici).
   Scopé sous l'ID + !important comme le reste — Elementor écrase sinon.
   ==================================================================== */
#oguey-single-product .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-single-product .oguey-container {
		padding-inline: var(--oguey-container-padding-mobile) !important;
	}
}

/* ====================================================================
   1. HERO — bandeau photo plein écran (Figma 605:3799)
   --------------------------------------------------------------------
   PAS de carte blanche en surimpression (différence avec réalisation) :
   juste la photo, l'overlay, et le bloc texte blanc dessus.
   ==================================================================== */

#oguey-single-product .oguey-product-hero {
	position: relative !important;
	background-color: #ffffff !important;
}

/* Le bandeau : photo de fond, hauteur 534px (Figma). */
#oguey-single-product .oguey-product-hero__banner {
	position: relative !important;
	min-height: 534px !important;
	background-color: var(--oguey-color-brand-deep) !important;
	background-size: cover !important;
	background-position: center !important;
	display: flex !important;
	align-items: center !important;
	padding-block: var(--oguey-space-16) !important;
}

/* Overlay noir 30% — rgba(0,0,0,0.3) dans le Figma. */
#oguey-single-product .oguey-product-hero__banner::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	background-color: rgba(0, 0, 0, 0.3) !important;
	pointer-events: none !important;
}

/* Bloc texte : Figma => left 300px, largeur 1018px, gap 8px.
   On reproduit via le conteneur du thème + une largeur max. */
#oguey-single-product .oguey-product-hero__inner {
	position: relative !important;
	z-index: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-2) !important; /* 8px */
	width: 100% !important;
	max-width: var(--oguey-container-width) !important;
	margin-inline: auto !important;
	padding-left: var(--oguey-container-padding) !important;
	padding-right: var(--oguey-container-padding) !important;
}

/* Fil d'Ariane — Raleway SemiBold 16px, blanc, lh 43.6px, tracking 0.5px */
#oguey-single-product .oguey-product-hero__breadcrumb {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 600 !important;
	font-size: 1rem !important; /* 16px */
	line-height: 43.6px !important;
	letter-spacing: 0.5px !important;
	color: #ffffff !important;
}

/* H1 — Playfair Display SemiBold 48px, MAJUSCULES, lh 57.6px.
   (Le H1 EST en majuscules dans le Figma : on garde uppercase ici —
   la consigne « no uppercase » vise les boutons et titres de carte.) */
#oguey-single-product .oguey-product-hero__title {
	margin: 0 !important;
	/* Playfair Display SC, comme tous les autres titres du site : la
	   variante sans petites capitales rendait ce hero différent des pages
	   gamme et des titres de section. */
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: clamp(2rem, 1.6vw + 1.6rem, 3rem) !important; /* ~48px desktop */
	line-height: 1.2 !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: #ffffff !important;
}

/* Intro — Raleway Regular 18px, blanc, lh 31.6px, casse normale.
   (Le Figma a une classe « uppercase » sur le wrapper mais le texte
   réel est en minuscules : on rend donc en casse normale.) */
#oguey-single-product .oguey-product-hero__intro {
	margin: 0 !important;
	max-width: 1018px !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 400 !important;
	font-size: 1.125rem !important; /* 18px */
	line-height: 31.6px !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: #ffffff !important;
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-product-hero__banner {
		min-height: 380px !important;
		padding-block: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-product-hero__title {
		font-size: 1.625rem !important; /* ~26px sur mobile */
		line-height: 1.25 !important;
	}
	#oguey-single-product .oguey-product-hero__intro {
		font-size: 1rem !important; /* 16px */
		line-height: 1.7 !important;
	}
}

/* ====================================================================
   2. TABS NAV — barre d'onglets ancrée sous le hero (Figma 101:420)
   --------------------------------------------------------------------
   bg blanc, bordures haut + bas 2px #d0d0d0, padding 14px 150px,
   flex gap 48px centré. Onglet actif : texte #143f84 + barre 2px dessous.
   Inactif : texte #464646. Dividers verticaux 2px×46px #d9d9d9.
   Collée en haut au scroll (sticky) pour rester accessible.
   ==================================================================== */

#oguey-single-product .oguey-product-tabs {
	position: sticky !important;
	top: 0 !important;
	z-index: 20 !important;
	background-color: #ffffff !important;
	border-top: 2px solid #d0d0d0 !important;
	border-bottom: 2px solid #d0d0d0 !important;
}

#oguey-single-product .oguey-product-tabs__inner {
	display: flex !important;
	align-items: stretch !important;
	justify-content: center !important;
	gap: 48px !important;
	padding: 14px 150px !important;
	max-width: var(--oguey-container-width) !important;
	margin-inline: auto !important;
}

/* Chaque onglet : colonne (libellé + barre dessous), centré. */
#oguey-single-product .oguey-product-tabs__tab {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 0 !important;
	text-decoration: none !important;
	background: none !important;
	border: none !important;
	cursor: pointer !important;
	flex: 0 0 auto !important;
	padding: 0 !important;
}

/* Libellé — Raleway Medium 16px, tracking 0.5px, lh 43.6px.
   Inactif #464646 ; actif #143f84. Casse normale. */
#oguey-single-product .oguey-product-tabs__label {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important; /* Medium */
	font-size: 1rem !important; /* 16px */
	line-height: 43.6px !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	text-align: center !important;
	white-space: nowrap !important;
	color: #464646 !important;
	transition: color var(--oguey-transition-fast) !important;
}

/* Barre 2px sous le libellé — visible seulement pour l'onglet actif. */
#oguey-single-product .oguey-product-tabs__underline {
	display: block !important;
	width: 100% !important;
	height: 2px !important;
	background-color: #143f84 !important;
	opacity: 0 !important;
	transition: opacity var(--oguey-transition-fast) !important;
}

#oguey-single-product .oguey-product-tabs__tab:hover .oguey-product-tabs__label,
#oguey-single-product .oguey-product-tabs__tab:focus-visible .oguey-product-tabs__label {
	color: #143f84 !important;
}

#oguey-single-product .oguey-product-tabs__tab.is-active .oguey-product-tabs__label {
	color: #143f84 !important;
}

#oguey-single-product .oguey-product-tabs__tab.is-active .oguey-product-tabs__underline {
	opacity: 1 !important;
}

/* Divider vertical entre onglets — 2px × 46px #d9d9d9. */
#oguey-single-product .oguey-product-tabs__divider {
	flex: 0 0 auto !important;
	width: 2px !important;
	height: 46px !important;
	background-color: #d9d9d9 !important;
	align-self: center !important;
}

/* Tablette : on réduit le padding horizontal énorme du Figma (150px). */
@media (max-width: 1024px) {
	#oguey-single-product .oguey-product-tabs__inner {
		padding: 14px var(--oguey-container-padding) !important;
		gap: var(--oguey-space-6) !important;
	}
}

/* Mobile : la barre devient scrollable horizontalement plutôt que
   d'écraser / masquer des onglets (cdc 4.6 — rien de masqué). */
@media (max-width: 767px) {
	#oguey-single-product .oguey-product-tabs__inner {
		justify-content: flex-start !important;
		gap: var(--oguey-space-4) !important;
		padding: 10px var(--oguey-container-padding-mobile) !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
	}
	#oguey-single-product .oguey-product-tabs__label {
		line-height: 2 !important;
	}
	#oguey-single-product .oguey-product-tabs__divider {
		height: 28px !important;
	}
}

/* ====================================================================
   Sections placeholder — neutralisées tant que le contenu n'est pas
   construit (étapes 3+). Pas de hauteur imposée : ancres invisibles.
   ==================================================================== */
#oguey-single-product .oguey-product-section--placeholder {
	scroll-margin-top: 90px !important; /* compense la barre sticky */
}

/* ====================================================================
   3-4. PRÉSENTATION + SECTIONS « Une pergola pensée pour durer »
   --------------------------------------------------------------------
   On REPREND À L'IDENTIQUE le CSS des sections de contenu du single
   réalisation (.oguey-section, .oguey-btn) — design validé. Le Figma
   produit étant mal foutu, on ne le suit pas ici.
   Re-scopé sous #oguey-single-product + !important.
   ==================================================================== */

/* Boutons — repris du composant Figma « bt 2/v2 ».
   Scopes sous l'ID + !important : Elementor stylise agressivement les <a>,
   ce qui ecrasait la couleur de texte des boutons (texte bleu au lieu de
   blanc) — corrige ici. */
#oguey-single-product .oguey-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: var(--oguey-space-3) !important;
	padding: var(--oguey-space-3) var(--oguey-space-5) !important;
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-button) !important;
	font-weight: 600 !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	text-transform: none !important;
	text-decoration: none !important;
	border: 1px solid transparent !important;
	border-radius: 0 !important;
	cursor: pointer !important;
	transition: background-color var(--oguey-transition-normal),
		color var(--oguey-transition-normal),
		border-color var(--oguey-transition-normal) !important;
}

#oguey-single-product .oguey-btn__icon {
	flex: 0 0 auto !important;
}

/* Bouton plein : fond bleu, TEXTE BLANC */
#oguey-single-product .oguey-btn--primary {
	background-color: var(--oguey-color-brand) !important;
	color: #ffffff !important;
}

#oguey-single-product .oguey-btn--primary:hover,
#oguey-single-product .oguey-btn--primary:focus-visible {
	background-color: var(--oguey-color-brand-deep) !important;
	color: #ffffff !important;
}

/* Bouton contour : bordure bleue, texte bleu → plein bleu + texte blanc au survol */
#oguey-single-product .oguey-btn--ghost {
	background-color: transparent !important;
	color: var(--oguey-color-brand) !important;
	border-color: var(--oguey-color-brand) !important;
}

#oguey-single-product .oguey-btn--ghost:hover,
#oguey-single-product .oguey-btn--ghost:focus-visible {
	background-color: var(--oguey-color-brand) !important;
	color: #ffffff !important;
}

/* Bouton « texte seul » : pas de fond, texte bleu, pictogramme bleu
   (ex. « Voir nos réalisations », « Devis gratuit », « Découvrir nos solutions ») */
#oguey-single-product .oguey-btn--text {
	background-color: transparent !important;
	color: var(--oguey-color-brand) !important;
	border-color: transparent !important;
	padding-inline: var(--oguey-space-2) !important;
}

#oguey-single-product .oguey-btn--text:hover,
#oguey-single-product .oguey-btn--text:focus-visible {
	color: var(--oguey-color-brand-deep) !important;
}

/* ====================================================================
   2. Sections de contenu (alternance gauche / droite)
   --------------------------------------------------------------------
   Valeurs reprises du Figma node 605:3937. Scopees sous l'ID +
   !important : Elementor ecrase sinon. Pas de carrousel — pile verticale
   (demande client). Images TOUJOURS carrees (demande client).
   ==================================================================== */

#oguey-single-product .oguey-section {
	padding-block: var(--oguey-space-20) !important;
}

#oguey-single-product .oguey-section__inner {
	display: flex !important;
	gap: 49px !important;            /* Figma 605:3937 */
	align-items: center !important;
}

/* Position de l'image : a gauche (defaut) ou a droite */
#oguey-single-product .oguey-section--img-right .oguey-section__inner {
	flex-direction: row-reverse !important;
}

#oguey-single-product .oguey-section__media,
#oguey-single-product .oguey-section__text {
	flex: 1 1 50% !important;
	min-width: 0 !important;
}

/* Image : TOUJOURS parfaitement carree (aspect-ratio 1/1, recadrage cover) */
#oguey-single-product .oguey-section__media {
	display: block !important;
}

#oguey-single-product .oguey-section__img {
	display: block !important;
	width: 100% !important;
	aspect-ratio: 1 / 1 !important;  /* carre parfait — demande client */
	height: auto !important;
	object-fit: cover !important;
	border-radius: 0 !important;
}

/* Bloc texte — gap 28px dans le Figma */
#oguey-single-product .oguey-section__text {
	display: flex !important;
	flex-direction: column !important;
	gap: 28px !important;            /* Figma 605:3937 */
}

/* Sur-titre (optionnel) — Raleway Light 20px, #949494, PAS de majuscules */
#oguey-single-product .oguey-section__eyebrow {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 300 !important;     /* Light */
	font-size: 1.25rem !important;   /* 20px */
	letter-spacing: var(--oguey-ls-wide) !important;
	text-transform: none !important;
	color: #949494 !important;
}

/* Titre — Playfair Display SC Bold 32px, #143f84 */
#oguey-single-product .oguey-section__title {
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 2rem !important;      /* 32px */
	line-height: var(--oguey-lh-tight) !important;
	color: #143F84 !important;
	margin: 0 !important;
}

/* Corps — Raleway Medium 18px, #464646, interligne 31.6px */
#oguey-single-product .oguey-section__body {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1.125rem !important;  /* 18px */
	line-height: 1.756 !important;   /* 31.6 / 18 */
	color: #464646 !important;
}

#oguey-single-product .oguey-section__body p {
	margin: 0 0 var(--oguey-space-4) !important;
}

#oguey-single-product .oguey-section__body p:last-child {
	margin-bottom: 0 !important;
}

#oguey-single-product .oguey-section__body ul,
#oguey-single-product .oguey-section__body ol {
	margin: var(--oguey-space-4) 0 !important;
	padding-left: 27px !important;   /* Figma : ms-[27px] sur les <li> */
}

#oguey-single-product .oguey-section__body li {
	margin-bottom: var(--oguey-space-2) !important;
}

#oguey-single-product .oguey-section__body a {
	color: var(--oguey-color-link) !important;
}

/* CTA — fond #143f84, texte blanc, 10/20 de padding, largeur ~291px */
#oguey-single-product .oguey-section__cta {
	margin-top: var(--oguey-space-2) !important;
	align-self: flex-start !important;
}

@media (max-width: 1024px) {
	#oguey-single-product .oguey-section__inner {
		gap: var(--oguey-space-10) !important;
	}
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-section {
		padding-block: var(--oguey-space-12) !important;
	}

	/* Mobile : image toujours au-dessus du texte, quel que soit `side`.
	   On n'enleve rien — on empile (cdc 4.6). */
	#oguey-single-product .oguey-section__inner,
	#oguey-single-product .oguey-section--img-right .oguey-section__inner {
		flex-direction: column !important;
		gap: var(--oguey-space-6) !important;
		align-items: stretch !important;
	}
}


/* --------------------------------------------------------------------
   Variante « edge » — sections « Une pergola pensée pour durer ».
   Le CÔTÉ IMAGE touche le bord de l'écran ; le CÔTÉ TEXTE reste aligné
   sur le conteneur centré (1320px). L'image n'est PAS carrée ici : elle
   prend toute la hauteur de la section. Le côté collé suit --img-left /
   --img-right. La présentation, elle, reste une .oguey-section normale.
   -------------------------------------------------------------------- */

#oguey-single-product .oguey-section--edge .oguey-section__inner--edge {
	display: flex !important;
	gap: 49px !important;
	align-items: stretch !important;      /* l'image s'étire à la hauteur du bloc texte */
	width: 100% !important;
	max-width: none !important;
	margin-inline: 0 !important;
	padding: 0 !important;
}

#oguey-single-product .oguey-section--edge.oguey-section--img-left .oguey-section__inner--edge {
	flex-direction: row !important;
}
#oguey-single-product .oguey-section--edge.oguey-section--img-left .oguey-section__text {
	padding-right: calc((100vw - var(--oguey-container-width)) / 2 + var(--oguey-container-padding)) !important;
}

#oguey-single-product .oguey-section--edge.oguey-section--img-right .oguey-section__inner--edge {
	flex-direction: row-reverse !important;
}
#oguey-single-product .oguey-section--edge.oguey-section--img-right .oguey-section__text {
	padding-left: calc((100vw - var(--oguey-container-width)) / 2 + var(--oguey-container-padding)) !important;
}

/* Côté image : ~45% de large, collé au bord. Sa hauteur SUIT le bloc
   texte. L'image est en position absolue DANS le média pour qu'elle ne
   puisse JAMAIS imposer sa hauteur intrinsèque à la rangée — c'est le
   bloc texte (contenu + padding) qui fixe la hauteur, l'image remplit. */
#oguey-single-product .oguey-section--edge .oguey-section__media {
	flex: 0 0 45% !important;
	max-width: 45% !important;
	align-self: stretch !important;
	position: relative !important;
	overflow: hidden !important;
}
#oguey-single-product .oguey-section--edge .oguey-section__img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: auto !important;
	object-fit: cover !important;
}

/* Côté texte : padding vertical = l'espace blanc au-dessus / en-dessous
   du texte. C'est CE bloc (contenu + padding) qui fixe la hauteur de la
   rangée ; l'image s'y cale. Contenu centré verticalement. */
#oguey-single-product .oguey-section--edge .oguey-section__text {
	flex: 1 1 auto !important;
	padding-block: var(--oguey-space-16) !important;  /* l'air au-dessus/en-dessous */
	justify-content: center !important;               /* contenu centré verticalement */
}
#oguey-single-product .oguey-section--edge .oguey-section__body {
	font-size: 1.1875rem !important;   /* 19px — un peu plus gros que les 18px standards */
	line-height: 1.7 !important;
}
#oguey-single-product .oguey-section--edge .oguey-section__title {
	font-size: 2.125rem !important;    /* 34px — un peu plus gros que les 32px standards */
}

@media (max-width: 1024px) {
	#oguey-single-product .oguey-section--edge .oguey-section__media {
		flex-basis: 42% !important;
		max-width: 42% !important;
	}
	#oguey-single-product .oguey-section--edge.oguey-section--img-left .oguey-section__text,
	#oguey-single-product .oguey-section--edge.oguey-section--img-right .oguey-section__text {
		padding-left: var(--oguey-container-padding) !important;
		padding-right: var(--oguey-container-padding) !important;
	}
}

@media (max-width: 767px) {
	/* Sur mobile, on ABANDONNE le système « edge » : trop fragile sur
	   petit écran (image absolue, calc() de débordement…). On repasse à
	   un bloc empilé tout simple — image pleine largeur en haut, hauteur
	   fixe raisonnable, puis le texte. On annule TOUTES les particularités
	   edge héritées du desktop. */
	#oguey-single-product .oguey-section--edge {
		padding-block: var(--oguey-space-12) !important;
		overflow-x: hidden !important;   /* filet de sécurité : rien ne déborde latéralement */
	}
	#oguey-single-product .oguey-section--edge .oguey-section__inner--edge {
		display: flex !important;
		flex-direction: column !important;
		gap: var(--oguey-space-6) !important;
		align-items: stretch !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-inline: 0 !important;
		padding: 0 var(--oguey-container-padding-mobile) !important;
		box-sizing: border-box !important;
	}
	/* Quel que soit img-left / img-right : image toujours au-dessus. */
	#oguey-single-product .oguey-section--edge.oguey-section--img-left .oguey-section__inner--edge,
	#oguey-single-product .oguey-section--edge.oguey-section--img-right .oguey-section__inner--edge {
		flex-direction: column !important;
	}
	/* Média : plus d'absolu, plus de flex-basis %. Bloc normal, pleine
	   largeur, hauteur fixe — l'image le remplit en object-fit. */
	#oguey-single-product .oguey-section--edge .oguey-section__media {
		position: static !important;
		flex: 0 0 auto !important;
		width: 100% !important;
		max-width: 100% !important;
		height: 280px !important;
		overflow: hidden !important;
	}
	#oguey-single-product .oguey-section--edge .oguey-section__img {
		position: static !important;
		inset: auto !important;
		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;
		aspect-ratio: auto !important;
		object-fit: cover !important;
	}
	/* Texte : plus de padding calc() de débordement, plus de centrage
	   vertical forcé. Bloc normal. */
	#oguey-single-product .oguey-section--edge .oguey-section__text {
		flex: 0 0 auto !important;
		padding: 0 !important;
		justify-content: flex-start !important;
	}
	#oguey-single-product .oguey-section--edge.oguey-section--img-left .oguey-section__text,
	#oguey-single-product .oguey-section--edge.oguey-section--img-right .oguey-section__text {
		padding: 0 !important;
	}
	/* Tailles de texte edge ramenées aux tailles standard sur mobile. */
	#oguey-single-product .oguey-section--edge .oguey-section__title {
		font-size: 1.625rem !important;   /* 26px */
	}
	#oguey-single-product .oguey-section--edge .oguey-section__body {
		font-size: 1rem !important;       /* 16px */
		line-height: 1.6 !important;
	}
}

/* ====================================================================
   5. NOS ENGAGEMENTS — #garanties (Figma 433:5102)
   --------------------------------------------------------------------
   Bloc fixe codé en dur. Fond crème + motif topographique couvrant la
   partie DROITE de la section ; une carte encadrée décalée à gauche qui
   déborde hors de la zone crème ; à droite 4 atouts en 2 colonnes.
   Scopé sous l'ID + !important comme le reste — Elementor écrase sinon.
   ==================================================================== */

#oguey-single-product .oguey-engagements {
	position: relative !important;
	padding-block: var(--oguey-space-20) !important;
	overflow: hidden !important;
}

/* Fond crème + motif : couche absolue couvrant ~72% à droite (le Figma
   a la zone crème qui démarre à 28,35% depuis la gauche). */
#oguey-single-product .oguey-engagements__bg {
	position: absolute !important;
	top: 0 !important;
	bottom: 0 !important;
	right: 0 !important;
	left: 28% !important;
	background-color: rgba(247, 242, 233, 0.92) !important;
	background-repeat: repeat !important;
	background-position: center !important;
	background-size: auto !important;
	z-index: 0 !important;
}

/* Conteneur centré : carte à gauche + atouts à droite. */
#oguey-single-product .oguey-engagements__inner {
	position: relative !important;
	z-index: 1 !important;
	display: flex !important;
	gap: 50px !important;
	align-items: center !important;
}

/* --------- La carte encadrée --------- */
#oguey-single-product .oguey-engagements__card {
	flex: 0 0 auto !important;
	width: 594px !important;
	max-width: 50% !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 23px !important;
	box-sizing: border-box !important;
	padding: 75px 36px 52px !important;
	border: 2px solid #d8b892 !important;
	background-color: #ffffff !important;
}

#oguey-single-product .oguey-engagements__card-head {
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
}

#oguey-single-product .oguey-engagements__eyebrow {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 400 !important;
	font-size: 20px !important;
	line-height: 1.4 !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: var(--oguey-primary-900) !important;
}

#oguey-single-product .oguey-engagements__title {
	margin: 0 !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 32px !important;
	line-height: 1.15 !important;
	text-transform: none !important;
	color: var(--oguey-primary-900) !important;
}

/* Liste des 4 items à coche */
#oguey-single-product .oguey-engagements__list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 5px !important;
}

#oguey-single-product .oguey-engagements__item {
	display: flex !important;
	gap: 8px !important;
	align-items: flex-start !important;
}

#oguey-single-product .oguey-engagements__check {
	flex: 0 0 32px !important;
	width: 32px !important;
	height: 32px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: var(--oguey-primary-900) !important;
}
#oguey-single-product .oguey-engagements__check svg {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}

#oguey-single-product .oguey-engagements__item-text {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 1.65 !important;
	color: #464646 !important;
}

/* Bouton « Découvrir » — .oguey-btn--text déjà défini plus haut
   (Raleway SemiBold, non-uppercase, flèche). On force juste la couleur. */
#oguey-single-product .oguey-engagements__cta {
	align-self: flex-start !important;
	color: var(--oguey-primary-900) !important;
}

/* --------- Les 4 atouts (2 colonnes × 2 lignes) --------- */
#oguey-single-product .oguey-engagements__atouts {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	flex: 1 1 auto !important;
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 50px !important;
}

#oguey-single-product .oguey-engagements__atout {
	display: flex !important;
	gap: 20px !important;
	align-items: flex-start !important;
}

#oguey-single-product .oguey-engagements__atout-icon {
	flex: 0 0 46px !important;
	width: 46px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
#oguey-single-product .oguey-engagements__atout-icon img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	border-radius: 0 !important;
}

#oguey-single-product .oguey-engagements__atout-body {
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
}

#oguey-single-product .oguey-engagements__atout-title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 20px !important;
	line-height: 1.3 !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: #000000 !important;
}

#oguey-single-product .oguey-engagements__atout-text {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	line-height: 1.33 !important;
	color: #464646 !important;
}

/* --------- Tablette --------- */
@media (max-width: 1024px) {
	#oguey-single-product .oguey-engagements__inner {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-engagements__card {
		width: 100% !important;
		max-width: 640px !important;
	}
	#oguey-single-product .oguey-engagements__bg {
		left: 0 !important;  /* sur tablette le fond couvre toute la largeur */
	}
}

/* --------- Mobile --------- */
@media (max-width: 767px) {
	#oguey-single-product .oguey-engagements {
		padding-block: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-engagements__card {
		padding: 40px 24px 36px !important;
	}
	#oguey-single-product .oguey-engagements__title {
		font-size: 26px !important;
	}
	#oguey-single-product .oguey-engagements__atouts {
		grid-template-columns: 1fr !important;
		gap: var(--oguey-space-8) !important;
	}
}

/* ====================================================================
   6. CARACTÉRISTIQUES TECHNIQUES — #caracteristiques (Figma 101:878)
   --------------------------------------------------------------------
   Interface à onglets. Barre d'onglets bordée gris clair ; onglet actif
   en aplat navy texte clair, inactifs texte gris. Sous la barre : un
   panneau titre + corps + bouton brochure à gauche, image à droite.
   Scopé sous l'ID + !important comme le reste.
   ==================================================================== */

#oguey-single-product .oguey-caracs {
	padding-block: var(--oguey-space-20) !important;
}

#oguey-single-product .oguey-caracs__inner {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-10) !important;
}

#oguey-single-product .oguey-caracs__title {
	margin: 0 !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 32px !important;
	line-height: 1.15 !important;
	text-transform: none !important;
	color: var(--oguey-primary-900) !important;
}

/* --------- Barre d'onglets --------- */
#oguey-single-product .oguey-caracs__tablist {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	align-items: stretch !important;
	border: 1px solid #d0d0d0 !important;
	padding: 5px !important;
}

#oguey-single-product .oguey-caracs__tab {
	appearance: none !important;
	-webkit-appearance: none !important;
	border: 0 !important;
	background: transparent !important;
	cursor: pointer !important;
	padding: 0 10px !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 2.7 !important;          /* ~43.6px sur 16px */
	letter-spacing: 0.5px !important;
	text-align: center !important;
	text-transform: none !important;
	color: #464646 !important;
	transition: background-color 0.15s ease, color 0.15s ease !important;
}

#oguey-single-product .oguey-caracs__tab:hover {
	color: var(--oguey-primary-900) !important;
}

#oguey-single-product .oguey-caracs__tab.is-active {
	background-color: var(--oguey-primary-900) !important;
	color: #fafafa !important;
}

#oguey-single-product .oguey-caracs__tab:focus-visible {
	outline: 2px solid var(--oguey-primary-900) !important;
	outline-offset: 2px !important;
}

/* --------- Panneau --------- */
#oguey-single-product .oguey-caracs__panel {
	display: flex !important;
	gap: var(--oguey-space-16) !important;
	align-items: flex-start !important;
}

#oguey-single-product .oguey-caracs__panel[hidden] {
	display: none !important;
}

#oguey-single-product .oguey-caracs__panel-text {
	flex: 1 1 55% !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 18px !important;
}

#oguey-single-product .oguey-caracs__panel-title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 25px !important;
	line-height: 1.3 !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: #000000 !important;
}

#oguey-single-product .oguey-caracs__panel-body {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	line-height: 1.7 !important;
	color: #464646 !important;
}
#oguey-single-product .oguey-caracs__panel-body p {
	margin: 0 0 0.8em !important;
}
#oguey-single-product .oguey-caracs__panel-body p:last-child {
	margin-bottom: 0 !important;
}

#oguey-single-product .oguey-caracs__cta {
	align-self: flex-start !important;
	margin-top: var(--oguey-space-2) !important;
}

/* Image du panneau — à droite */
#oguey-single-product .oguey-caracs__panel-media {
	flex: 0 0 38% !important;
	max-width: 38% !important;
}
#oguey-single-product .oguey-caracs__panel-img {
	display: block !important;
	width: 100% !important;
	aspect-ratio: 5 / 6 !important;     /* taille identique pour tous les onglets */
	height: auto !important;
	object-fit: cover !important;       /* recadre — peu importe le ratio source */
	border-radius: 0 !important;
}

/* --------- Tablette --------- */
@media (max-width: 1024px) {
	#oguey-single-product .oguey-caracs__panel {
		gap: var(--oguey-space-10) !important;
	}
}

/* --------- Mobile --------- */
@media (max-width: 767px) {
	#oguey-single-product .oguey-caracs {
		padding-block: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-caracs__title {
		font-size: 26px !important;
	}
	/* La barre d'onglets défile horizontalement plutôt que de s'empiler. */
	#oguey-single-product .oguey-caracs__tablist {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
	}
	#oguey-single-product .oguey-caracs__tab {
		white-space: nowrap !important;
		flex: 0 0 auto !important;
	}
	/* Panneau : image au-dessus du texte (cdc 4.6 : rien de masqué). */
	#oguey-single-product .oguey-caracs__panel {
		flex-direction: column !important;
		gap: var(--oguey-space-6) !important;
	}
	#oguey-single-product .oguey-caracs__panel-text,
	#oguey-single-product .oguey-caracs__panel-media {
		flex-basis: auto !important;
		max-width: 100% !important;
		width: 100% !important;
	}
	#oguey-single-product .oguey-caracs__panel-media {
		order: -1 !important;
	}
}

/* ====================================================================
   7. Documentation technique — volet gauche #082351, volet droit #F7F2E9
   --------------------------------------------------------------------
   Scopee sous l'ID + !important : Elementor ecrase sinon.
   Catalogue : dimensions et rotation exactes demandees par le client.
   ==================================================================== */

#oguey-single-product .oguey-documentation__split {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	align-items: stretch !important;
}

/* Volet gauche — fond bleu profond, porte le catalogue.
   overflow visible + z-index : le catalogue déborde par-dessus le volet
   crème, comme dans la maquette. */
#oguey-single-product .oguey-documentation__visual {
	position: relative !important;
	background-color: var(--oguey-color-brand-deep) !important; /* #082351 */
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: var(--oguey-space-16) !important;
	min-height: 620px !important;  /* assez haut pour la hauteur du catalogue */
	overflow: visible !important;
	z-index: 2 !important;
}

/* Catalogue — dimensions fixes + position + rotation exactes (demande client).
   W 434.71 / H 588.73 ; top 50% / left 101% ; rotation -11.42 deg.
   Déborde sur le volet crème (z-index au-dessus). */
#oguey-single-product .oguey-documentation__catalogue {
	position: absolute !important;
	display: block !important;
	width: 434.71px !important;
	height: 588.73px !important;
	top: 50% !important;
	left: 85% !important;
	transform: translate(-50%, -50%) rotate(-11.42deg) !important;
	object-fit: cover !important;
	border-radius: 0 !important;
	z-index: 3 !important;
}

#oguey-single-product .oguey-documentation__content {
	background-color: var(--oguey-color-cream) !important; /* #F7F2E9 */
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-6) !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
	padding: var(--oguey-space-16) !important;
}

/* Titre — #143F84 (demande client) */
#oguey-single-product .oguey-documentation__title {
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 2rem !important;       /* 32px */
	line-height: var(--oguey-lh-tight) !important;
	color: #143F84 !important;
	margin: 0 !important;
}

#oguey-single-product .oguey-documentation__text {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1.125rem !important;   /* 18px */
	line-height: 1.756 !important;
	color: #464646 !important;
	margin: 0 !important;
}

#oguey-single-product .oguey-documentation__actions {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: var(--oguey-space-8) !important;
	align-items: center !important;
	justify-content: center !important;
	margin-top: var(--oguey-space-2) !important;
}

@media (max-width: 1024px) {
	#oguey-single-product .oguey-documentation__visual,
	#oguey-single-product .oguey-documentation__content {
		padding: var(--oguey-space-12) !important;
	}
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-documentation__split {
		grid-template-columns: 1fr !important;
	}
	#oguey-single-product .oguey-documentation__visual {
		min-height: 480px !important;
		padding: var(--oguey-space-10) !important;
		overflow: hidden !important; /* le catalogue ne déborde plus sur mobile */
	}
	/* Catalogue centré dans le volet sur mobile (desktop : décalé à droite) */
	#oguey-single-product .oguey-documentation__catalogue {
		left: 50% !important;
	}
}

/* ====================================================================
   8. NOS RÉALISATIONS — #realisations (Figma 101:1035)
   --------------------------------------------------------------------
   Slider horizontal de produits liés. En-tête : titre + intro à gauche,
   bouton à droite. Rangée de cartes plus larges que leur colonne : elles
   débordent à droite et défilent (scroll-snap). Pas de badge, pas
   d'extrait — image + titre. Scopé sous l'ID + !important.
   ==================================================================== */

#oguey-single-product .oguey-related {
	padding-block: var(--oguey-space-20) !important;
}

#oguey-single-product .oguey-related__inner {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-16) !important;
}

/* --------- En-tête --------- */
#oguey-single-product .oguey-related__head {
	display: flex !important;
	gap: var(--oguey-space-12) !important;
	align-items: flex-start !important;
	justify-content: space-between !important;
}

#oguey-single-product .oguey-related__intro {
	display: flex !important;
	flex-direction: column !important;
	gap: 20px !important;
	max-width: 760px !important;
}

#oguey-single-product .oguey-related__title {
	margin: 0 !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 32px !important;
	line-height: 1.15 !important;
	text-transform: none !important;
	color: var(--oguey-primary-900) !important;
}

#oguey-single-product .oguey-related__text {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 400 !important;
	font-size: 20px !important;
	line-height: 1.55 !important;
	letter-spacing: 0.5px !important;
	color: #464646 !important;
}

#oguey-single-product .oguey-related__cta {
	flex: 0 0 auto !important;
	white-space: nowrap !important;
	color: var(--oguey-primary-900) !important;
}

/* --------- Rangée défilante --------- */
#oguey-single-product .oguey-related__track {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 0 var(--oguey-space-4) !important;
	display: flex !important;
	gap: 46px !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	-webkit-overflow-scrolling: touch !important;
	scrollbar-width: thin !important;
}

/* Chaque carte : largeur fixe PLUS large que 1/3 du conteneur — d'où le
   débordement à droite et le défilement. ~42% de la largeur du conteneur. */
#oguey-single-product .oguey-related__card {
	flex: 0 0 42% !important;
	max-width: 42% !important;
	scroll-snap-align: start !important;
}

#oguey-single-product .oguey-related__card-link {
	display: flex !important;
	flex-direction: column !important;
	gap: 21px !important;
	text-decoration: none !important;
	color: inherit !important;
}

#oguey-single-product .oguey-related__card-media {
	width: 100% !important;
	aspect-ratio: 538 / 611 !important;   /* ratio carte du Figma — taille identique partout */
	overflow: hidden !important;
}

#oguey-single-product .oguey-related__card-img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	border-radius: 0 !important;
	transition: transform 0.4s ease !important;
}

#oguey-single-product .oguey-related__card-link:hover .oguey-related__card-img {
	transform: scale(1.04) !important;
}

#oguey-single-product .oguey-related__card-title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 1.475 !important;
	text-transform: none !important;       /* pas d'uppercase — règle projet */
	color: #464646 !important;
}

/* --------- Tablette --------- */
@media (max-width: 1024px) {
	#oguey-single-product .oguey-related__head {
		flex-direction: column !important;
		gap: var(--oguey-space-6) !important;
	}
	#oguey-single-product .oguey-related__card {
		flex-basis: 60% !important;
		max-width: 60% !important;
	}
}

/* --------- Mobile --------- */
@media (max-width: 767px) {
	#oguey-single-product .oguey-related {
		padding-block: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-related__title {
		font-size: 26px !important;
	}
	#oguey-single-product .oguey-related__text {
		font-size: 16px !important;
	}
	#oguey-single-product .oguey-related__track {
		gap: var(--oguey-space-6) !important;
	}
	#oguey-single-product .oguey-related__card {
		flex-basis: 85% !important;
		max-width: 85% !important;
	}
}

/* ====================================================================
   Carte bleue « D'autres questions ? » — reprise du single réalisation
   (la page produit n'a pas de hero card-blue, on l'amène ici pour la FAQ).
   ==================================================================== */
/* Carte bleue « D'autres questions ? » — #082351, 351px.
   Contenu (texte + bouton) centre verticalement ET horizontalement.
   La feuille SVG est positionnee en absolu et clippee (overflow hidden). */
#oguey-single-product .oguey-hero__card-blue {
	position: relative !important;
	overflow: hidden !important;
	background-color: var(--oguey-color-brand-deep) !important; /* #082351 */
	flex: 0 0 351px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 60px 30px !important;
}

/* Feuille decorative — valeurs exactes demandees par le client */
#oguey-single-product .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;
}

/* Bloc texte + bouton, au-dessus de la feuille */
#oguey-single-product .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-single-product .oguey-hero__card-blue-text {
	display: flex !important;
	flex-direction: column !important;
	gap: 30px !important;
	width: 100% !important;
	text-align: center !important;
}

/* « D'autres questions ? » — Raleway Bold 23px, creme #F7F2E9, PAS de majuscules */
#oguey-single-product .oguey-hero__card-blue-title {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 1.4375rem !important; /* 23px */
	letter-spacing: var(--oguey-ls-wide) !important;
	text-transform: none !important;
	color: var(--oguey-color-cream) !important; /* #F7F2E9 */
}

/* Sous-texte — Raleway Medium 16px, #F4F4F4 */
#oguey-single-product .oguey-hero__card-blue-desc {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1rem !important; /* 16px */
	line-height: 1.475 !important;
	color: var(--oguey-neutral-100) !important;
}

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

/* ---- Hero responsive ---- */
@media (max-width: 1024px) {
	#oguey-single-product .oguey-hero__cards {
		flex-direction: column !important;
		margin-top: -100px !important;
	}
	#oguey-single-product .oguey-hero__banner {
		padding-bottom: 100px !important;
	}
	#oguey-single-product .oguey-hero__card-white {
		max-width: none !important;
		min-height: 0 !important;
		padding: var(--oguey-space-10) var(--oguey-space-8) !important;
	}
	#oguey-single-product .oguey-hero__card-blue {
		flex: 1 1 auto !important;
	}
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-hero__banner {
		min-height: 360px !important;
		/* plus d'air en haut et en bas de la photo sur mobile */
		padding-top: var(--oguey-space-12) !important;
		padding-bottom: var(--oguey-space-16) !important;
	}
	/* Titre du hero plus petit sur mobile — il débordait trop */
	#oguey-single-product .oguey-hero__photo-title {
		font-size: 1.625rem !important; /* ~26px */
		line-height: 1.25 !important;
	}
	#oguey-single-product .oguey-hero__banner-inner {
		padding-left: calc(var(--oguey-container-padding-mobile) + 16px) !important;
		padding-right: var(--oguey-container-padding-mobile) !important;
	}
	#oguey-single-product .oguey-hero__cards {
		margin-top: -80px !important;
	}
	#oguey-single-product .oguey-hero__card-white {
		padding: var(--oguey-space-8) var(--oguey-space-5) !important;
	}
	#oguey-single-product .oguey-hero__card-blue {
		padding: var(--oguey-space-10) var(--oguey-space-6) !important;
		gap: var(--oguey-space-10) !important;
	}
}

/* ====================================================================
   9. FAQ produit — liste de questions + carte « D'autres questions ? »
   --------------------------------------------------------------------
   Accordeon repris du Figma node 499:4119 : PAS de fond bleu, juste la
   question + un chevron, et une ligne de separation en bas. Meme rendu
   ouvert ou ferme. Scopee sous l'ID + !important (Elementor ecrase sinon).
   La carte aside « D'autres questions ? » reutilise telle quelle la
   structure .oguey-hero__card-blue du hero (motif feuille compris).
   ==================================================================== */

#oguey-single-product .oguey-product__faq {
	padding-block: var(--oguey-space-24) !important;
}

#oguey-single-product .oguey-product__faq-inner {
	display: grid !important;
	grid-template-columns: 1fr 351px !important; /* carte aside = 351px */
	gap: var(--oguey-space-16) !important;
	align-items: start !important;
}

#oguey-single-product .oguey-product__faq-head {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-4) !important;
	margin-bottom: var(--oguey-space-8) !important;
}

/* Titre FAQ — Raleway SemiBold 32px, #143F84, PAS de majuscules (demande client) */
#oguey-single-product .oguey-product__faq-head .oguey-section-title,
#oguey-single-product .oguey-product__faq-head h2 {
	font-family: var(--oguey-font-body) !important;
	font-weight: 600 !important;      /* SemiBold */
	font-size: 2rem !important;       /* 32px */
	line-height: var(--oguey-lh-tight) !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	text-transform: none !important;
	color: #143F84 !important;
	margin: 0 !important;
}

#oguey-single-product .oguey-product__faq-head p {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1.125rem !important;   /* 18px */
	line-height: 1.756 !important;
	color: #464646 !important;
	margin: 0 !important;
}

/* --- Accordeon (Figma 499:4119) --- */
#oguey-single-product .oguey-faq {
	display: flex !important;
	flex-direction: column !important;
}

/* Chaque item : la ligne de separation est en bas (border-bottom). */
#oguey-single-product .oguey-faq__item {
	border-bottom: 1px solid var(--oguey-color-border) !important;
}

#oguey-single-product .oguey-faq__question {
	margin: 0 !important;
}

/* Declencheur : pas de fond, juste question a gauche + chevron a droite.
   Padding vertical SYMÉTRIQUE : la question respire autant au-dessus
   qu'en dessous, la ligne de séparation est ainsi bien centrée. */
#oguey-single-product .oguey-faq__trigger {
	width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: var(--oguey-space-6) !important;
	padding: 22px 0px !important;
	background: none !important;
	border: none !important;
	cursor: pointer !important;
	text-align: left !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;      /* Medium */
	font-size: 1rem !important;       /* 16px — Figma */
	line-height: 1.35 !important;
	color: #464646 !important;
	transition: color var(--oguey-transition-fast) !important;
}

#oguey-single-product .oguey-faq__trigger:hover,
#oguey-single-product .oguey-faq__trigger:focus-visible {
	color: var(--oguey-color-brand) !important;
}

#oguey-single-product .oguey-faq__q-text {
	flex: 1 1 auto !important;
	text-transform: none !important;
}

/* Chevron — chevron-right tourne de 90deg (pointe vers le bas) ferme,
   -90deg (pointe vers le haut) ouvert. */
#oguey-single-product .oguey-faq__chevron {
	flex: 0 0 auto !important;
	width: 24px !important;
	height: 24px !important;
	color: #464646 !important;
	transform: rotate(90deg) !important;
	transition: transform var(--oguey-transition-normal) !important;
}

#oguey-single-product .oguey-faq__trigger[aria-expanded="true"] .oguey-faq__chevron {
	transform: rotate(-90deg) !important;
}

/* Panneau de reponse — léger retrait au-dessus puisque le trigger a
   maintenant un padding symétrique (la réponse ne colle pas à la question). */
#oguey-single-product .oguey-faq__panel {
	padding: 4px 0px 26px !important;
}

#oguey-single-product .oguey-faq__panel[hidden] {
	display: none !important;
}

#oguey-single-product .oguey-faq__answer {
	font-family: var(--oguey-font-body) !important;
	font-weight: 500 !important;
	font-size: 1rem !important;       /* 16px */
	line-height: 1.6 !important;
	color: #464646 !important;
}

#oguey-single-product .oguey-faq__answer p {
	margin: 0 0 var(--oguey-space-3) !important;
}

#oguey-single-product .oguey-faq__answer p:last-child {
	margin-bottom: 0 !important;
}

#oguey-single-product .oguey-faq__answer ul,
#oguey-single-product .oguey-faq__answer ol {
	margin: var(--oguey-space-3) 0 !important;
	padding-left: var(--oguey-space-6) !important;
}

#oguey-single-product .oguey-faq__answer a {
	color: var(--oguey-color-link) !important;
}

#oguey-single-product .oguey-product__faq-aside {
	position: sticky !important;
	top: var(--oguey-space-8) !important;
}

/* La carte « D'autres questions ? » réutilise .oguey-hero__card-blue ;
   dans la grille FAQ elle doit simplement remplir sa colonne (351px). */
#oguey-single-product .oguey-product__faq-aside .oguey-hero__card-blue {
	flex: 1 1 auto !important;
	width: 100% !important;
}

@media (max-width: 1024px) {
	#oguey-single-product .oguey-product__faq-inner {
		grid-template-columns: 1fr !important;
		gap: var(--oguey-space-10) !important;
	}
	#oguey-single-product .oguey-product__faq-aside {
		position: static !important;
	}
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-product__faq {
		padding-block: var(--oguey-space-16) !important;
	}
}

/* --------------------------------------------------------------------
   FAQ produit — espacement entre les DEUX groupes (Conseils + Types).
   Le single réalisation n'a qu'un groupe ; ici on en empile deux.
   -------------------------------------------------------------------- */
#oguey-single-product .oguey-product__faq-main {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-20) !important;
}
#oguey-single-product .oguey-product__faq-group {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-8) !important;
}

/* ====================================================================
   10. AVIS CLIENTS — embed Elfsight + motif fenêtre (Figma 605:3259)
   --------------------------------------------------------------------
   En-tête centré (sur-titre Raleway Light gris + titre Playfair).
   Le widget Elfsight gère son propre rendu — on lui laisse la largeur
   du conteneur. Motif « fenêtre » en filigrane à droite, décoratif.
   Scopé sous l'ID + !important.
   ==================================================================== */

#oguey-single-product .oguey-avis {
	position: relative !important;
	padding-block: var(--oguey-space-20) !important;
	overflow: hidden !important;
}

/* Motif fenêtre — filigrane décoratif, à droite, derrière le contenu. */
#oguey-single-product .oguey-avis__pattern {
	position: absolute !important;
	top: 50% !important;
	right: -80px !important;
	transform: translateY(-50%) rotate(-30deg) !important;
	width: 420px !important;
	height: auto !important;
	opacity: 0.5 !important;
	pointer-events: none !important;
	z-index: 0 !important;
}

#oguey-single-product .oguey-avis__inner {
	position: relative !important;
	z-index: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-16) !important;
}

#oguey-single-product .oguey-avis__head {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 9px !important;
	text-align: center !important;
}

#oguey-single-product .oguey-avis__eyebrow {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 300 !important;          /* Raleway Light */
	font-size: 20px !important;
	line-height: 1.4 !important;
	letter-spacing: 0.5px !important;
	text-transform: none !important;
	color: #949494 !important;
}

#oguey-single-product .oguey-avis__title {
	margin: 0 !important;
	font-family: var(--oguey-font-heading) !important;
	font-weight: 700 !important;
	font-size: 32px !important;
	line-height: 1.15 !important;
	text-transform: none !important;
	color: var(--oguey-primary-900) !important;
}

/* Le widget Elfsight gère son propre layout interne. */
#oguey-single-product .oguey-avis__widget {
	width: 100% !important;
}

/* --------- Mobile --------- */
@media (max-width: 767px) {
	#oguey-single-product .oguey-avis {
		padding-block: var(--oguey-space-12) !important;
	}
	#oguey-single-product .oguey-avis__title {
		font-size: 26px !important;
	}
	#oguey-single-product .oguey-avis__pattern {
		width: 240px !important;
		right: -60px !important;
		opacity: 0.35 !important;
	}
}

/* ====================================================================
 * CORRECTIFS DU 13/08 — rendu des sections importées.
 *
 * Le répétable de sections a été conçu pour une saisie manuelle, avec
 * des images choisies et des textes calibrés. Alimenté par l'import,
 * il reçoit des photos de ratios très variables (3:2 à 16:9) et des
 * textes de longueurs inégales, ce qui produisait des sections de
 * hauteurs incohérentes et des images minuscules.
 * ================================================================== */

/* La hauteur d'une section « edge » est dictée par sa colonne de texte.
 * Un texte court donnait donc une image écrasée. On pose un plancher
 * proportionnel à la largeur de la fenêtre, plafonné pour ne pas
 * dominer la page sur les grands écrans. */
#oguey-single-product .oguey-section--edge .oguey-section__media {
	min-height: min(34vw, 480px) !important;
}

/* Section sans image : plus de colonne média réservée, le texte occupe
 * toute la largeur du conteneur, centré comme les blocs éditoriaux. */
#oguey-single-product .oguey-section--no-media .oguey-section__inner,
#oguey-single-product .oguey-section--no-media .oguey-section__inner--edge {
	display: block !important;
	max-width: var(--oguey-container-width) !important;
	margin: 0 auto !important;
	padding-right: var(--oguey-container-padding) !important;
	padding-left: var(--oguey-container-padding) !important;
}

#oguey-single-product .oguey-section--no-media .oguey-section__text {
	flex: none !important;
	max-width: 78ch !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
}

/* Libellés de sous-partie issus des items du zoning. Ce sont des
 * intertitres de paragraphe, pas des titres de section : ils gardent le
 * niveau h3 pour la hiérarchie SEO mais reprennent la police de texte,
 * sans petites capitales ni police d'affichage. */
#oguey-single-product .oguey-section__subhead {
	margin: var(--oguey-space-6) 0 var(--oguey-space-2) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 1.0625rem !important;
	line-height: var(--oguey-lh-snug) !important;
	letter-spacing: 0 !important;
	color: var(--oguey-neutral-950) !important;
	text-transform: none !important;
	font-variant: normal !important;
}

#oguey-single-product .oguey-section__subhead:first-child {
	margin-top: 0 !important;
}

/* Cartes de produits liées : ratio homogène malgré des photos sources
 * de formats différents. */
#oguey-single-product .oguey-related__card-media {
	aspect-ratio: 4 / 3 !important;
	overflow: hidden !important;
}

#oguey-single-product .oguey-related__card-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-section--edge .oguey-section__media {
		min-height: 62vw !important;
	}
}

/* Boutons de navigation du slider de réalisations : absents du code alors
 * que la maquette les prévoit. Même composant que sur la page gamme. */
#oguey-single-product .oguey-related__nav {
	display: flex !important;
	justify-content: flex-end !important;
	gap: var(--oguey-space-3) !important;
	margin-bottom: var(--oguey-space-4) !important;
}

#oguey-single-product .oguey-related__arrow {
	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-single-product .oguey-related__arrow:hover,
#oguey-single-product .oguey-related__arrow:focus-visible {
	background: var(--oguey-color-brand) !important;
	color: #ffffff !important;
}

#oguey-single-product .oguey-related__arrow[disabled] {
	opacity: 0.35 !important;
	cursor: default !important;
}

/* La barre de défilement native n'a plus lieu d'être une fois les
 * boutons présents. */
#oguey-single-product .oguey-related__track {
	scrollbar-width: none !important;
}

#oguey-single-product .oguey-related__track::-webkit-scrollbar {
	display: none !important;
}

/* ====================================================================
 * COMPOSANTS DE SECTION
 *
 * La maquette ne décrit qu'une page produit, celle de la pergola, alors
 * que les zonings en couvrent vingt-sept, jusqu'à dix-huit blocs dont
 * plusieurs sans photo. Chaque forme de bloc est rattachée ici à un
 * composant dérivé de la maquette, plutôt qu'interprétée au cas par cas.
 * Rien n'est inventé là où la maquette existe : « media » reprend la
 * section alternée telle quelle.
 * ================================================================== */

#oguey-single-product .oguey-psection {
	padding: var(--oguey-space-24) 0 !important;
}

#oguey-single-product .oguey-psection__inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: var(--oguey-space-12) !important;
	align-items: center !important;
}

#oguey-single-product .oguey-psection__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-single-product .oguey-psection__title {
	margin: 0 0 var(--oguey-space-5) !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-single-product .oguey-psection__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-single-product .oguey-psection__body p {
	margin: 0 0 var(--oguey-space-4) !important;
}

#oguey-single-product .oguey-psection__body p:last-child {
	margin-bottom: 0 !important;
}

#oguey-single-product .oguey-psection__actions {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: var(--oguey-space-4) !important;
	margin-top: var(--oguey-space-8) !important;
}

/* --- media : image et texte en vis-à-vis, alternés ------------------ */
#oguey-single-product .oguey-psection--media .oguey-psection__inner {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
	gap: var(--oguey-space-16) !important;
}

#oguey-single-product .oguey-psection--img-left .oguey-psection__text {
	order: 2 !important;
}

#oguey-single-product .oguey-psection--img-left .oguey-psection__media {
	order: 1 !important;
}

#oguey-single-product .oguey-psection__media {
	aspect-ratio: 4 / 3 !important;
	overflow: hidden !important;
}

#oguey-single-product .oguey-psection__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

/* --- atouts : texte, image large, puis colonnes titre + description -- */
#oguey-single-product .oguey-psection--atouts .oguey-psection__media--wide {
	aspect-ratio: 21 / 9 !important;
}

#oguey-single-product .oguey-psection__grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
	gap: var(--oguey-space-10) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

#oguey-single-product .oguey-psection__grid[data-count="2"] {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

#oguey-single-product .oguey-psection__atout {
	padding-top: var(--oguey-space-5) !important;
	border-top: 2px solid var(--oguey-color-brand) !important;
}

#oguey-single-product .oguey-psection__atout-title {
	margin: 0 0 var(--oguey-space-2) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: var(--oguey-fs-card-title) !important;
	line-height: var(--oguey-lh-snug) !important;
	color: var(--oguey-neutral-950) !important;
	text-transform: none !important;
}

#oguey-single-product .oguey-psection__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;
}

/* --- tags : liste de mots-clés en étiquettes ------------------------ */
#oguey-single-product .oguey-psection__tags {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: var(--oguey-space-3) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

#oguey-single-product .oguey-psection__tag {
	padding: var(--oguey-space-2) var(--oguey-space-5) !important;
	border: 1px solid var(--oguey-color-border) !important;
	border-radius: var(--oguey-radius-none) !important;
	font-family: var(--oguey-font-body) !important;
	font-size: var(--oguey-fs-card-p) !important;
	color: var(--oguey-color-text) !important;
	text-transform: none !important;
}

/* --- bandeau : texte pleine largeur, fonds alternés ----------------- */
#oguey-single-product .oguey-psection--cream {
	background: var(--oguey-color-cream) !important;
}

#oguey-single-product .oguey-psection--band .oguey-psection__text,
#oguey-single-product .oguey-psection--tags .oguey-psection__text {
	max-width: 78ch !important;
}

/* --- badge de prix sur l'image de présentation ---------------------- */
#oguey-single-product .oguey-section__media {
	position: relative !important;
}

#oguey-single-product .oguey-section__price {
	position: absolute !important;
	left: 0 !important;
	bottom: var(--oguey-space-10) !important;
	z-index: 2 !important;
	margin: 0 !important;
	padding: var(--oguey-space-3) var(--oguey-space-8) !important;
	background: var(--oguey-color-cream) !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-transform: none !important;
}

@media (max-width: 900px) {
	#oguey-single-product .oguey-psection--media .oguey-psection__inner {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: var(--oguey-space-8) !important;
	}
	#oguey-single-product .oguey-psection--img-left .oguey-psection__text,
	#oguey-single-product .oguey-psection--img-left .oguey-psection__media {
		order: initial !important;
	}
	#oguey-single-product .oguey-psection {
		padding: var(--oguey-space-16) 0 !important;
	}
	#oguey-single-product .oguey-psection__grid {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: var(--oguey-space-8) !important;
	}
}

/* Elementor injecte un arrondi global sur les images via son kit de styles.
 * Le design system Oguey est entièrement à angles vifs : on neutralise. */
#oguey-single-product .oguey-psection__media,
#oguey-single-product .oguey-psection__img,
#oguey-single-product .oguey-section__media,
#oguey-single-product .oguey-section__img,
#oguey-single-product .oguey-related__card-media,
#oguey-single-product .oguey-related__card-img,
#oguey-single-product .oguey-hero__media,
#oguey-single-product .oguey-hero__img,
#oguey-single-product img {
	border-radius: var(--oguey-radius-none) !important;
}

/* ====================================================================
 * PILE DÉFILANTE DE BANDEAUX
 *
 * Trois bandeaux consécutifs ou plus sont réunis en un composant à
 * panneaux : la page de volet-roulant passe de dix pavés empilés à un
 * seul bloc parcouru à la flèche. Le débordement horizontal garde tous
 * les panneaux dans le document, donc lisibles par les moteurs.
 * ================================================================== */
#oguey-single-product .oguey-pile {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--oguey-space-8) !important;
}

#oguey-single-product .oguey-pile__head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: var(--oguey-space-6) !important;
}

#oguey-single-product .oguey-pile__count {
	margin: 0 !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 600 !important;
	font-size: var(--oguey-fs-card-p) !important;
	letter-spacing: var(--oguey-ls-wide) !important;
	color: var(--oguey-color-text-muted) !important;
}

#oguey-single-product .oguey-pile__nav {
	display: flex !important;
	gap: var(--oguey-space-3) !important;
}

#oguey-single-product .oguey-pile__arrow {
	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-single-product .oguey-pile__arrow:hover,
#oguey-single-product .oguey-pile__arrow:focus-visible {
	background: var(--oguey-color-brand) !important;
	color: #ffffff !important;
}

#oguey-single-product .oguey-pile__arrow[disabled] {
	opacity: 0.3 !important;
	cursor: default !important;
}

#oguey-single-product .oguey-pile__track {
	display: flex !important;
	gap: 0 !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	scrollbar-width: none !important;
}

#oguey-single-product .oguey-pile__track::-webkit-scrollbar {
	display: none !important;
}

#oguey-single-product .oguey-pile__panel {
	flex: 0 0 100% !important;
	max-width: 100% !important;
	scroll-snap-align: start !important;
	padding-right: var(--oguey-space-10) !important;
}

#oguey-single-product .oguey-pile__panel .oguey-psection__body {
	max-width: 74ch !important;
}

/* ====================================================================
 * FINITIONS
 * ================================================================== */

/* Apparition au défilement : fondu et légère montée. */
#oguey-single-product .oguey-reveal {
	opacity: 0 !important;
	transform: translateY(12px) !important;
	transition: opacity 600ms ease, transform 600ms ease !important;
}

#oguey-single-product .oguey-reveal.is-visible {
	opacity: 1 !important;
	transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
	#oguey-single-product .oguey-reveal {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* Zoom discret des photos au survol, comme sur les cartes de gamme. */
#oguey-single-product .oguey-psection__media,
#oguey-single-product .oguey-section__media {
	overflow: hidden !important;
}

#oguey-single-product .oguey-psection__img,
#oguey-single-product .oguey-section__img {
	transition: transform var(--oguey-transition-slow) !important;
}

#oguey-single-product .oguey-psection:hover .oguey-psection__img,
#oguey-single-product .oguey-section--edge:hover .oguey-section__img {
	transform: scale(1.03) !important;
}

@media (prefers-reduced-motion: reduce) {
	#oguey-single-product .oguey-psection__img,
	#oguey-single-product .oguey-section__img {
		transition: none !important;
	}
	#oguey-single-product .oguey-psection:hover .oguey-psection__img,
	#oguey-single-product .oguey-section--edge:hover .oguey-section__img {
		transform: none !important;
	}
}

/* Filet bleu sous les titres de section : composant du design system
 * (.oguey-section-eyebrow) présent mais jamais utilisé jusqu'ici. */
#oguey-single-product .oguey-psection__title.oguey-section-eyebrow::before {
	content: "" !important;
	display: block !important;
	width: 112px !important;
	height: 5px !important;
	margin-bottom: var(--oguey-space-4) !important;
	background-color: var(--oguey-color-brand) !important;
	border-radius: var(--oguey-radius-none) !important;
}

/* Barre d'ancres collante au défilement. */
#oguey-single-product .oguey-product-tabs.is-stuck {
	position: sticky !important;
	top: 0 !important;
	z-index: 20 !important;
	background: var(--oguey-color-bg) !important;
	box-shadow: 0 1px 0 var(--oguey-color-border) !important;
}

@media (max-width: 767px) {
	#oguey-single-product .oguey-pile__panel {
		padding-right: var(--oguey-space-4) !important;
	}
	#oguey-single-product .oguey-pile__head {
		flex-direction: row !important;
	}
}

/* Le badge de prix chevauche l'image : sur petits écrans il doit rester
 * lisible et ne pas déborder du conteneur. */
@media (max-width: 767px) {
	#oguey-single-product .oguey-section__price {
		bottom: var(--oguey-space-4) !important;
		padding: var(--oguey-space-2) var(--oguey-space-5) !important;
		font-size: var(--oguey-fs-card-p) !important;
	}
	#oguey-single-product .oguey-pile__count {
		font-size: 0.8125rem !important;
	}
	#oguey-single-product .oguey-pile__arrow,
	#oguey-single-product .oguey-related__arrow {
		width: 40px !important;
		height: 40px !important;
	}
	/* Le filet des titres est proportionnellement trop large en mobile. */
	#oguey-single-product .oguey-psection__title.oguey-section-eyebrow::before {
		width: 72px !important;
		height: 4px !important;
	}
}

/* Intertitre d'item dans une section media ou bandeau. */
#oguey-single-product .oguey-psection__subhead {
	margin: var(--oguey-space-6) 0 var(--oguey-space-2) !important;
	font-family: var(--oguey-font-body) !important;
	font-weight: 700 !important;
	font-size: 1.0625rem !important;
	line-height: var(--oguey-lh-snug) !important;
	letter-spacing: 0 !important;
	color: var(--oguey-neutral-950) !important;
	text-transform: none !important;
	font-variant: normal !important;
}
