/*
 * bayou : styles du thème enfant Woodmart (structure de la démo « EDC », choisie le 14/10/2026 pour
 * le lancement 100 % incendie). Woodmart fournit la mise en page et la typographie (Funnel Display,
 * Noto Sans) ; cette feuille ajoute la palette EDC et la mise en forme des fonctions bayou
 * (assistant, devis, prix pro, commande par message). Conçue d'abord pour le téléphone. Propriétés
 * logiques (inline/block) : la feuille servira telle quelle à l'arabe (RTL) quand il sera ajouté.
 *
 * Palette EDC : dégradé orange flamme → rouge pour les grands bandeaux, émeraude pour l'assistant
 * devis, boutons noirs arrondis, fond gris clair. Le rouge attire l'œil sans tout recouvrir : pas de
 * petit texte blanc sur l'orange.
 */

:root {
	/* Couleurs officielles (palette EDC ; vert émeraude « B » retenu par défaut le 14/10/2026). */
	--color-brand-ink: #101010;
	--color-brand-ivory: #f4f4f2; /* Fonds clairs des encadrés (nom gardé de la palette B). */
	--bayou-flame: #f95228;
	--bayou-red: #d62432;
	--bayou-emerald: #0fa968;
	--bayou-emerald-dark: #0b7a4f;
	--bayou-gradient-fire: linear-gradient(110deg, var(--bayou-flame) 0%, var(--bayou-red) 100%);
	--bayou-gradient-emerald: linear-gradient(120deg, var(--bayou-emerald) 0%, var(--bayou-emerald-dark) 100%);

	/* Rayon ouvert (incendie) ; d'autres rayons auront leur couleur ici. */
	--bayou-incendie: var(--bayou-red);

	/* Couleurs fonctionnelles (validées le 02/10/2026). */
	--color-white: #ffffff;
	--color-text-secondary: #4a4a4a;
	--color-border: #d9d4cc;
	--color-success: #2f6b4f;
	--color-error: #b54747;

	--font-size-h2: clamp(24px, 3.5vw, 36px);
	--font-size-h3: clamp(20px, 2.5vw, 26px);
	--font-size-caption: 14px;

	/* Espacements (unité 8 px), rayons, bordure. */
	--space-1: 8px;
	--space-2: 16px;
	--space-3: 24px;
	--space-4: 32px;
	--space-5: 48px;
	--radius-control: 10px;
	--radius-card: 12px;
	--radius-surface: 16px;
	--border-thin: 1px solid var(--color-border);

	/* Mouvement : sortie rapide et douce (« ease-out » marqué), jamais plus de 300 ms. */
	--ease-out: cubic-bezier(0.23, 1, 0.32, 1);
	--transition-standard: 160ms var(--ease-out);

	/* Zone tactile minimale (mobile) : champs Woodmart à 48 px au lieu de 42. */
	--tap: 48px;
	--wd-form-height: 48px;
}

/* Références et normes toujours en caractères latins, de gauche à droite. */
.bayou-ref {
	direction: ltr;
	unicode-bidi: isolate;
	font-variant-numeric: tabular-nums;
}

.bayou-caption {
	font-size: var(--font-size-caption);
	color: var(--color-text-secondary);
}

/* 16 px minimum dans les champs : évite le zoom automatique d'iOS. */
@media (max-width: 1024px) {
	input:not([type="checkbox"]):not([type="radio"]),
	select,
	textarea {
		font-size: 16px;
	}
}

/* ---------- Icônes des rayons ---------- */

/* Liste « Sous-rayons » du catalogue : icône devant chaque nom (inc/icones.php). */
.widget_product_categories .product-categories a:has(.bayou-cat-icon) {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.bayou-cat-icon {
	flex: none;
	width: 36px;
	height: 36px;
}

/* Menus (en-tête, menu déroulant, téléphone) : photos détourées des sous-rayons, assez grandes
 * pour reconnaître le produit. */
.wd-nav-img[src*="/icones/"][src*=".webp"] {
	--nav-img-width: 46px !important; /* Woodmart fixe 30 px par menu. */
	--nav-img-height: 46px !important;
}

/* Liens WhatsApp (menus, boutons) : logo WhatsApp Business devant le texte. */
a[href^="https://wa.me/"]::before {
	content: "";
	display: inline-block;
	flex: none;
	width: 1.5em;
	height: 1.5em;
	margin-inline-end: 0.45em;
	vertical-align: -0.4em;
	background: url(../images/whatsapp-business.svg) center / contain no-repeat;
}

/* ---------- Grands bandeaux ---------- */

/* Dégradé orange flamme → rouge : bandeau de l'accueil, haut du catalogue, titre des pages,
 * menu « Rayons ». */
.bayou-hero,
.bayou-hero .wd-block-cover-img,
.wd-page-title {
	background-image: var(--bayou-gradient-fire);
}

/* Bloc de l'assistant devis : émeraude, textes en blanc franc (le blanc grisé du thème manque de
 * contraste sur le vert). */
.wp-block-wd-row.bayou-emeraude {
	background-image: var(--bayou-gradient-emerald);
}

/* Bloc émeraude et bandeaux « Commander chez bayou » : texte blanc sur couleur unie. */
:is(.bayou-emeraude, .bayou-offer, .bayou-message) {
	--wd-title-color: #fff;
	--wd-text-color: #fff;
	color: #fff;
}

/* Cartes des rayons : carte blanche, nom en haut, photo en dessous (sans la chevaucher). */
/* Grille des cartes (inc/rayons.php) : six par ligne, trois sur tablette et téléphone ; une ligne
   incomplète (5 rayons sur 6 places) est centrée. */
.bayou-rayons .elements-grid {
	--bayou-col: var(--wd-col-lg);
	--bayou-gap: var(--wd-gap-lg);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--bayou-gap);
}

.bayou-rayons .elements-grid > .wd-col {
	flex: 0 0 calc((100% - (var(--bayou-col) - 1) * var(--bayou-gap)) / var(--bayou-col));
	max-width: none;
	margin: 0;
	padding: 0;
}

@media (max-width: 1024px) {
	.bayou-rayons .elements-grid {
		--bayou-col: var(--wd-col-md);
	}
}

@media (max-width: 768px) {
	.bayou-rayons .elements-grid {
		--bayou-col: var(--wd-col-sm);
		--bayou-gap: var(--wd-gap-sm);
	}
}

.bayou-rayons .wd-cat-inner {
	overflow: hidden;
	border-radius: var(--radius-surface);
	background: #fff;
}

.bayou-rayons .cat-design-mask-subcat .wd-cat-content {
	display: flex;
	align-items: center;
	width: 100%;
}

.bayou-rayons .wd-cat-header .wd-entities-title {
	text-align: center;
}

.bayou-rayons .wd-cat-image {
	padding: 92px 16% 8px;
	background: #fff;
}

/* Photo détourée (inc/rayons.php) ; sinon photo du produit, fond fondu dans le blanc de la carte. */
.bayou-rayons .wd-cat-image img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: contain;
	mix-blend-mode: darken;
}

.bayou-rayons .wd-cat-image .bayou-cat-cutout {
	mix-blend-mode: normal;
	transition: transform 0.3s;
}

.bayou-rayons .wd-cat:hover .bayou-cat-cutout {
	transform: translateY(-4px) scale(1.04);
}

@media (max-width: 768px) {
	/* Plus forts que les réglages du bloc (.wd.wd .wd-<id>) et de Woodmart. */
	.wd.wd .wd-cats-element.bayou-rayons {
		padding-inline: 12px;
	}

	.bayou-rayons .cat-design-mask-subcat .wd-cat-content {
		padding: 12px 6px;
	}

	.bayou-rayons .wd-cat-header .wd-entities-title {
		font-size: 13px;
		line-height: 1.25;
	}

	.bayou-rayons .wd-cat-image {
		padding: 46px 10% 4px;
	}
}

/* Texte de l'accueil : questions fréquentes sur toute la largeur. */
.bayou-seo > * {
	align-self: stretch;
}

/* Bouton de ce texte : même bouton noir arrondi que le bandeau, sans majuscules. */
.bayou-seo .wp-block-button__link {
	padding: 12px 24px;
	border: 0;
	border-radius: 999px;
	background: var(--color-brand-ink);
	color: #fff;
	font-size: 14px;
	text-transform: none;
}

/* Logo blanc du pied de page à sa taille. */
img[src*="bayou-logo-blanc"] {
	width: 120px;
	height: auto;
}

/* ---------- Cartes produit et prix ---------- */

/* Cartes en grille (accueil, catalogue) : photo, nom et prix centrés. */
.wd-product-thumb .wp-block-wd-container.wd-dir-col {
	align-items: center;
	text-align: center;
}

.wd-product-thumb .wp-block-wd-container.wd-dir-row {
	justify-content: center;
}

/* Nom du produit sur trois lignes : la démo n'en montre qu'une (« Centrale adressable » sans
 * « Compact Lyon 1 boucle »), or c'est la fin du nom qui distingue les modèles. */
.wd.wd .wd-line-clamp.wd-entities-title {
	--wd-line-count: 3;
}

/* Photos de formats très différents (switch très large, armoire très haute) : même cadre carré
 * pour toutes, photo entière au centre. Le fond blanc ou gris clair des photos se fond dans le
 * gris du cadre (« darken » garde la teinte la plus sombre des deux). */
.wd-product-thumb .wd-product-img-link {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	padding: 10%;
	background: #f4f4f4;
}

.wd-product-thumb .wd-product-img-link img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: darken;
}

/* Vignette EDC (nom en haut et prix en bas, posés sur la photo) : cadre plus haut que large, la
 * photo est placée entre le nom (jusqu'à trois lignes) et le prix, sans les chevaucher. */
.wd-loop-prod-thumb:has(.wp-block-wd-container) .wd-product-img-link {
	aspect-ratio: 3 / 4;
	padding: 46% 14% 26%;
}

@media (max-width: 768px) {
	.wd-loop-prod-thumb:has(.wp-block-wd-container) .wd-product-img-link {
		padding: 56% 12% 30%;
	}
}

/* Les prix restent encre, même sur les pages d'un rayon (en rouge, ils feraient promotion). */
.price {
	--wd-primary-color: var(--color-brand-ink);
}

/* Un prix ne se coupe jamais en deux lignes (« 171 / 000 DA »). */
.price,
.amount {
	white-space: nowrap;
}

.wd-product .price {
	font-size: clamp(16px, 1.4vw, 18px);
}

/* Prix pro : prix pro en premier, prix grand public barré et explicitement libellé. */
.bayou-price-pro__label {
	display: inline-block;
	padding: 0 var(--space-1);
	border-radius: var(--radius-control);
	background: var(--color-brand-ink);
	color: var(--color-brand-ivory);
	font-size: var(--font-size-caption);
	font-weight: 600;
	vertical-align: middle;
}

.bayou-price-pro ins {
	text-decoration: none;
	font-weight: 600;
}

.bayou-price-pro del {
	color: var(--color-text-secondary);
	font-size: 0.75em;
	font-weight: 400;
}

/* ---------- Boutons ---------- */

/* Boutons « .button » (WooCommerce, bayou) : encre, avec les couleurs des boutons par défaut
 * réglées dans Woodmart (sans cela, Woodmart les affiche en gris clair). */
.button {
	--btn-bgcolor: var(--btn-default-bgcolor);
	--btn-bgcolor-hover: var(--btn-default-bgcolor-hover);
	--btn-color: var(--btn-default-color);
	--btn-color-hover: var(--btn-default-color-hover);
	--btn-brd-radius: var(--btn-default-brd-radius);
}

/* Bouton secondaire : bordé, il ne concurrence pas l'action principale. */
.button.bayou-button-secondary,
.button.bayou-order-by-message__button {
	--btn-bgcolor: transparent;
	--btn-bgcolor-hover: var(--color-brand-ivory);
	--btn-color: var(--color-brand-ink);
	--btn-color-hover: var(--color-brand-ink);
	--btn-brd-width: 1px;
	--btn-brd-color: var(--color-brand-ink);
	--btn-brd-color-hover: var(--color-brand-ink);
}

/* Fonctions bayou : cibles tactiles de 48 px, texte lisible. */
:is(.bayou-fire, .bayou-fire-live, .bayou-quote-form, .bayou-project-form, .bayou-order-by-message, .bayou-pro-invite, .bayou-account-after-order) .button {
	--btn-height: var(--tap);
	--btn-font-size: 15px;
}

/* Retour au toucher : le bouton s'enfonce légèrement. */
.button,
.btn,
.wd-nav-link,
.bayou-choice {
	transition-property: color, background-color, border-color, box-shadow, transform;
}

.button:active,
.btn:active,
.bayou-choice:active {
	transform: scale(0.97);
	transition-duration: 160ms;
	transition-timing-function: var(--ease-out);
}

.button:disabled,
.button.disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

/* ---------- Encadrés et messages ---------- */

.bayou-pro-invite,
.bayou-account-after-order {
	margin-block: var(--space-2);
	padding: var(--space-2);
	border: var(--border-thin);
	border-radius: var(--radius-surface);
	background: var(--color-brand-ivory);
}

.bayou-cod-notice {
	font-size: var(--font-size-caption);
	color: var(--color-text-secondary);
}

/* ---------- Page de commande ---------- */

/* Le pays est toujours l'Algérie : inutile de l'afficher.
 * !important : le JavaScript de WooCommerce réaffiche le champ par un style en ligne. */
.woocommerce-checkout #billing_country_field {
	display: none !important;
}

/* ---------- Commander par message ---------- */

.bayou-order-by-message {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-1);
	margin-block: var(--space-2);
}

.bayou-order-by-message__title,
.bayou-order-by-message__copied {
	flex-basis: 100%;
	margin: 0;
	font-size: var(--font-size-caption);
	color: var(--color-text-secondary);
}

.bayou-order-by-message__button {
	flex: 1 1 auto;
	text-align: center;
}

.bayou-order-by-message__button--whatsapp {
	flex-basis: 100%;
}

/* ---------- Devis (panier) ---------- */

.bayou-quote-form {
	margin-block-start: var(--space-1);
}

.bayou-quote-form .button {
	width: 100%;
}

.bayou-project-form {
	margin-block-start: var(--space-2);
	padding-block-start: var(--space-2);
	border-block-start: var(--border-thin);
}

/* Fiche technique PDF du fabricant (fiche produit). */
.bayou-datasheet {
	display: block;
	margin-block-start: var(--space-1);
	font-weight: 600;
}

/* Lien bien visible : encre, souligné, pastille « PDF » devant. */
.bayou-datasheet a {
	display: inline-flex;
	align-items: center;
	gap: var(--space-1);
	min-height: 40px;
	color: var(--color-brand-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.bayou-datasheet a::before {
	content: "PDF";
	padding: 2px 6px;
	border-radius: 4px;
	background: var(--bayou-incendie);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
}

/* ---------- Accueil : texte et questions fréquentes ---------- */

.bayou-lead {
	max-width: 720px;
	font-size: 18px;
}

.bayou-faq {
	margin-block: var(--space-1);
	padding: var(--space-2);
	border: var(--border-thin);
	border-radius: var(--radius-control);
	background: var(--color-white);
}

.bayou-faq summary {
	font-weight: 600;
	cursor: pointer;
}

.bayou-faq p {
	margin-block: var(--space-1) 0;
}

/* ---------- Assistant devis incendie ---------- */

.bayou-fire {
	max-width: 760px;
}

/* L'attribut hidden l'emporte toujours sur les styles des boutons et formulaires. */
.bayou-fire [hidden] {
	display: none !important;
}

.bayou-fire-step {
	margin: 0 0 var(--space-3);
	padding: var(--space-3) var(--space-2);
	border: var(--border-thin);
	border-radius: var(--radius-surface);
	background: var(--color-white);
}

.bayou-fire-step legend,
.bayou-fire-step-title {
	float: left; /* Le titre reste dans la carte. */
	width: 100%;
	margin: 0 0 var(--space-2);
	padding: 0;
	background: none;
	font-size: var(--font-size-h3);
	font-weight: 700;
	line-height: 1.3;
}

.bayou-fire-step legend + * {
	clear: both;
}

.bayou-fire-progress {
	margin-block-end: var(--space-1);
	color: var(--color-text-secondary);
	font-size: var(--font-size-caption);
}

/* Grandes cibles tactiles : toute la carte est cliquable. */
.bayou-choice,
.bayou-check {
	display: flex;
	gap: var(--space-2);
	align-items: flex-start;
	min-height: var(--tap);
	margin-block-end: var(--space-1);
	padding: 12px var(--space-2);
	border: var(--border-thin);
	border-radius: var(--radius-control);
	font-weight: 400;
	cursor: pointer;
}

.bayou-choice:has(input:checked) {
	border-color: var(--color-brand-ink);
	box-shadow: inset 0 0 0 1px var(--color-brand-ink);
}

.bayou-choice input,
.bayou-check input {
	flex: none;
	width: 20px;
	height: 20px;
	margin-block-start: 2px;
}

.bayou-check {
	border: 0;
	padding-inline: 0;
}

.bayou-field {
	display: grid;
	gap: 4px;
	margin-block-end: var(--space-2);
}

/* Trois champs côte à côte dès que l'écran le permet. */
.bayou-fire-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0 var(--space-2);
	margin-block-end: var(--space-2);
	padding-block-end: var(--space-1);
	border-block-end: var(--border-thin);
}

.bayou-fire-row-title,
.bayou-fire-row [data-remove] {
	grid-column: 1 / -1;
	margin: 0 0 var(--space-1);
}

.bayou-fire-row-title {
	font-weight: 700;
}

/* Lien d'action : pas un bouton plein. */
button.bayou-link-button,
button.bayou-link-button:hover {
	min-height: var(--tap);
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-brand-ink);
	font-weight: 500;
	text-align: start;
	text-decoration: underline;
}

.bayou-fire-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--space-2);
}

.bayou-fire-nav .button {
	margin-inline-start: auto;
}

.bayou-fire-step .button {
	width: 100%;
	margin-block-start: var(--space-1);
}

/* ----- Étape 5 : le devis ----- */

.bayou-fire-result {
	margin-block-end: var(--space-3);
}

.bayou-fire-result:focus {
	outline: none;
}

.bayou-fire-summary {
	padding: var(--space-3) var(--space-2);
	border-radius: var(--radius-surface);
	background: var(--color-brand-ink);
	color: var(--color-brand-ivory);
}

.bayou-fire-summary .bayou-fire-system {
	margin: 0 0 var(--space-1);
	color: var(--color-brand-ivory);
	font-size: var(--font-size-h2);
	line-height: 1.15;
}

.bayou-fire-summary .bayou-badge {
	border-color: var(--color-brand-ivory);
	color: var(--color-brand-ivory);
}

.bayou-fire-summary .bayou-caption {
	margin: var(--space-1) 0 0;
	color: var(--color-border);
}

.bayou-fire-figures {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-1);
	margin: var(--space-2) 0;
	padding: 0;
	list-style: none;
}

.bayou-fire-figures li {
	padding: 6px 12px;
	border: 1px solid rgba(247, 243, 236, 0.35);
	border-radius: var(--radius-control);
	font-size: var(--font-size-caption);
}

.bayou-fire-figures strong {
	font-size: 18px;
}

.bayou-fire-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--space-2);
	margin: 0;
	padding-block-start: var(--space-2);
	border-block-start: 1px solid rgba(247, 243, 236, 0.35);
}

.bayou-fire-total strong {
	font-size: var(--font-size-h2);
	white-space: nowrap;
}

.bayou-badge {
	display: inline-block;
	padding: 2px var(--space-1);
	border: 1px solid var(--color-success);
	border-radius: var(--radius-control);
	color: var(--color-success);
	font-size: var(--font-size-caption);
	font-weight: 600;
	vertical-align: middle;
}

.bayou-notice {
	margin-block: var(--space-2);
	padding: 12px var(--space-2);
	border-inline-start: 4px solid var(--color-brand-ink);
	background: var(--color-white);
}

.bayou-notice-error {
	border-inline-start-color: var(--color-error);
}

/* Liste du matériel : une carte par article, quantité en premier. */
.bayou-fire-items {
	margin: 0 0 var(--space-3);
	padding: 0;
	border: var(--border-thin);
	border-radius: var(--radius-card);
	background: var(--color-white);
	list-style: none;
}

.bayou-fire-item {
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: 4px var(--space-2);
	padding: var(--space-2);
	border-block-end: var(--border-thin);
}

.bayou-fire-item:last-child {
	border-block-end: 0;
}

.bayou-fire-item-qty {
	grid-row: span 2;
	font-size: 20px;
	font-weight: 700;
	white-space: nowrap;
}

.bayou-fire-item-name a {
	color: var(--color-brand-ink);
	font-weight: 600;
}

.bayou-fire-item-name .bayou-ref {
	display: block;
	color: var(--color-text-secondary);
	font-size: var(--font-size-caption);
}

.bayou-fire-item-price {
	font-weight: 700;
}

.bayou-fire-item.is-on-request .bayou-fire-item-price {
	color: var(--color-text-secondary);
	font-weight: 500;
}

.bayou-fire-actions {
	display: grid;
	gap: var(--space-1);
	margin-block-end: var(--space-2);
}

.bayou-fire-actions form {
	display: grid;
	gap: var(--space-1);
}

.bayou-fire-actions .button {
	width: 100%;
}

.bayou-fire-notes {
	margin-block-start: var(--space-2);
	padding-inline-start: var(--space-2);
	color: var(--color-text-secondary);
	font-size: var(--font-size-caption);
}

.bayou-fire-edit summary {
	min-height: var(--tap);
	padding-block: 12px;
	font-weight: 600;
	cursor: pointer;
}

@media (min-width: 600px) {
	.bayou-fire-summary {
		padding: var(--space-4);
	}

	.bayou-fire-item {
		grid-template-columns: 80px 1fr auto;
		align-items: baseline;
	}

	.bayou-fire-item-qty {
		grid-row: auto;
	}

	.bayou-fire-item-price {
		text-align: end;
		white-space: nowrap;
	}

	.bayou-fire-step .button {
		width: auto;
	}
}


/* ---------- Pied de page ---------- */

/* Liens vers les réseaux sociaux ([bayou_reseaux]) : cibles tactiles confortables. */
.bayou-social a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
}

/* Fiche produit : contenu rédigé (contenu.json, importé par wp bayou photos). */
.bayou-points-cles {
	margin: 0 0 1em;
	padding-left: 1.2em;
}

.bayou-points-cles li {
	margin-bottom: 0.25em;
}

.bayou-specs {
	width: 100%;
	border-collapse: collapse;
	border: var(--border-thin);
	margin: 0 0 1.5em;
}

.bayou-specs th,
.bayou-specs td {
	padding: 8px 12px;
	border-bottom: var(--border-thin);
	text-align: left;
	vertical-align: top;
}

.bayou-specs th {
	width: 38%;
	font-weight: 600;
	background: var(--color-brand-ivory);
}

.bayou-source {
	color: var(--color-text-secondary);
}

@media (max-width: 600px) {
	.bayou-specs th {
		width: 45%;
	}
}

/* ---------- Mouvement ---------- */

/* Étape 5 de l'assistant : le devis apparaît en fondu, sans saut. */
.bayou-fire-live:not([hidden]) {
	animation: bayou-fade-in 200ms var(--ease-out);
}

@keyframes bayou-fade-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	::before,
	::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Guide de choix sous les produits d'un rayon (bayou-core, content/rayons). */
.bayou-rayon-guide {
	max-width: 860px;
	margin-top: 56px;
}

.bayou-rayon-guide h2 {
	margin-top: 32px;
	font-size: 24px;
}

.bayou-rayon-guide h3 {
	margin-top: 20px;
	font-size: 18px;
}