.jb4wood-avis-v2 {
    position: relative;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center;
    overflow: hidden;
    /* Autorise les particules a deborder de 32px haut/bas (clip lateral conserve)
       sans creer de scrollbar parasite. */
    clip-path: inset(-32px 0 -32px 0);
    -webkit-clip-path: inset(-32px 0 -32px 0);
    box-sizing: border-box;
}
.jb4wood-avis-v2 .jb-avis-carousel {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.jb4wood-avis-v2 .jb4wood-avis-eyebrow,
.jb4wood-avis-v2 .jb4wood-avis-title { display: none !important; }

/* Pill note globale — CLIQUABLE → ouvre la liste Google des avis.
   Fond jaune or (gradient d'origine) + backdrop-filter blur 1.5px (glassmorphism comme CTA).
   Conservé : border doré, lueur dorée box-shadow, couleurs textes. */
.jb-avis-rating-pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    background: rgba(248, 245, 240, 0.20);
    backdrop-filter: var(--jb-blur-1-5);
    -webkit-backdrop-filter: var(--jb-blur-1-5);
    border: 1px solid rgba(245,180,0,0.55);
    border-radius: 18px;
    margin-bottom: 1.4rem;
    font-family: 'Signika','Arial Black',Impact,sans-serif;
    font-size: 1rem;
    box-shadow: 0 2px 10px rgba(245,180,0,0.22);
    text-decoration: none !important;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.jb-avis-rating-pill:hover,
.jb-avis-rating-pill:focus-visible {
    transform: translateY(-1px) scale(1.03);
    box-shadow: 0 4px 16px rgba(245,180,0,0.40);
    background: rgba(248, 245, 240, 0.35);
}
.jb-avis-rating-pill .jb-rating-stars { color: #f5b400; letter-spacing: 1px; font-size: 1rem; }
.jb-avis-rating-pill .jb-rating-num { color: #14544A; font-size: 1.05rem; }
.jb-avis-rating-pill .jb-rating-sep { color: #7C6145; }
.jb-avis-rating-pill .jb-rating-count { color: #493828; }

/* Carrousel container — coverflow FULL-WIDTH bord à bord sur tous écrans */
.jb-avis-carousel {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: none;          /* plus de cap → adapte à n'importe quelle taille d'écran */
    overflow: hidden;
    padding: 1.5rem 0;
    user-select: none;
    -webkit-user-select: none;
    touch-action: pan-y;
}

/* PERF : pause des animations lettres infinite hors viewport.
   Particules : transform-only (compositor-only, coût GPU négligeable) → pas de pause utile. */
.jb-avis-carousel:not(.is-revealed) .jb-hl-letter {
    animation-play-state: paused !important;
}

/* Pill et carousel : z-index pour passer au-dessus du body::before parallax */
.jb4wood-avis-v2 .jb-avis-rating-pill,
.jb4wood-avis-v2 .jb-avis-carousel {
    position: relative;
    z-index: 2;
}
/* Particules dorées (10 spans, 4 keyframes, transform-only sur compositor GPU).
   Hauteur du conteneur FIXE 360px ancré en haut → particules ne suivent pas la croissance
   du carousel quand une grande card arrive (positions stables). Z-index 1 : sous la pill
   (z=2) et le carousel (z=2) → flottent derrière les cards. */
.jb-avis-particles {
    position: absolute;
    top: -32px;
    left: 0;
    right: 0;
    height: 424px;             /* Etendu : +32px haut + +32px bas hors section avis */
    pointer-events: none;
    overflow: visible;          /* Particules autorisees a sortir de la box (effet plus aere) */
    z-index: 1;
}
.jb-avis-particles .jb-particle {
    position: absolute;
    width: 7px; height: 7px;
    /* JAUNE (default) — cœur jaune vif → or saturé → transparent + halo doré */
    background: radial-gradient(circle,
        rgba(255,235,120,1) 0%,
        rgba(255,200,40,0.95) 30%,
        rgba(245,180,0,0.65) 55%,
        rgba(245,180,0,0) 75%);
    box-shadow: 0 0 10px 1px rgba(255,210,60,0.55);
    border-radius: 50%;
    opacity: 0;
    will-change: transform, opacity;
}
/* JAUNE AMBRÉ — 6 particules (un cran plus chaud que default, vers #e8a000) */
.jb-avis-particles .jb-p2,
.jb-avis-particles .jb-p7,
.jb-avis-particles .jb-p10,
.jb-avis-particles .jb-p12,
.jb-avis-particles .jb-p15,
.jb-avis-particles .jb-p18 {
    background: radial-gradient(circle,
        rgba(255,225,150,1) 0%,
        rgba(250,195,80,0.95) 30%,
        rgba(220,165,30,0.65) 55%,
        rgba(220,165,30,0) 75%);
    box-shadow: 0 0 10px 1px rgba(250,195,80,0.55);
}
/* JAUNE PÂLE — 6 particules (plus clair, doré crème vers #f8d050) */
.jb-avis-particles .jb-p1,
.jb-avis-particles .jb-p4,
.jb-avis-particles .jb-p9,
.jb-avis-particles .jb-p14,
.jb-avis-particles .jb-p17,
.jb-avis-particles .jb-p20 {
    background: radial-gradient(circle,
        rgba(255,245,180,1) 0%,
        rgba(255,225,120,0.95) 30%,
        rgba(245,200,60,0.60) 55%,
        rgba(245,200,60,0) 75%);
    box-shadow: 0 0 10px 1px rgba(255,225,120,0.50);
}
/* Positions en pixels dans la zone fixe 360px : ne dépendent plus de la hauteur du parent. */
.jb-avis-particles .jb-p1  { top:  60px; left:  8%; width: 5px; height: 5px; animation: jb-drift-up         14s ease-in-out infinite; animation-delay: 0s;    }
.jb-avis-particles .jb-p2  { top:  40px; left: 88%; width: 6px; height: 6px; animation: jb-drift-down       15s ease-in-out infinite; animation-delay: 1.4s;  }
.jb-avis-particles .jb-p3  { top: 200px; left: 72%; width: 4px; height: 4px; animation: jb-drift-up-left    13s ease-in-out infinite; animation-delay: 2.8s;  }
.jb-avis-particles .jb-p4  { top: 110px; left: 12%; width: 6px; height: 6px; animation: jb-drift-up-right   16s ease-in-out infinite; animation-delay: 4.1s;  }
.jb-avis-particles .jb-p5  { top: 280px; left: 45%; width: 5px; height: 5px; animation: jb-drift-up         13s ease-in-out infinite; animation-delay: 5.6s;  }
.jb-avis-particles .jb-p6  { top:  90px; left: 38%; width: 4px; height: 4px; animation: jb-drift-down       14s ease-in-out infinite; animation-delay: 7.0s;  }
.jb-avis-particles .jb-p7  { top: 230px; left: 25%; width: 7px; height: 7px; animation: jb-drift-up-left    15s ease-in-out infinite; animation-delay: 8.5s;  }
.jb-avis-particles .jb-p8  { top: 310px; left: 78%; width: 5px; height: 5px; animation: jb-drift-up         12s ease-in-out infinite; animation-delay: 9.8s;  }
.jb-avis-particles .jb-p9  { top:  30px; left: 55%; width: 6px; height: 6px; animation: jb-drift-down       14s ease-in-out infinite; animation-delay: 11.2s; }
.jb-avis-particles .jb-p10 { top: 170px; left: 92%; width: 4px; height: 4px; animation: jb-drift-up-right   13s ease-in-out infinite; animation-delay: 12.7s; }
/* +10 particules ordi uniquement (cf @media mobile : display:none ≤768px) */
.jb-avis-particles .jb-p11 { top: 150px; left: 18%; width: 5px; height: 5px; animation: jb-drift-up         15s ease-in-out infinite; animation-delay: 0.7s;  }
.jb-avis-particles .jb-p12 { top: 280px; left: 82%; width: 6px; height: 6px; animation: jb-drift-down       13s ease-in-out infinite; animation-delay: 2.1s;  }
.jb-avis-particles .jb-p13 { top: 100px; left: 65%; width: 4px; height: 4px; animation: jb-drift-up-left    14s ease-in-out infinite; animation-delay: 3.5s;  }
.jb-avis-particles .jb-p14 { top: 320px; left: 30%; width: 6px; height: 6px; animation: jb-drift-up-right   15s ease-in-out infinite; animation-delay: 4.9s;  }
.jb-avis-particles .jb-p15 { top:  50px; left: 42%; width: 5px; height: 5px; animation: jb-drift-up         13s ease-in-out infinite; animation-delay: 6.3s;  }
.jb-avis-particles .jb-p16 { top: 240px; left: 60%; width: 4px; height: 4px; animation: jb-drift-down       14s ease-in-out infinite; animation-delay: 7.7s;  }
.jb-avis-particles .jb-p17 { top:  80px; left: 78%; width: 7px; height: 7px; animation: jb-drift-up-left    16s ease-in-out infinite; animation-delay: 9.2s;  }
.jb-avis-particles .jb-p18 { top: 260px; left: 15%; width: 5px; height: 5px; animation: jb-drift-up         12s ease-in-out infinite; animation-delay: 10.5s; }
.jb-avis-particles .jb-p19 { top: 130px; left: 35%; width: 6px; height: 6px; animation: jb-drift-down       15s ease-in-out infinite; animation-delay: 11.9s; }
.jb-avis-particles .jb-p20 { top: 200px; left: 50%; width: 4px; height: 4px; animation: jb-drift-up-right   14s ease-in-out infinite; animation-delay: 13.4s; }

/* Mobile : tue toutes les particules (perf GPU + lisibilité sur petit écran) */
@media (max-width: 768px) {
    .jb-avis-particles { display: none; }
}

/* Keyframes enrichies : multi-peaks d'opacity + scale pour effet de scintillement */
@keyframes jb-drift-up {
    0%, 100% { transform: translate3d(0, 0, 0) scale(0.5);  opacity: 0; }
    12%      { transform: translate3d(4px, -25px, 0) scale(1.1); opacity: 1; }
    28%      { transform: translate3d(10px, -55px, 0) scale(0.85); opacity: 0.55; }
    44%      { transform: translate3d(14px, -80px, 0) scale(1.25); opacity: 1; }
    62%      { transform: translate3d(18px, -105px, 0) scale(0.9); opacity: 0.65; }
    78%      { transform: translate3d(20px, -120px, 0) scale(1.15); opacity: 0.95; }
    90%      { opacity: 0.4; }
}
@keyframes jb-drift-down {
    0%, 100% { transform: translate3d(0, 0, 0) scale(0.5); opacity: 0; }
    12%      { transform: translate3d(-3px, 18px, 0) scale(1.05); opacity: 1; }
    30%      { transform: translate3d(-8px, 45px, 0) scale(0.85); opacity: 0.55; }
    48%      { transform: translate3d(-12px, 70px, 0) scale(1.2); opacity: 1; }
    66%      { transform: translate3d(-14px, 88px, 0) scale(0.9); opacity: 0.65; }
    82%      { transform: translate3d(-15px, 100px, 0) scale(1.1); opacity: 0.9; }
    92%      { opacity: 0.4; }
}
@keyframes jb-drift-up-left {
    0%, 100% { transform: translate3d(0, 0, 0) scale(0.5); opacity: 0; }
    14%      { transform: translate3d(-15px, -10px, 0) scale(1.1); opacity: 1; }
    32%      { transform: translate3d(-35px, -25px, 0) scale(0.85); opacity: 0.55; }
    50%      { transform: translate3d(-55px, -38px, 0) scale(1.25); opacity: 1; }
    68%      { transform: translate3d(-65px, -45px, 0) scale(0.9); opacity: 0.65; }
    82%      { transform: translate3d(-70px, -50px, 0) scale(1.15); opacity: 0.95; }
    92%      { opacity: 0.4; }
}
@keyframes jb-drift-up-right {
    0%, 100% { transform: translate3d(0, 0, 0) scale(0.5); opacity: 0; }
    14%      { transform: translate3d(15px, -12px, 0) scale(1.1); opacity: 1; }
    32%      { transform: translate3d(35px, -28px, 0) scale(0.85); opacity: 0.55; }
    50%      { transform: translate3d(55px, -45px, 0) scale(1.25); opacity: 1; }
    68%      { transform: translate3d(65px, -55px, 0) scale(0.9); opacity: 0.65; }
    82%      { transform: translate3d(70px, -60px, 0) scale(1.15); opacity: 0.95; }
    92%      { opacity: 0.4; }
}
@media (prefers-reduced-motion: reduce) {
    .jb-avis-particles .jb-particle { animation: none; opacity: 0; }
}

/* Track : positionnement absolu des slides depuis le centre.
   Hauteur ajustée par JS au max contenu pour éviter coupure de texte. */
.jb-avis-track {
    position: relative;
    width: 100%;
    height: 280px;             /* min, JS surcharge au montage */
    cursor: grab;
    transition: height 0.4s ease;
}
.jb-avis-track.is-dragging { cursor: grabbing; }
.jb-avis-track.is-dragging .jb-avis-slide {
    transition: none !important;
    /* On garde backdrop-filter actif pendant le drag pour ne pas créer de saut visuel
       (perte de blur + perte de mask créaient un effet désagréable au touch).
       Le blur étant léger (2-3px), la perf reste acceptable. */
}
/* GPU compositing hints — force chaque slide sur sa propre couche compositée */
.jb-avis-slide {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}
.jb-avis-track {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    perspective: 1000px;
}

.jb-avis-slide {
    position: absolute;
    top: 0;
    left: 50%;
    width: 95%;
    max-width: 1000px;
    box-sizing: border-box;
    padding: 1.3rem 1.6rem 1.5rem;
    text-align: center;
    /* Fond opaque sur les voisines, pas de backdrop-filter (test perf) */
    background: rgba(245, 240, 232, 0.80);
    border: 1px solid rgba(124,97,69,0.30);
    border-radius: 18px;
    box-shadow:
        0 10px 30px rgba(20, 84, 74, 0.06),
        0 3px 10px rgba(73, 56, 40, 0.04),
        inset 0 1px 0 rgba(255,255,255,0.4);
    /* Caché tant que le JS layout n'est pas appliqué → évite le "flash vert" au mount
       (les 22 cards sont rendues empilées avec leurs ombres vertes avant que le JS
       ne les positionne en coverflow). Révélé via la classe .is-revealed (IntersectionObserver). */
    visibility: hidden;
    transform: translateX(-50%);
    transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.45s ease, background 0.45s ease, box-shadow 0.45s ease;
    will-change: transform, opacity, background;
}
.jb-avis-slide.is-active {
    z-index: 10;
    cursor: default;
    /* Card hero : "frosted glass" SANS backdrop-filter (cause irrécupérable du bug ghost
       sur iOS Safari pendant les transitions). Effet simulé via radial-gradient + multi
       box-shadow inset → impression de profondeur lumineuse, perf totalement neutre. */
    background:
        radial-gradient(ellipse at top left, rgba(255,255,255,0.55), transparent 65%),
        radial-gradient(ellipse at bottom right, rgba(232,228,224,0.45), transparent 70%),
        linear-gradient(135deg, rgba(255,255,255,0.92) 0%, rgba(245,240,232,0.86) 100%);
    box-shadow:
        0 14px 36px rgba(20, 84, 74, 0.10),
        0 4px 12px rgba(73, 56, 40, 0.05),
        inset 0 1px 2px rgba(255,255,255,0.7),
        inset 0 -1px 2px rgba(73, 56, 40, 0.05);
}
/* Révélation du carousel après IntersectionObserver fire (layout JS appliqué) */
.jb-avis-carousel.is-revealed .jb-avis-slide {
    visibility: visible;
}
/* Slides non-actives : curseur pointer pour signaler qu'elles sont cliquables */
.jb-avis-slide:not(.is-active) {
    cursor: pointer;
}

/* Guillemets ouvrant + fermant en watermark — positionnés sur le SLIDE entier
   pour rester dans la card sans être coupés par overflow */
.jb-avis-slide blockquote {
    padding: 0 24px;
}
.jb-avis-slide::before,
.jb-avis-slide::after {
    position: absolute;
    font-family: Georgia, 'Playfair Display', 'Adobe Caslon Pro', serif;
    font-size: 4.2rem;
    line-height: 0.8;
    color: rgba(124,97,69,0.30);
    user-select: none;
    font-weight: 400;
    pointer-events: none;
    z-index: 1;
}
.jb-avis-slide::before {
    content: "\201C";       /* ouvrant courbe */
    left: 14px;
    top: 32px;              /* descendu pour s'aligner avec le début du texte (sous les étoiles) */
}
.jb-avis-slide::after {
    content: "\201D";       /* fermant courbe */
    right: 14px;
    bottom: 8px;
}
@media (max-width: 640px) {
    .jb-avis-slide blockquote { padding: 0 18px; }
    .jb-avis-slide::before,
    .jb-avis-slide::after {
        font-size: 3.2rem;
    }
    .jb-avis-slide::before { left: 10px; top: 24px; }
    .jb-avis-slide::after  { right: 10px; bottom: 6px; }
}

/* Étoiles */
.jb-avis-stars {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin: 0.4rem 0 0.8rem;
}
.jb-avis-stars svg {
    width: 22px;
    height: 22px;
    fill: #d8d3c8;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,0.10));
    transition: fill 0.3s ease, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.3s ease;
}
.jb-avis-stars svg.on { fill: #f5b400; }
/* Cascade glow auto sur la carte active */
/* Animation des étoiles : scale + rotate uniquement (PAS de drop-shadow doré, instable à
   l'extinction). Étoiles dorées statiques + petite "danse" en cascade à l'arrivée. */
.jb-avis-slide.is-active .jb-avis-stars svg.on {
    animation: jb-avis-star-glow 1.4s ease-in-out both;
}
.jb-avis-slide.is-active .jb-avis-stars svg.on:nth-child(1) { animation-delay: 0.05s; }
.jb-avis-slide.is-active .jb-avis-stars svg.on:nth-child(2) { animation-delay: 0.18s; }
.jb-avis-slide.is-active .jb-avis-stars svg.on:nth-child(3) { animation-delay: 0.31s; }
.jb-avis-slide.is-active .jb-avis-stars svg.on:nth-child(4) { animation-delay: 0.44s; }
.jb-avis-slide.is-active .jb-avis-stars svg.on:nth-child(5) { animation-delay: 0.57s; }
@keyframes jb-avis-star-glow {
    /* Lueur dorée calée sur les mêmes paliers que le scale/rotate.
       0% et 100% = drop-shadow transparent (alpha 0) → aucun saut de couleur en début ou fin
       (jamais de transition or→noir, qui était LA cause du bug visuel précédent). */
    0%   { transform: scale(1)    rotate(0deg);  filter: drop-shadow(0 0 0 rgba(245,180,0,0)); }
    18%  { transform: scale(1.10) rotate(-4deg); filter: drop-shadow(0 0 6px rgba(245,180,0,0.50)); }
    40%  { transform: scale(1.20) rotate(-6deg); filter: drop-shadow(0 0 12px rgba(245,180,0,0.95)); }
    58%  { transform: scale(1.13) rotate(0deg);  filter: drop-shadow(0 0 9px rgba(245,180,0,0.75)); }
    72%  { transform: scale(1.07) rotate(3deg);  filter: drop-shadow(0 0 6px rgba(245,180,0,0.50)); }
    88%  { transform: scale(1.03) rotate(1deg);  filter: drop-shadow(0 0 3px rgba(245,180,0,0.25)); }
    100% { transform: scale(1)    rotate(0deg);  filter: drop-shadow(0 0 0 rgba(245,180,0,0)); }
}

/* Texte avis */
.jb-avis-slide blockquote {
    margin: 0;
    padding: 0;
    border: none;
    font-style: italic;
    font-family: var(--jb-serif); /* serif standard Constantia (ex-Lora) — citation avis (var globale :root jb4wood-style.php) */
    color: #14544A;
    font-size: clamp(1rem, 1.3vw, 1.12rem);
    line-height: 1.55;
    quotes: "\201C" "\201D";
    /* Pas de césure auto, casse uniquement entre mots (default normal pour le français) */
    hyphens: none;
    -webkit-hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
}
.jb-avis-slide blockquote p { margin: 0; }

/* === Animation lettre par lettre des mots surlignés ====
   Pas de animation-delay CSS (instable sur N éléments avec calc). Le JS déclenche
   chaque lettre via setTimeout par mot enregistré au montage (cf. registerHighlights). */
.jb-hl-letter {
    display: inline-block;
    transform-origin: 50% 50%;
}
@keyframes jb-hl-pulse {
    0%   { transform: scale(1); }
    35%  { transform: scale(1.30) translateY(-1px); }
    100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .jb-hl-letter { animation: none !important; }
}

/* Mots valorisants : ressortent davantage (couleur or-bois plus profonde + bigger + soft shadow). */
.jb-avis-hl {
    background: none;
    color: #7C6145;
    font-weight: 800;
    font-style: normal;
    font-size: 1.12em;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}
/* Wrapper par mot : empêche la casse entre lettres (inline-block) tout en permettant
   la casse aux espaces entre mots (TextNode). Critique pour expressions multi-mots. */
.jb-hl-word {
    display: inline-block;
    white-space: nowrap;
}
.jb-avis-author {
    margin-top: 1rem;
    font-style: normal;
}
.jb-avis-author cite {
    display: inline;
    font-family: 'Signika','Arial Black',Impact,sans-serif;
    color: #493828;
    font-size: 1rem;
    font-style: normal;
}
.jb-avis-author .jb-avis-when {
    color: #6b6058;
    font-size: 0.85rem;
    font-style: italic;
    margin-left: 8px;
}

/* Zones d'appui : 50% chacune → elles se REJOIGNENT au centre (aucun trou).
   AU-DESSUS de tout (z=200), invisibles. En couvrant tout le carrousel, la cible
   du touch est TOUJOURS un bouton tap (jamais .jb-avis-slide.is-active), donc
   onStart() ne s'auto-annule plus → le SWIPE fonctionne depuis n'importe où
   (centre inclus). Tap : moitié gauche = précédent, moitié droite = suivant. */
.jb-avis-tap,
.jb-avis-tap:hover,
.jb-avis-tap:focus,
.jb-avis-tap:active,
.jb-avis-tap:focus-visible {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 50% !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    z-index: 200 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    color: transparent !important;
    -webkit-tap-highlight-color: transparent !important;
    transform: none !important;
    transition: none !important;
    text-shadow: none !important;
    font: inherit !important;
}
.jb-avis-tap::before,
.jb-avis-tap::after {
    display: none !important;
    content: none !important;
}
.jb-avis-tap-left  { left: 0 !important; right: auto !important; }
.jb-avis-tap-right { right: 0 !important; left: auto !important; }

/* Boutons navigation prev/next (desktop + paysage mobile)
   Pas de fond/bordure/ombre — juste la flèche en marron avec text-shadow pour la lisibilité */
.jb-avis-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px; height: 44px;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    color: #493828;
    font-size: 2.4rem;
    font-weight: 800;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    text-shadow: 0 1px 3px rgba(255,255,255,0.7), 0 0 8px rgba(255,255,255,0.4);
    transition: color 0.2s ease, transform 0.2s ease;
    z-index: 3;
    line-height: 1;
    padding: 0;
}
.jb-avis-nav:hover { color: #7C6145; transform: translateY(-50%) scale(1.15); }
.jb-avis-prev { left: 8px; }
.jb-avis-next { right: 8px; }

/* Mobile : nav arrows masqués (swipe natif). Card hero quasi pleine largeur.
   Spécificité élevée + min-width pour battre tout container parent qui limiterait. */
@media (max-width: 640px) {
    .jb-avis-nav { display: flex !important; width: 36px; height: 36px; font-size: 2rem; }
    .jb4wood-avis-v2 .jb-avis-carousel,
    .jb4wood-avis-v2 .jb-avis-track {
        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 100vw !important;
    }
    .jb4wood-avis-v2 .jb-avis-track .jb-avis-slide {
        width: 92vw !important;
        max-width: 92vw !important;
        min-width: 92vw !important;
        padding: 1.1rem 1.2rem 1.3rem;
    }
    .jb-avis-quote-mark { font-size: 4.5rem; }
    .jb-avis-slide blockquote { font-size: 0.98rem; }
}

/* Boutons supprimés (pill en haut = action principale) */
.jb4wood-avis-v2 .jb4wood-avis-actions { display: none !important; }

/* Desktop only : carte hero alignee sur la largeur du bandeau presse (720px max) */
@media (min-width: 1024px) {
    .jb4wood-avis-v2 .jb-avis-slide {
        max-width: 720px !important;
    }
}