/* Couche d'intégration : ce que le kit ne peut pas prévoir parce que ça dépend
   du balisage de WooCommerce et de Blocksy. Chargée après le kit.
   Règle du projet : on corrige ici, jamais dans les fichiers du kit. */

/* La liste de produits devient la grille du kit : plus de puces ni de retraits,
   et on neutralise les largeurs flottantes que WooCommerce pose par défaut. */
ul.products.cab-grid {
  list-style: none;
  margin: 0;
  padding: 0;
}
ul.products.cab-grid > .cab-card {
  width: auto;
  float: none;
  margin: 0;
  clear: none;
}
ul.products.cab-grid::before,
ul.products.cab-grid::after {
  content: none;
}

/* Blocksy habille ses propres vignettes : on laisse la main au kit. */
ul.products.cab-grid > .cab-card .ct-woo-card-actions,
ul.products.cab-grid > .cab-card .ct-woocommerce-product-element {
  display: none;
}

/* Le bouton d'ajout de la boucle est un <a> : il doit se comporter comme le bouton du kit. */
.cab-card__action .cab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

/* Woo ajoute un « produit ajouté » après le bouton : il ferait sauter la mise en page. */
.cab-card__action .added_to_cart {
  display: none;
}

/* ---------- Mise en page des sections (accueil et pages éditoriales) ----------
   Ces classes ne sont pas des composants du kit : c'est le liant entre eux.
   Elles vivent donc ici et non dans kit/css/. */

.cab-section { margin: var(--cab-s-4) auto; }
.cab-section__title {
  font-family: var(--cab-font-display);
  font-size: var(--cab-fs-h2);
  font-weight: 300;
  line-height: var(--cab-lh-title);
  margin: 0 0 var(--cab-s-3);
}
.cab-section__lead {
  max-width: 62ch;
  margin: calc(var(--cab-s-3) * -1) 0 var(--cab-s-4);
  color: var(--cab-muted);
}
.cab-section__more { margin-top: var(--cab-s-4); }
.cab-section__title--lg { font-size: clamp(32px, 3.2vw, 46px); }
/* Le bloc des rayons suit le bandeau d'accueil : il n'a pas besoin de respiration
   au-dessus, l'écran était à moitié blanc. */
.cab-section--rayons { margin-top: var(--cab-s-3); margin-bottom: var(--cab-s-3); }
.cab-section--selection { margin-top: 0; }
/* Le titre et le bouton sur la même ligne, alignés sur la gouttière du conteneur. */
.cab-section__head .cab-section__title { margin-bottom: 0; }
@media (max-width: 767px) {
  .cab-section__head { flex-direction: column; align-items: flex-start; gap: 14px; }
}

/* La grille des produits n'a pas de puces quand on la réutilise hors boucle Woo. */
.cab-section ul.products { list-style: none; margin: 0; padding: 0; }

/* Bloc « La ferme » : image et texte côte à côte, empilés sur mobile. */
.cab-ferme {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--cab-s-6);
  align-items: center;
}
.cab-ferme__media img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.cab-ferme__texte p { max-width: 54ch; }
@media (max-width: 899px) {
  .cab-ferme { grid-template-columns: 1fr; gap: var(--cab-s-4); }
}

/* Le héros occupe toute la largeur, même à l'intérieur du conteneur de Blocksy. */
.cab-hero { margin-bottom: var(--cab-s-8); }
.cab-hero__content.cab-container { width: 100%; }

/* Réassurance pleine largeur sur l'accueil. */
.cab-reassure { margin: var(--cab-s-8) 0; }
@media (max-width: 899px) {
  .cab-reassure { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cab-reassure__item:nth-child(2n) { border-right: 0; }
}
@media (max-width: 599px) {
  .cab-reassure { grid-template-columns: 1fr; }
  .cab-reassure__item { border-right: 0; border-bottom: 1px solid var(--cab-line); }
}

/* Blocksy encadre le contenu : sur l'accueil, les sections gèrent leur propre largeur. */
.home .ct-container, .home .ct-container-full { max-width: none; padding: 0; }

/* ---------- Mini-panier ---------- */

/* Le tiroir et son voile existent dans le DOM mais restent masqués tant que le script
   ne les a pas ouverts : [hidden] doit gagner contre les règles de position du kit. */
.cab-drawer[hidden], .cab-drawer-veil[hidden] { display: none; }
.cab-drawer__inner { display: flex; flex-direction: column; height: 100%; }
.cab-drawer.is-loading { opacity: 0.6; pointer-events: none; }
body.cab-drawer-ouvert { overflow: hidden; }

.cab-drawer__note { color: var(--cab-muted); font-size: var(--cab-fs-label); }
.cab-line--cadeau .cab-line__price { font-weight: 600; }
.cab-line__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cab-line__remove { background: none; border: 0; padding: 0; text-decoration: underline; color: var(--cab-muted); font-size: var(--cab-fs-label); cursor: pointer; }
.cab-line__remove:hover { color: var(--cab-ink); }

/* L'icône du panier de l'en-tête ouvre le tiroir : elle reste un lien vers /panier/
   pour rester utilisable sans JavaScript. */
.cab-header__cart { cursor: pointer; }

/* ---------- Tunnel de commande ---------- */

.cab-tunnel .ct-container, .cab-tunnel .ct-container-full { max-width: none; padding: 0; }
.cab-header__brand--sm .cab-header__logo { font-size: 18px; }

/* Deux colonnes : formulaire à gauche, récapitulatif collant à droite. */
.cab-tunnel .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 56px; align-items: start; padding-block: var(--cab-s-5) var(--cab-s-6); }
.cab-tunnel .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.cab-tunnel form.checkout { display: contents; }
.cab-tunnel #customer_details { grid-column: 1; }
.cab-tunnel #order_review_heading, .cab-tunnel #order_review { grid-column: 2; }
.cab-tunnel #order_review { position: sticky; top: 24px; padding: 24px; border: 1px solid var(--cab-line); }
@media (max-width: 999px) {
  .cab-tunnel .woocommerce { grid-template-columns: 1fr; gap: var(--cab-s-4); }
  .cab-tunnel #customer_details, .cab-tunnel #order_review_heading, .cab-tunnel #order_review { grid-column: 1; }
  .cab-tunnel #order_review { position: static; }
}

/* Champs : hauteur et traits du kit. */
.cab-tunnel .form-row input.input-text,
.cab-tunnel .form-row textarea,
.cab-tunnel .form-row .select2-selection {
  height: var(--cab-control-h);
  border: 1px solid var(--cab-line);
  border-radius: var(--cab-radius);
  padding: 0 14px;
  font-family: var(--cab-font-text);
  font-size: var(--cab-fs-body);
  background: var(--cab-bg);
}
.cab-tunnel .form-row textarea { height: auto; padding: 12px 14px; }
.cab-tunnel .form-row label { font-size: var(--cab-fs-label); letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; margin-bottom: 6px; display: block; }
.cab-tunnel .form-row.is-wide { width: 100%; }

/* Logos de paiement et mention de sécurité. */
.cab-paylogos { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.cab-paylogo { border: 1px solid var(--cab-line); padding: 4px 10px; font-size: var(--cab-fs-label); letter-spacing: 0.04em; color: var(--cab-muted); }
.cab-checkout__secure { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; font-size: var(--cab-fs-meta); color: var(--cab-muted); }
.cab-checkout__secure svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; stroke: currentColor; fill: none; stroke-width: 1.8; }

/* Pied minimal du tunnel. */
.cab-footer--min { display: flex; justify-content: space-between; gap: var(--cab-s-3); flex-wrap: wrap; padding: var(--cab-s-3) var(--cab-page-pad); border-top: 1px solid var(--cab-line); font-size: var(--cab-fs-meta); color: var(--cab-muted); }
.cab-footer--min a { color: inherit; }
.cab-footer__min-links { display: flex; gap: var(--cab-s-3); flex-wrap: wrap; }

/* ---------- Expériences : agenda et barre d'achat ---------- */

.cab-agenda-bloc { margin-bottom: var(--cab-s-6); }
.cab-agenda__row { grid-template-columns: 220px minmax(0, 1fr) 120px 140px; }
.cab-agenda__action { justify-self: end; }
@media (max-width: 1023px) {
  .cab-agenda__row { grid-template-columns: 1fr auto; }
  .cab-agenda__title { grid-column: span 2; }
}

/* La barre collante recouvre le pied de page : on libère la place. */
@media (max-width: 767px) {
  .single-product .cab-footer { padding-bottom: 88px; }
}

/* ---------- Confirmation de commande ---------- */

.cab-suite { margin: var(--cab-s-5) 0; }
.cab-suite .cab-reassure--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cab-s-3); }
.cab-suite .cab-reassure__item { align-items: flex-start; }
.cab-suite__cadeau { margin-top: var(--cab-s-3); padding: 14px 16px; background: var(--cab-bg-soft); }
@media (max-width: 767px) { .cab-suite .cab-reassure--inline { grid-template-columns: 1fr; } }

/* Sur la confirmation, le tiroir et la barre d'achat n'ont plus lieu d'être. */
.cab-confirmation .cab-drawer, .cab-confirmation .cab-drawer-veil, .cab-confirmation .cab-stickybuy { display: none; }

/* ---------- Pages éditoriales ---------- */

.cab-editorial .entry-content,
.cab-editorial .ct-container > article {
  max-width: 76ch;
  margin-inline: auto;
}
.cab-editorial .entry-content > * + * { margin-top: var(--cab-s-3); }
.cab-editorial .entry-content h2 { margin-top: var(--cab-s-6); }
.cab-editorial .entry-content img,
.cab-editorial .entry-content iframe { max-width: 100%; height: auto; display: block; }
.cab-editorial .entry-content figure { margin: var(--cab-s-5) 0; }
.cab-editorial .entry-content iframe { aspect-ratio: 16 / 9; width: 100%; border: 0; }

/* Chapeau : les anciens H2 trop longs redevenus paragraphes. */
.cab-lead {
  font-family: var(--cab-font-display);
  font-size: 21px;
  font-weight: 300;
  line-height: 1.4;
  margin-block: var(--cab-s-3);
}

/* Sommaire ancré des pages longues. */
.cab-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cab-s-2) var(--cab-s-3);
  padding: var(--cab-s-2) 0;
  margin-bottom: var(--cab-s-5);
  border-top: 1px solid var(--cab-line);
  border-bottom: 1px solid var(--cab-line);
  font-size: var(--cab-fs-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.cab-subnav a { text-decoration: none; color: var(--cab-muted); }
.cab-subnav a:hover, .cab-subnav a[aria-current] { color: var(--cab-ink); }

/* ---------- Formulaire de contact ---------- */

.cab-contact { display: flex; flex-direction: column; gap: var(--cab-s-3); max-width: 560px; }
.cab-contact .cab-field { display: flex; flex-direction: column; gap: 6px; }
.cab-contact label { font-size: var(--cab-fs-label); letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; }
.cab-contact .cab-input,
.cab-contact .cab-textarea {
  width: 100%;
  border: 1px solid var(--cab-line);
  border-radius: var(--cab-radius);
  padding: 0 14px;
  height: var(--cab-control-h);
  font-family: var(--cab-font-text);
  font-size: var(--cab-fs-body);
  background: var(--cab-bg);
}
.cab-contact .cab-textarea { height: auto; padding: 12px 14px; line-height: var(--cab-lh-body); }
.cab-contact .cab-input:focus-visible,
.cab-contact .cab-textarea:focus-visible { outline: 2px solid var(--cab-ink); outline-offset: 1px; }
.cab-contact__erreurs { border-left: 3px solid var(--cab-error); padding: 12px 16px; background: var(--cab-bg-soft); }
.cab-contact__erreurs p { margin: 0; color: var(--cab-error); }
.cab-contact__merci { border: 1px solid var(--cab-line); padding: var(--cab-s-4); background: var(--cab-bg-soft); }

/* Champ piège : invisible à l'écran, hors du parcours clavier, mais pas display:none
   (certains robots ignorent les champs masqués ainsi). */
.cab-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Atelier sans date ouverte. */
.cab-sansdate { border: 1px solid var(--cab-line); padding: var(--cab-s-3); background: var(--cab-bg-soft); display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.cab-sansdate p { margin: 0; }

/* ---------- Méga-menu ---------- */

.cab-mega { display: inline-flex; align-items: center; }
.cab-mega__lien { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.cab-mega__caret { font-size: 11px; line-height: 1; transition: transform var(--cab-t-fast); }
.cab-mega__lien[aria-expanded="true"] .cab-mega__caret { transform: rotate(180deg); }

/* Un panneau étroit ancré à gauche sous « Boutique », et non une bande pleine
   largeur : une liste verticale se lit plus vite qu'une grille de pictos. */
.cab-mega__panneau {
  /* Ancré sur la page, pas sous le lien : il part du bord gauche et remonte
     par-dessus l'en-tête, comme sur la référence. */
  position: fixed;
  top: 14px;
  left: 16px;
  z-index: 60;
  width: 470px;
  max-height: calc(100vh - 28px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 26px 0 20px;
  margin-top: 10px;
  background: var(--cab-bg);
  border: 1px solid var(--cab-line);
  border-radius: 10px;
  box-shadow: 0 22px 50px rgba(0, 0, 0, 0.14);
  display: flex;
  flex-direction: column;
  /* Il entre par la gauche en s'éclaircissant, et repart par où il est venu. */
  opacity: 0;
  transform: translateX(-24px);
  transition: opacity 220ms ease, transform 220ms ease;
}
.cab-mega__panneau.is-open { opacity: 1; transform: none; }
.cab-mega__panneau[hidden] { display: none; }

/* Voile très léger sur le reste de la page pendant que le panneau est ouvert. */
.cab-mega__voile {
  position: fixed; inset: 0; z-index: 55;
  background: rgba(17, 17, 17, 0.10);
  opacity: 0; pointer-events: none;
  transition: opacity 220ms ease;
}
.cab-mega__voile.is-open { opacity: 1; pointer-events: auto; }

@media (prefers-reduced-motion: reduce) {
  .cab-mega__panneau { transition: none; transform: none; }
}

/* Le titre de la liste et la croix partagent une ligne, comme sur la maquette. */
.cab-mega__entete {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 0 20px 0 26px; margin-bottom: 6px;
}
.cab-mega__titre { color: var(--cab-muted); }
.cab-mega__fermer {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; margin-right: -8px;
  background: none; border: 0; padding: 0; cursor: pointer; color: var(--cab-ink);
}
.cab-mega__fermer svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; }

.cab-mega__groupe { list-style: none; margin: 0; padding: 0 26px; }

.cab-mega__groupe a {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 7px 0;
  font-family: var(--cab-font-display); font-size: 20px; font-weight: 300; line-height: 1.3;
  color: var(--cab-ink); text-decoration: none;
  /* L'en-tête met ses liens en capitales espacées : dans le panneau, ils redeviennent
     du texte courant, sinon « Sirop de plantes » passe à la ligne. */
  text-transform: none; letter-spacing: normal;
}
/* L'en-tête souligne ses liens d'un filet au survol ; dans le panneau, ça s'ajoutait
   au soulignement du texte et faisait deux traits. Un seul suffit. */
.cab-mega__groupe a { border-bottom: 0 !important; }
.cab-mega__groupe a:hover, .cab-mega__groupe a:focus-visible { text-decoration: none; }
/* Seul le nom du rayon se souligne. Posé sur le lien entier, le trait courait aussi
   sous le nombre de produits, à l'autre bout de la ligne : deux traits séparés. */
.cab-mega__groupe a:hover > span:first-child,
.cab-mega__groupe a:focus-visible > span:first-child { text-decoration: underline; text-underline-offset: 4px; }
.cab-mega__groupe small { font-family: var(--cab-font-text); font-size: 12px; color: var(--cab-muted); white-space: nowrap; }
.cab-mega__groupe a > span:first-of-type { flex: 1 1 auto; }
.cab-mega__picto {
  width: 22px; height: 22px; flex: 0 0 22px; align-self: center;
  stroke: var(--cab-ink); fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
  transition: transform var(--cab-t-fast);
}
.cab-mega__groupe a:hover .cab-mega__picto { transform: translateY(-2px); }

/* ---------- Méga-menu : les deux mises en avant ---------- */

/* Présentées autrement que les rayons, pour qu'on ne les compte pas comme tels :
   un encart posé sur un fond doux, une phrase, et la flèche qui avance au survol. */
.cab-mega__encarts {
  margin: 22px 26px 6px; padding-top: 22px; display: grid; gap: 14px;
  border-top: 1px solid var(--cab-line);
}
.cab-mega__panneau .cab-mega__encart {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px;
  padding: 26px 24px;
  background: var(--cab-bg-soft);
  border: 1px solid transparent; border-radius: 10px;
  color: var(--cab-ink); text-decoration: none;
  transition: background var(--cab-t-fast), border-color var(--cab-t-fast);
}
.cab-mega__encart { border-bottom: 0 !important; }
/* L'en-tête met ses liens en capitales espacées. Dans les encarts c'est une phrase
   qu'on lit, pas une étiquette : elle reprend la casse et l'espacement du texte. */
.cab-mega__encart, .cab-mega__encart strong, .cab-mega__encart small {
  text-transform: none; letter-spacing: normal;
}
/* Au survol, l'encart se détache du fond sans qu'un trait noir vienne le cerner :
   ce n'est pas un bouton, et le contour dur jurait avec les filets du reste. */
.cab-mega__encart:hover, .cab-mega__encart:focus-visible {
  background: var(--cab-bg); border-color: var(--cab-line);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.07);
  text-decoration: none;
}
.cab-mega__encart-picto {
  width: 34px; height: 34px; align-self: center;
  stroke: var(--cab-ink); fill: none; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round;
}
.cab-mega__encart-texte { display: block; min-width: 0; }
.cab-mega__encart-texte strong {
  display: block;
  font-family: var(--cab-font-display); font-size: 20px; font-weight: 300; line-height: 1.25;
}
.cab-mega__encart-texte small {
  /* Une ligne, suspendue : l'encart annonce, c'est la page qui raconte. La coupure
     n'est là que si la phrase s'allonge un jour. */
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
  overflow: hidden;
  margin-top: 5px;
  font-family: var(--cab-font-text); font-size: 13px; line-height: 1.5; color: var(--cab-muted);
  white-space: normal; text-wrap: pretty;
}
.cab-mega__encart-fleche {
  width: 18px; height: 18px; flex: 0 0 18px;
  stroke: var(--cab-ink); fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round;
  transition: transform var(--cab-t-fast);
}
.cab-mega__encart:hover .cab-mega__encart-fleche { transform: translateX(4px); }

/* Sur tablette et mobile, le panneau laisse place au menu déroulant. */
@media (max-width: 1099px) {
  .cab-mega__panneau { left: 0; right: 0; top: 0; width: auto; margin: 0; border-radius: 0; border-left: 0; border-right: 0; }
}

/* ---------- Recherche ---------- */

.cab-recherche {
  border-bottom: 1px solid var(--cab-line);
  background: var(--cab-bg);
  padding: var(--cab-s-3) var(--cab-page-pad);
}
.cab-recherche[hidden] { display: none; }
.cab-recherche__form { display: flex; gap: var(--cab-s-2); align-items: center; max-width: var(--cab-container); margin-inline: auto; }
.cab-recherche__form .cab-input { flex-grow: 1; height: var(--cab-control-h); border: 1px solid var(--cab-line); padding: 0 14px; font-family: var(--cab-font-text); font-size: var(--cab-fs-body); }
.cab-recherche__fermer { background: none; border: 0; padding: 8px; cursor: pointer; min-width: var(--cab-touch-min); min-height: var(--cab-touch-min); }
.cab-recherche__fermer svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.cab-recherche__pistes { display: flex; gap: var(--cab-s-5); flex-wrap: wrap; max-width: var(--cab-container); margin: var(--cab-s-3) auto 0; }
.cab-recherche__groupe { display: flex; gap: var(--cab-s-2); align-items: baseline; flex-wrap: wrap; }
.cab-recherche__groupe .cab-label { color: var(--cab-muted); }
.cab-recherche__groupe a { font-size: var(--cab-fs-small); }

/* ---------- En-tête réduit au défilement ---------- */

.cab-header { position: sticky; top: 0; z-index: 50; background: var(--cab-bg); transition: height var(--cab-t-med); }
.admin-bar .cab-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .cab-header { top: 46px; } }

/* ---------- Menu mobile ---------- */

.cab-menu-mobile { display: flex; flex-direction: column; padding: var(--cab-s-3) var(--cab-page-pad); border-bottom: 1px solid var(--cab-line); gap: 2px; }
.cab-menu-mobile[hidden] { display: none; }
.cab-menu-mobile > a { padding: 12px 0; font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600; border-bottom: 1px solid var(--cab-line); }
.cab-menu-mobile__sous { display: flex; flex-direction: column; padding: 8px 0 12px 16px; gap: 8px; }
.cab-menu-mobile__sous a { font-size: var(--cab-fs-small); color: var(--cab-muted); text-transform: none; letter-spacing: 0; }
@media (min-width: 1100px) { .cab-header__burger { display: none; } }

/* ---------- Hub Ateliers & visites ---------- */

.cab-hub .cab-expcard__media { aspect-ratio: 4 / 3; overflow: hidden; background: var(--cab-bg-soft); }
.cab-hub .cab-expcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cab-hub .cab-expcard__body { padding: var(--cab-s-3); display: flex; flex-direction: column; gap: 10px; flex-grow: 1; }
.cab-hub .cab-expcard__body p { margin: 0; }
.cab-expcard__date { font-size: var(--cab-fs-meta); color: var(--cab-muted); }
.cab-expcard__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 12px; }
.cab-expcard__price { font-size: 15px; font-weight: 600; }

.cab-agenda__tete { display: flex; align-items: baseline; justify-content: space-between; gap: var(--cab-s-3); flex-wrap: wrap; margin-bottom: var(--cab-s-2); }
.cab-agenda__tete .cab-section__title { margin: 0; }
.cab-agenda__filtres { display: flex; gap: 8px; flex-wrap: wrap; }
.cab-agenda__row[hidden] { display: none; }
.cab-agenda__vide { padding: var(--cab-s-4) 0; color: var(--cab-muted); }
.cab-agenda__vide[hidden] { display: none; }

.cab-sansdate__actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- Barre de filtres de la boutique ---------- */

.cab-filtres {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--cab-s-3);
  flex-wrap: wrap;
  padding-bottom: var(--cab-s-3);
  margin-bottom: var(--cab-s-4);
  border-bottom: 1px solid var(--cab-line);
}
.cab-filtres__groupe, .cab-filtres__fin { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cab-filtres a.cab-chip { text-decoration: none; }
.cab-chip__n { margin-left: 6px; color: var(--cab-muted); font-weight: 400; }
.cab-chip.is-active .cab-chip__n { color: inherit; opacity: 0.7; }

/* Le tri natif de WooCommerce prend l'allure du kit. */
.cab-filtres .woocommerce-ordering { margin: 0; }
.cab-filtres .woocommerce-ordering select {
  height: var(--cab-control-h-sm);
  border: 1px solid var(--cab-line);
  background: var(--cab-bg);
  padding: 0 10px;
  font-family: var(--cab-font-text);
  font-size: var(--cab-fs-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ---------- Avis clients ---------- */
.cab-review__quote { margin: 0; }
.cab-review__src { font-size: var(--cab-fs-label); color: var(--cab-muted); }
.cab-avis-invite { font-size: var(--cab-fs-small); color: var(--cab-muted); margin-top: var(--cab-s-2); }

/* ---------- Vidéo de fond du héros ---------- */

.cab-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  opacity: 0;
  transition: opacity 600ms ease;
  z-index: 0;
}
/* La vidéo ne se montre qu'une fois en train de jouer : sinon on voit un rectangle noir. */
.cab-hero--video.is-video-prete .cab-hero__video { opacity: 1; }

@media (max-width: 767px) {
  .cab-hero__video { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .cab-hero__video { display: none; }
}

/* ---------- Bandeau photo des pages éditoriales ---------- */

/* Moins haut que le héros de l'accueil : c'est une entrée de page, pas une vitrine. */
.cab-hero--page { min-height: 300px; }
.cab-hero__content,
.cab-hero__content .cab-hero__title,
.cab-hero__content .cab-hero__lead { color: #ffffff; }
.cab-hero--page .cab-hero__content { padding-bottom: var(--cab-s-5); }
.cab-hero--page .cab-hero__title { font-size: clamp(30px, 5vw, 52px); }

@media (max-width: 767px) {
  .cab-hero--page { min-height: 220px; }
}

/* ---------- Vignette produit, maquettes du 23/09 ---------- */

/* Pastilles en haut à gauche : pleine pour ce qui est positif, contour pour ce qui nuance. */
.cab-card__badges {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.cab-card__badges .cab-badge {
  border-radius: 999px; padding: 6px 14px;
  font-size: 11px; font-weight: 500; letter-spacing: 0.02em; text-transform: none;
}
.cab-badge--plein { background: var(--cab-ink); color: var(--cab-on-ink); border-color: var(--cab-ink); }
/* Posées sur une photo, pas sur un fond neutre comme dans les maquettes : sans fond
   opaque, une pastille en contour devient illisible dès que l'image est chargée. */
.cab-badge--contour {
  background: rgba(255, 255, 255, 0.88); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--cab-ink); border-color: var(--cab-ink);
}

/* Le bouton d'ajout : une pilule qui apparaît au survol, action à gauche, prix à droite. */
.cab-card__action .cab-btn {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; height: 52px; padding: 0 24px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--cab-ink);
  border: 1px solid var(--cab-ink);
  font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase;
  transition: background-color var(--cab-t-fast), color var(--cab-t-fast);
}
.cab-card__action .cab-btn:hover,
.cab-card__action .cab-btn:focus-visible {
  background: var(--cab-ink); color: var(--cab-on-ink); border-color: var(--cab-ink);
}
.cab-card__action .cab-btn__prix { font-variant-numeric: tabular-nums; letter-spacing: 0; text-transform: none; font-size: 14px; }
/* Un seul libellé (« Choisir », « Lire la suite ») : il se centre. */
.cab-card__action .cab-btn:not(:has(.cab-btn__prix)) { justify-content: center; }

.cab-card__desc {
  font-size: 14px; line-height: 1.45; color: var(--cab-muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cab-card__note { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cab-muted); }
.cab-card__note svg { width: 14px; height: 14px; fill: var(--cab-ink); flex-shrink: 0; }

@media (hover: none), (max-width: 767px) {
  /* Sans survol, le bouton reste posé sous la photo, en entier : le prix doit se lire. */
  .cab-card__action .cab-btn { width: 100%; height: 46px; padding: 0 18px; }
  .cab-card__action .cab-btn .cab-btn__label { display: inline; }
  .cab-card__body { flex-direction: column; align-items: stretch; }
}

/* ---------- Rangée de produits défilante ---------- */

.cab-slider { position: relative; }

.cab-slider__piste {
  display: grid; grid-auto-flow: column;
  /* 4,4 colonnes : quatre vignettes entières et un morceau de la cinquième, qui dit
     qu'il y en a d'autres à droite — mieux qu'une flèche seule.
     Largeur fixe, pas un minmax(0, …) : avec un minimum de zéro, les douze colonnes
     se tassent dans la largeur disponible et il n'y a plus rien à faire défiler. */
  /* Plafonnée : sur un écran large, 4,4 colonnes donnaient des vignettes énormes.
     Au-delà, la rangée en montre simplement davantage. */
  grid-auto-columns: min(330px, calc((100% - 4 * 24px) / 4.4));
  gap: 24px;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 0;
  padding-bottom: 4px;
  /* La barre de défilement native est remplacée par la jauge, sous la rangée. */
  scrollbar-width: none;
}
.cab-slider__piste::-webkit-scrollbar { display: none; }
.cab-slider__piste > .cab-card { scroll-snap-align: start; }
.cab-slider__piste:focus-visible { outline: 2px solid var(--cab-ink); outline-offset: 4px; }

/* Les flèches n'apparaissent qu'au survol de la rangée — et restent là au clavier. */
/* Fond clair, chevron noir : posée sur une photo sombre, une flèche noire
   disparaissait. Le blanc translucide se lit sur toutes les photos. */
.cab-slider__nav {
  position: absolute; top: calc(var(--cab-slider-media-h, 300px) / 2); transform: translateY(-50%);
  z-index: 3;
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 64px;
  background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--cab-ink);
  border: 0; cursor: pointer;
  opacity: 0; transition: opacity var(--cab-t-fast), background-color var(--cab-t-fast), color var(--cab-t-fast);
}
.cab-slider__nav:hover { background: var(--cab-ink); color: var(--cab-on-ink); }
.cab-slider__nav--prev { left: 0; }
.cab-slider__nav--next { right: 0; }

/* Rangée pleine largeur : elle sort du conteneur et touche les deux bords de l'écran,
   les flèches avec elle. La piste garde la marge de page à gauche pour que la première
   vignette s'aligne sur le titre au-dessus. */
.cab-slider--large {
  --cab-vw: var(--cab-largeur-page, 100vw);
  margin-inline: calc(50% - var(--cab-vw) / 2);
  width: var(--cab-vw);
  max-width: var(--cab-vw);
}
/* Aucune gouttière : la bande part du bord de l'écran et commence par une vignette
   entière. Le titre reste, lui, dans le conteneur — c'est le parti pris de la bande
   pleine largeur. Le « padding: 0 » de WooCommerce sur ul.products va dans le même
   sens, mais on l'écrit pour ne pas en dépendre. */
.cab-slider.cab-slider--large ul.cab-slider__piste {
  padding-inline: 0;
  scroll-padding-inline: 0;
}
.cab-slider--large .cab-slider__barre {
  max-width: var(--cab-container);
  margin-inline: auto;
}
.cab-slider__nav svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cab-slider:hover .cab-slider__nav:not([hidden]),
.cab-slider__nav:focus-visible { opacity: 1; }
.cab-slider--fixe .cab-slider__nav, .cab-slider--fixe .cab-slider__barre { display: none; }

.cab-slider__barre { margin-top: 28px; height: 2px; background: var(--cab-line); overflow: hidden; }
.cab-slider__jauge { display: block; height: 100%; background: var(--cab-ink); transition: transform 150ms linear; }

@media (max-width: 1199px) {
  .cab-slider__piste { grid-auto-columns: calc((100% - 3 * 20px) / 3.4); gap: 20px; }
}
@media (max-width: 767px) {
  /* Au doigt, les flèches ne servent pas : on laisse dépasser la carte suivante,
     c'est ce qui dit qu'il y a autre chose à droite. */
  .cab-slider__piste { grid-auto-columns: 72%; gap: 14px; scroll-snap-type: x mandatory; }
  .cab-slider__nav { display: none; }
  .cab-slider__barre { margin-top: 18px; }
}

/* ---------- Mini-panier : corbeille et ventes croisées (maquettes du 23/09) ---------- */

/* La corbeille remplace le lien « Retirer » : plus court à atteindre, et la ligne
   garde son texte pour elle. Le libellé reste lisible aux lecteurs d'écran. */
/* flex-shrink: 0 — sans quoi les lignes se tassent quand la liste dépasse la hauteur
   du tiroir, au lieu de le faire défiler. */
.cab-line { align-items: flex-start; gap: 12px; flex-shrink: 0; }
.cab-line__remove {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; margin-top: 4px;
  background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--cab-muted); text-decoration: none;
  transition: color var(--cab-t-fast);
}
.cab-line__remove:hover { color: var(--cab-ink); }
.cab-line__remove svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

.cab-drawer__suggest { padding-top: var(--cab-s-3); border-top: 1px solid var(--cab-line); flex-shrink: 0; }
.cab-drawer__suggest-titre {
  font-size: var(--cab-fs-label); font-weight: 600; letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; margin-bottom: 14px;
}
.cab-cross { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cab-cross__item { display: flex; flex-direction: column; gap: 8px; }
.cab-cross__media { position: relative; background: var(--cab-bg-soft); aspect-ratio: 1 / 1; overflow: hidden; border-radius: 6px; }
.cab-cross__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cab-cross__add {
  position: absolute; top: 10px; left: 10px; z-index: 2;
  display: inline-flex; align-items: center; min-height: 32px; padding: 0 16px;
  background: rgba(255, 255, 255, 0.94); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--cab-ink); border: 1px solid var(--cab-line); border-radius: 999px;
  font-size: 11px; letter-spacing: var(--cab-tracking-label); text-transform: uppercase; text-decoration: none;
  transition: background-color var(--cab-t-fast), color var(--cab-t-fast);
}
.cab-cross__add:hover, .cab-cross__add:focus-visible { background: var(--cab-ink); color: var(--cab-on-ink); border-color: var(--cab-ink); text-decoration: none; }
.cab-cross__add.loading { opacity: 0.6; pointer-events: none; }
.cab-cross__add.added { display: none; } /* WooCommerce ajoute son propre « Voir le panier » */
.cab-cross__titre { font-family: var(--cab-font-display); font-size: 15px; line-height: 1.25; text-decoration: none; }
.cab-cross__prix { font-size: 13px; color: var(--cab-muted); }
.cab-cross__prix del { margin-right: 6px; }
.cab-cross .added_to_cart { display: none; }

/* Le picto de fermeture du tiroir n'avait aucune dimension : il s'étirait sur 150 px. */
.cab-drawer__close svg {
  width: 18px; height: 18px;
  stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round;
}

/* ---------- Diaporama d'accueil (maquette « SLIDER HP ») ---------- */

/* Le bandeau n'est plus pleine largeur : il est posé dans la page, coins arrondis. */
.cab-diapo {
  position: relative;
  margin: 12px var(--cab-page-pad) 0;
  border-radius: 14px;
  overflow: hidden;
  background: var(--cab-bg-soft);
  isolation: isolate;
}
.cab-diapo__piste { display: grid; }
/* Les panneaux se superposent : un seul est visible, les autres restent dans le DOM. */
.cab-diapo__vue {
  grid-area: 1 / 1;
  position: relative;
  /* Proportion de la maquette, avec un plancher pour que le texte respire. */
  aspect-ratio: 16 / 7;
  min-height: 460px;
  display: flex; align-items: flex-end;
  opacity: 0; visibility: hidden;
  transition: opacity 600ms ease, visibility 0s linear 600ms;
}
.cab-diapo__vue.is-active { opacity: 1; visibility: visible; transition: opacity 600ms ease; }

.cab-diapo__img, .cab-diapo__video {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 40%;
}
.cab-diapo__video { opacity: 0; transition: opacity 600ms ease; }
.cab-diapo__video.is-prete { opacity: 1; }

/* Deux voiles superposés, depuis le bas et depuis la gauche : le texte est en bas à
   gauche, et une photo claire — un champ en plein soleil — l'y noierait sans cela. */
.cab-diapo__vue::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.30) 42%, rgba(0, 0, 0, 0) 72%),
    linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.18) 45%, rgba(0, 0, 0, 0) 75%);
}

.cab-diapo__contenu {
  position: relative; z-index: 2;
  width: 100%; max-width: 760px;
  margin: 0; padding: var(--cab-s-6) var(--cab-s-5) var(--cab-s-5);
  color: var(--cab-on-ink);
  display: flex; flex-direction: column; gap: 14px; align-items: flex-start;
}
/* Sélecteur doublé : le thème parent colore les h1 en noir, et un titre noir sur
   une photo de plein été ne se lit pas. */
.cab-diapo .cab-diapo__titre {
  font-family: var(--cab-font-display); font-weight: 300;
  font-size: clamp(30px, 4.2vw, 54px); line-height: 1.12;
  color: var(--cab-on-ink);
  margin: 0;
  text-wrap: balance;
}
.cab-diapo__lead { font-size: 16px; line-height: 1.5; max-width: 46ch; opacity: 0.94; margin: 0; }
.cab-diapo__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.cab-diapo__actions .cab-btn { display: inline-flex; align-items: center; gap: 12px; }
.cab-btn__fleche { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }

/* Commandes en bas à droite, comme sur la maquette. */
.cab-diapo__controles {
  position: absolute; right: 20px; bottom: 20px; z-index: 3;
  display: flex; align-items: center; gap: 10px;
}
.cab-diapo__puces { display: flex; align-items: center; gap: 8px; }
.cab-diapo__puce {
  width: 9px; height: 9px; padding: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255, 255, 255, 0.45); border: 0;
  transition: background-color var(--cab-t-fast), transform var(--cab-t-fast);
}
.cab-diapo__puce.is-active { background: var(--cab-on-ink); transform: scale(1.25); }
/* La cible tactile fait 44 px, même si le point n'en fait que 9. */
.cab-diapo__puce::before { content: ""; position: absolute; width: 32px; height: 44px; transform: translate(-12px, -18px); }

/* Pas de pastille ronde posée sur la photo : le bouton de pause ne se montre qu'au
   survol du bandeau ou quand on l'atteint au clavier. Un diaporama qui tourne seul
   doit pouvoir être arrêté ; ça ne l'oblige pas à s'afficher en permanence. */
.cab-diapo__pause {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; padding: 0; margin-left: 4px;
  background: none; border: 0; cursor: pointer; color: var(--cab-on-ink);
  opacity: 0; transition: opacity var(--cab-t-fast);
}
.cab-diapo:hover .cab-diapo__pause,
.cab-diapo__pause:focus-visible,
.cab-diapo.is-arrete .cab-diapo__pause { opacity: 0.85; }
.cab-diapo__pause:hover { opacity: 1; }
.cab-diapo__pause svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cab-diapo__picto-play { display: none; }
.cab-diapo.is-arrete .cab-diapo__picto-pause { display: none; }
.cab-diapo.is-arrete .cab-diapo__picto-play { display: block; fill: currentColor; stroke: none; }

@media (max-width: 767px) {
  .cab-diapo { margin-inline: 0; border-radius: 0; }
  .cab-diapo__vue { aspect-ratio: 4 / 5; min-height: 420px; }
  .cab-diapo__video { display: none; }
  .cab-diapo__contenu { padding: var(--cab-s-5) var(--cab-page-pad) 70px; }
  .cab-diapo__actions { flex-direction: column; align-self: stretch; }
  .cab-diapo__actions .cab-btn { width: 100%; justify-content: center; }
  .cab-diapo__controles { right: var(--cab-page-pad); bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .cab-diapo__vue { transition: none; }
  .cab-diapo__video { display: none; }
}


/* ---------- Réassurance : quatre arguments, sans grille de tableau ---------- */

/* L'ancienne bande était une grille cloisonnée de filets, très administrative. Ici
   un fond doux, du volume, et rien qui sépare : ce sont quatre promesses, pas un
   tableau comparatif. */
.cab-reassure--doux {
  margin-block: var(--cab-s-3);
  border: 0;
  background: var(--cab-bg-soft);
  border-radius: 14px;
  padding: var(--cab-s-5) var(--cab-s-4);
  margin-inline: var(--cab-page-pad);
  gap: var(--cab-s-4);
}
.cab-reassure--doux .cab-reassure__item {
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  padding: 0; border: 0;
}
.cab-reassure--doux .cab-reassure__item svg {
  width: 30px; height: 30px;
  stroke: var(--cab-ink); fill: none; stroke-width: 1.3;
}
.cab-reassure--doux .cab-reassure__title {
  font-family: var(--cab-font-display);
  font-size: 20px; font-weight: 300; line-height: 1.2;
  letter-spacing: 0; text-transform: none;
}
.cab-reassure--doux .cab-reassure__sub {
  font-size: 14px; line-height: 1.5; color: var(--cab-muted); margin: 0;
  max-width: 30ch;
}

@media (max-width: 1023px) {
  .cab-reassure--doux { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cab-s-3); }
  .cab-reassure--doux .cab-reassure__item { border: 0; padding: 0; }
}
@media (max-width: 599px) {
  .cab-reassure--doux { grid-template-columns: 1fr; margin-inline: var(--cab-page-pad); padding: var(--cab-s-4) var(--cab-s-3); }
  /* Sur une colonne, la phrase reprend sa place : elle n'a plus à être sacrifiée. */
  .cab-reassure--doux .cab-reassure__sub { display: block; }
}

/* ---------- Lettre mensuelle : les champs dans la page ---------- */

.cab-newsletter__form { width: 100%; max-width: 640px; }
.cab-newsletter__champs { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: start; }
.cab-newsletter__champs .cab-champ:first-child { grid-column: 1; }
.cab-newsletter__champs .cab-champ:nth-child(2) { grid-column: 2; }
.cab-newsletter__champs .cab-champ { margin: 0; }
/* L'adresse prend toute la largeur : c'est le champ qui compte. */
.cab-newsletter__champs .cab-champ--large { grid-column: 1 / 3; }
.cab-newsletter__champs .cab-btn { grid-column: 3; grid-row: 2; height: var(--cab-control-h); }
.cab-newsletter__form .cab-input {
  width: 100%; height: var(--cab-control-h);
  padding: 0 16px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.08);
  color: var(--cab-on-ink); font-family: var(--cab-font-text); font-size: 15px;
}
.cab-newsletter__form .cab-input::placeholder { color: rgba(255, 255, 255, 0.62); }
.cab-newsletter__form .cab-input:focus-visible { outline: 2px solid var(--cab-on-ink); outline-offset: 2px; }
.cab-newsletter__retour { margin-top: 12px; font-size: 14px; }
/* L'erreur se détache du texte courant : un filet et un fond, pas seulement une teinte. */
.cab-newsletter__retour--erreur {
  padding: 10px 14px; border-radius: 10px;
  color: #ffe3e3; background: rgba(255, 90, 90, 0.14); border: 1px solid rgba(255, 160, 160, 0.5);
}
/* L'ancre #lettre ne doit pas glisser sous l'en-tête collant. */
.cab-newsletter { scroll-margin-top: calc(var(--cab-header-h-compact) + 16px); }

/* La confirmation remplace le formulaire : un cartouche blanc sur le bandeau noir,
   qui ne se confond ni avec le titre ni avec les mentions. */
.cab-newsletter__merci {
  display: flex; align-items: flex-start; gap: 16px;
  width: 100%; max-width: 640px;
  padding: 20px 24px; border-radius: 14px;
  background: var(--cab-bg); color: var(--cab-ink);
}
@media (prefers-reduced-motion: no-preference) {
  .cab-newsletter__merci {
    animation: cab-merci 360ms cubic-bezier(0.23, 1, 0.32, 1) both;
  }
}
@keyframes cab-merci {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
}
.cab-newsletter__merci-picto {
  flex-shrink: 0; width: 36px; height: 36px; padding: 8px; border-radius: 50%;
  background: var(--cab-ink); color: var(--cab-on-ink);
  stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.cab-newsletter__merci-titre {
  margin: 4px 0 4px; font-family: var(--cab-font-display); font-size: 22px; font-weight: 400; line-height: 1.2;
}
.cab-newsletter__merci-texte { margin: 0; font-size: 14px; line-height: 1.5; color: var(--cab-muted); }
.cab-newsletter__mentions { margin-top: 12px; font-size: 12px; opacity: 0.7; }
/* Le champ piège n'est jamais montré, et jamais annoncé aux lecteurs d'écran. */
.cab-piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 599px) {
  .cab-newsletter__champs { grid-template-columns: 1fr; }
  .cab-newsletter__champs .cab-champ--large { grid-column: 1; }
  .cab-newsletter__champs .cab-btn { grid-column: 1; grid-row: auto; height: var(--cab-control-h); }
}

/* ---------- Réseaux sociaux du pied de page ---------- */

.cab-footer__social { display: flex; align-items: center; gap: 14px; }
.cab-social {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--cab-line); color: inherit;
  transition: background var(--cab-t-fast), color var(--cab-t-fast), border-color var(--cab-t-fast);
}
.cab-social:hover, .cab-social:focus-visible { background: var(--cab-ink); color: var(--cab-on-ink); border-color: var(--cab-ink); text-decoration: none; }
.cab-social svg { width: 18px; height: 18px; }
.cab-footer__signature { display: block; margin-top: 4px; font-size: 12px; color: var(--cab-muted); }
.cab-footer__signature a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Carte atelier entièrement cliquable ---------- */

.cab-expcard { position: relative; }
.cab-expcard__title a { text-decoration: none; }
.cab-expcard__title a::after { content: ""; position: absolute; inset: 0; }
.cab-expcard:hover .cab-expcard__cta { background: var(--cab-ink); color: var(--cab-on-ink); border-color: var(--cab-ink); }

/* ---------- Pages boutique ---------- */

.cab-boutique__tete { text-align: center; padding-top: var(--cab-s-4); }
.cab-boutique__titre {
  font-family: var(--cab-font-display); font-weight: 300;
  font-size: clamp(32px, 3.6vw, 50px); line-height: 1.12;
  margin: 0;
}
.cab-boutique__texte { max-width: min(100%, 980px); margin: 14px auto 0; color: var(--cab-muted); font-size: 15px; line-height: 1.6; }
/* Le texte long est replié : il compte pour les moteurs, pas au-dessus du catalogue. */
.cab-boutique__texte--repliable p {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.cab-boutique__texte--repliable.is-ouvert p { display: block; }
.cab-boutique__plus {
  margin-top: 6px; background: none; border: 0; padding: 0; cursor: pointer;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; color: var(--cab-ink);
  text-decoration: underline; text-underline-offset: 4px;
}

.cab-rayon { scroll-margin-top: calc(var(--cab-header-h-compact) + 64px); }
.cab-rayon + .cab-rayon { margin-top: var(--cab-s-5); }
.cab-rayon .cab-section__head { margin-bottom: var(--cab-s-3); }

.cab-autres-rayons { margin-top: var(--cab-s-5); padding-top: var(--cab-s-4); border-top: 1px solid var(--cab-line); text-align: center; }
.cab-autres-rayons__titre { font-family: var(--cab-font-display); font-weight: 300; font-size: 24px; margin: 0 0 18px; }
.cab-autres-rayons__liste { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

@media (max-width: 767px) {
  .cab-rayon + .cab-rayon { margin-top: var(--cab-s-4); }
}

.cab-ariane {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-bottom: 14px;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; color: var(--cab-muted);
}
.cab-ariane a { text-decoration: none; }
.cab-ariane a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cab-ariane__sep { opacity: 0.5; }
.cab-filtres__compte { font-size: var(--cab-fs-label); color: var(--cab-muted); }
.cab-filtres__compte .woocommerce-result-count { margin: 0; }

/* ---------- Barre de rayon, collante ---------- */

.cab-barrerayon {
  position: fixed; left: 0; right: 0; z-index: 40;
  top: var(--cab-header-h-compact); /* valeur de départ : le script la recale sur l'en-tête réel */
  background: var(--cab-bg);
  border-bottom: 1px solid var(--cab-line);
  opacity: 0; transform: translateY(-8px);
  transition: opacity 200ms ease, transform 200ms ease;
  pointer-events: none;
}
.cab-barrerayon.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.cab-barrerayon[hidden] { display: none; }
.cab-barrerayon__inner {
  display: flex; align-items: center; justify-content: space-between; gap: var(--cab-s-3);
  min-height: 56px; padding-block: 8px;
}

.cab-barrerayon__nom { display: none; align-items: center; gap: 12px; }
.cab-barrerayon__nom.is-active { display: inline-flex; }
.cab-barrerayon__nom > span {
  font-family: var(--cab-font-display); font-size: 20px; font-weight: 300; line-height: 1;
}
.cab-barrerayon__nom svg { width: 24px; height: 24px; stroke: var(--cab-ink); fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }

.cab-barrerayon__autres { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; justify-content: flex-end; }
.cab-barrerayon__lien {
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; text-decoration: none; white-space: nowrap;
}
.cab-barrerayon__lien:hover { text-decoration: underline; text-underline-offset: 4px; }
.cab-barrerayon__lien[hidden] { display: none; }

@media (max-width: 1023px) {
  .cab-barrerayon__inner { gap: 12px; }
  .cab-barrerayon__nom .cab-btn { display: none; }
  .cab-barrerayon__nom > span { font-size: 17px; }
  .cab-barrerayon__autres { gap: 14px; overflow-x: auto; flex-wrap: nowrap; }
}
@media (max-width: 599px) {
  .cab-barrerayon__nom > span { display: none; }
}

/* ---------- Haut de la fiche produit (référence Flamingo Estate) ---------- */

/* La colonne d'achat est montée par Blocksy et WooCommerce, chacun posant ses blocs
   dans son ordre. Plutôt que de démonter leurs accroches pour les remonter ailleurs,
   on les laisse sortir et on les range ici. */
.single-product .entry-summary { display: flex; flex-direction: column; }
.single-product .entry-summary > * { order: 50; }
.single-product .cab-fiche__ariane   { order: 1; }
.single-product .cab-fiche__badges   { order: 2; }
.single-product .product_title       { order: 3; }
.single-product .cab-fiche__mesure   { order: 4; }
.single-product .cab-xp__reperes     { order: 4; }
.single-product .cab-xp__compris     { order: 9; }
.single-product .woocommerce-product-details__short-description { order: 5; }
.single-product .entry-summary .price { order: 6; }
.single-product .cab-fiche__dispo    { order: 7; }
.single-product .ct-product-add-to-cart,
.single-product form.cart            { order: 8; }
.single-product .cab-reassure--inline { order: 9; }
.single-product .product_meta        { order: 9; }
.single-product .cab-avis-invite     { order: 10; }
/* Les filets de Blocksy se placeraient au hasard dans ce nouvel ordre. */
.single-product .entry-summary .ct-product-divider { display: none; }

.cab-fiche__ariane { margin: 0 0 14px; text-align: left; justify-content: flex-start; }
.cab-fiche__badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.single-product .product_title { margin: 0 0 10px; }
.cab-fiche__mesure {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin: 0 0 18px;
  font-size: 14px; color: var(--cab-muted);
}
.cab-fiche__note { display: inline-flex; align-items: center; gap: 6px; }
.cab-fiche__note svg { width: 15px; height: 15px; fill: var(--cab-ink); stroke: none; }
.single-product .entry-summary .price { margin: 0 0 14px; }
.single-product .cab-buy__unit { display: block; margin-top: 6px; font-size: 13px; color: var(--cab-muted); }
.single-product .woocommerce-product-details__short-description { margin: 4px 0 24px; }
.single-product .cab-fiche__dispo {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 20px; font-size: 14px; color: var(--cab-muted);
}
/* La pastille verte de la disponibilité : le seul point de couleur toléré, et il dit
   quelque chose — la commande part. */
.single-product .cab-fiche__dispo::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: #2f7a4f; flex-shrink: 0;
}
.single-product .cab-reassure--inline { margin-top: 24px; }

/* C'est la photo qui reste, pas la colonne.
   La colonne d'achat porte maintenant tout : description, réassurance, catégories et
   les cinq volets. Collée, elle s'arrêtait au premier écran et on ne pouvait plus la
   lire jusqu'au bout. La photo, elle, n'a qu'une hauteur : elle peut tenir en place
   pendant qu'on parcourt le reste. */
@media (min-width: 1000px) {
  .single-product .woocommerce-product-gallery {
    position: sticky;
    top: calc(var(--cab-header-h-compact) + 24px);
    align-self: start;
  }
  /* Une photo plus haute que l'écran ne peut pas tenir en place : le navigateur la
     colle par le haut et en coupe le bas tant qu'on défile. On la plafonne à ce qui
     reste de hauteur visible sous l'en-tête. */
  .single-product .flexy-view,
  .single-product .woocommerce-product-gallery > .ct-product-gallery-container > .ct-media-container {
    max-height: calc(100vh - var(--cab-header-h-compact) - 48px);
  }
  .single-product .flexy-view img,
  .single-product .woocommerce-product-gallery > .ct-product-gallery-container > .ct-media-container img {
    height: 100%; object-fit: cover;
  }
}

/* La galerie : les vignettes passent sur le côté, la photo garde la place. */
@media (min-width: 1000px) {
  .single-product .flexy-container {
    display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 16px; align-items: start;
  }
  .single-product .flexy-container > .flexy { grid-column: 2; grid-row: 1; }
  .single-product .flexy-pills { grid-column: 1; grid-row: 1; margin: 0; }
  .single-product .flexy-pills ol {
    display: flex; flex-direction: column; gap: 10px;
    margin: 0; padding: 0; list-style: none;
  }
  .single-product .flexy-pills ol li { width: 76px; margin: 0; padding: 0; }
}
.single-product .flexy-pills ol li img { border-radius: 6px; }
.single-product .flexy-view img { border-radius: 10px; }

/* Les flèches de Blocksy existent déjà : on les rend visibles au survol, en noir. */
.single-product .flexy-arrow-prev,
.single-product .flexy-arrow-next {
  opacity: 0; transition: opacity var(--cab-t-fast);
  color: var(--cab-ink);
}
.single-product .flexy:hover .flexy-arrow-prev,
.single-product .flexy:hover .flexy-arrow-next,
.single-product .flexy-arrow-prev:focus-visible,
.single-product .flexy-arrow-next:focus-visible { opacity: 1; }

/* ---------- Fiche produit : la photo prend la place qui lui revient ---------- */

/* Blocksy coupe la fiche en deux moitiés égales. Sur les références, la photo occupe
   presque les deux tiers : c'est elle qui donne envie, la colonne d'achat n'a besoin
   que de sa largeur de lecture.

   Blocksy pose cette largeur avec « var(--product-gallery-width, 50%) » : on règle la
   variable plutôt que de refaire sa mise en page. Une première version la remplaçait
   par une grille, et perdait — son sélecteur passe par « :has() », qui compte pour
   trois classes. */
.single-product .product-entry-wrapper { --product-gallery-width: 62%; }
@media (min-width: 1000px) {
  .single-product .product-entry-wrapper { gap: 56px; }
}

/* Le bouton d'achat suit le modèle du site : une pilule, comme partout ailleurs. */
.single-product .single_add_to_cart_button,
.single-product .ct-product-add-to-cart .button { border-radius: 999px; }
.single-product .quantity { border-radius: 999px; }

/* ---------- Les informations complémentaires, en lignes repliées ---------- */

/* Dans la colonne, l'accordéon se fait discret : un filet, un intitulé en petites
   capitales, un signe à droite. Le titre de 19 px du kit, lui, était fait pour la
   pleine largeur. */
.single-product .entry-summary .cab-accs {
  order: 9;
  margin-top: 28px;
  border-top: 1px solid var(--cab-line);
}
.single-product .entry-summary .cab-acc { border-bottom: 1px solid var(--cab-line); }
.single-product .entry-summary .cab-acc__heading { margin: 0; }
.single-product .entry-summary .cab-acc__btn { padding: 16px 0; cursor: pointer; }
.single-product .entry-summary .cab-acc__title {
  font-family: var(--cab-font-text);
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase;
}
.single-product .entry-summary .cab-acc__panel { padding: 0 0 18px; }

/* Les « plus produits » sur deux colonnes, entre deux filets, comme sur la maquette
   Produit-desktop. Les quatre lignes sont courtes : une seule colonne les étirait. */
.single-product .entry-summary .cab-reassure--inline {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px;
  padding: 18px 0;
  border-top: 1px solid var(--cab-line);
  border-bottom: 1px solid var(--cab-line);
  font-size: 13px;
}
.single-product .entry-summary .cab-reassure__item { align-items: center; }
@media (max-width: 600px) {
  .single-product .entry-summary .cab-reassure--inline { grid-template-columns: 1fr; }
}

/* Les angles arrondis valent pour toute photo de fiche, pas seulement pour celles
   d'un diaporama : un produit qui n'a qu'une image sort par « figure.ct-media-container »
   et non par « .flexy-view », et gardait ses angles droits. */
.single-product .woocommerce-product-gallery img,
.single-product .ct-media-container { border-radius: 10px; overflow: hidden; }

/* Les miniatures restent collées en haut à gauche, quelle qu'en soit la hauteur. */
.single-product .flexy-pills { align-self: start; justify-self: start; }
.single-product .flexy-pills ol { align-items: flex-start; }
.single-product .flexy-pills ol li img { border-radius: 6px; }

/* Le champ de quantité est la boîte qu'on voit : c'est lui qui porte le trait et
   l'arrondi. Blocksy le fixe en « !important », mais depuis une variable : on règle la
   variable, pour cette boîte seulement, plutôt que de surenchérir. */
.single-product .quantity { --theme-form-field-border-radius: 999px; }

/* Les miniatures s'alignent sur le menu de l'en-tête.

   Blocksy centre la fiche dans un conteneur de largeur fixe, ce qui laissait 75 px de
   marge quand l'en-tête en laisse 56 : la colonne de miniatures commençait 19 px plus à
   droite que « Boutique », et l'œil le voyait. On aligne la fiche sur la même marge.

   « --cab-largeur-page » est mesurée en JavaScript sur clientWidth : « 100vw » compte
   la barre de défilement et décalerait tout d'une poignée de pixels. */
.single-product .product-entry-wrapper {
  width: calc(var(--cab-largeur-page, 100vw) - 2 * var(--cab-page-pad));
  max-width: none;
}

/* Blocksy garde sa propre ligne de catégories, que WooCommerce ne rend plus. Elle
   répète le fil d'Ariane du haut de colonne ; on la laisse dans le code pour les
   robots et on cesse de l'afficher. */
.single-product .entry-summary .product_meta { display: none; }

/* ---------- Les recettes d'une fiche produit ---------- */

.cab-recettes {
  position: relative;
  margin: 72px var(--cab-page-pad) 0;
}
.cab-recette {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--cab-bg-soft);
  border-radius: 10px; overflow: hidden;
}
.cab-recette__texte {
  display: flex; flex-direction: column; gap: 16px; justify-content: center;
  padding: 56px 64px;
}
.cab-recette__titre {
  margin: 0;
  font-family: var(--cab-font-display); font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 300; line-height: 1.15;
}
.cab-recette__corps { font-size: 14px; line-height: 1.65; }
.cab-recette__corps > :first-child { margin-top: 0; }
.cab-recette__corps > :last-child { margin-bottom: 0; }
/* Une recette sans photo ne garde pas une moitié vide. */
.cab-recette--sans-photo { grid-template-columns: 1fr; }
.cab-recette__media { position: relative; min-height: 340px; }
.cab-recette__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Plusieurs recettes : une par écran, qui défilent. */
.cab-recettes__piste {
  display: grid; grid-auto-flow: column; grid-auto-columns: 100%;
  gap: 20px;
  overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.cab-recettes__piste::-webkit-scrollbar { display: none; }
.cab-recettes__piste > .cab-recette { scroll-snap-align: start; }

.cab-recettes__nav {
  position: absolute; inset: 0; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 14px; pointer-events: none;
  opacity: 0; transition: opacity var(--cab-t-fast);
}
.cab-recettes:hover .cab-recettes__nav,
.cab-recettes:focus-within .cab-recettes__nav { opacity: 1; }
.cab-recettes__fleche {
  pointer-events: auto;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--cab-bg); border: 1px solid var(--cab-line);
  cursor: pointer; color: var(--cab-ink);
}
.cab-recettes__fleche svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cab-recettes__fleche[disabled] { opacity: 0; pointer-events: none; }

@media (max-width: 899px) {
  .cab-recette { grid-template-columns: 1fr; }
  .cab-recette__texte { padding: 32px 24px; }
  .cab-recette__media { min-height: 240px; order: -1; }
}

/* Les photos se remplacent en fondu. Les vues s'empilent dans la même case de grille,
   la transformation de Blocksy est neutralisée, et seule l'opacité bouge. */
.single-product .cab-galerie-fondu .flexy-items { display: grid; }
.single-product .cab-galerie-fondu .flexy-item {
  grid-area: 1 / 1;
  transform: none !important;
  opacity: 0; pointer-events: none;
  transition: opacity 420ms ease;
}
.single-product .cab-galerie-fondu .flexy-item.cab-visible { opacity: 1; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
  .single-product .cab-galerie-fondu .flexy-item { transition: none; }
}

/* ---------- Le bloc d'avis de la fiche ---------- */

.cab-avis-bloc { margin: 72px var(--cab-page-pad) 0; }
.cab-avis-bloc .cab-section__title { margin-bottom: 28px; }
.cab-avis__grille {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px;
}
@media (max-width: 1099px) { .cab-avis__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 699px)  { .cab-avis__grille { grid-template-columns: 1fr; } }
.cab-avis__carte {
  display: flex; flex-direction: column; gap: 16px;
  margin: 0; padding: 28px;
  border: 1px solid var(--cab-line); border-radius: 10px;
}
.cab-avis__etoiles { display: flex; gap: 2px; }
.cab-avis__etoiles svg { width: 14px; height: 14px; fill: var(--cab-ink); stroke: none; }
.cab-avis__texte {
  margin: 0;
  font-family: var(--cab-font-display); font-size: 19px; font-weight: 300; line-height: 1.4;
}
.cab-avis__source { margin-top: auto; display: flex; flex-direction: column; gap: 2px; }
.cab-avis__auteur { font-size: 13px; font-weight: 600; }
/* L'origine se lit toujours : on ne cite personne sans dire d'où on le tient. */
.cab-avis__origine { font-size: 12px; color: var(--cab-muted); }
.cab-avis__invite {
  display: flex; flex-direction: column; gap: 14px; justify-content: center; align-items: flex-start;
  padding: 28px; border-radius: 10px; background: var(--cab-bg-soft);
}
.cab-avis__invite p { margin: 0; font-size: 14px; line-height: 1.5; }
.cab-avis__invite-titre { font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; line-height: 1.3; }

/* La mention sous un bloc de témoignages : d'où ils viennent, en toutes lettres. */
.cab-avis__mention { margin: 18px 0 0; font-size: 12px; color: var(--cab-muted); }
.cab-avis__mention a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Le texte des volets, remis en forme ---------- */

/* Les descriptions viennent de cinq ans de saisie : des titres en dur, du gras partout,
   des listes qui mélangent les arguments et les ingrédients. On ne réécrit pas les
   textes de Juliette, mais on cesse de leur appliquer les tailles de titre du thème —
   un « Les Plus de Notre Mélange » en 24 px gras au milieu d'un volet de colonne. */
.single-product .cab-acc__panel h1,
.single-product .cab-acc__panel h2,
.single-product .cab-acc__panel h3,
.single-product .cab-acc__panel h4,
.single-product .cab-acc__panel h5,
.single-product .cab-acc__panel h6 {
  margin: 20px 0 8px;
  font-family: var(--cab-font-display);
  font-size: 16px; font-weight: 400; line-height: 1.3;
  letter-spacing: normal; text-transform: none;
}
.single-product .cab-acc__panel > :first-child { margin-top: 0; }
.single-product .cab-acc__panel > :last-child { margin-bottom: 0; }
.single-product .cab-acc__panel p { margin: 0 0 12px; }
.single-product .cab-acc__panel strong,
.single-product .cab-acc__panel b { font-weight: 600; }
.single-product .cab-acc__panel ul,
.single-product .cab-acc__panel ol,
.single-product .entry-summary .cab-acc__panel ul,
.single-product .entry-summary .cab-acc__panel ol {
  margin: 0 0 14px; padding-left: 20px; list-style-position: outside;
}
.single-product .cab-acc__panel ul { list-style-type: disc; }
.single-product .cab-acc__panel li { margin: 0 0 4px; }
.single-product .cab-acc__panel li::marker { color: var(--cab-muted); }
.single-product .cab-acc__panel table { width: 100%; border-collapse: collapse; font-size: 13px; }
.single-product .cab-acc__panel th,
.single-product .cab-acc__panel td {
  padding: 8px 0; text-align: left; vertical-align: top;
  border-bottom: 1px solid var(--cab-line);
}
.single-product .cab-acc__panel th { font-weight: 600; width: 40%; }

/* ---------- Les pastilles passent sur la photo ---------- */

/* Elles étaient sur la miniature de gauche, là où elles gênaient la lecture des
   vignettes et où on ne les voyait pas. Elles se posent en haut à droite de la grande
   photo, en pilules, comme tous les autres repères du site. */
@media (max-width: 999px) {
  .single-product .woocommerce-product-gallery { position: relative; }
}
.single-product .woocommerce-product-gallery .onsale,
.single-product .flexy-pills .onsale { display: none; }

.cab-fiche__badges--photo {
  position: absolute; top: 16px; right: 16px; z-index: 3;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
  margin: 0; pointer-events: none;
}
.cab-fiche__badges .cab-badge { border-radius: 999px; }

/* Le formulaire d'avis, sous les cartes. */
.cab-avis__formulaire { margin-top: 36px; max-width: 680px; }
.cab-avis__formulaire .comment-reply-title { font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; }
.cab-avis__formulaire .comment-form input[type="text"],
.cab-avis__formulaire .comment-form input[type="email"],
.cab-avis__formulaire .comment-form textarea { width: 100%; }
.cab-avis__formulaire .comment-form-rating { margin-bottom: 14px; }
.cab-avis__formulaire .form-submit input { border-radius: 999px; }

/* Le formulaire de devis reprend celui du contact, avec deux ajouts : des lignes à
   deux champs — nom et structure, e-mail et téléphone vont par paires — et une
   colonne plus large, parce qu'il pose neuf questions au lieu de cinq. */
.cab-contact--devis { max-width: 720px; }
.cab-contact__duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cab-s-3); }
.cab-contact__duo .cab-field { margin: 0; }
.cab-contact .cab-field { margin: 0; }
.cab-contact select.cab-input { appearance: none; background-image: none; }
.cab-contact__mention { margin: 0; font-size: 12px; color: var(--cab-muted); }
@media (max-width: 600px) {
  .cab-contact__duo { grid-template-columns: 1fr; }
}

/* Le hub des expériences suit le gabarit des pages de rayon : en-tête centré, cartes
   de catégorie, puis la grille annoncée par son titre. */
.cab-hub__tete-grille { margin-top: 56px; margin-bottom: 8px; }
.cab-hub.cab-section--rayons { margin-top: 32px; }

/* ---------- Le tunnel de commande, sur la maquette Checkout ---------- */

/* Les pictos de l'en-tête n'avaient aucune taille : « cabane_icone » ne pose que la
   classe, et sans règle un SVG occupe toute la place qu'on lui laisse. La flèche de
   retour et le cadenas remplissaient donc la moitié de la barre. */
.cab-checkout-header svg { width: 16px; height: 16px; flex: 0 0 16px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cab-checkout-header__secure svg { stroke-width: 1.4; }

/* Les trois temps de la commande, numérotés. */
.cab-etape {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px;
  margin: 0 0 20px;
}
.cab-etape__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; flex: 0 0 26px;
  border: 1px solid var(--cab-ink); border-radius: 50%;
  font-size: 12px; font-weight: 600; line-height: 1;
  align-self: center;
}
.cab-etape__titre {
  margin: 0;
  font-family: var(--cab-font-display); font-size: 24px; font-weight: 300; line-height: 1.2;
}
.cab-etape__aparte { margin: 0; margin-left: auto; font-size: 13px; color: var(--cab-muted); }
.cab-etape__lien { text-decoration: underline; text-underline-offset: 3px; }
.cab-etape--paiement { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--cab-line); }

/* L'étape 2 vit dans le tableau du récapitulatif, là où WooCommerce la calcule. */
.cab-etape-ligne td { padding: 22px 0 6px; border: 0; }
.cab-etape-ligne .cab-etape { margin: 0; }
.cab-etape-ligne .cab-etape__titre { font-size: 20px; }

/* WooCommerce garde ses propres titres : on ne veut pas les deux. */
.cab-tunnel #customer_details h3,
.cab-tunnel #order_review_heading { display: none; }

/* Le récapitulatif : une photo, un nom, une contenance, un prix. */
.cab-recap__ligne { display: flex; align-items: flex-start; gap: 14px; }
.cab-recap__media { flex: 0 0 56px; }
.cab-recap__media img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; display: block; }
.cab-recap__texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cab-recap__nom { font-family: var(--cab-font-display); font-size: 16px; line-height: 1.25; }
.cab-recap__sous { font-size: 12px; color: var(--cab-muted); }
.cab-recap__qte { display: inline-block; margin-left: 6px; font-size: 13px; color: var(--cab-muted); }
.cab-tunnel .shop_table td, .cab-tunnel .shop_table th { padding: 14px 0; vertical-align: top; }

/* Chaque mode de livraison : ce que c'est, ce que ça implique, combien ça coûte. */
.cab-tunnel #shipping_method li { margin: 0 0 4px; padding: 0; list-style: none; }
.cab-tunnel #shipping_method label { display: block; width: 100%; cursor: pointer; }
.cab-livraison { display: block; padding-left: 2px; }
.cab-livraison__haut { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.cab-livraison__nom { font-size: 14px; }
.cab-livraison__prix { font-size: 14px; font-weight: 600; white-space: nowrap; }
.cab-livraison__note { display: block; margin-top: 2px; font-size: 12px; line-height: 1.45; color: var(--cab-muted); }

/* L'étape 2 s'annonce déjà : « Expédition » par-dessus faisait deux titres. C'est
   Blocksy qui l'écrit, dans un div à lui — pas WooCommerce dans un en-tête de ligne. */
.cab-tunnel .ct-shipping-heading { display: none; }
.cab-tunnel .woocommerce-shipping-totals > td { padding-top: 0; }

/* Le bouton radio et son intitulé sur la même ligne : un intitulé en bloc renvoyait le
   rond tout seul au-dessus. */
.cab-tunnel #shipping_method li { display: flex; align-items: flex-start; gap: 10px; }
.cab-tunnel #shipping_method li input[type="radio"] { margin-top: 3px; flex: 0 0 auto; }

/* La quantité se pose sur la photo, comme sur la maquette, au lieu de tomber dessous. */
.cab-tunnel td.product-name { position: relative; }
.cab-recap__qte {
  position: absolute; top: 8px; left: 0;
  margin: 0; padding: 1px 7px;
  background: var(--cab-ink); color: var(--cab-on-ink);
  border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 1.5;
}

/* ---------- Fiche expérience ---------- */

/* Les quatre repères, sous le titre : ils remplacent la contenance et le prix au
   100 g, qui n'ont aucun sens pour un repas partagé. */
.cab-xp__reperes {
  display: flex; flex-wrap: wrap; gap: 8px 18px;
  margin: 0 0 20px; padding: 0; list-style: none;
  font-size: 14px; color: var(--cab-muted);
}
.cab-xp__reperes li { display: flex; align-items: center; gap: 8px; }
.cab-xp__reperes li + li::before { content: "·"; margin-right: 10px; }

.cab-xp__compris {
  margin-top: 22px; padding: 18px 20px;
  background: var(--cab-bg-soft); border-radius: 10px;
}
.cab-xp__compris p { margin: 0; font-size: 14px; line-height: 1.6; }
.cab-xp__compris .cab-label { margin-bottom: 6px; color: var(--cab-muted); }

/* « Comment ça se passe » : le déroulé, heure par heure. */
.cab-deroule {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px;
  margin: 0; padding: 0; list-style: none;
  counter-reset: etape;
}
.cab-deroule__etape { padding-top: 20px; border-top: 1px solid var(--cab-ink); }
.cab-deroule__heure {
  display: block; margin-bottom: 10px;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; font-weight: 600;
}
.cab-deroule__titre {
  margin: 0 0 8px;
  font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; line-height: 1.2;
}
.cab-deroule__texte { margin: 0; font-size: 14px; line-height: 1.65; color: var(--cab-muted); }

/* « Où nous trouver » : pas de carte tierce, juste ce qu'il faut pour venir. */
.cab-xp-lieu__corps {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 40px;
  padding: 32px; background: var(--cab-bg-soft); border-radius: 10px;
}
.cab-xp-lieu__corps p { margin: 0 0 6px; font-size: 14px; line-height: 1.6; }
.cab-xp-lieu__nom { font-family: var(--cab-font-display); font-size: 20px; font-weight: 300; }
.cab-xp-lieu__corps .cab-btn { margin-top: 14px; }
.cab-xp-lieu__contact .cab-label { color: var(--cab-muted); margin-bottom: 8px; }
.cab-xp-lieu__contact a { text-decoration: underline; text-underline-offset: 3px; }

/* Les questions fréquentes reprennent les volets de la fiche produit. */
.cab-xp-faq .cab-accs { max-width: 760px; border-top: 1px solid var(--cab-line); }
.cab-xp-faq .cab-acc { border-bottom: 1px solid var(--cab-line); }
.cab-xp-faq .cab-acc__heading { margin: 0; }

@media (max-width: 899px) {
  .cab-deroule { grid-template-columns: 1fr; gap: 24px; }
  .cab-xp-lieu__corps { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
}

/* ---------- Page Groupes ---------- */

.cab-groupes__carte {
  display: flex; flex-direction: column; gap: 8px;
  padding: 26px; background: var(--cab-bg-soft); border-radius: 10px;
}
.cab-groupes__carte .cab-label { color: var(--cab-muted); }
.cab-groupes__titre {
  margin: 0;
  font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; line-height: 1.2;
}
.cab-groupes__carte p { margin: 0; font-size: 14px; line-height: 1.6; }

.cab-groupes__colonnes {
  display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 48px;
  align-items: start;
}
.cab-groupes__etapes { margin: 0; padding-left: 20px; display: grid; gap: 12px; }
.cab-groupes__etapes li { font-size: 15px; line-height: 1.6; }
.cab-groupes__aparte {
  padding: 26px; background: var(--cab-bg-soft); border-radius: 10px;
}
.cab-groupes__aparte p { margin: 0 0 6px; font-size: 14px; line-height: 1.6; }
.cab-groupes__aparte .cab-label { margin-top: 18px; color: var(--cab-muted); }
.cab-groupes__aparte .cab-label:first-child { margin-top: 0; }
.cab-groupes__tel a {
  font-family: var(--cab-font-display); font-size: 22px; font-weight: 300;
  text-decoration: underline; text-underline-offset: 4px;
}
@media (max-width: 899px) {
  .cab-groupes__colonnes { grid-template-columns: 1fr; gap: 28px; }
}

/* La page La ferme déborde de la colonne de lecture.

   Blocksy limite le contenu d'une page éditoriale à 742 px : c'est la bonne largeur
   pour un paragraphe, pas pour une photo de 460 px avec du texte à côté, ni pour trois
   cartes de front. Les sections de cette page reprennent la largeur de la page, comme
   la boutique — le texte courant, lui, garde sa colonne étroite. */
.cab-page-ferme .entry-content > .cab-ferme__bloc {
  width: calc(var(--cab-largeur-page, 100vw) - 2 * var(--cab-page-pad));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}
.cab-page-ferme .cab-ferme__texte { max-width: 62ch; }
@media (max-width: 899px) {
  .cab-page-ferme .entry-content > .cab-ferme__bloc {
    width: auto; margin-left: 0; transform: none;
  }
}

/* ---------- La ferme, sur la planche Ferme-desktop ---------- */

/* Le bandeau reprend le cadre du diaporama d'accueil : posé dans la page, angles
   arrondis, pas collé aux bords de l'écran. Toutes les pages éditoriales le
   partagent, pour qu'on passe de La ferme à Groupes sans changer de monde. */
.cab-hero--page {
  margin: 12px var(--cab-page-pad) 0;
  min-height: 380px;
  border-radius: 14px;
  overflow: hidden;
  display: flex; align-items: flex-end;
  isolation: isolate;
}
.cab-page-ferme .cab-hero--page { min-height: 520px; }
.cab-hero--page::after {
  /* Deux voiles : un léger en haut pour le fil d'Ariane, le grand en bas pour le titre. */
  background:
    linear-gradient(180deg, rgba(0,0,0,0.40) 0%, rgba(0,0,0,0) 18%),
    linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,0.32) 62%, rgba(0,0,0,0.74) 100%);
}
.cab-hero--page .cab-hero__title,
.cab-hero--page .cab-hero__lead { text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35); }
.cab-hero--page .cab-hero__content {
  width: 100%; max-width: none;
  margin: 0; padding: 0 clamp(24px, 4vw, 56px) clamp(28px, 4vw, 56px);
  text-align: left;
}
.cab-hero--page .cab-hero__title { max-width: 800px; }
.cab-hero--page .cab-hero__lead { max-width: 600px; }

/* Le sommaire court sur toute la largeur, sous un filet qui va d'un bord à l'autre. */
.cab-page-ferme .cab-subnav {
  display: flex; flex-wrap: wrap; gap: 28px;
  max-width: none; width: auto;
  margin: 28px 0 0; padding: 0 var(--cab-page-pad);
  border-bottom: 1px solid var(--cab-line);
}
.cab-page-ferme .cab-subnav a {
  padding: 14px 0; border-bottom: 2px solid transparent;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; font-weight: 600; color: var(--cab-muted);
}
/* L'entrée soulignée est celle de la section qu'on lit (assets/sommaire.js). */
.cab-page-ferme .cab-subnav a[aria-current] { color: var(--cab-ink); border-bottom-color: var(--cab-ink); }
.cab-page-ferme .cab-subnav a:hover { color: var(--cab-ink); text-decoration: none; }

/* Le contenu de cette page n'est pas une colonne de lecture : il occupe la page,
   marges comprises, comme la boutique. */
.cab-page-ferme .entry-content > .cab-ferme__bloc,
.cab-page-ferme .entry-content > .cab-ferme__bande,
.cab-page-ferme .entry-content > .cab-subnav-desactive {
  position: relative;
  width: calc(100vw - 2 * var(--cab-page-pad));
  max-width: none;
  left: 50%;
  transform: translateX(-50%);
}
/* La bande du séchoir, elle, va d'un bord à l'autre. */
.cab-page-ferme .entry-content > .cab-ferme__bande { width: 100vw; }
/* Le sommaire garde ses marges propres : sa règle de gauche part du bord de page. */
.cab-page-ferme .cab-subnav { padding-inline: 0; }
.cab-ferme__bloc { margin-top: 88px; scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.cab-ferme__bande { margin-top: 88px; scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }

.cab-ferme__titre {
  margin: 0 0 18px;
  font-family: var(--cab-font-display); font-size: clamp(28px, 3vw, 38px);
  font-weight: 300; line-height: 1.15;
}
.cab-ferme__entete {
  display: flex; align-items: baseline; justify-content: space-between; gap: 32px;
  flex-wrap: wrap; margin-bottom: 28px;
}
.cab-ferme__entete .cab-ferme__titre { margin: 0; }
.cab-ferme__chapeau { margin: 0; font-size: 13px; color: var(--cab-muted); }
.cab-ferme__texte { font-size: 15px; line-height: 1.7; max-width: 62ch; }
.cab-ferme__texte p { margin: 0 0 12px; }
.cab-ferme__liens { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin: 24px 0 0; }
.cab-ferme__lien-texte {
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; font-weight: 600;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.cab-ferme__lien-texte:hover { text-decoration: none; }

/* Juliette : le portrait à gauche, en 4/5. */
.cab-ferme__duo { display: grid; grid-template-columns: minmax(0, 520px) minmax(0, 1fr); gap: 72px; align-items: center; }
.cab-ferme__media img { width: 100%; height: auto; display: block; border-radius: 10px; }
.cab-ferme__media--portrait img { aspect-ratio: 4 / 5; object-fit: cover; }
.cab-ferme__colonne .cab-label { display: block; margin-bottom: 10px; color: var(--cab-muted); }

/* Les trois gestes : une photo, un titre, deux lignes. Pas de cadre. */
.cab-ferme__gestes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.cab-geste__media { position: relative; aspect-ratio: 4 / 3; background: var(--cab-bg-soft); border-radius: 10px; overflow: hidden; }
.cab-geste__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cab-geste__kicker {
  position: absolute; left: 14px; bottom: 12px;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; font-weight: 600; color: var(--cab-on-ink);
  text-shadow: 0 1px 6px rgba(0,0,0,0.5);
}
.cab-geste__titre { margin: 16px 0 6px; font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; }
.cab-geste p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--cab-muted); }

/* Le séchoir : la moitié noire à gauche, la photo à droite, d'un bord à l'autre. */
.cab-ferme__bande { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Sans photo, la bande ne garde pas une moitié vide. */
.cab-ferme__bande--sans-photo { grid-template-columns: 1fr; }
.cab-ferme__bande-texte {
  display: flex; flex-direction: column; justify-content: center;
  padding: clamp(32px, 4vw, 64px) clamp(24px, 4vw, 64px);
  background: var(--cab-ink); color: var(--cab-on-ink);
}
.cab-ferme__bande-texte .cab-label { color: var(--cab-on-ink-muted); margin-bottom: 10px; }
/* Blanc imposé : Blocksy repeint les titres en encre sombre, et « Là où tout se joue »
   disparaissait sur le noir. Le texte grandit aussi — à 15 px il flottait au milieu
   d'une demi-page noire au lieu de l'habiter. */
.cab-page-ferme .cab-ferme__bande-texte h2.cab-ferme__titre,
.cab-ferme__bande-texte .cab-ferme__titre { color: var(--cab-on-ink); }
/* Le retrait de 64 px que Blocksy pose au-dessus de ses titres creusait un trou entre
   « LE SÉCHOIR » et le titre. Il faut viser aussi précis que lui pour l'annuler. */
.cab-page-ferme .cab-ferme__bande-texte h2.cab-ferme__titre { margin-top: 0; }
.cab-ferme__bande-texte .cab-ferme__titre {
  font-size: clamp(32px, 3.4vw, 46px);
  /* Blocksy pose 64 px au-dessus de ses titres : ça creusait un trou entre
     « LE SÉCHOIR » et le titre, et ça gonflait la bande pour rien. */
  margin-top: 0; margin-bottom: 18px;
}
.cab-ferme__bande-texte .cab-ferme__texte {
  color: var(--cab-on-ink);
  /* Mesure large : à 52 signes, le texte laissait un tiers du panneau noir vide. */
  font-size: 16px; line-height: 1.7; max-width: 64ch;
}
.cab-ferme__bande-texte .cab-ferme__texte p { margin: 0 0 14px; }
.cab-ferme__bande-texte .cab-ferme__texte p:last-child { margin-bottom: 0; }
.cab-ferme__bande-texte .cab-ferme__liens { margin-top: 20px; }
.cab-ferme__bande-texte .cab-ferme__lien-texte { color: var(--cab-on-ink); }

/* Au survol, la photo laisse voir l'intérieur du séchoir. Une image posée par-dessus
   l'autre : les deux sont dans la page au chargement, rien n'est chargé au survol. */
.cab-ferme__bande-survol {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 420ms ease;
}
.cab-ferme__bande-media--double:focus-within .cab-ferme__bande-survol { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .cab-ferme__bande-survol { transition: none; }
}
.cab-ferme__bande-media { position: relative; min-height: 420px; background: var(--cab-bg-soft); }
.cab-ferme__bande-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Blocksy impose « height: auto » aux images du contenu : la photo du séchoir gardait
   ses proportions et laissait du blanc sous elle au lieu de tenir toute la bande. */
.cab-page-ferme .entry-content .cab-ferme__bande-media img { height: 100%; }

/* Où nous trouver : deux fiches côte à côte. Le bloc a quitté La ferme pour la page
   Contact, où l'on va quand on cherche une adresse. */
.cab-trouver { margin-top: 48px; }
.cab-trouver__titre { margin: 0 0 18px; font-family: var(--cab-font-display); font-size: clamp(24px, 2.4vw, 30px); font-weight: 300; }
.cab-trouver__fiches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.cab-trouver__fiche { padding: 20px 22px; border: 1px solid var(--cab-line); border-radius: 10px; }
.cab-trouver__fiche .cab-label { display: block; margin-bottom: 8px; color: var(--cab-muted); }
.cab-trouver__fiche p { margin: 0 0 4px; font-size: 14px; line-height: 1.55; }
.cab-trouver__adresse { font-family: var(--cab-font-display); font-size: 19px; font-weight: 300; }
.cab-trouver__fiche a { text-decoration: underline; text-underline-offset: 3px; }
.cab-trouver__note { margin: 18px 0 0; font-size: 14px; color: var(--cab-muted); }
@media (max-width: 767px) { .cab-trouver__fiches { grid-template-columns: 1fr; } }

/* Les revendeurs : quatre colonnes sous un filet. */
.cab-ferme__revendeurs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }

/* Ce qui pousse ici : les variétés en rangée défilante, sur le composant des rangées
   de produits. Une carte dépasse à droite, c'est ce qui dit qu'il y en a d'autres. */
.cab-slider--plantes .cab-plantes {
  display: flex; gap: 24px; margin: 0; padding: 0 0 8px; list-style: none;
}
.cab-plante {
  flex: 0 0 clamp(220px, 24vw, 280px);
  scroll-snap-align: start;
}
.cab-plante__media {
  position: relative; aspect-ratio: 4 / 5; margin-bottom: 14px;
  overflow: hidden; border-radius: 10px; background: var(--cab-bg-soft);
}
.cab-plante__media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 600ms cubic-bezier(0.23, 1, 0.32, 1);
}
/* Même mesure que pour la photo du séchoir : Blocksy impose « height: auto » aux
   images du contenu, et la photo flottait en haut d'un cadre trop grand. */
.cab-page-ferme .entry-content .cab-plante__media img { height: 100%; }
.cab-plante__nom {
  margin: 0 0 6px;
  font-family: var(--cab-font-display); font-size: 21px; font-weight: 300; line-height: 1.2;
}
.cab-plante__saveur {
  margin: 0 0 8px;
  font-size: var(--cab-fs-meta); color: var(--cab-muted); font-style: italic;
}
.cab-plante__texte { margin: 0; font-size: 14px; line-height: 1.6; }
.cab-plante__produits {
  display: inline-block; margin-top: 12px;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label);
  text-transform: uppercase; font-weight: 600;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
  text-decoration: none;
}
.cab-plante__produits:hover { text-decoration: none; opacity: 0.7; }

@media (max-width: 767px) {
  .cab-slider--plantes .cab-plantes { gap: 16px; }
  .cab-plante { flex-basis: 74vw; }
}
.cab-revendeur { padding-top: 16px; border-top: 1px solid var(--cab-ink); }
.cab-revendeur .cab-label { display: block; margin-bottom: 8px; color: var(--cab-muted); }
.cab-revendeur__nom { margin: 0; font-family: var(--cab-font-display); font-size: 18px; font-weight: 300; line-height: 1.3; }
.cab-revendeur__lieu { margin: 4px 0 0; font-size: 13px; color: var(--cab-muted); }

/* Dormir à la ferme, venir aider. */
.cab-ferme__sejours { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.cab-sejour { display: grid; grid-template-columns: minmax(0, 150px) minmax(0, 1fr); gap: 22px; align-items: center; padding: 20px; background: var(--cab-bg-soft); border-radius: 10px; }
.cab-sejour__media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 8px; display: block; }
.cab-sejour__titre { margin: 0 0 6px; font-family: var(--cab-font-display); font-size: 21px; font-weight: 300; }
.cab-sejour p { margin: 0 0 12px; font-size: 14px; line-height: 1.6; }

@media (max-width: 1023px) {
  .cab-ferme__gestes { grid-template-columns: 1fr; }
  .cab-ferme__revendeurs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cab-ferme__sejours { grid-template-columns: 1fr; }
}
@media (max-width: 899px) {
  .cab-hero--page { min-height: 300px; margin-inline: 0; border-radius: 0; }
  .cab-page-ferme .cab-hero--page { min-height: 340px; }
  .cab-page-ferme .entry-content > .cab-ferme__bloc,
  .cab-page-ferme .entry-content > .cab-ferme__bande,
  .cab-page-ferme .entry-content > .cab-subnav-desactive { width: auto; left: 0; transform: none; }
  .cab-ferme__duo { grid-template-columns: 1fr; gap: 28px; }
  .cab-ferme__bande { grid-template-columns: 1fr; }
  .cab-ferme__bande-media { min-height: 260px; }
  .cab-ferme__revendeurs { grid-template-columns: 1fr; }
  .cab-ferme__bloc, .cab-ferme__bande { margin-top: 56px; }
  .cab-page-ferme .cab-subnav { gap: 18px; overflow-x: auto; flex-wrap: nowrap; }
}

/* La barre d'annonce est figée à 32 px. Sur un téléphone, ses deux messages tiennent
   sur deux lignes et débordaient sous l'en-tête, coupés en travers. On la laisse
   grandir plutôt que de rogner le message. */
@media (max-width: 767px) {
  .cab-announce {
    height: auto; min-height: var(--cab-announce-h);
    padding-block: 5px; padding-inline: 16px;
    line-height: 1.4; text-align: center;
  }
}

/* La barre d'achat collante reprend le prix de la fiche, avec la ligne du prix au
   100 g qui s'y est glissée : « 6,50 €150 g · 4,33 € / 100 g » sur une barre de
   72 px. Elle ne garde que le prix. */
.cab-stickybuy .cab-buy__unit { display: none; }

/* Le fil d'Ariane des pages éditoriales, au-dessus du bandeau. */
.cab-ariane--page { padding-top: 20px; padding-bottom: 4px; }

/* Une page à bandeau démarre sa photo à 12 px du menu, comme le diaporama de
   l'accueil. Le fil d'Ariane s'installe dessus plutôt qu'au-dessus : posé avant,
   il creusait un vide de cent pixels entre l'en-tête et l'image. */
.cab-a-bandeau .site-main > .ct-container-full,
.cab-a-bandeau .site-main > .ct-container { padding-top: 0; }
.cab-ariane--hero {
  position: absolute; z-index: 2; top: 0; left: 0;
  justify-content: flex-start;
  margin: 0; padding: clamp(16px, 2vw, 24px) clamp(24px, 4vw, 56px);
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}
.cab-ariane--hero a,
.cab-ariane--hero [aria-current] { color: #ffffff; }
.cab-ariane--hero [aria-current] { opacity: 0.75; }

/* Le sommaire de La ferme se centre, et suit le défilement : six sections sur sept
   mille pixels, on doit pouvoir changer de section sans remonter. */
.cab-page-ferme .cab-subnav {
  position: sticky; top: var(--cab-header-h-compact); z-index: 30;
  justify-content: center;
  width: 100vw; max-width: none;
  margin-inline: calc(50% - 50vw) !important;
  padding-inline: var(--cab-page-pad);
  background: var(--cab-bg);
  border-bottom: 1px solid var(--cab-line);
}
@media (max-width: 899px) {
  .cab-page-ferme .cab-subnav { justify-content: flex-start; }
}

/* ---------- La ferme, relue le 24/09 ---------- */

/* « Qui suis-je » et son titre étaient séparés de 64 px : la règle des titres de page
   éditoriale (.cab-editorial .entry-content h2) passait devant celle de la ferme. Sur
   cette page, chaque titre est posé par sa section. */
.cab-page-ferme .entry-content h2.cab-ferme__titre,
.cab-page-ferme .entry-content h3.cab-geste__titre,
.cab-page-ferme .entry-content h3.cab-plante__nom,
.cab-page-ferme .entry-content h3.cab-sejour__titre { margin-top: 0; }
.cab-page-ferme .entry-content h3.cab-geste__titre { margin-top: 16px; }

/* Titres sans mot orphelin, paragraphes sans veuve. */
.cab-ferme__titre, .cab-geste__titre, .cab-plante__nom, .cab-sejour__titre { text-wrap: balance; }
.cab-ferme__texte p, .cab-geste p, .cab-plante__texte, .cab-sejour p { text-wrap: pretty; }

/* Survols réservés à la souris : sur un téléphone, le toucher déclenche le survol et le
   laisse collé — la photo restait agrandie, le séchoir restait ouvert. */
@media (hover: hover) and (pointer: fine) {
  .cab-plante:hover .cab-plante__media img { transform: scale(1.04); }
  .cab-ferme__bande-media--double:hover .cab-ferme__bande-survol { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .cab-plante__media img { transition: none; }
}

/* Un bouton répond au doigt : il s'enfonce d'un rien quand on appuie. */
.cab-btn { transition: background var(--cab-t-fast), color var(--cab-t-fast), border-color var(--cab-t-fast), transform 160ms cubic-bezier(0.23, 1, 0.32, 1); }
.cab-btn:active { transform: scale(0.97); }
@media (prefers-reduced-motion: reduce) {
  .cab-btn:active { transform: none; }
}

/* Sous 900 px, les sections collaient aux bords de l'écran : le texte partait du
   pixel zéro. Elles reprennent la marge de page ; seule la bande du séchoir reste
   d'un bord à l'autre, c'est son parti pris. */
@media (max-width: 899px) {
  .cab-page-ferme .entry-content > .cab-ferme__bloc { padding-inline: var(--cab-page-pad); }
  /* La rangée des variétés, elle, file jusqu'au bord droit : la carte coupée dit
     qu'il y en a d'autres. La première reste alignée sur le titre. */
  .cab-page-ferme .cab-slider--plantes .cab-plantes {
    margin-inline: calc(-1 * var(--cab-page-pad));
    padding-inline: var(--cab-page-pad);
    scroll-padding-inline: var(--cab-page-pad);
  }
  /* Le sommaire défile au doigt ; sa barre grise de défilement n'avait rien à faire là. */
  .cab-page-ferme .cab-subnav { scrollbar-width: none; }
  .cab-page-ferme .cab-subnav::-webkit-scrollbar { display: none; }
  .cab-page-ferme .cab-subnav a { flex-shrink: 0; }
}


/* ---------- Accueil, relu le 24/09 ---------- */

/* Au doigt, la pilule « Ajouter · prix » devait rester posée sous la photo. Mais elle
   vit dans le cadre de la photo, dont l'image est en position absolue : passée en
   « static », elle remontait en haut de l'image, sous la pastille « Promo » qui
   masquait « Ajouter ». On la pose au pied de la photo, toujours visible. */
@media (hover: none), (max-width: 767px) {
  .cab-card__media > .cab-card__action {
    position: absolute; top: auto; left: 10px; right: 10px; bottom: 10px;
    margin: 0;
  }
}

@media (max-width: 767px) {
  /* Les rayons s'empilaient un par écran : cinq photos de 430 px, 2 300 px à faire
     défiler avant le premier produit. Deux par ligne, comme le kit le prévoit pour
     les grilles de cinq ; le dernier, s'il est seul, prend la ligne entière. */
  .cab-section--rayons .cab-grid--stack-m { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .cab-section--rayons .cab-catcard:last-child:nth-child(odd) { grid-column: 1 / -1; aspect-ratio: 16 / 9; }

  /* La rangée pleine largeur partait du pixel zéro : la première vignette et son nom
     collaient au bord de l'écran. Au téléphone, elle reprend la marge de page. */
  .cab-slider.cab-slider--large ul.cab-slider__piste {
    padding-inline: var(--cab-page-pad);
    scroll-padding-inline: var(--cab-page-pad);
  }
}

/* Noms de rayons et titres de section sans mot seul en bout de ligne
   (« Sirop de / plantes »). */
.cab-catcard .cab-label, .cab-section__title, .cab-expcard__title, .cab-hero__title { text-wrap: balance; }

/* ---------- Vignettes produit au téléphone, relues le 24/09 ---------- */

/* Deux colonnes : le nom, le rayon et la description se chevauchaient et partaient
   sur la carte voisine. Le corps de carte est une colonne qui « wrap », et le titre
   y réclamait « flex-basis: 100% » — en colonne, c'est 100 % de la hauteur : le
   rayon et la description passaient dans une seconde colonne, hors de la carte.
   Le nom tient maintenant sur deux lignes au lieu d'être coupé d'une ellipse. */
@media (hover: none), (max-width: 767px) {
  .cab-card__body { flex-wrap: nowrap; }
  .cab-card__title {
    flex-basis: auto; white-space: normal;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  }
}

/* Le bouton d'ajout de WooCommerce prenait la police système : il n'hérite pas. */
.cab-btn, .cab-card__action .cab-btn { font-family: var(--cab-font-text); }

/* Sur une vignette étroite, « AJOUTER 7,50 € » ne tenait pas : le prix était coupé
   au bord de la photo. On garde le prix, précédé d'un +, et on laisse tomber le mot —
   le lien porte déjà « Ajouter au panier : … » pour les lecteurs d'écran. */
.cab-card__media { container-type: inline-size; }
@container (max-width: 240px) {
  .cab-card__action .cab-btn { height: 40px; padding: 0 12px; gap: 6px; font-size: 11px; letter-spacing: 0.04em; }
  .cab-card__action .cab-btn:has(.cab-btn__prix) { justify-content: center; }
  .cab-card__action .cab-btn:has(.cab-btn__prix) .cab-btn__label { display: none; }
  .cab-card__action .cab-btn__prix::before { content: "+\00a0"; }
}

/* La boutique, rangée par rayon, empilait ses 79 produits un par ligne au téléphone :
   38 000 px à faire défiler. Deux par ligne, comme dans chaque rayon. */
@media (max-width: 767px) {
  .cab-rayon ul.products.cab-grid--stack-m { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}

/* ---------- Pages éditoriales, relues le 24/09 ---------- */

/* Sous le bandeau, le premier paragraphe touchait la photo : zéro pixel entre les deux
   (Juliette, Le séchoir). Le sommaire de La ferme a déjà sa propre marge. */
.cab-a-bandeau .entry-content > :first-child:not(.cab-subnav) { margin-top: clamp(32px, 5vw, 56px); }

/* Liens-textes soulignés (« Nous écrire », « Toutes les plantes »…) : 20 px de haut,
   sous les 44 px qu'un doigt demande. La zone sensible grandit, le dessin ne bouge pas. */
.cab-ferme__lien-texte, .cab-plante__produits { position: relative; }
.cab-ferme__lien-texte::after, .cab-plante__produits::after {
  content: ""; position: absolute; left: -6px; right: -6px; top: 50%;
  height: 44px; transform: translateY(-50%);
}

/* Le blog (Actualités, articles) gardait la police système de Blocksy pour ses dates,
   catégories et extraits : sa variable de police n'était jamais redéfinie. */
:root:root { --theme-font-family: var(--cab-font-text); }

/* Le nombre de résultats, sous le titre d'une recherche. */
.cab-boutique__compte { margin: 8px 0 0; text-align: center; font-size: 14px; color: var(--cab-muted); }

/* Page introuvable : ce qui se passe, et par où reprendre. */
.cab-introuvable { max-width: 720px; margin-inline: auto; padding-block: clamp(48px, 8vw, 96px); text-align: center; }
.cab-introuvable__titre { margin: 0 0 16px; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(30px, 4vw, 44px); line-height: 1.15; text-wrap: balance; }
.cab-introuvable__texte { margin: 0 auto 28px; max-width: 52ch; color: var(--cab-muted); text-wrap: pretty; }
.cab-introuvable__portes { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 32px; padding: 0; list-style: none; }
.cab-introuvable__recherche { max-width: 420px; margin-inline: auto; }

/* ---------- Ateliers & visites, retours du 24/09 ---------- */

/* La grille « Tout ce qu'on propose » : titre et filtres sur une ligne, et l'ancre
   #propose s'arrête sous l'en-tête collant, titre visible. */
.cab-hub__tete-grille { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.products .cab-card[hidden] { display: none; }

/* Les cartes des formats ne portent plus ni date ni prix : la flèche seule, à droite. */
.cab-formats .cab-catcard__bas { justify-content: flex-end; }

/* Agenda : le titre mène à la fiche, « En savoir plus » à côté de « Réserver ». */
.cab-agenda__title a { color: inherit; text-decoration: none; }
.cab-agenda__title a:hover { text-decoration: underline; text-underline-offset: 4px; }
.cab-agenda__action { display: flex; align-items: center; justify-content: flex-end; gap: 18px; }
.cab-agenda__plus {
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600;
  color: var(--cab-ink); text-decoration: underline; text-underline-offset: 4px; white-space: nowrap;
}
.cab-agenda__row { grid-template-columns: 220px minmax(0, 1fr) 120px auto; }

/* La dernière ligne du brunch : une ligne d'agenda, avec l'adresse à laisser. */
.cab-agenda__row--alerte { background: var(--cab-bg-soft); padding-inline: 16px; border-radius: 10px; border-bottom: 0; margin-top: 8px; }
.cab-agenda__row--alerte .cab-agenda__date { color: var(--cab-muted); }
.cab-agenda__alerte { grid-column: span 2; justify-self: end; }

/* Le formulaire « Me prévenir », partout où il sert. */
.cab-alerte { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.cab-alerte__champ { height: 40px; min-width: 240px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--cab-line); background: var(--cab-bg); font: inherit; font-size: 14px; }
.cab-alerte__champ:focus-visible { outline: 2px solid var(--cab-ink); outline-offset: 2px; }
.cab-alerte__bouton { height: 40px; }
.cab-alerte__erreur { flex-basis: 100%; margin: 4px 0 0; font-size: 13px; color: #a3261a; }
.cab-alerte--merci { gap: 10px; font-size: 14px; }
.cab-alerte--merci svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; }
.cab-sansdate .cab-alerte { margin-top: 14px; }
.cab-sansdate { scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.cab-agenda__row--alerte { scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }

@media (max-width: 1023px) {
  .cab-agenda__row { grid-template-columns: 1fr auto; }
  .cab-agenda__alerte { grid-column: 1 / -1; justify-self: stretch; }
  .cab-alerte__champ { flex: 1; min-width: 0; }
}

/* Cartes de l'accueil « Ateliers, visites et brunchs » : si une carte a un cadre, il
   suit l'arrondi de sa photo. */
.cab-expcard { border-radius: 12px; overflow: hidden; }

/* Tuile « Sur mesure » du rayon Coffrets & cadeaux : la place de deux vignettes, la
   photo d'un côté, la proposition de l'autre. Elle suit la hauteur de la rangée. */
.cab-tuile-surmesure {
  grid-column: span 2;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  border-radius: 8px; overflow: hidden; background: var(--cab-bg-soft);
  min-height: 100%;
}
.cab-tuile-surmesure__media { position: relative; min-height: 280px; }
.cab-tuile-surmesure__media img { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; }
.cab-tuile-surmesure__texte { display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: clamp(20px, 3vw, 40px); }
.cab-tuile-surmesure__texte .cab-label { color: var(--cab-muted); }
.cab-tuile-surmesure__titre { margin: 0; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.15; text-wrap: balance; }
.cab-tuile-surmesure__texte p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--cab-muted); text-wrap: pretty; }
.cab-tuile-surmesure__lien { align-self: flex-start; margin-top: 6px; }
@media (max-width: 767px) {
  .cab-tuile-surmesure { grid-template-columns: 1fr; }
  .cab-tuile-surmesure__media { min-height: 220px; }
}
/* Le titre de la grille à gauche, ses filtres à droite. */
.cab-hub__tete-grille.cab-section__head { justify-content: space-between; text-align: left; }
.cab-hub__tete-grille .cab-section__title { margin: 0; }
/* La ligne « prévenez-moi » du brunch : champ et bouton sur une ligne. */
.cab-agenda__row.cab-agenda__row--alerte { grid-template-columns: 220px minmax(0, 1fr) auto; }
.cab-agenda__row--alerte .cab-alerte { flex-wrap: nowrap; }
.cab-agenda__alerte { grid-column: auto; }
@media (max-width: 1023px) {
  .cab-agenda__row.cab-agenda__row--alerte { grid-template-columns: 1fr; }
  .cab-agenda__row--alerte .cab-alerte { flex-wrap: wrap; }
}

/* ---------- Fiche expérience : réservation (maquette Experience-desktop) ---------- */

.cab-resa { display: flex; flex-direction: column; gap: 16px; margin-top: 8px; }
.cab-resa__dates { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.cab-resa__legende {
  display: block; margin: 0 0 4px; padding: 0;
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: var(--cab-ink);
}
.cab-resa__date {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px; border: 1px solid var(--cab-line); border-radius: 10px;
  cursor: pointer; transition: border-color var(--cab-t-fast), background-color var(--cab-t-fast);
}
.cab-resa__date:hover { border-color: var(--cab-ink); }
.cab-resa__date:has(input:checked) { border-color: var(--cab-ink); background: var(--cab-bg-soft); }
.cab-resa__date:has(input:focus-visible) { outline: 2px solid var(--cab-ink); outline-offset: 2px; }
.cab-resa__date input { width: 18px; height: 18px; margin: 0; flex-shrink: 0; accent-color: var(--cab-ink); }
.cab-resa__texte { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.cab-resa__jour { font-size: 15px; font-weight: 600; }
.cab-resa__detail { font-size: 13px; color: var(--cab-muted); }
.cab-resa__prix { font-size: 15px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cab-resa__date.is-complet { cursor: default; color: var(--cab-muted); }
.cab-resa__date.is-complet:hover { border-color: var(--cab-line); }
.cab-resa__rond { width: 18px; height: 18px; flex-shrink: 0; border: 1px solid var(--cab-line); border-radius: 50%; }
.cab-resa__attente { font-size: 13px; color: var(--cab-muted); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }

.cab-resa__personnes { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 4px; }
.cab-resa__personnes .cab-resa__legende { margin: 0; }
.cab-resa__personnes .cab-qty { height: 44px; border-radius: 999px; overflow: hidden; }
.cab-resa__personnes .cab-qty button { width: 44px; }
.cab-resa__plafond { margin: -6px 0 0; font-size: 12px; color: var(--cab-muted); }
.cab-resa__plafond a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cab-resa__total { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid var(--cab-line); }
.cab-resa__recap { font-size: 14px; color: var(--cab-muted); }
.cab-resa__somme { font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums; }
.cab-resa__bouton { width: 100%; height: 52px; }
.cab-resa__liste-attente { margin-top: 18px; padding: 16px; border-radius: 10px; background: var(--cab-bg-soft); scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.cab-resa__liste-attente .cab-small { margin: 0 0 10px; }

/* L'acompte des formations garde sa place, dans le rythme du formulaire. */
.cab-resa .deposits-frontend-wrapper { margin: 0; }

/* ---------- Fiche expérience : avis et autres formats ---------- */

.cab-xp-avis { scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.cab-xp-avis__ecrire { margin-top: 28px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.cab-xp-avis__volet { width: 100%; max-width: 640px; }
.cab-xp-avis__volet > summary { list-style: none; display: inline-flex; }
.cab-xp-avis__volet > summary::-webkit-details-marker { display: none; }
.cab-xp-avis__volet[open] > summary { margin-bottom: 18px; }
.cab-avis-form { display: flex; flex-direction: column; gap: 14px; }
.cab-avis-form label { display: block; margin-bottom: 6px; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; }
.cab-avis-form select, .cab-avis-form textarea { width: 100%; padding: 10px 14px; border: 1px solid var(--cab-line); border-radius: 10px; font: inherit; background: var(--cab-bg); }
.cab-avis-form select { max-width: 260px; }
.cab-avis-form .form-submit { margin: 0; }

/* « À vivre aussi à la ferme » : tous les formats sur une ligne. */
.cab-xp-autres { grid-template-columns: repeat(var(--cab-colonnes, 3), minmax(0, 1fr)); }
@media (max-width: 767px) { .cab-xp-autres { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
.cab-resa__sur-mesure { margin: 16px 0 0; font-size: 14px; color: var(--cab-muted); }
.cab-resa__sur-mesure a { color: var(--cab-ink); text-decoration: underline; text-underline-offset: 3px; }

/* Fiche produit : un seul badge, sur la photo principale. Blocksy posait le sien
   (« ÉPUISÉ ») sur la galerie, et il tombait sur la première miniature. */
.single-product .out-of-stock-badge { display: none; }
.cab-sansdate__autre { margin: 14px 0 0; font-size: 14px; color: var(--cab-muted); }
.cab-sansdate__autre a { color: var(--cab-ink); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Pages à deux colonnes : Groupes, Sur mesure, Boutique à la ferme ---------- */

/* Le contenu éditorial est tenu dans 742 px par Blocksy : ces pages prennent la
   largeur du conteneur, le texte à gauche, l'action à droite. */
.cab-page-deux-colonnes .entry-content > .cab-deux-colonnes {
  max-width: var(--cab-container, 1240px); width: calc(100vw - 2 * var(--cab-page-pad));
  margin-inline: auto !important; position: relative; left: 50%; transform: translateX(-50%);
}
.cab-deux-colonnes {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 440px);
  gap: clamp(32px, 5vw, 80px); align-items: start;
  margin-top: clamp(32px, 5vw, 56px);
}
.cab-deux-colonnes__texte > :first-child { margin-top: 0; }
.cab-deux-colonnes__texte p, .cab-deux-colonnes__texte li { font-size: 16px; line-height: 1.7; max-width: 62ch; text-wrap: pretty; }
.cab-deux-colonnes__texte h2 { margin-top: var(--cab-s-5); }
/* L'ancre #demande s'arrête sous l'en-tête. (Ce qui colle : voir « is-collant » plus bas.) */
.cab-deux-colonnes__action { scroll-margin-top: calc(var(--cab-header-h-compact) + 24px); }
.cab-deux-colonnes__carte { padding: clamp(20px, 2.5vw, 32px); border-radius: 14px; background: var(--cab-bg-soft); }
.cab-deux-colonnes__titre { margin: 0 0 18px; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(24px, 2.2vw, 30px); }
/* Dans la colonne, les champs s'empilent : deux par ligne, ils étaient trop étroits. */
.cab-deux-colonnes__carte .cab-contact__duo { grid-template-columns: 1fr; display: grid; gap: 0; }
.cab-deux-colonnes__carte .cab-contact { max-width: none; }
.cab-deux-colonnes__carte .cab-btn--lg { width: 100%; }
@media (max-width: 959px) {
  .cab-page-deux-colonnes .entry-content > .cab-deux-colonnes { width: auto; left: 0; transform: none; }
  .cab-deux-colonnes { grid-template-columns: 1fr; }
  .cab-deux-colonnes__action { position: static; }
}

/* Groupes : trois lignes sous un filet, plus de boîtes. */
.cab-groupes__liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--cab-ink); }
.cab-groupes__ligne { padding: 18px 0; border-bottom: 1px solid var(--cab-line); }
.cab-groupes__ligne .cab-label { color: var(--cab-muted); }
.cab-groupes__ligne .cab-groupes__titre { margin: 6px 0 4px; font-family: var(--cab-font-display); font-weight: 300; font-size: 22px; }
.cab-groupes__ligne p { margin: 0; color: var(--cab-muted); }
.cab-groupes__suite { margin-top: var(--cab-s-5); }
.cab-groupes__aparte { margin-top: var(--cab-s-4); padding-top: var(--cab-s-3); border-top: 1px solid var(--cab-line); }
.cab-groupes__aparte .cab-label { margin: 16px 0 4px; color: var(--cab-muted); }
.cab-groupes__aparte .cab-label:first-child { margin-top: 0; }

/* Boutique à la ferme : la fiche pratique. */
.cab-infos { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.cab-infos li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; line-height: 1.55; }
.cab-infos svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cab-infos a { text-decoration: underline; text-underline-offset: 3px; }
.cab-infos__actions { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.cab-infos__actions .cab-btn { width: 100%; }
/* La règle des titres éditoriaux (64 px au-dessus) ne vaut pas dans la carte de droite. */
.cab-editorial .entry-content .cab-deux-colonnes__titre { margin-top: 0; }

/* ---------- La ferme, retours du 24/09 ---------- */

/* Plus d'air entre les sections : « Cultiver, cueillir, sécher » et le séchoir
   arrivaient collés à ce qui les précède. Les 88 px prévus ne s'appliquaient pas :
   la règle des pages éditoriales (« > * + * », 24 px) passait devant. */
.cab-page-ferme .entry-content > .cab-ferme__bloc,
.cab-page-ferme .entry-content > .cab-ferme__bande { margin-top: clamp(64px, 8vw, 120px); }
.cab-page-ferme .entry-content > .cab-ferme__bloc:first-of-type { margin-top: clamp(40px, 5vw, 64px); }

/* Les ancres du sommaire s'arrêtaient sous l'en-tête et le sommaire collants : le
   titre de la section était caché. On réserve leur hauteur. */
.entry-content [id^="section-"], .cab-ferme__bloc, .cab-ferme__bande {
  scroll-margin-top: calc(var(--cab-header-h-compact) + 51px + 32px);
}

/* Le séchoir : plus de demi-page noire. Un bloc dans la largeur de la page, photo
   arrondie à gauche, texte à droite sur le fond crème, en caractères plus fins. */
.cab-page-ferme .entry-content > .cab-ferme__bande {
  width: calc(var(--cab-largeur-page, 100vw) - 2 * var(--cab-page-pad));
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  border-radius: 14px; overflow: hidden; background: var(--cab-bg-soft);
}
.cab-ferme__bande .cab-ferme__bande-media { order: -1; min-height: 480px; }
.cab-ferme__bande-texte { background: transparent; color: var(--cab-ink); padding: clamp(28px, 4vw, 64px); }
.cab-ferme__bande-texte .cab-label { color: var(--cab-muted); }
.cab-page-ferme .cab-ferme__bande-texte h2.cab-ferme__titre,
.cab-ferme__bande-texte .cab-ferme__titre { color: var(--cab-ink); font-size: clamp(28px, 2.8vw, 38px); }
.cab-ferme__bande-texte .cab-ferme__texte { color: var(--cab-ink); font-size: 15px; max-width: 58ch; }
.cab-ferme__bande-texte .cab-ferme__lien-texte { color: var(--cab-ink); }
@media (max-width: 899px) {
  .cab-page-ferme .entry-content > .cab-ferme__bande { width: auto; grid-template-columns: 1fr; margin-inline: var(--cab-page-pad); }
  .cab-ferme__bande .cab-ferme__bande-media { min-height: 260px; }
}

/* Les variétés : la rangée prend toute la largeur, flèches aux bords, comme l'accueil. */
.cab-slider.cab-slider--large.cab-slider--plantes ul.cab-plantes { padding-inline: var(--cab-page-pad); scroll-padding-inline: var(--cab-page-pad); }

/* « 7 produits en contiennent » : un volet qui s'ouvre sous la carte. */
.cab-plante__produits-volet { margin-top: 12px; }
.cab-plante__produits-volet > summary { list-style: none; cursor: pointer; display: inline-block; margin-top: 0; }
.cab-plante__produits-volet > summary::-webkit-details-marker { display: none; }
/* Le pseudo-élément ::after sert déjà de zone tactile (44 px) : pas d'indicateur
   dessus, sans quoi un « + » s'affichait en haut à gauche du lien. */
.cab-plante__liste { list-style: none; margin: 10px 0 0; padding: 10px 0 0; border-top: 1px solid var(--cab-line); display: flex; flex-direction: column; gap: 6px; }
.cab-plante__liste a { font-size: 14px; color: var(--cab-ink); text-decoration: none; }
.cab-plante__liste a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cab-plante__tous a { font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600; text-decoration: underline; }
@media (max-width: 899px) {
  /* Au téléphone, la bande du séchoir va d'un bord à l'autre : sans arrondi. */
  .cab-page-ferme .entry-content > .cab-ferme__bande { border-radius: 0; margin-inline: 0; }
  /* La rangée pleine largeur porte déjà la marge de page : pas de marge négative en plus. */
  .cab-page-ferme .cab-slider.cab-slider--large.cab-slider--plantes ul.cab-plantes { margin-inline: 0; }
}

/* ---------- Actualités, retours du 24/09 ---------- */

/* La grille : des vignettes de même hauteur, photo arrondie, « Lire l'article » en bas. */
.cab-actus { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px) clamp(16px, 2vw, 28px); }
.cab-actus__page { padding-top: clamp(32px, 4vw, 56px); }
.cab-actu { display: flex; flex-direction: column; gap: 14px; }
.cab-actu__media { display: block; position: relative; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; background: var(--cab-bg-soft); }
.cab-actu__media img { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; transition: transform 600ms cubic-bezier(0.23, 1, 0.32, 1); }
@media (hover: hover) and (pointer: fine) { .cab-actu:hover .cab-actu__media img { transform: scale(1.03); } }
.cab-actu__corps { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.cab-actu__date { font-size: 13px; color: var(--cab-muted); }
.cab-actu__titre { margin: 0; font-family: var(--cab-font-display); font-weight: 300; font-size: 22px; line-height: 1.2; text-wrap: balance; }
.cab-actu__titre a { color: inherit; text-decoration: none; }
.cab-actu__extrait { margin: 0; font-size: 14px; line-height: 1.6; color: var(--cab-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cab-actu__lire {
  margin-top: auto; padding-top: 6px; align-self: flex-start;
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600;
  color: var(--cab-ink); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.cab-actus__pages { margin-top: var(--cab-s-5); display: flex; justify-content: center; }
.cab-actus__pages .nav-links { display: flex; gap: 12px; align-items: center; }
@media (max-width: 999px) { .cab-actus { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .cab-actus { grid-template-columns: 1fr; } }

/* Un article : une colonne de lecture, sans cadre. */
.cab-article { padding: clamp(24px, 4vw, 48px) var(--cab-page-pad) 0; }
.cab-article__colonne { max-width: 760px; margin: 0 auto; }
.cab-article__tete { margin: 20px 0 28px; }
.cab-article__date { margin: 0 0 10px; font-size: 13px; color: var(--cab-muted); }
.cab-article__titre { margin: 0; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(32px, 4.4vw, 52px); line-height: 1.1; text-wrap: balance; }
.cab-article__photo { margin: 0 0 32px; }
.cab-article__photo img { width: 100%; height: auto; border-radius: 14px; display: block; }
.cab-article__contenu { font-size: 17px; line-height: 1.75; }
.cab-article__contenu img { border-radius: 10px; height: auto; }
.cab-article__contenu .wp-block-gallery, .cab-article__contenu .gallery { gap: 12px; }
.cab-article__retour { margin: 40px 0 0; padding-top: 20px; border-top: 1px solid var(--cab-line); }
.cab-article__retour a { font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600; color: var(--cab-ink); text-decoration: none; }
.cab-article__commentaires { margin-top: var(--cab-s-5); }
.cab-commentaire { padding: 16px 0; border-top: 1px solid var(--cab-line); }
.cab-commentaire__qui { margin: 0 0 6px; font-size: 14px; color: var(--cab-muted); }
.cab-commentaire__qui strong { color: var(--cab-ink); }
.cab-article__ecrire { margin-top: 20px; }
.cab-article__autres { margin-top: var(--cab-s-6); }
/* La grille des actualités collait au bandeau. */
.cab-actus__page > section > .cab-actus:first-child, .cab-actus__page .cab-actus { margin-top: clamp(40px, 5vw, 64px); }
.cab-article__autres .cab-actus { margin-top: 0; }

/* ---------- Contact, retours du 24/09 ---------- */
.cab-infos--contact li { font-size: 16px; }
.cab-infos--contact li + li { padding-top: 16px; border-top: 1px solid var(--cab-line); }
.cab-contact__reseaux { margin-top: var(--cab-s-4); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.cab-contact__reseaux .cab-label { flex-basis: 100%; margin: 0; color: var(--cab-muted); }
.cab-contact__reseaux a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--cab-ink); text-decoration: none; font-size: 15px; }
.cab-contact__reseaux svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.6; }
.cab-contact__ailleurs { margin-top: var(--cab-s-4); padding: 20px 22px; border: 1px solid var(--cab-line); border-radius: 12px; }
.cab-contact__ailleurs .cab-label { margin: 0 0 6px; color: var(--cab-muted); }
.cab-contact__ailleurs p { margin: 0 0 12px; font-size: 15px; }
.cab-contact__ailleurs p:last-child { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.cab-deux-colonnes__carte .cab-contact .cab-btn--lg { width: 100%; }
.cab-deux-colonnes__texte .cab-contact__reseaux .cab-label { max-width: none; }

/* ---------- Commande : étapes à gauche, panier à droite (24/09) ---------- */

/* Le panier : une colonne crème qui reste à l'écran. */
.cab-tunnel .ct-order-review {
  position: sticky; top: 24px; align-self: start;
  padding: clamp(20px, 2.4vw, 32px); border-radius: 14px; background: var(--cab-bg-soft);
}
.cab-tunnel #order_review { position: static; padding: 0; border: 0; }
.cab-recap__tete { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.cab-recap__titre { margin: 0; font-family: var(--cab-font-display); font-weight: 300; font-size: 24px; }
.cab-recap__modifier { font-size: 13px; color: var(--cab-muted); text-decoration: underline; text-underline-offset: 3px; }
.cab-tunnel .ct-order-review .shop_table { background: transparent; }
.cab-tunnel .ct-order-review tr.order-total th, .cab-tunnel .ct-order-review tr.order-total td { font-size: 18px; font-weight: 600; padding-top: 18px; }

/* Étape 2 : les modes de livraison en cartes, comme les dates d'un atelier. */
#cab-etape-2 { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--cab-line); }
.cab-livraison__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.cab-tunnel .cab-livraison__liste li.cab-livraison__choix {
  display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap;
  margin: 0; padding: 14px 16px; border: 1px solid var(--cab-line); border-radius: 10px;
  transition: border-color var(--cab-t-fast), background-color var(--cab-t-fast);
}
.cab-tunnel .cab-livraison__liste li.cab-livraison__choix:has(input:checked) { border-color: var(--cab-ink); background: var(--cab-bg-soft); }
.cab-livraison__choix > label { flex: 1; cursor: pointer; }
.cab-livraison__choix > input[type="radio"] { accent-color: var(--cab-ink); width: 18px; height: 18px; margin-top: 2px; }
.cab-livraison__choix > :not(input):not(label) { flex-basis: 100%; }
.cab-livraison__vide { color: var(--cab-muted); font-size: 14px; }

/* Étape 3 : le paiement suit, dans la colonne de gauche. */
.cab-tunnel .ct-customer-details #payment { margin: 8px 0 0; background: transparent; padding: 0; }
/* Blocksy réécrit la ligne en une cellule avec son intitulé caché : on le remontre. */
.cab-tunnel .woocommerce-checkout-review-order-table tr.cab-recap-livraison td { text-align: right; }
.cab-tunnel .woocommerce-checkout-review-order-table tr.cab-recap-livraison .ct-shipping-heading { display: block; float: left; font-weight: 400; text-transform: none; letter-spacing: 0; }
@media (max-width: 1023px) {
  /* Au téléphone, le panier passe en tête (on sait ce qu'on paie avant de remplir),
     et ne colle plus. */
  .cab-tunnel .ct-order-review { order: -1; position: static; }
  .cab-tunnel .ct-customer-details { order: 0; }
  .cab-tunnel #payment ul.payment_methods { margin-inline: 0; padding-inline: 0; }
  .cab-tunnel #payment ul.payment_methods > li { padding-inline: 14px; }
}

/* Le mot qui apparaît au survol d'une carte était limité à 7 em : « Demander un devis »
   était coupé en « Demander un d ». La place suit maintenant les libellés longs. */
.cab-catcard:hover .cab-catcard__go-texte, .cab-catcard:focus-visible .cab-catcard__go-texte { max-width: 14em; }

/* Juliette : sur grand écran, la photo et le texte restaient calés à gauche, avec un
   grand vide à droite. Le duo est centré dans une largeur contenue. */
.cab-ferme__juliette .cab-ferme__duo { grid-template-columns: minmax(0, 460px) minmax(0, 560px); justify-content: center; }
.cab-ferme__metier { display: block; }
@media (max-width: 899px) { .cab-ferme__juliette .cab-ferme__duo { grid-template-columns: 1fr; } }

/* Les variétés : des cartes de même rythme. La saveur tient sur une ligne, le texte
   sur quatre (il reste entier dans la page), et le lien vers les produits se cale en
   bas de chaque carte : les liens s'alignent d'une carte à l'autre. */
.cab-slider--plantes .cab-plante { display: flex; flex-direction: column; }
.cab-plante__saveur { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cab-plante__texte { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.cab-plante__produits-volet { margin-top: auto; padding-top: 12px; }
/* La saveur sur une ligne élargissait la carte à la longueur de la phrase (Hysope :
   613 px au lieu de 280) : une carte ne s'élargit jamais au-delà de sa place. */
.cab-slider--plantes .cab-plante { min-width: 0; }

/* ---------- La ferme : « Cultiver, cueillir, sécher » (maquette du 24/09) ---------- */

.cab-gestes__tete {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap;
  padding-bottom: 28px; margin-bottom: 36px; border-bottom: 1px solid var(--cab-line);
}
.cab-gestes__surtitre { display: block; color: var(--cab-muted); letter-spacing: 0.24em; }
.cab-page-ferme .entry-content h2.cab-gestes__titre { margin: 14px 0 0; font-size: clamp(40px, 4.6vw, 68px); font-weight: 400; line-height: 1.02; letter-spacing: -0.01em; }
.cab-gestes__tete .cab-ferme__chapeau { font-size: 15px; margin: 0 0 8px; }

.cab-gestes__grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 2.5vw, 36px); align-items: start; }
.cab-geste__num { display: block; font-size: var(--cab-fs-label); letter-spacing: 0.2em; text-transform: uppercase; color: var(--cab-muted); }
.cab-page-ferme .entry-content h3.cab-geste__titre { margin: 12px 0 0; font-family: var(--cab-font-display); font-weight: 400; font-size: clamp(28px, 2.7vw, 42px); line-height: 1.1; }
.cab-geste .cab-geste__texte { margin: 0; font-size: 16px; line-height: 1.65; color: var(--cab-muted); text-wrap: pretty; }
.cab-geste .cab-geste__media { border-radius: 10px; overflow: hidden; position: relative; background: var(--cab-bg-soft); }
.cab-page-ferme .entry-content .cab-geste__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* 01 : la grande photo, puis le titre et le texte séparés par un filet vertical. */
.cab-geste--une .cab-geste__media { aspect-ratio: 4 / 3; }
.cab-geste__pied { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 40px; margin-top: 28px; align-items: start; }
.cab-geste__pied .cab-geste__texte { padding-left: 40px; border-left: 1px solid var(--cab-line); max-width: 42ch; }

/* 02 et 03 : photo et texte côte à côte, séparés par un filet. */
.cab-gestes__colonne { display: flex; flex-direction: column; }
.cab-geste--ligne { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(20px, 2.5vw, 36px); align-items: center; }
.cab-page-ferme .entry-content .cab-geste--ligne h3.cab-geste__titre { font-size: clamp(26px, 2.3vw, 40px); }
.cab-geste--ligne .cab-geste__media { aspect-ratio: 6 / 5; }
.cab-geste--ligne + .cab-geste--ligne { margin-top: 32px; padding-top: 32px; border-top: 1px solid var(--cab-line); }
.cab-geste--ligne .cab-geste__texte { margin-top: 18px; }

@media (max-width: 1099px) {
  .cab-gestes__grille { grid-template-columns: 1fr; }
  .cab-geste--une .cab-geste__media { aspect-ratio: 16 / 10; }
  .cab-gestes__colonne { margin-top: 12px; padding-top: 32px; border-top: 1px solid var(--cab-line); }
}
@media (max-width: 599px) {
  .cab-gestes__tete { align-items: flex-start; flex-direction: column; margin-bottom: 24px; }
  .cab-geste__pied { grid-template-columns: 1fr; gap: 12px; margin-top: 18px; }
  .cab-geste__pied .cab-geste__texte { padding-left: 0; border-left: 0; }
  .cab-geste--ligne { grid-template-columns: 1fr; gap: 16px; }
  .cab-geste--ligne .cab-geste__media { aspect-ratio: 16 / 10; }
  .cab-geste--ligne .cab-geste__texte { margin-top: 10px; }
}

/* ---------- Article : un en-tête plus généreux (24/09) ---------- */
/* Le titre était calé à gauche dans une colonne de 760 px, sous un fil d'Ariane
   centré : un grand vide autour. L'en-tête est centré sur la largeur de la page, la
   photo (ou la première image du texte) déborde de la colonne de lecture. */
.cab-article__tete { max-width: 1040px; margin: 0 auto clamp(32px, 4vw, 56px); text-align: center; }
.cab-article__tete .cab-ariane { justify-content: center; }
.cab-article__date { margin: clamp(24px, 3vw, 40px) 0 14px; font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; }
.cab-article__titre { font-size: clamp(36px, 5.2vw, 72px); line-height: 1.04; letter-spacing: -0.01em; }
.cab-article__photo { max-width: 1120px; margin: 0 auto clamp(32px, 4vw, 56px); }
.cab-article__colonne { max-width: 720px; }
/* Une image posée en tête du texte prend, elle aussi, plus de largeur que le texte. */
@media (min-width: 900px) {
  .cab-article__contenu > figure:first-child, .cab-article__contenu > p:first-child > img:only-child,
  .cab-article__contenu > .wp-block-image:first-child { margin-inline: -120px; max-width: none; }
  .cab-article__contenu > figure:first-child img, .cab-article__contenu > .wp-block-image:first-child img { width: 100%; }
}

/* « Lire l'article » : au survol, le soulignement de WordPress s'ajoutait au filet du
   lien — deux lignes. Plus de soulignement : la petite flèche des cartes glisse à la
   place, et toute la vignette la déclenche. */
.cab-actu__lire { display: inline-flex; align-items: center; gap: 8px; }
.cab-actu__lire:hover, .cab-actu__lire:focus-visible { text-decoration: none; }
.cab-actu__lire svg {
  width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.4; flex-shrink: 0;
  opacity: 0; transform: translateX(-6px);
  transition: opacity var(--cab-t-fast), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.cab-actu:hover .cab-actu__lire svg, .cab-actu__lire:focus-visible svg { opacity: 1; transform: none; }
@media (hover: none) { .cab-actu__lire svg { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cab-actu__lire svg { transition: none; } }
/* Le filet souligne le mot seul, pas la place réservée à la flèche. */
.cab-actu__lire { border-bottom: 0; padding-bottom: 0; }
.cab-actu__lire-texte { border-bottom: 1px solid currentColor; padding-bottom: 2px; }

/* ---------- Mon compte (24/09) ---------- */
/* Sous le bandeau, les deux formulaires dans deux cartes centrées. */
.woocommerce-account #customer_login {
  max-width: 1040px; margin: clamp(32px, 4vw, 56px) auto 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.5vw, 32px);
}
.woocommerce-account #customer_login::before, .woocommerce-account #customer_login::after { display: none; }
.woocommerce-account #customer_login > .u-column1, .woocommerce-account #customer_login > .u-column2 {
  width: auto; float: none; margin: 0; padding: clamp(24px, 3vw, 40px);
  border: 0; border-radius: 14px; background: var(--cab-bg-soft);
}
.woocommerce-account #customer_login h2 { margin: 0 0 18px; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(24px, 2.2vw, 30px); }
.woocommerce-account #customer_login .input-text { border-radius: 10px; background: var(--cab-bg); }
.woocommerce-account #customer_login .woocommerce-button, .woocommerce-account #customer_login button[type="submit"] {
  border-radius: 999px; padding-inline: 28px; min-height: 46px;
  background: var(--cab-ink); color: var(--cab-on-ink); border: 1px solid var(--cab-ink);
  font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 700;
}
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p, .woocommerce-account #customer_login p { font-size: 14px; line-height: 1.6; }
.woocommerce-account #customer_login .lost_password a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) { .woocommerce-account #customer_login { grid-template-columns: 1fr; } }

/* ---------- Retours du 24/09, suite ---------- */

/* Hub : « Tout ce qu'on propose » à gauche, les filtres à droite. L'en-tête était un
   second conteneur dans la zone de la grille, avec ses propres marges : titre et
   filtres se serraient au milieu, décalés de la première vignette. */
.woo-listing-top .cab-hub__tete-grille.cab-container { max-width: none; width: 100%; margin-inline: 0; padding-inline: 0; }
.cab-hub__tete-grille .cab-propose__filtres { justify-content: flex-end; }
@media (max-width: 767px) {
  .cab-hub__tete-grille .cab-propose__filtres { justify-content: flex-start; }
}

/* La ferme, « Cultiver, cueillir, sécher » : comme sur la maquette, la colonne de
   droite prend la hauteur de la grande photo et de son pied. Les deux photos
   s'étirent pour que le bas de « Séchées lentement » tombe sur le bas du texte de
   « Cultivées ici », et le haut de la première sur le haut de la grande photo. */
@media (min-width: 1100px) {
  .cab-gestes__grille { align-items: stretch; }
  .cab-gestes__colonne { height: 100%; }
  .cab-geste--ligne { flex: 1 1 0; align-items: stretch; min-height: 0; }
  .cab-geste--ligne > :last-child { align-self: center; }
  .cab-geste--ligne .cab-geste__media { aspect-ratio: auto; height: 100%; min-height: 220px; }
}

/* Les variétés, « N produits en contiennent » : la liste s'ouvre par-dessus la carte,
   qui garde sa taille. Le lien reste visible en bas, et son « + » devient une croix
   pour refermer. Le volet monte depuis le bas, comme une fiche qu'on tire. */
.cab-slider--plantes .cab-plante { position: relative; }
.cab-plante__produits-volet > summary { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: 10px; }
.cab-plante__signe { position: relative; width: 9px; height: 9px; flex: none; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1); }
.cab-plante__signe::before, .cab-plante__signe::after {
  content: ""; position: absolute; left: 0; top: 4px; width: 9px; height: 1px; background: currentColor;
}
.cab-plante__signe::after { transform: rotate(90deg); }
.cab-plante__produits-volet[open] .cab-plante__signe { transform: rotate(45deg); }
.cab-plante__volet {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column;
  padding: 22px 22px 64px; border-radius: 10px;
  background: var(--cab-bg-soft);
  overflow: hidden;
}
/* Ouvert, le lien se glisse dans le volet, aligné sur la liste. Un décalage visuel
   seulement : la carte ne bouge pas d'un pixel. */
.cab-plante__produits-volet > summary { transition: transform 320ms cubic-bezier(0.23, 1, 0.32, 1); }
.cab-plante__produits-volet[open] > summary { transform: translate(22px, -18px); }
.cab-plante__produits-volet[open] .cab-plante__volet { animation: cab-volet-monte 320ms cubic-bezier(0.23, 1, 0.32, 1); }
@keyframes cab-volet-monte {
  from { opacity: 0; clip-path: inset(40% 0 0 0 round 10px); }
  to   { opacity: 1; clip-path: inset(0 0 0 0 round 10px); }
}
.cab-plante__volet-titre {
  margin: 0 0 14px; padding-bottom: 14px; border-bottom: 1px solid var(--cab-line);
  font-family: var(--cab-font-display); font-size: 22px; font-weight: 300; line-height: 1.2;
}
.cab-plante__volet-titre .cab-label { display: block; margin-bottom: 6px; font-family: var(--cab-font-text); color: var(--cab-muted); }
.cab-plante__volet .cab-plante__liste {
  margin: 0; padding: 0; border-top: 0; gap: 0; flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;
}
.cab-plante__volet .cab-plante__liste li { border-bottom: 1px solid var(--cab-line); }
.cab-plante__volet .cab-plante__liste li:last-child { border-bottom: 0; }
.cab-plante__volet .cab-plante__liste a { display: flex; align-items: center; min-height: 40px; font-size: 15px; }
.cab-plante__volet .cab-plante__tous a { font-weight: 600; }
@media (prefers-reduced-motion: reduce) {
  .cab-plante__produits-volet[open] .cab-plante__volet { animation: none; }
  .cab-plante__signe, .cab-plante__produits-volet > summary { transition: none; }
}

/* Contact, Groupes, Sur mesure : le formulaire prend la plus grande part, presque le
   double d'avant (440 px). Les champs retrouvent deux par ligne. La boutique à la
   ferme garde sa fiche étroite. */
@media (min-width: 960px) {
  .cab-deux-colonnes:has(form) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); gap: clamp(32px, 4vw, 64px); }
  .cab-deux-colonnes:has(form) .cab-deux-colonnes__carte .cab-contact__duo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
  .cab-deux-colonnes:has(form) .cab-deux-colonnes__carte { padding: clamp(28px, 3vw, 44px); }
}

/* Avis d'un produit : le formulaire s'ouvre dans la carte « Vous l'avez goûté ? »,
   qui prend alors toute la largeur de la rangée. */
.cab-avis__volet .cab-avis-form { margin-top: 4px; }

/* Fiche produit, « Dans le même esprit » : le titre était centré dans un conteneur
   de 1328 px, décalé de la photo au-dessus et des vignettes dessous. Il se cale sur
   la marge de la page, comme le reste de la fiche. */
.cab-similaires > .cab-container { max-width: none; margin-inline: 0; padding-inline: var(--cab-page-pad); }

/* Pages à deux colonnes : la colonne la plus courte reste à l'écran, sous l'en-tête,
   pendant qu'on lit l'autre. Le script de inc/pages.php la désigne et mesure l'en-tête. */
@media (min-width: 960px) {
  .cab-deux-colonnes > .is-collant { position: sticky; top: var(--cab-collant, 112px); }
}

/* ---------- Sur mesure : la colonne de gauche (24/09) ---------- */

/* L'introduction, en chapeau. */
.cab-deux-colonnes__texte > p:first-child:has(+ .cab-sm) {
  font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(20px, 1.7vw, 24px); line-height: 1.45; max-width: none;
}
.cab-sm { margin-top: var(--cab-s-5); }
.cab-editorial .entry-content .cab-sm h2.cab-section__title { margin: 0 0 20px; }

/* Les trois formules : une photo, un numéro, et pour qui c'est fait. */
.cab-sm__liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--cab-ink); }
.cab-sm__formule {
  display: grid; grid-template-columns: clamp(110px, 12vw, 160px) minmax(0, 1fr); gap: clamp(18px, 2vw, 28px);
  padding: 24px 0; border-bottom: 1px solid var(--cab-line); align-items: start;
}
.cab-sm__media { position: relative; aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: var(--cab-bg-soft); }
.cab-editorial .entry-content .cab-sm__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; margin: 0; }
.cab-sm__num { display: block; font-size: var(--cab-fs-label); letter-spacing: 0.2em; color: var(--cab-muted); }
.cab-editorial .entry-content h3.cab-sm__titre { margin: 6px 0 8px; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(22px, 1.9vw, 26px); line-height: 1.15; }
.cab-deux-colonnes__texte p.cab-sm__texte { margin: 0; font-size: 15px; line-height: 1.6; color: var(--cab-muted); }
.cab-sm__pour { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 14px 0 0; padding: 0; }
.cab-deux-colonnes__texte .cab-sm__pour li {
  margin: 0; padding: 4px 11px; border: 1px solid var(--cab-line); border-radius: 999px;
  font-size: 12px; line-height: 1.4; letter-spacing: 0.02em; color: var(--cab-ink);
}

/* Le déroulé : trois étapes côte à côte, numérotées en grand. */
.cab-sm__deroule { margin-top: var(--cab-s-5); }
.cab-sm__etapes { counter-reset: cab-etape; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.cab-deux-colonnes__texte .cab-sm__etapes li {
  counter-increment: cab-etape; margin: 0; padding-top: 14px; border-top: 1px solid var(--cab-ink);
  font-size: 14px; line-height: 1.6; color: var(--cab-muted);
}
.cab-sm__etapes li::before {
  content: counter(cab-etape); display: block; margin-bottom: 10px;
  font-family: var(--cab-font-display); font-weight: 300; font-size: 44px; line-height: 1; color: var(--cab-ink);
}
.cab-sm__etapes strong { display: block; margin-bottom: 4px; color: var(--cab-ink); font-weight: 600; }

/* L'aparté : une phrase, le téléphone en grand. */
.cab-sm__aparte { margin-top: var(--cab-s-5); padding: clamp(24px, 3vw, 36px); border-radius: 14px; background: var(--cab-ink); color: var(--cab-bg); }
.cab-deux-colonnes__texte p.cab-sm__citation { margin: 0; max-width: none; font-family: var(--cab-font-display); font-weight: 300; font-size: clamp(22px, 2vw, 28px); line-height: 1.3; color: inherit; text-wrap: balance; }
.cab-sm__tel { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.2); }
.cab-sm__tel .cab-label { color: rgba(255, 255, 255, 0.7); }
.cab-sm__tel a { font-family: var(--cab-font-display); font-weight: 300; font-size: 26px; color: inherit; text-decoration: none; }
.cab-sm__tel a:hover { text-decoration: underline; text-underline-offset: 5px; }
.cab-deux-colonnes__texte p.cab-sm__autres { margin: 14px 0 0; font-size: 14px; color: rgba(255, 255, 255, 0.75); }
.cab-sm__autres a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 599px) {
  .cab-sm__etapes { grid-template-columns: 1fr; gap: 16px; }
  .cab-sm__formule { grid-template-columns: 96px minmax(0, 1fr); }
}

/* ---------- Commande, retours du 24/09 (suite) ---------- */

/* Le panier de droite, plus ramassé. L'en-tête « Produit / Sous-total » passait sur
   deux lignes et ne disait rien qu'on ne voie : retiré, comme chez Shopify. Chaque
   ligne perdait 26 px sous la photo : l'espace insécable que WooCommerce glisse
   après le nom faisait une ligne de texte à lui seul. */
.cab-tunnel .woocommerce-checkout-review-order-table thead { display: none; }
.cab-tunnel .woocommerce-checkout-review-order-table td.product-name { font-size: 0; line-height: 0; }
.cab-tunnel .woocommerce-checkout-review-order-table td.product-name .cab-recap__ligne { font-size: 14px; line-height: 1.4; }
.cab-tunnel .woocommerce-checkout-review-order-table tr.cart_item td { padding: 10px 0; border-bottom: 0; }
.cab-tunnel .woocommerce-checkout-review-order-table tr.cart_item:first-child td { padding-top: 4px; }
.cab-tunnel .woocommerce-checkout-review-order-table tr.cart_item td.product-total { font-size: 14px; white-space: nowrap; padding-left: 12px; }
.cab-tunnel .cab-recap__media { flex-basis: 52px; }
.cab-tunnel .cab-recap__media img { width: 52px; height: 52px; }
.cab-tunnel .cab-recap__nom { font-size: 15px; }

/* Le code promo, replié sous les articles. */
.cab-tunnel .woocommerce-checkout-review-order-table tr.cab-promo-ligne td { padding: 14px 0; border-top: 1px solid var(--cab-line); border-bottom: 1px solid var(--cab-line); }
.cab-promo > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 32px; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.cab-promo > summary::-webkit-details-marker { display: none; }
.cab-promo[open] > summary { margin-bottom: 10px; }
.cab-promo__champs { display: flex; gap: 8px; }
.cab-tunnel .cab-promo__champ { flex: 1; min-width: 0; height: 44px; padding: 0 14px; border: 1px solid var(--cab-line); border-radius: 10px; background: var(--cab-bg); font: inherit; font-size: 14px; letter-spacing: 0.04em; }
.cab-promo__bouton { height: 44px; flex: none; }
.cab-promo.is-chargement { opacity: 0.6; pointer-events: none; }
.cab-promo__retour:empty { display: none; }
.cab-promo__retour { margin-bottom: 12px; font-size: 13px; }
.cab-promo__retour ul, .cab-promo__retour .woocommerce-error, .cab-promo__retour .woocommerce-message { margin: 0; padding: 10px 14px; border-radius: 10px; list-style: none; }
.cab-tunnel tr.cart-discount td a.woocommerce-remove-coupon { margin-left: 6px; font-size: 12px; color: var(--cab-muted); }

/* Les modes de livraison : le cadre respire. La marge intérieure était annulée par
   une règle plus ancienne (#shipping_method li { padding: 0 }) : bouton radio et
   prix touchaient le bord. */
.cab-tunnel #shipping_method.cab-livraison__liste li.cab-livraison__choix { padding: 16px 20px; margin: 0; gap: 14px; }
.cab-tunnel #shipping_method.cab-livraison__liste li.cab-livraison__choix > input[type="radio"] { margin: 2px 0 0; }
/* Ce que Colissimo ajoute sous le mode (bouton du point relais, point choisi) se cale
   sur le texte, pas sur le bouton radio : 18 px de rond + 14 px d'écart. */
.cab-tunnel #shipping_method li.cab-livraison__choix > div { margin-left: 32px; }
.cab-tunnel #shipping_method li.cab-livraison__choix > div:empty { display: none; }
.cab-tunnel #lpc_layer_pickup_selection_button { margin-top: 4px; }
.cab-tunnel .lpc_pick_up_widget_show_map.wp-element-button {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 22px; margin: 0;
  border: 1px solid var(--cab-ink); border-radius: 999px; background: var(--cab-ink); color: var(--cab-on-ink);
  font-family: var(--cab-font-text); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
}
.cab-tunnel .lpc_pick_up_widget_show_map.wp-element-button:hover { background: transparent; color: var(--cab-ink); }
.cab-tunnel #lpc_pick_up_info { margin: 4px 0 12px; font-size: 14px; line-height: 1.5; }
.cab-tunnel #lpc_pick_up_info .lpc_pickup_info_title { margin-bottom: 6px; font-size: var(--cab-fs-label); letter-spacing: var(--cab-tracking-label); text-transform: uppercase; font-weight: 600; color: var(--cab-muted); }
.cab-tunnel #lpc_pick_up_info .lpc_pickup_info_distance { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--cab-muted); }
.cab-tunnel #lpc_pick_up_info .lpc_pickup_marker { width: 12px; height: auto; }
.cab-tunnel #lpc_pick_up_info .lpc_pickup_info_address_name { font-weight: 600; text-transform: none; }
.cab-tunnel #lpc_pick_up_info .lpc_pickup_info_address { font-size: 13px; letter-spacing: 0.02em; }

/* Confirmation de commande : « La suite » collée à son contenu (près de 90 px de
   vide entre le titre et les deux engagements), et deux boutons pour repartir. */
.cab-tunnel .cab-suite { margin: 40px 0 48px; }
.cab-tunnel .cab-suite > h2.cab-section__title { margin: 0 0 14px; }
.cab-tunnel .cab-suite .cab-reassure--inline { margin: 0; padding: 20px 0; }
.cab-tunnel .cab-suite .cab-reassure__item > div { display: flex; flex-direction: column; gap: 4px; }
.cab-suite__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
@media (max-width: 599px) { .cab-suite__actions .cab-btn { width: 100%; justify-content: center; } }

/* Fil d'Ariane : un titre long (« Visite dégustation de la Cabane à Plantes »)
   écrasait les liens précédents, qui passaient sur deux lignes en colonnes
   (« Ateliers & / visites »). Les liens gardent leur largeur, le dernier élément —
   la page où l'on est, que le titre répète juste dessous — se coupe en « … ». */
.cab-ariane > * { flex: none; white-space: nowrap; }
.cab-ariane > [aria-current] { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* ---------- Des angles arrondis partout (24/09) ---------- */
/* Le kit prévoyait des angles droits (--cab-radius: 0) quand le reste du site s'est
   arrondi : cartes à 10 px, boutons en pilule. Les champs suivent maintenant la
   variable (10 px) ; restaient carrés la recherche et l'espace client. */
.cab-recherche__form .cab-input { border-radius: 999px; padding: 0 22px; }

/* Mon compte, une fois connecté : le menu, les avis de WooCommerce, les boutons. */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a { border-radius: 10px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li { border-radius: 10px; }
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-notice { border-radius: 12px; }
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content a.button { border-radius: 999px; }
.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea { border-radius: 10px; }
/* Les avis de WooCommerce ailleurs (panier, fiche) prennent le même arrondi. */
.woocommerce-info, .woocommerce-message, .woocommerce-error { border-radius: 12px; }

/* Fiche produit, « Ce qu'on en dit » : l'invitation sur un tiers, les avis sur les
   deux autres (ceux du produit, puis des avis Google sur la ferme, au hasard). */
.cab-avis-bloc__grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 20px; align-items: stretch; }
.cab-avis-bloc__cartes { align-self: start; }
.cab-avis-bloc__cartes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.cab-avis-bloc__cartes:empty { display: none; }
@media (max-width: 899px) { .cab-avis-bloc__grille { grid-template-columns: 1fr; } }
@media (max-width: 599px) { .cab-avis-bloc__cartes { grid-template-columns: 1fr; } }

/* ---------- Cookies et médias tiers (remplacent Complianz, 24/09) ---------- */

/* Le bandeau n'existe que si un outil à cookies est réglé : une carte discrète en bas
   à gauche, « Refuser » et « Accepter » de même taille. */
.cab-cookies {
  position: fixed; left: 16px; bottom: 16px; z-index: 9990;
  width: min(400px, calc(100vw - 32px)); padding: 18px 20px;
  background: var(--cab-bg); color: var(--cab-ink);
  border: 1px solid var(--cab-line); border-radius: 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}
.cab-cookies[hidden] { display: none; }
.cab-cookies__texte { margin: 0 0 14px; font-size: 14px; line-height: 1.55; }
.cab-cookies__texte a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cab-cookies__choix { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cab-cookies__choix .cab-btn { width: 100%; justify-content: center; }
@media (prefers-reduced-motion: no-preference) {
  .cab-cookies:not([hidden]) { animation: cab-merci 320ms cubic-bezier(0.23, 1, 0.32, 1) both; }
}
.cab-footer__cookies { margin-left: 12px; color: inherit; }

/* Une vidéo ou un podcast d'un autre site : chargé seulement au clic. */
.cab-media-tiers {
  display: flex; flex-direction: column; justify-content: center; gap: 4px;
  aspect-ratio: 16 / 9; margin: 24px 0; padding: 24px;
  background: var(--cab-bg-soft); border-radius: 14px; text-align: center;
}
.cab-media-tiers--audio { aspect-ratio: auto; min-height: 180px; }
.cab-media-tiers p { margin: 0; }
.cab-media-tiers__texte { font-family: var(--cab-font-display); font-weight: 300; font-size: 20px; }
.cab-media-tiers__actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px; margin-top: 10px !important; }
.cab-media-tiers__actions a { color: var(--cab-ink); text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }
.cab-media-tiers__note { margin-top: 8px !important; font-size: 12px; color: var(--cab-muted); }
.cab-media-tiers.is-lu { padding: 0; overflow: hidden; background: #000; }
.cab-media-tiers.is-lu iframe { width: 100%; height: 100%; border: 0; display: block; }
.cab-media-tiers--audio.is-lu { background: none; min-height: 220px; }
.cab-media-tiers--audio.is-lu iframe { height: 220px; }

/* Réservation d'un atelier à acompte : ce qu'on paie aujourd'hui, le solde et sa date. */
.cab-resa__acompte { margin: 10px 0 0; padding: 12px 14px; border-radius: 10px; background: var(--cab-bg-soft); font-size: 13px; line-height: 1.5; }
.cab-resa__acompte[hidden] { display: none; }

/* « Vous l'avez goûté ? » : le titre au-dessus de la phrase, pas à la même taille (la
   règle des paragraphes de la carte le ramenait à 14 px). Le formulaire s'ouvre dans
   la carte, dans sa colonne : les avis à droite ne bougent pas. */
.cab-avis__invite .cab-avis__invite-titre { font-size: clamp(24px, 2vw, 28px); line-height: 1.2; }
.cab-avis__invite .cab-avis__volet { width: 100%; }
.cab-avis__invite .cab-avis-form select { max-width: none; }

/* Formulaire d'avis ouvert : le bouton qui l'a ouvert s'efface (fiches produit et
   ateliers). */
.cab-xp-avis__volet[open] > summary { display: none; }

/* La note en étoiles. Le script de WooCommerce remplace la liste « Votre note » par cinq
   liens (« 1 étoile sur 5 »…) ; sa feuille de style, qui les dessine en étoiles, n'est
   pas chargée par le thème : le texte s'affichait tel quel. Le libellé reste lu par
   les lecteurs d'écran, seule l'étoile se voit. Survol : les étoiles se remplissent
   jusqu'au curseur ; choix : jusqu'à la note donnée. */
.cab-avis-form p.stars { margin: 0; line-height: 1; }
.cab-avis-form p.stars span { display: inline-flex; gap: 2px; }
.cab-avis-form p.stars a {
  position: relative; display: inline-block; width: 40px; height: 40px;
  overflow: hidden; text-indent: 100%; white-space: nowrap; color: var(--cab-ink); text-decoration: none;
}
.cab-avis-form p.stars a::before {
  content: "☆"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  text-indent: 0; font-size: 30px; line-height: 1; font-family: system-ui, sans-serif;
}
.cab-avis-form p.stars:hover a::before,
.cab-avis-form p.stars.selected a::before { content: "★"; }
.cab-avis-form p.stars:hover a:hover ~ a::before,
.cab-avis-form p.stars.selected:not(:hover) a.active ~ a::before { content: "☆"; }
.cab-avis-form p.stars a:focus-visible { outline: 2px solid var(--cab-ink); outline-offset: 2px; border-radius: 6px; }

/* La note sous le titre : cinq étoiles noires (estompées au-delà de la note) et le
   nombre d'avis, le tout cliquable vers « Ce qu'on en dit ». */
a.cab-fiche__note { color: var(--cab-ink); text-decoration: none; font-size: 13px; gap: 8px; min-height: 32px; }
a.cab-fiche__note:hover span:last-child { text-decoration: underline; text-underline-offset: 3px; }
.cab-fiche__etoiles { display: inline-flex; gap: 2px; }
.cab-fiche__etoile svg { width: 15px; height: 15px; fill: var(--cab-ink); stroke: none; }
.cab-fiche__etoile:not(.is-pleine) svg { opacity: 0.2; }
.cab-avis-bloc { scroll-margin-top: calc(var(--cab-header-h-compact) + 40px); }