/*
Theme Name: E-KAUF
Theme URI: https://e-kauf.fr
Description: Thème enfant de Twenty Twenty-Five pour la boutique E-KAUF — vêtements chauffants. Direction chaleureuse : crème, rouge E-KAUF, caramel. Typos Bitter + Karla auto-hébergées.
Author: E-KAUF
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 8.1
Text Domain: e-kauf
*/

/* ---------- Réassurance en haut de page ---------- */
.ekauf-topbar {
	background: var(--wp--preset--color--encre);
	color: #f7f1e9;
	font-size: 13px;
	letter-spacing: .02em;
	text-align: center;
	padding: 9px 16px;
}
/* Ce selecteur visait les puces de separation « • » du texte de reassurance, mais il
   atteignait TOUS les <span> du bandeau — dont celui qui enveloppe les icones des reseaux
   sociaux, qui apparaissaient donc a 55 % d'opacite. C'est ce que le client a vu et decrit
   comme « grise ». Le texte a ete retire (voir inc/reseaux.php) et la regle avec lui. */
.ekauf-topbar .ekauf-topbar-txt span { opacity: .55; margin: 0 10px; }

/* ---------- En-tête ---------- */
.ekauf-logo {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 25px;
	letter-spacing: .02em;
	color: var(--wp--preset--color--rouge);
	text-decoration: none;
}
.wp-block-navigation a { text-decoration: none; }
.wp-block-navigation a:hover { color: var(--wp--preset--color--rouge); }

/* ---------- Boutons ---------- */
.wp-block-button__link,
.wc-block-components-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button {
	border-radius: 4px !important;
	font-weight: 600;
	letter-spacing: .01em;
}
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button {
	background: var(--wp--preset--color--rouge) !important;
	color: #fff !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover {
	background: var(--wp--preset--color--rouge-fonce) !important;
}

/* ---------- Étapes « comment ça marche » ---------- */
.ekauf-etape-num {
	font-family: var(--wp--preset--font-family--display);
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: var(--wp--preset--color--rouge);
	width: 30px; height: 30px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 14px;
}

/* ---------- Cartes ---------- */
.ekauf-carte {
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	overflow: hidden;
}

/* ---------- Boutique : cartes produit ----------
   Les styles de WooCommerce sont chargés après ceux du thème : à spécificité égale
   ils gagnent. D'où le `body` en tête de sélecteur et quelques !important ciblés. */
/* Pourquoi « .woocommerce.woocommerce » et non « body .woocommerce » :
 *
 * WooCommerce pose la classe `woocommerce` sur <body> lui-même. Le sélecteur
 * « body .woocommerce » désigne un élément DESCENDANT de body portant cette classe —
 * il ne correspond donc à rien, et 22 règles de cette feuille étaient mortes en silence
 * (titres en serif rouge, prix minuscule, bandeau non positionné).
 *
 * La classe répétée gagne en spécificité — nécessaire puisque woocommerce.css est chargé
 * APRÈS la feuille du thème, et l'emporte donc à spécificité égale — tout en continuant
 * de correspondre à <body class="woocommerce">.
 */
.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
	gap: 22px;
	margin: 0 !important;
	padding: 0;
	list-style: none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none !important; }

.woocommerce.woocommerce ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 12px;
	padding: 0 0 18px !important;
	text-align: left;
	overflow: hidden;
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.woocommerce.woocommerce ul.products li.product:hover {
	box-shadow: 0 10px 28px rgba(36,29,24,.09);
	transform: translateY(-2px);
	border-color: var(--wp--preset--color--caramel-clr);
}

/* la photo : même format partout, et le bandeau posé dessus */
.woocommerce.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link { position: relative; display: block; }
.woocommerce.woocommerce ul.products li.product img {
	margin: 0 0 14px !important;
	border-radius: 0;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	background: #fff;
}
.woocommerce.woocommerce ul.products li.product .ekauf-ribbon {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	margin: 0;
	background: rgba(255,255,255,.94);
	box-shadow: 0 1px 4px rgba(36,29,24,.14);
}

/* le texte : marges serrées, titre sur deux lignes réservées pour aligner les prix */
.woocommerce.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--wp--preset--font-family--corps) !important;
	font-size: 16px !important;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--encre);
	margin: 0 18px 8px !important;
	padding: 0 !important;
	/* Deux lignes réservées : les prix et les boutons s'alignent d'une carte à l'autre,
	   quelle que soit la longueur du nom. La valeur doit suivre -webkit-line-clamp. */
	min-height: 2.7em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.woocommerce.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title { color: var(--wp--preset--color--rouge); }

.woocommerce.woocommerce ul.products li.product .price {
	color: var(--wp--preset--color--encre) !important;
	font-size: 19px !important;
	font-weight: 700;
	display: block;
	margin: 0 18px 4px !important;
	line-height: 1.2;
}
.woocommerce.woocommerce ul.products li.product .ekauf-dispo {
	font-size: 13px;
	color: var(--wp--preset--color--encre-doux);
	margin: 0 18px 16px !important;
	line-height: 1.4;
}

/* le bouton, toujours collé au bas de la carte et de largeur identique */
.woocommerce.woocommerce ul.products li.product .button,
.woocommerce.woocommerce ul.products li.product a.button {
	margin: auto 18px 0 !important;
	display: block;
	width: auto;
	padding: 12px 14px !important;
	text-align: center;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.3;
	background: var(--wp--preset--color--rouge) !important;
	color: #fff !important;
	border-radius: 4px;
}
.woocommerce.woocommerce ul.products li.product .button:hover { background: var(--wp--preset--color--rouge-fonce) !important; }
.woocommerce.woocommerce ul.products li.product .added_to_cart { margin: 8px 18px 0; font-size: 13.5px; }

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering { margin-bottom: 24px; }

.ekauf-ribbon {
	display: inline-block;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--rouge);
	background: var(--wp--preset--color--creme-2);
	border-radius: 4px;
	padding: 4px 9px;
}

/* ---------- Fiche produit ---------- */
.woocommerce div.product .product_title {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	line-height: 1.15;
}
.woocommerce div.product p.price { color: var(--wp--preset--color--encre); font-weight: 700; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--wp--preset--color--rouge); }
.woocommerce div.product .woocommerce-tabs .panel h3 {
	font-family: var(--wp--preset--font-family--display);
	font-size: 18px;
	margin-top: 26px;
}
.woocommerce-product-gallery__image img { border-radius: 8px; }

/* ---------- Pied de page ---------- */
.ekauf-footer { background: var(--wp--preset--color--encre); color: #cdbfae; }
.ekauf-footer a { color: #ede3d6; text-decoration: none; }
.ekauf-footer a:hover { color: #fff; text-decoration: underline; }
.ekauf-footer h2, .ekauf-footer h3 { color: #fff; }

/* ---------- Divers ---------- */
figure.wp-block-image img { border-radius: 8px; }
/* Attention : .ekauf-mesure sert aussi au chapô de l'accueil (front-page.html).
   Les styles de carte du guide des tailles sont donc portés par .ekauf-mesures > .ekauf-mesure. */
.ekauf-mesure { max-width: 62ch; }
@media (max-width: 781px) {
	.ekauf-topbar { font-size: 12px; }
	.ekauf-logo { font-size: 21px; }
}

/* ================= Bandeau du haut ================= */
.ekauf-topbar-in {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.ekauf-topbar-in { justify-content: space-between; }
/* messages qui se relaient : chacun visible 4 s sur un cycle de n x 4 s */
.ekauf-topbar-msgs { position: relative; flex: 1; min-height: 1.4em; text-align: left; }
.ekauf-topbar-msg {
	position: absolute; inset: 0; opacity: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	animation: ekauf-relai calc(var(--n) * 4s) infinite; animation-delay: calc(var(--i) * 4s);
}
.ekauf-topbar-msg a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
@keyframes ekauf-relai { 0% { opacity: 0; } 4%, 29% { opacity: 1; } 33%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.ekauf-topbar-msg { animation: none; }
	.ekauf-topbar-msg:first-child { opacity: 1; }
}
.ekauf-topbar-social { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.ekauf-suivez { opacity: .85; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; }
.ekauf-social { display: inline-flex; align-items: center; gap: 8px; }
.ekauf-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	text-decoration: none !important;
	line-height: 0;
	transition: transform .15s ease, filter .15s ease;
}
.ekauf-social svg { fill: #fff; }
.ekauf-social a:hover { transform: translateY(-2px); filter: brightness(1.08); }
.ekauf-social-instagram {
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
/* le noir TikTok a besoin d'un liseré pour ne pas disparaître sur fond sombre */
.ekauf-footer .ekauf-social-tiktok,
.ekauf-social-clair .ekauf-social-tiktok { box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }

/* ================= Cartes réseaux ================= */
.ekauf-reseaux-cartes { display: grid; gap: 12px; }
.ekauf-reseau-carte {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	text-decoration: none !important;
	color: var(--wp--preset--color--encre);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.ekauf-reseau-carte:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(36,29,24,.10);
	border-color: var(--wp--preset--color--caramel-clr);
}
.ekauf-reseau-pastille {
	flex: 0 0 44px;
	height: 44px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ekauf-reseau-pastille svg { fill: #fff; }
.ekauf-reseau-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ekauf-reseau-txt strong { font-family: var(--wp--preset--font-family--display); font-size: 16.5px; }
.ekauf-reseau-compte { font-size: 13px; color: var(--wp--preset--color--caramel); font-weight: 600; }
.ekauf-reseau-accroche { font-size: 14px; color: var(--wp--preset--color--encre-doux); line-height: 1.45; }
.ekauf-reseau-fleche { margin-left: auto; color: var(--wp--preset--color--rouge); font-size: 19px; }
.ekauf-footer .ekauf-reseau-carte { background: #2e2620; border-color: #3d342b; color: #f0e7db; }
.ekauf-footer .ekauf-reseau-accroche { color: #b7a596; }

/* ================= Avis Google ================= */
.ekauf-avis-resume {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 26px 0 0;
	font-size: 15px;
	color: var(--wp--preset--color--encre-doux);
}
.ekauf-avis-entete {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
	margin: 26px 0 30px;
	padding: 18px 24px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
}
.ekauf-avis-entete strong { font-size: 25px; font-family: var(--wp--preset--font-family--display); }
.ekauf-avis-nb { display: block; font-size: 14px; color: var(--wp--preset--color--encre-doux); margin-top: 2px; }
.ekauf-avis-lien { font-size: 14.5px; font-weight: 600; white-space: nowrap; }
.ekauf-avis-piste {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(270px, 1fr);
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0;
	padding-bottom: 6px;
	scrollbar-width: thin;
}
.ekauf-avis-piste > * { scroll-snap-align: start; }
@media (min-width: 900px) { .ekauf-avis-piste { grid-auto-columns: minmax(300px, 1fr); } }
.ekauf-avis-fleches { display: flex; gap: 8px; justify-content: center; margin-top: 18px; }
.ekauf-avis-fleches button {
	width: 38px; height: 38px;
	border-radius: 50%;
	border: 1px solid var(--wp--preset--color--bord);
	background: #fff;
	color: var(--wp--preset--color--encre);
	font-size: 17px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.ekauf-avis-fleches button:hover { background: var(--wp--preset--color--rouge); color: #fff; border-color: var(--wp--preset--color--rouge); }
.ekauf-avis-simple { justify-content: center; }
.ekauf-avis-carte {
	margin: 0;
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
}
.ekauf-avis-carte blockquote {
	margin: 12px 0 14px;
	padding: 0;
	border: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 16px;
	line-height: 1.55;
}
.ekauf-avis-carte figcaption { font-size: 14px; font-weight: 600; }
.ekauf-avis-carte figcaption span { font-weight: 400; color: var(--wp--preset--color--encre-doux); }

/* ================= Notre histoire ================= */
.ekauf-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin: 8px 0 4px; }
.ekauf-chiffre {
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	padding: 22px 24px;
}
.ekauf-chiffre b {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 30px;
	line-height: 1.1;
	color: var(--wp--preset--color--rouge);
}
.ekauf-chiffre span { font-size: 14.5px; color: var(--wp--preset--color--encre-doux); }
.ekauf-etape-histoire {
	display: grid;
	grid-template-columns: 84px 1fr;
	gap: 20px;
	padding: 22px 0;
	border-top: 1px solid var(--wp--preset--color--bord);
}
.ekauf-etape-histoire time {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	color: var(--wp--preset--color--caramel);
}
.ekauf-etape-histoire h3 { margin: 0 0 6px; font-size: 17.5px; }
.ekauf-etape-histoire p { margin: 0; color: var(--wp--preset--color--encre-doux); font-size: 15.5px; }

@media (max-width: 781px) {
	.ekauf-topbar-social .ekauf-suivez { display: none; }
	.ekauf-topbar-txt { font-size: 11.5px; }
	.ekauf-etape-histoire { grid-template-columns: 1fr; gap: 8px; }
}

/* ================= En-tête : logo, nav, panier ================= */
.ekauf-logo-block a, .wp-block-site-title a {
	color: var(--wp--preset--color--rouge) !important;
	text-decoration: none !important;
}
.ekauf-nav { flex: 0 1 auto; }
.ekauf-panier {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	text-decoration: none !important;
	color: var(--wp--preset--color--encre);
	flex: 0 0 auto;
}
.ekauf-panier svg { fill: currentColor; }
.ekauf-panier:hover { color: var(--wp--preset--color--rouge); }
.ekauf-panier-nb {
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--wp--preset--color--rouge);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.ekauf-panier-nb.est-vide { background: var(--wp--preset--color--bord); color: var(--wp--preset--color--encre-doux); }

/* ================= Fil d'Ariane, tri, pagination ================= */
.woocommerce .woocommerce-breadcrumb {
	font-size: 13.5px;
	color: var(--wp--preset--color--encre-doux);
	margin-bottom: 22px;
}
.woocommerce .woocommerce-breadcrumb a { color: var(--wp--preset--color--encre-doux); }
.woocommerce nav.woocommerce-pagination ul { border-color: var(--wp--preset--color--bord); }

/* ================= Formulaires ================= */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"], textarea, select {
	border: 1px solid var(--wp--preset--color--bord) !important;
	border-radius: 4px !important;
	background: #fff;
	padding: 11px 13px;
	font-family: inherit;
	font-size: 15.5px;
}
input:focus, textarea:focus, select:focus {
	outline: 2px solid var(--wp--preset--color--caramel-clr);
	outline-offset: 1px;
}
.wp-block-search__button { border-radius: 4px; }

/* ================= Accessibilité ================= */
a:focus-visible, button:focus-visible, summary:focus-visible {
	outline: 2px solid var(--wp--preset--color--rouge);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ================= Onglets produit ================= */
.woocommerce div.product .woocommerce-tabs ul.tabs { padding-left: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { border-radius: 6px 6px 0 0; }
.ekauf-onglet h3:first-child { margin-top: 0; }
.ekauf-onglet ul, .ekauf-onglet ol { padding-left: 22px; }
.ekauf-onglet li { margin-bottom: 6px; }
.ekauf-onglet { max-width: 70ch; }

/* icônes réduites dans le bandeau du haut */
.ekauf-topbar { padding: 6px 0; }
.ekauf-social-clair a { width: 24px; height: 24px; border-radius: 7px; }
.ekauf-social-clair svg { width: 15px; height: 15px; }

.ekauf-avis-titre { font-family: var(--wp--preset--font-family--display); font-size: 17.5px; display: block; }
.ekauf-avis-bouton {
	margin-left: auto;
	padding: 11px 20px;
	border-radius: 4px;
	background: var(--wp--preset--color--rouge);
	color: #fff !important;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none !important;
	white-space: nowrap;
}
.ekauf-avis-bouton:hover { background: var(--wp--preset--color--rouge-fonce); }
.ekauf-avis-simple { text-align: left; }
@media (max-width: 600px) { .ekauf-avis-bouton { margin-left: 0; } }
.ekauf-avis-carte blockquote p { margin: 0; }

/* ================= Marque ================= */
.ekauf-marque { flex: 0 0 auto; }
.ekauf-marque .wp-block-site-logo img { display: block; height: auto; }
.ekauf-footer .ekauf-marque-pied { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
@media (max-width: 600px) {
	.ekauf-marque .wp-block-site-logo { width: 34px; }
	.ekauf-logo-block a { font-size: 21px !important; }
}

/* ================= Cartes de contact ================= */
.ekauf-moyens {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 14px;
	margin: 26px 0 34px;
}
.ekauf-moyen {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	padding: 20px 18px;
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.ekauf-moyen-titre {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 16px;
	color: var(--wp--preset--color--encre);
}
.ekauf-moyen p { margin: 0; font-size: 14.5px; color: var(--wp--preset--color--encre-doux); line-height: 1.5; }
.ekauf-moyen a { color: var(--wp--preset--color--rouge); font-weight: 600; text-decoration: none; word-break: break-word; }
.ekauf-moyen a:hover { text-decoration: underline; }
.ekauf-moyen-delai {
	margin-top: auto;
	padding-top: 10px;
	font-size: 13px;
	color: var(--wp--preset--color--encre-doux);
}

/* ================= Encart d'information ================= */
.ekauf-encart {
	background: var(--wp--preset--color--creme-2);
	border-left: 3px solid var(--wp--preset--color--caramel);
	border-radius: 0 8px 8px 0;
	padding: 16px 18px;
	margin: 26px 0;
}
.ekauf-encart p { margin: 0; font-size: 15px; line-height: 1.6; }
.ekauf-encart p + p { margin-top: 8px; }
.ekauf-encart strong { color: var(--wp--preset--color--encre); }

/* ================= Tableaux ================= */
/* Le conteneur permet le défilement horizontal sur mobile sans casser la page. */
.wp-block-table,
.ekauf-tableau { overflow-x: auto; margin: 26px 0; }
.wp-block-table table,
.ekauf-tableau table {
	border-collapse: separate;
	border-spacing: 0;
	width: 100%;
	min-width: 340px;
	font-size: 15px;
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	overflow: hidden;
}
.wp-block-table th,
.ekauf-tableau th {
	background: var(--wp--preset--color--creme-2);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 14px;
	text-align: left;
	color: var(--wp--preset--color--encre);
	letter-spacing: .01em;
}
.wp-block-table th,
.wp-block-table td,
.ekauf-tableau th,
.ekauf-tableau td {
	padding: 12px 14px;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--bord);
	vertical-align: middle;
}
.wp-block-table tbody tr:last-child td,
.ekauf-tableau tbody tr:last-child td { border-bottom: 0; }
.wp-block-table tbody tr:nth-child(even),
.ekauf-tableau tbody tr:nth-child(even) { background: rgba(217, 180, 140, .07); }
/* La première colonne porte la taille : on l'accentue. */
.wp-block-table tbody td:first-child,
.ekauf-tableau tbody td:first-child {
	font-weight: 700;
	color: var(--wp--preset--color--encre);
	white-space: nowrap;
}
.wp-block-table figcaption,
.ekauf-tableau figcaption {
	margin-top: 10px;
	font-size: 13px;
	color: var(--wp--preset--color--encre-doux);
	text-align: left;
}

/* ================= Étapes numérotées en ligne ================= */
.ekauf-mesures {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 16px;
	margin: 24px 0 30px;
}
.ekauf-mesures > .ekauf-mesure {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	padding: 18px;
}
.ekauf-mesures .ekauf-mesure-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--wp--preset--color--rouge);
	color: #fff;
	font-size: 13.5px;
	font-weight: 700;
	margin-bottom: 10px;
}
.ekauf-mesures .ekauf-mesure h3 { margin: 0 0 6px; font-size: 16px; }
.ekauf-mesures .ekauf-mesure p { margin: 0; font-size: 14.5px; color: var(--wp--preset--color--encre-doux); line-height: 1.55; }

/* ================= Formulaire de contact (Fluent Forms) ================= */
/* Fluent Forms n'apporte presque aucun style : tout est repris ici pour rester
   cohérent avec le reste du site, et pour être utilisable au pouce sur mobile. */
.ekauf-form-carte {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 12px;
	padding: 26px 24px;
	margin: 8px 0 30px;
}
.ekauf-form-carte > h2:first-child { margin-top: 0; }
body .fluentform .ff-el-group { margin-bottom: 18px; }
body .fluentform .ff-el-input--label label {
	font-weight: 600;
	font-size: 14.5px;
	color: var(--wp--preset--color--encre);
	margin-bottom: 6px;
	display: inline-block;
}
body .fluentform .ff-el-input--label.ff-el-is-required label:after {
	color: var(--wp--preset--color--rouge);
	margin-left: 3px;
}
body .fluentform .ff-el-form-control {
	width: 100%;
	border: 1px solid var(--wp--preset--color--bord) !important;
	border-radius: 6px !important;
	background: var(--wp--preset--color--blanc) !important;
	padding: 12px 13px !important;
	font-family: inherit !important;
	/* 16px minimum : en dessous, iOS zoome automatiquement au focus. */
	font-size: 16px !important;
	color: var(--wp--preset--color--encre) !important;
	box-shadow: none !important;
	line-height: 1.4;
}
body .fluentform textarea.ff-el-form-control { min-height: 130px; resize: vertical; }
body .fluentform .ff-el-form-control:focus {
	border-color: var(--wp--preset--color--caramel) !important;
	outline: 2px solid var(--wp--preset--color--caramel-clr);
	outline-offset: 1px;
}
body .fluentform select.ff-el-form-control {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23241d18' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	padding-right: 38px !important;
}
body .fluentform .ff-btn-submit {
	background: var(--wp--preset--color--rouge) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 6px !important;
	padding: 14px 28px !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	cursor: pointer;
	width: auto;
	min-height: 48px;
}
body .fluentform .ff-btn-submit:hover { background: var(--wp--preset--color--rouge-fonce) !important; }
body .fluentform .ff-el-is-error .ff-el-form-control { border-color: var(--wp--preset--color--rouge) !important; }
body .fluentform .error, body .fluentform .text-danger {
	color: var(--wp--preset--color--rouge);
	font-size: 13.5px;
	margin-top: 5px;
}
body .fluentform .ff-message-success {
	background: var(--wp--preset--color--creme-2);
	border-left: 3px solid var(--wp--preset--color--caramel);
	border-radius: 0 8px 8px 0;
	padding: 16px 18px;
	color: var(--wp--preset--color--encre);
}
/* Nom et email côte à côte dès qu'il y a la place.
   Fluent Forms n'enveloppe pas ses champs : on ne peut donc pas faire une grille sur un
   parent commun. On met le formulaire en flex et on donne une demi-largeur aux deux
   champs marqués « ekauf-moitie » dans migration/formulaire-contact.php. */
@media (min-width: 700px) {
	body .fluentform form > fieldset { display: flex; flex-wrap: wrap; gap: 0 18px; }
	body .fluentform form > fieldset > .ff-el-group { flex: 1 1 100%; }
	body .fluentform .ekauf-moitie { flex: 1 1 calc(50% - 9px) !important; }
}

@media (max-width: 600px) {
	.ekauf-form-carte { padding: 20px 16px; border-radius: 10px; }
	.ekauf-moyens { gap: 12px; margin: 20px 0 26px; }
	.ekauf-moyen { padding: 16px 15px; }
	.ekauf-encart { padding: 14px 15px; }
	.wp-block-table th, .wp-block-table td,
	.ekauf-tableau th, .ekauf-tableau td { padding: 10px 11px; font-size: 14px; }
	/* Le bouton d'envoi occupe toute la largeur : plus facile au pouce. */
	body .fluentform .ff-btn-submit { width: 100% !important; }
}

/* ================= Chapô et rythme des pages de contenu ================= */
.ekauf-chapo {
	font-size: 18px;
	line-height: 1.6;
	color: var(--wp--preset--color--encre-doux);
	max-width: 62ch;
	margin-bottom: 30px;
}
.entry-content h2, .wp-block-post-content h2 {
	font-family: var(--wp--preset--font-family--display);
	margin-top: 42px;
	margin-bottom: 14px;
	font-size: 25px;
	line-height: 1.25;
}
.entry-content > h2:first-child, .wp-block-post-content > h2:first-child { margin-top: 0; }
.entry-content p, .wp-block-post-content p { line-height: 1.65; }

/* Le titre de page : plus lisible, et il respire moins sur mobile. */
.wp-block-post-title {
	font-family: var(--wp--preset--font-family--display);
	line-height: 1.15;
}

@media (max-width: 600px) {
	.ekauf-chapo { font-size: 16.5px; margin-bottom: 24px; }
	.entry-content h2, .wp-block-post-content h2 { font-size: 21px; margin-top: 34px; }
	.wp-block-post-title { font-size: 28px !important; }
	.ekauf-mesures { gap: 12px; margin: 20px 0 26px; }
	.ekauf-mesures > .ekauf-mesure { padding: 15px; }
	/* Boutons empilés et pleine largeur : cibles confortables au pouce. */
	.wp-block-buttons { gap: 10px; }
	.wp-block-buttons .wp-block-button { width: 100%; }
	.wp-block-buttons .wp-block-button__link { display: block; text-align: center; padding: 14px 20px; }
}

/* ================= Accordéon FAQ ================= */
.ekauf-faq { margin: 26px 0; }
.ekauf-question {
	border: 1px solid var(--wp--preset--color--bord);
	background: var(--wp--preset--color--blanc);
	border-radius: 8px;
	margin-bottom: 10px;
	transition: border-color .15s ease;
}
.ekauf-question:hover { border-color: var(--wp--preset--color--caramel); }
.ekauf-question[open] { border-color: var(--wp--preset--color--caramel); }
.ekauf-question > summary {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 16px;
	color: var(--wp--preset--color--encre);
	cursor: pointer;
	list-style: none;
	/* 48px de haut au minimum : une question doit se toucher au pouce sans viser. */
	padding: 15px 46px 15px 18px;
	position: relative;
	line-height: 1.4;
}
.ekauf-question > summary::-webkit-details-marker { display: none; }
/* Chevron dessiné en CSS : il indique l'état, et pivote à l'ouverture. */
.ekauf-question > summary::after {
	content: "";
	position: absolute;
	right: 20px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid var(--wp--preset--color--rouge);
	border-bottom: 2px solid var(--wp--preset--color--rouge);
	transform: translateY(-70%) rotate(45deg);
	transition: transform .18s ease;
}
.ekauf-question[open] > summary::after { transform: translateY(-30%) rotate(225deg); }
.ekauf-reponse {
	padding: 0 18px 17px;
	color: var(--wp--preset--color--encre-doux);
	font-size: 15.5px;
	line-height: 1.65;
}
.ekauf-reponse p:first-child { margin-top: 0; }
.ekauf-reponse p:last-child { margin-bottom: 0; }
.ekauf-reponse ul, .ekauf-reponse ol { padding-left: 20px; margin: 8px 0; }

@media (max-width: 600px) {
	.ekauf-question > summary { font-size: 15.5px; padding: 14px 42px 14px 15px; }
	.ekauf-reponse { padding: 0 15px 15px; font-size: 15px; }
}

/* ================= Pages légales : lisibilité d'un texte long ================= */
.ekauf-legal h2 { font-size: 21px; }
.ekauf-legal h3 { font-size: 17px; margin-top: 26px; margin-bottom: 8px; }
.ekauf-legal p, .ekauf-legal li { font-size: 15.5px; line-height: 1.7; }
.ekauf-legal ul, .ekauf-legal ol { padding-left: 22px; }
.ekauf-legal li { margin-bottom: 7px; }
/* Les mentions encore à compléter, signalées en rouge dans le contenu. */
.ekauf-a-completer {
	background: rgba(184, 35, 42, .07);
	border-left: 3px solid var(--wp--preset--color--rouge);
	padding: 12px 15px;
	border-radius: 0 6px 6px 0;
	font-size: 15px;
	margin: 18px 0;
}
.ekauf-manquant { color: var(--wp--preset--color--rouge); font-weight: 600; }
.ekauf-a-completer p { margin: 0; }

/* ================= Boutique sur mobile ================= */
/* Deux colonnes jusqu'en bas : la boutique tient en un écran et demi au lieu de quatre,
   et les photos carrées restent lisibles à 150 px. */
@media (max-width: 600px) {
	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 12px;
	}
	.woocommerce.woocommerce ul.products li.product { border-radius: 10px; padding-bottom: 14px !important; }
	.woocommerce.woocommerce ul.products li.product img { margin-bottom: 10px !important; }
	.woocommerce.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 14px !important;
		margin: 0 12px 6px !important;
	}
	.woocommerce.woocommerce ul.products li.product .price { font-size: 16.5px !important; margin: 0 12px 3px !important; }
	.woocommerce.woocommerce ul.products li.product .ekauf-dispo { font-size: 12px; margin: 0 12px 12px !important; }
	.woocommerce.woocommerce ul.products li.product .button,
	.woocommerce.woocommerce ul.products li.product a.button {
		margin: auto 12px 0 !important;
		padding: 11px 8px !important;
		font-size: 13.5px;
	}
	.woocommerce.woocommerce ul.products li.product .ekauf-ribbon { top: 7px; left: 7px; font-size: 9.5px; padding: 3px 7px; }
	/* Le survol n'existe pas au doigt : le décalage ne servait qu'à faire sauter la grille. */
	.woocommerce.woocommerce ul.products li.product:hover { transform: none; box-shadow: none; }
}

/* ================= Villes des marchés de Noël ================= */
.ekauf-villes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 16px;
	margin: 24px 0 30px;
}
.ekauf-ville {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 10px;
	padding: 20px;
	display: flex;
	flex-direction: column;
}
.ekauf-ville h3 {
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	margin: 0 0 3px;
	color: var(--wp--preset--color--encre);
}
.ekauf-ville-lieu {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--wp--preset--color--rouge);
	margin-bottom: 10px;
}
.ekauf-ville p { margin: 0 0 14px; font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--encre-doux); }
/* Le statut des dates est collé en bas : les cartes s'alignent malgré des textes inégaux. */
.ekauf-ville-dates {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--wp--preset--color--bord);
	font-size: 13px;
	color: var(--wp--preset--color--encre-doux);
	font-style: italic;
}

@media (max-width: 600px) {
	.ekauf-villes { gap: 12px; }
	.ekauf-ville { padding: 16px; }
	.ekauf-ville h3 { font-size: 18px; }
}

/* ==========================================================================
   Bulle de discussion (inc/chat.php)

   Ce n'est pas un chat en direct : c'est le formulaire de contact presente comme
   une conversation. Le style doit donc rester sobre — une bulle qui clignote et
   promet une reponse immediate, alors que personne n'est derriere, agace plus
   qu'elle ne rassure.
   ========================================================================== */

.ekauf-chat {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
	display: flex;
	/* column-reverse : le bouton est premier dans le HTML (c'est l'ordre logique pour le
	   clavier et les lecteurs d'ecran), mais le panneau doit s'afficher AU-DESSUS de lui.
	   Dans le sens normal il s'ouvrait vers le bas et sortait de l'ecran. */
	flex-direction: column-reverse;
	align-items: flex-end;
	gap: 12px;
}

/* Bouton rond, l'icone seule. Un libelle « Une question ? » avait ete essaye : il occupait
   la largeur d'un bouton de menu a cote du panier, et n'apprenait rien que l'icone ne dise. */
.ekauf-chat-bulle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--rouge);
	color: #fff;
	font-family: var(--wp--preset--font-family--corps), system-ui, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(36, 29, 24, 0.22);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.ekauf-chat-bulle:hover { transform: translateY(-2px); box-shadow: 0 9px 26px rgba(36, 29, 24, 0.28); }
.ekauf-chat-bulle:focus-visible { outline: 3px solid var(--wp--preset--color--encre); outline-offset: 3px; }
.ekauf-chat-bulle svg { fill: currentColor; flex: none; }

/* Panneau ouvert : la bulle prend une croix, pour qu'un seul bouton suffise a fermer. */
.ekauf-chat.est-ouvert .ekauf-chat-bulle { background: var(--wp--preset--color--encre); }

/*
 * L'attribut `hidden` DOIT etre remis a display:none ici.
 *
 * La feuille du navigateur declare `[hidden] { display: none }`, mais un selecteur de classe
 * l'emporte sur elle : la regle `.ekauf-chat-panneau { display: flex }` ci-dessous annulait
 * `hidden`, et le panneau restait ouvert en permanence sur toutes les pages du site.
 * C'est le piege classique de `hidden` combine a un display explicite.
 */
.ekauf-chat-panneau[hidden] { display: none !important; }

.ekauf-chat-panneau {
	width: min(370px, calc(100vw - 32px));
	max-height: min(78vh, 620px);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--wp--preset--color--creme);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 16px;
	box-shadow: 0 18px 48px rgba(36, 29, 24, 0.24);
}

.ekauf-chat-entete {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 16px 14px;
	background: var(--wp--preset--color--rouge);
	color: #fff;
}
.ekauf-chat-entete strong {
	display: block;
	font-family: var(--wp--preset--font-family--display), Georgia, serif;
	font-size: 17px;
	line-height: 1.25;
}
.ekauf-chat-entete span {
	display: block;
	margin-top: 3px;
	font-size: 13px;
	line-height: 1.4;
	opacity: 0.9;
}
.ekauf-chat-fermer {
	flex: none;
	padding: 4px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: #fff;
	cursor: pointer;
}
.ekauf-chat-fermer:hover { background: rgba(255, 255, 255, 0.18); }

.ekauf-chat-corps {
	padding: 16px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* Le message d'accueil, en bulle de conversation : c'est ce qui donne le ton « chat »
   sans mentir sur la nature du dispositif. */
.ekauf-chat-message {
	margin: 0 0 16px;
	padding: 12px 14px;
	background: var(--wp--preset--color--creme-2, #fff);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 14px 14px 14px 4px;
	font-size: 14.5px;
	line-height: 1.5;
}

.ekauf-chat-pied {
	margin: 14px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--wp--preset--color--encre-doux);
}

/* Le formulaire est le meme qu'en page contact, mais dans 340 px de large : une seule
   colonne, et des champs plus compacts. */
.ekauf-chat-corps .fluentform .ff-el-group { margin-bottom: 12px; }
.ekauf-chat-corps .fluentform .ekauf-moitie { width: 100%; }
.ekauf-chat-corps .fluentform form { display: block; }
.ekauf-chat-corps .fluentform input[type="text"],
.ekauf-chat-corps .fluentform input[type="email"],
.ekauf-chat-corps .fluentform textarea {
	/* 16 px minimum : en dessous, iOS zoome tout seul a la prise de focus et le
	   panneau sort de l'ecran. */
	font-size: 16px !important;
	padding: 10px 12px;
}
.ekauf-chat-corps .fluentform textarea { min-height: 90px; }
.ekauf-chat-corps .fluentform .ff-btn-submit { width: 100%; }

@media (max-width: 600px) {
	.ekauf-chat { right: 14px; bottom: 14px; gap: 10px; }
	.ekauf-chat-bulle { width: 50px; height: 50px; }
	.ekauf-chat-panneau { max-height: 78vh; }
}

/* Impression : une bulle flottante n'a aucun sens sur du papier. */
@media print { .ekauf-chat { display: none; } }

/* ---------- Lien vers le guide de taille, sur la fiche produit ---------- */
/* Place au-dessus du selecteur de taille par woocommerce_before_variations_form. */
.ekauf-guide-taille-lien {
	margin: 0 0 12px;
	font-size: 14px;
	color: var(--wp--preset--color--encre-doux);
}
.ekauf-guide-taille-lien a {
	display: inline-block;
	padding: 7px 13px;
	margin-right: 8px;
	border: 1px solid var(--wp--preset--color--rouge);
	border-radius: 8px;
	color: var(--wp--preset--color--rouge);
	font-weight: 600;
	text-decoration: none;
}
.ekauf-guide-taille-lien a:hover,
.ekauf-guide-taille-lien a:focus-visible {
	background: var(--wp--preset--color--rouge);
	color: #fff;
}
/* ---------- Option « batterie supplementaire » sur la fiche produit ---------- */
/* La case est sous la quantite, dans le formulaire d'ajout au panier : elle doit se lire
   comme une offre, pas comme une mention legale. D'ou l'encadre et le prix en gras.
   `flex` plutot qu'un simple `inline` : sur telephone, la phrase tient sur trois lignes et
   doit rester alignee sous elle-meme, pas sous la case a cocher. */
.ekauf-option-batterie {
	flex-basis: 100%;
	margin: 14px 0 4px;
	padding: 12px 14px;
	background: var(--wp--preset--color--creme-2);
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 8px;
}
.ekauf-option-batterie label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
	font-size: 14.5px;
	line-height: 1.45;
	cursor: pointer;
}
.ekauf-option-batterie input {
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: var(--wp--preset--color--rouge);
}
.ekauf-option-batterie strong { font-weight: 700; color: var(--wp--preset--color--rouge); white-space: nowrap; }
.ekauf-option-mention {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--wp--preset--color--encre-doux);
}

/* Les trois tableaux du guide : lisibles sur telephone, sans debordement de page. */
.ekauf-tailles { overflow-x: auto; }
.ekauf-tailles table { min-width: 420px; }
.ekauf-tailles th, .ekauf-tailles td { text-align: left; white-space: nowrap; }
.ekauf-tailles tbody tr:nth-child(odd) { background: rgba(0,0,0,.025); }

/* La photo du modele, au-dessus de son tableau (client, 14/09/2026) : on lit des mesures
   sans savoir de quel vetement il s'agit, et les trois se ressemblent au nom.
   CENTREE, et non plus flottante a droite (client, 22/09/2026). */
.ekauf-guide-figure { margin: 0 auto 20px; max-width: 260px; }
.ekauf-guide-figure img { display: block; width: 100%; height: auto; border-radius: 6px; }

/* ---------- Schemas de mesure du guide de taille (corps, main) ---------- */
/* Des SVG, pas des images : nets a toute taille, 2 ko, et ils suivent la couleur du
   texte — donc lisibles quel que soit le fond. Les traits ne sont PAS mis a l'echelle
   par le navigateur (vector-effect), sinon un schema affiche en 200 px de large aurait
   des fleches deux fois trop epaisses. */
.ekauf-schema-bloc { margin: 24px auto 28px; max-width: 340px; text-align: center; }
.ekauf-schema {
	display: block;
	width: 100%;
	height: auto;
	max-width: 300px;
	margin: 0 auto;
	color: var(--wp--preset--color--rouge);
}
.ekauf-schema--main { max-width: 250px; }
.ekauf-schema-corps { stroke: var(--wp--preset--color--encre); stroke-width: 3; }
.ekauf-schema-membre { stroke-width: 3; }
.ekauf-schema-cote { stroke: currentColor; stroke-width: 1.6; fill: none; }
.ekauf-schema-fleche { stroke-width: 2; }
.ekauf-schema-lettre {
	fill: currentColor;
	stroke: none;
	font-weight: 700;
	font-size: 22px;
}
.ekauf-schema-bloc figcaption {
	margin-top: 10px;
	font-size: 14px;
	color: var(--wp--preset--color--encre-doux);
}
.ekauf-mesures-liste ul { margin: 0 0 6px; padding-left: 1.2em; }
.ekauf-mesures-liste li { margin-bottom: 6px; }

/* ---------- Rubans des marchés de Noël ---------- */
.ekauf-rubans { display: flex; flex-direction: column; gap: 26px; margin: 28px 0; }
.ekauf-ruban {
	display: grid;
	grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
	gap: 0;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 12px;
}
/* Une ligne sur deux part de l'autre côté : sans ça, quatre rubans identiques donnent
   l'impression d'un tableau, pas d'une page. L'ordre visuel change, l'ordre du DOM non —
   un lecteur d'écran lit toujours photo puis texte. */
.ekauf-ruban--inverse .ekauf-ruban-photo { order: 2; }
.ekauf-ruban-photo { position: relative; min-height: 210px; background: var(--wp--preset--color--creme-2); }
.ekauf-ruban-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ekauf-ruban-sans-photo {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--wp--preset--font-family--display);
	font-size: 24px;
	color: var(--wp--preset--color--encre-doux);
	letter-spacing: .04em;
}
.ekauf-ruban-texte { padding: 24px 26px; }
.ekauf-ruban-texte h3 { margin: 0 0 6px; font-size: 22px; }
.ekauf-ruban-dates {
	margin: 0 0 4px;
	font-weight: 700;
	color: var(--wp--preset--color--rouge);
}
.ekauf-ruban-lieu {
	margin: 0 0 12px;
	font-size: 14.5px;
	color: var(--wp--preset--color--encre-doux);
}
.ekauf-ruban-texte p { margin: 0 0 10px; }
.ekauf-ruban-stand {
	margin: 14px 0 0;
	font-size: 13.5px;
	color: var(--wp--preset--color--encre-doux);
	font-style: italic;
}
@media (max-width: 781px) {
	.ekauf-ruban { grid-template-columns: 1fr; }
	.ekauf-ruban--inverse .ekauf-ruban-photo { order: 0; }
	.ekauf-ruban-photo { min-height: 180px; }
	.ekauf-ruban-texte { padding: 20px; }
}

/* ---------- Section technique de l'accueil ---------- */
.ekauf-technique {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 18px;
	margin-top: 34px;
}
.ekauf-tech {
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--bord);
	border-radius: 12px;
}
.ekauf-tech h3 { margin: 0 0 10px; font-size: 18px; }
.ekauf-tech p { margin: 0 0 10px; font-size: 15px; }
.ekauf-tech p:last-child { margin-bottom: 0; }
/* Les affirmations non verifiees sont ecrites en rouge, comme les mentions legales
   manquantes : elles doivent sauter aux yeux tant qu'elles ne sont pas confirmees. */

/* Mention du prestataire, en pied de page et en fin de CGV.
   Volontairement discrete : elle ne doit pas detourner un visiteur venu acheter. Le lien
   est un `mailto` plutot qu'un texte, pour qu'une panne du site trouve son destinataire en
   un clic. Meme traitement que sur kersimone-saint-lunaire.fr. */
.ekauf-fait-par {
	margin-top: 18px;
	font-size: 11.5px;
	color: #8a8078;
	letter-spacing: .01em;
}
.ekauf-fait-par a {
	color: inherit;
	text-decoration: underline;
	text-decoration-style: dotted;
	text-underline-offset: 2px;
}
.ekauf-fait-par a:hover { color: #cbbfb2; }

.ekauf-tech-note {
	padding-top: 10px;
	border-top: 1px dashed var(--wp--preset--color--bord);
	font-size: 13.5px !important;
	color: var(--wp--preset--color--encre-doux);
}

/* ---------- Pictogrammes des trois atouts, en tete d'accueil (client, 05/10/2026) ---------- */
/* Poses par classe sur le paragraphe (ekauf-atout + ekauf-atout--…) : le bloc reste un
   paragraphe ordinaire, que le client peut retoucher dans l'editeur sans le casser. */
.ekauf-atout { display: flex; align-items: center; gap: 10px; }
.ekauf-atout::before {
	content: ""; flex: 0 0 34px; width: 34px; height: 34px;
	background: center / contain no-repeat;
}
.ekauf-atout--chrono::before   { background-image: url(assets/img/atouts/chrono-flamme.svg); }
.ekauf-atout--niveaux::before  { background-image: url(assets/img/atouts/trois-niveaux.svg); }
.ekauf-atout--autonomie::before { background-image: url(assets/img/atouts/autonomie.svg); }

/* Guide de taille : les photos produit ont un fond blanc qui tranche sur le creme de la
   page (client, 05/10/2026). « multiply » rend le blanc transparent sans retoucher les
   fichiers — la meme photo reste intacte en boutique. */
.ekauf-guide-figure { text-align: center; }
.ekauf-guide-figure img { margin: 0 auto; mix-blend-mode: multiply; border-radius: 0; }

/* ---------- Maillage interne (fiches produit, articles) ---------- */
.ekauf-maillage { clear: both; margin: 28px 0 0; font-size: 15px; color: var(--wp--preset--color--encre-doux); }
.ekauf-maillage a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
