/* ==================================================================
 * Nouveau design "Miellerie, cire & garrigue" (2026-10)
 * Chargé après theme.min.css uniquement quand $refonte est vrai
 * (registre theme.refonte ou cookie d'aperçu). Tout est préfixé par body.refonte.
================================================================== */

@font-face {
    font-family: 'Fraunces';
    src: url(../fonts/fraunces-latin.woff2) format('woff2');
    font-weight: 400 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fraunces';
    src: url(../fonts/fraunces-italic-latin.woff2) format('woff2');
    font-weight: 400 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url(../fonts/dmsans-latin.woff2) format('woff2');
    font-weight: 400 700;
    font-style: normal;
    font-display: swap;
}

body.refonte {
    --sapin: #34432E;
    --sapin-fonce: #1F2A1B;
    --miel: #F2C81B;
    --chataignier: #8A5A10;
    --cire: #F1E8D6;
    --cire-bord: #E6DCC8;
    --lin: #FBF7EF;
    --encre: #2B2A22;
    --texte-doux: #55513F;
    --titres: 'Fraunces', Georgia, serif;
    --texte: 'DM Sans', system-ui, -apple-system, sans-serif;
    --largeur: 1240px;
    --carte: #F6EEDD; /* fond des cartes et encadrés : cire claire, jamais blanc pur */
    --rayon: 24px;
    --ombre: 0 2px 6px rgba(52, 67, 46, .06), 0 12px 28px rgba(52, 67, 46, .08);

    font-family: var(--texte);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.6;
    color: var(--encre);
    background: var(--lin);
}

/* ---------- base ---------- */

body.refonte .content_body,
body.refonte #contenu,
body.refonte #contenu_body {
    background: var(--lin);
}

body.refonte #contenu {
    margin-top: 0;
}

body.refonte h1, body.refonte .h1,
body.refonte h2, body.refonte .h2,
body.refonte h3, body.refonte .h3,
body.refonte h4, body.refonte .h4 {
    font-family: var(--titres);
    font-weight: 500;
    color: var(--encre);
    letter-spacing: -.015em;
    line-height: 1.15;
    text-transform: none;
}

body.refonte h1, body.refonte .h1 { font-size: clamp(34px, 4.2vw, 52px); }
body.refonte h2, body.refonte .h2 { font-size: clamp(28px, 3.2vw, 40px); }
body.refonte h3, body.refonte .h3 { font-size: 22px; }
body.refonte h4, body.refonte .h4 { font-size: 19px; }

body.refonte h2::after, body.refonte .h2::after {
    display: none;
}

body.refonte .cms h1 { margin-bottom: 3rem; }
body.refonte .cms h2, body.refonte .cms h3, body.refonte .cms h4 { margin-top: 3rem; }

body.refonte a,
body.refonte .cms a:not(.button) {
    color: var(--sapin);
}

body.refonte a:hover,
body.refonte a:focus {
    color: var(--sapin-fonce);
    opacity: 1;
}

body.refonte p { line-height: 1.65; }

body.refonte .rf-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

body.refonte .rf-wrap,
body.refonte .container {
    width: auto;
    max-width: var(--largeur);
    margin-left: auto;
    margin-right: auto;
    padding-left: 32px;
    padding-right: 32px;
    box-sizing: border-box;
}

body.refonte .container .container { padding-left: 0; padding-right: 0; }

/* ---------- boutons ---------- */

body.refonte .rf-btn,
body.refonte .button,
body.refonte .btn,
body.refonte .btn-custom {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 0 28px;
    border-radius: 999px;
    border: 1.5px solid var(--sapin);
    background: var(--sapin);
    color: var(--lin);
    font-family: var(--texte);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
    box-shadow: none;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

body.refonte .rf-btn:hover,
body.refonte .button:hover,
body.refonte .btn:hover,
body.refonte .btn-custom:hover {
    background: var(--sapin-fonce);
    border-color: var(--sapin-fonce);
    color: var(--lin);
}

body.refonte .button::after,
body.refonte .btn::after,
body.refonte .btn-primary::after {
    display: none !important;
}

body.refonte .rf-btn-contour,
body.refonte .btn-secondary,
body.refonte .btn-outline-primary {
    background: transparent;
    color: var(--sapin);
}

body.refonte .rf-btn-contour:hover,
body.refonte .btn-secondary:hover,
body.refonte .btn-outline-primary:hover {
    background: var(--sapin);
    color: var(--lin);
}

body.refonte .rf-btn-miel {
    background: var(--miel);
    border-color: var(--miel);
    color: var(--encre);
}

body.refonte .rf-btn-miel:hover {
    background: #E3B80C;
    border-color: #E3B80C;
    color: var(--encre);
}

body.refonte .rf-btn-contour-clair {
    background: transparent;
    border-color: var(--lin);
    color: var(--lin);
}

body.refonte .rf-btn-contour-clair:hover {
    background: var(--lin);
    border-color: var(--lin);
    color: var(--sapin);
}

body.refonte .btn-small,
body.refonte .btn-sm {
    min-height: 40px;
    padding: 0 18px;
    font-size: 14px;
}

body.refonte .rf-boutons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
@media (max-width: 575px) {
    /* « Appeler avant de passer à la boutique » (accueil) : sur une ligne, sinon centré */
    body.refonte .rf-boutons .rf-btn { padding: 0 18px; font-size: 15px; text-align: center; }
}

body.refonte .rf-lien {
    font-weight: 600;
    color: var(--sapin);
}

body.refonte .rf-rond {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: var(--encre);
    transition: background-color .2s ease;
}

body.refonte .rf-rond:hover {
    background: var(--cire);
    color: var(--encre);
}

/* ---------- formulaires ---------- */

body.refonte input[type=text],
body.refonte input[type=email],
body.refonte input[type=password],
body.refonte input[type=tel],
body.refonte input[type=search],
body.refonte input[type=number],
body.refonte select,
body.refonte textarea {
    min-height: 48px;
    padding: 10px 16px;
    border: 1px solid var(--cire-bord);
    border-radius: 14px;
    background: #fff;
    font-family: var(--texte);
    font-size: 16px;
    color: var(--encre);
    box-shadow: none;
}

body.refonte textarea { min-height: 140px; }

body.refonte input:focus,
body.refonte select:focus,
body.refonte textarea:focus {
    outline: 2px solid var(--miel);
    outline-offset: 1px;
    border-color: var(--sapin);
}

body.refonte label,
body.refonte .label-title {
    font-weight: 500;
    color: var(--encre);
}

/* ---------- bandeau d'infos + en-tête ---------- */

body.refonte .rf-infobar {
    background: var(--sapin);
    color: var(--cire);
    font-size: 14px;
    letter-spacing: .02em;
}

body.refonte .rf-infobar .rf-wrap {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px 28px;
    padding-top: 9px;
    padding-bottom: 9px;
}

body.refonte #header.rf-header,
body.refonte #header.rf-header.sticky {
    position: sticky;
    top: 0;
    left: auto;
    right: auto;
    z-index: 50;
    width: auto;
    height: auto;
    margin: 0;
    background: var(--lin);
    border-bottom: 1px solid var(--cire-bord);
    box-shadow: none;
}

body.refonte #header.rf-header.sticky {
    box-shadow: 0 6px 20px rgba(52, 67, 46, .08);
}

body.refonte #header.sticky + #contenu,
body.refonte:not(.page_home) #header.sticky + #contenu {
    margin-top: 0;
}

body.refonte .rf-header-top {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 24px;
    padding-top: 16px;
    padding-bottom: 16px;
}

body.refonte .rf-logo,
body.refonte #header.sticky .rf-logo {
    position: static;
    margin: 0;
    flex: 0 0 auto;
}

body.refonte .rf-logo img,
body.refonte #header.sticky .rf-logo img,
body.refonte #logo img {
    display: block;
    width: 350px;
    max-width: 100%;
    height: auto;
    margin: 0;
}

body.refonte .rf-recherche {
    flex: 1 1 260px;
    max-width: 380px;
}

body.refonte .rf-recherche .searchbar,
body.refonte .rf-recherche .searchbar.show {
    position: static;
    display: block;
    width: auto !important;
    height: auto;
    overflow: visible;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: none;
    padding: 0;
    box-shadow: none;
}

body.refonte .rf-recherche form {
    position: relative;
    display: flex;
    margin: 0;
}

body.refonte #searchblock #search {
    float: none;
    display: block;
    height: auto;
    border: 1px solid var(--cire-bord);
    font-weight: 400;
    color: var(--encre);
    width: 100%;
    min-height: 46px;
    padding: 0 52px 0 20px;
    border-radius: 999px;
    background: #fff;
}

body.refonte #searchblock #btsearch {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: var(--sapin);
    color: var(--lin);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

body.refonte .rf-acces {
    display: flex;
    gap: 22px;
    margin-left: auto;
    font-size: 15px;
    font-weight: 500;
}

body.refonte .rf-acces a {
    color: var(--encre);
    white-space: nowrap;
}

body.refonte .rf-acces a:hover { color: var(--sapin); }

body.refonte .rf-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

body.refonte #panierheaderTop {
    padding: 0;
}

body.refonte #panierheaderTop .rf-panier,
body.refonte #panierheaderTop .col-panier-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 18px 0 14px !important;
    border: 0;
    border-radius: 999px;
    background: var(--sapin);
    color: var(--lin);
}

body.refonte #panierheaderTop .col-panier-item:hover {
    background: var(--sapin-fonce);
    color: var(--lin);
    border: 0;
}

body.refonte #panierheaderTop .rb_icon { display: flex; }

body.refonte #panierheaderTop .nb_article {
    position: absolute;
    top: -4px;
    left: 28px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    background: var(--miel);
    color: var(--encre);
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
}

body.refonte #panierheaderTop .rb_total {
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
}

body.refonte #panier_close,
body.refonte .hide-panier #panier_close {
    position: static;
    width: 44px;
    height: 44px;
    right: auto;
    background: transparent;
}

body.refonte .rf-burger {
    display: none;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    position: relative;
}

body.refonte .rf-burger-barres,
body.refonte .rf-burger-barres::before,
body.refonte .rf-burger-barres::after {
    position: absolute;
    left: 11px;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: var(--encre);
    content: '';
    transition: transform .2s ease, opacity .2s ease;
}

body.refonte .rf-burger-barres { top: 21px; }
body.refonte .rf-burger-barres::before { top: -7px; left: 0; }
body.refonte .rf-burger-barres::after { top: 7px; left: 0; }

body.refonte.rf-menu-ouvert .rf-burger-barres { background: transparent; }
body.refonte.rf-menu-ouvert .rf-burger-barres::before { transform: translateY(7px) rotate(45deg); }
body.refonte.rf-menu-ouvert .rf-burger-barres::after { transform: translateY(-7px) rotate(-45deg); }

/* anciens éléments d'en-tête inutiles dans le nouveau design */
body.refonte #bandeau,
body.refonte #menu_launcher,
body.refonte #col-listing-panier,
body.refonte #menu-desktop header.mobile-only,
body.refonte .kyxar .none {
    display: none !important;
}

/* barre des rubriques (desktop) */
body.refonte #menu-desktop,
#home.refonte #menu-desktop,
body.refonte .hide-panier #menu-desktop {
    position: relative;
    z-index: 2;
    display: block;
    width: 100% !important;
    max-width: none;
    flex: none !important;
    height: auto;
    min-height: 0;
    transform: none;
    background: transparent;
    border-top: 1px solid var(--cire-bord);
}

body.refonte #menu-principal > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 4px;
    max-width: var(--largeur);
    margin: 0 auto;
    padding: 0 32px;
    font-family: var(--texte);
}

body.refonte #menu-principal > ul > li {
    position: relative;
    width: auto;
}

body.refonte #menu-principal > ul > li > a {
    display: block;
    width: auto;
    margin: 0;
    padding: 13px 14px;
    color: var(--encre);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: none;
    text-align: center;
    white-space: nowrap;
}

body.refonte #menu-principal > ul > li > a .icon { display: none; }

body.refonte #menu-principal > ul > li > a:hover,
body.refonte #menu-principal > ul > li.current > a {
    color: var(--sapin);
    opacity: 1;
    box-shadow: inset 0 -3px 0 var(--miel);
}


body.refonte #menu-principal ul li > ul.smenu,
body.refonte #menu-principal ul li:hover > ul.smenu {
    display: none;
}

body.refonte #menu-principal ul li:hover > ul.smenu,
body.refonte #menu-principal ul li:focus-within > ul.smenu {
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    right: auto;
    z-index: 10;
    width: 280px;
    margin: 0;
    padding: 10px;
    transform: translateX(-50%);
    background: var(--lin);
    border: 1px solid var(--cire-bord);
    border-radius: 18px;
    box-shadow: var(--ombre);
}

body.refonte #menu-principal ul.smenu > li {
    border: 0;
    width: auto;
}

body.refonte #menu-principal ul.smenu a.title_smenu {
    display: block;
    margin: 0;
    padding: 9px 14px;
    border-radius: 12px;
    color: var(--encre);
    font-size: 15px;
    text-align: left;
}

body.refonte #menu-principal ul.smenu a.title_smenu:hover {
    background: var(--cire);
    opacity: 1;
}

/* ---------- fil de l'abeille ---------- */

body.refonte .rf-fil {
    position: absolute;
    top: 0;
    left: 32px;
    right: 32px;
    max-width: 1176px;
    margin: 0 auto;
    z-index: 4;
    pointer-events: none;
}

body.refonte .rf-fil svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

body.refonte .rf-fil path {
    fill: none;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-dasharray: 6 14;
}

body.refonte .rf-fil-noir { stroke: var(--encre); }
body.refonte .rf-fil-jaune { stroke: var(--miel); stroke-dashoffset: -10; }

body.refonte .rf-abeille {
    position: absolute;
    width: 3.4%;
    min-width: 28px;
    height: auto;
    transform-origin: 6.5% 67.4%;
}

body.refonte .rf-avec-fil { position: relative; }

/* fil du haut de l'accueil : dessiné dans le repère du nid d'alvéoles */
body.refonte .rf-fil-entete {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    margin: 0;
}

/* ---------- accueil : haut de page ---------- */

body.refonte .rf-hero {
    display: flex;
    align-items: center;
    min-height: calc(100svh - var(--rf-haut-entete, 160px));
    padding: 104px 0 64px;
    box-sizing: border-box;
    background: var(--cire);
}

body.refonte .rf-hero > .rf-wrap {
    width: 100%;
    max-width: 1440px;
}

body.refonte .rf-hero-grille {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}

body.refonte .rf-hero-texte {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
}

body.refonte .rf-pastille {
    padding: 6px 14px;
    border-radius: 999px;
    background: #EFE4CC;
    color: #6B4A12;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body.refonte .rf-hero h1 {
    margin: 0;
    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.04;
    letter-spacing: -.02em;
}

body.refonte .rf-hero h1 em {
    color: var(--sapin);
    font-style: italic;
}

body.refonte .rf-hero-texte p {
    max-width: 520px;
    margin: 0;
    font-size: 19px;
    color: var(--texte-doux);
}

/* nid d'alvéoles : grande alvéole + 5 petites collées à ses côtés (boîte 560 x 620) */
body.refonte .rf-alveoles {
    position: relative;
    width: 100%;
    /* le nid tient dans la hauteur de l'écran */
    max-width: max(320px, calc((100svh - var(--rf-haut-entete, 160px) - 168px) * 560 / 620));
    margin-left: auto;
    aspect-ratio: 560 / 620;
    container-type: inline-size;
}

body.refonte .rf-hx {
    position: absolute;
    width: 26.79%;
    aspect-ratio: .866;
    overflow: hidden;
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

body.refonte .rf-hx img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.refonte .rf-hx-0 { left: 11.61%; top: 19.27%; width: 58.93%; }
body.refonte .rf-hx-1 { left: 50.18%; top: .89%; }
body.refonte .rf-hx-2 { left: 72.68%; top: 36.05%; }
body.refonte .rf-hx-3 { left: 5.18%; top: 71.21%; }
body.refonte .rf-hx-deco { left: 5.18%; top: .89%; background: var(--lin); }

body.refonte .rf-hx-horaires {
    left: 50.18%;
    top: 71.21%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 0 8%;
    background: var(--miel);
    color: var(--encre);
    text-align: center;
    line-height: 1.2;
    font-size: 2.7cqw;
}

body.refonte .rf-hx-surtitre {
    font-size: 2.3cqw;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.refonte .rf-hx-grand {
    font-family: var(--titres);
    font-size: 4.3cqw;
    font-weight: 500;
}

body.refonte .rf-hx-petit { font-size: 2.2cqw; }

body.refonte .rf-hx-contour {
    position: absolute;
    overflow: visible;
    fill: none;
    stroke-width: 2;
}

body.refonte .rf-hx-contour-1 { left: 90.18%; top: 10.8%; width: 7.14%; stroke: var(--miel); }
body.refonte .rf-hx-contour-2 { left: 2.5%; top: 47%; width: 5.71%; stroke: #C9BC9F; }

/* ---------- accueil : sections ---------- */

body.refonte .rf-section {
    padding: 96px 0;
}

body.refonte .rf-section-sombre {
    background: var(--sapin);
    color: #DCD6C3;
}

body.refonte .rf-section-sombre h2 { color: var(--lin); }
body.refonte .rf-section-sombre .rf-surtitre { color: var(--miel); }

body.refonte .rf-section-cire { background: var(--cire); }

body.refonte .rf-surtitre {
    display: block;
    color: var(--chataignier);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.refonte .rf-entete-section {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 44px;
}

body.refonte .rf-entete-section h2 {
    margin: 10px 0 0;
    font-size: clamp(32px, 3.4vw, 46px);
}

body.refonte .rf-deux-colonnes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 56px;
    align-items: center;
}

body.refonte .rf-texte-section {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

body.refonte .rf-texte-section h2 {
    margin: 0;
    font-size: clamp(32px, 3.4vw, 46px);
}

body.refonte .rf-texte-section p {
    max-width: 480px;
    margin: 0;
}

body.refonte .rf-photo {
    display: block;
    width: 100%;
    aspect-ratio: 5 / 4;
    object-fit: cover;
    border-radius: 28px;
}

body.refonte .rf-infos {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 22px 24px;
    list-style: none;
    border-radius: 20px;
    background: rgba(251, 247, 239, .08);
}

body.refonte .rf-infos li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}

body.refonte .rf-infos svg {
    flex: none;
    color: var(--miel);
}

body.refonte .rf-liste-visites {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

body.refonte .rf-liste-visites a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    border-radius: 20px;
    background: var(--cire);
    color: var(--encre);
    transition: background-color .2s ease;
}

body.refonte .rf-liste-visites a:hover {
    background: #EADFC8;
    color: var(--encre);
}

body.refonte .rf-visite-titre {
    display: block;
    font-family: var(--titres);
    font-size: 21px;
    font-weight: 500;
}

body.refonte .rf-visite-detail {
    font-size: 15px;
    color: var(--texte-doux);
}

body.refonte .rf-prix {
    font-weight: 600;
    white-space: nowrap;
}

body.refonte .rf-mosaique {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

body.refonte .rf-mosaique img {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 28px;
}

body.refonte .rf-mosaique img:first-child {
    grid-row: span 2;
    height: 100%;
    aspect-ratio: auto;
    min-height: 420px;
}

body.refonte .rf-articles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

body.refonte .rf-article {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--rayon);
    background: var(--lin);
    color: var(--encre);
    transition: transform .25s ease, box-shadow .25s ease;
}

body.refonte .rf-article:hover {
    transform: translateY(-4px);
    box-shadow: var(--ombre);
    color: var(--encre);
}

body.refonte .rf-article img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

body.refonte .rf-article-corps {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px 24px 26px;
}

body.refonte .rf-article-titre {
    font-family: var(--titres);
    font-size: 23px;
    font-weight: 500;
    line-height: 1.25;
}

body.refonte .rf-article-extrait {
    font-size: 15px;
    color: var(--texte-doux);
}

/* ---------- cartes produits (accueil, catalogue, produits similaires) ---------- */

body.refonte .rf-produits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
}

body.refonte .fiche_produit {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: 100%;
    margin-bottom: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
}

body.refonte .fiche_produit .img_produit {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1;
    padding: 0;
    border-radius: var(--rayon);
    background: #F3E6C4;
}

/* l'ancien thème isole l'image (z-index 1000) : le fond doit être sur ce calque pour que le blanc des photos se fonde dedans */
body.refonte .fiche_produit .img_produit figure,
body.refonte .fiche_produit .abs_c {
    position: absolute;
    inset: 0;
    z-index: auto;
    margin: 0;
    background: #F3E6C4;
}

body.refonte .fiche_produit .img_produit .product_img_link {
    display: block;
    width: 100%;
    height: 100%;
}

body.refonte .fiche_produit .img_produit .product_img_link img,
body.refonte .fiche_produit .img_produit img {
    position: static;
    max-height: none;
    width: 100%;
    height: 100%;
    max-width: none;
    padding: 24px;
    box-sizing: border-box;
    object-fit: contain;
    mix-blend-mode: multiply;
    transform: none;
    transition: transform .4s ease;
}

body.refonte .fiche_produit:hover .img_produit img { transform: scale(1.04); }

body.refonte .fiche_produit figcaption { display: none; }

body.refonte .sticker_promo,
body.refonte .sticker_new,
body.refonte .sticker_degressif {
    position: absolute;
    top: 14px;
    left: 14px;
    right: auto;
    bottom: auto;
    z-index: 2;
    width: auto;
    height: auto;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--sapin);
    color: var(--lin);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
}

body.refonte .sticker_new,
body.refonte .sticker_degressif {
    background: var(--lin);
    color: var(--encre);
}

body.refonte .sticker_content .sticker_new + .sticker_degressif { top: 46px; }
body.refonte .sticker_promo strong { font-weight: 600; }

body.refonte [id^="p-"] {
    display: flex;
    flex-direction: column;
}

body.refonte [id^="p-"] > .fiche_produit { flex: 1 1 auto; height: auto; }

body.refonte .fiche_produit .produit_infos {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 0;
}

body.refonte .fiche_produit .title_produit {
    margin: 0;
    font-family: var(--titres);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.25;
    text-align: left;
    height: auto;
    min-height: 2.5em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

body.refonte .fiche_produit .title_produit a { color: var(--encre); }

body.refonte .fiche_produit .marque_produit {
    height: auto;
    line-height: 1.4;
    margin: 0;
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 400;
    color: var(--texte-doux);
    text-align: left;
}

body.refonte .fiche_produit .marque_produit br { display: none; }
body.refonte .fiche_produit .marque_produit a { color: var(--texte-doux); margin-left: 6px; }

/* prix et bouton toujours en bas de la carte, quelle que soit la longueur du titre */
body.refonte .fiche_produit .produit_infos > .row {
    align-items: center;
    margin-top: auto;
    padding-top: 6px;
}

body.refonte .fiche_produit .prix_produit {
    font-family: var(--texte);
    font-size: 18px;
    font-weight: 600;
    color: var(--encre);
}

body.refonte .fiche_produit .prix_barre {
    font-size: 14px;
    color: var(--texte-doux);
    text-decoration: line-through;
}

body.refonte .fiche_produit .add_cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    background: var(--sapin);
    color: var(--lin);
    cursor: pointer;
}

body.refonte .fiche_produit .add_cart:hover { background: var(--sapin-fonce); }
body.refonte .fiche_produit .add_cart .icon { font-size: 22px; color: var(--lin); }
body.refonte .fiche_produit .add_cart.rupture { background: var(--cire-bord); }
body.refonte .fiche_produit .add_cart.rupture .icon { color: var(--texte-doux); }

body.refonte .quantity_container {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--cire-bord);
    border-radius: 999px;
    background: #fff;
}

body.refonte .quantity_container .qt_manage {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--cire);
    color: var(--encre);
    cursor: pointer;
}

body.refonte .quantity_container .inpQtyCart {
    width: 36px;
    min-height: 34px;
    padding: 0;
    border: 0;
    text-align: center;
    background: transparent;
}

/* ---------- fil d'Ariane, catalogue, fiche produit ---------- */

body.refonte #chemin,
body.refonte .chemin_content {
    font-size: 14px;
    color: var(--texte-doux);
}

/* #chemin : plus prioritaire que le gris de l'ancien thème (#787676, contraste insuffisant) */
body.refonte .bread_link,
body.refonte #chemin .bread_link { color: var(--texte-doux); }

body.refonte #fiche .h1 { margin-top: 0; }

body.refonte #fiche .h2 {
    font-family: var(--texte);
    font-size: 16px;
    font-weight: 400;
    color: var(--texte-doux);
}

/* photo principale : cadre carré, photo toujours centrée (une ou plusieurs photos) */
body.refonte #fiche .blocimg_content {
    display: block;
    height: auto;
    text-align: center;
}

body.refonte #fiche #blocimg {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    border: 0;
    border-radius: var(--rayon);
    background: #F3E6C4;
}

body.refonte #fiche #blocimg #lst_zoom {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

body.refonte #fiche #blocimg #lst_zoom li {
    width: 100%;
    height: 100%;
    margin: 0;
}

/* les photos non affichées laissent leur <li> vide : on le retire pour qu'il ne pousse pas la photo affichée */
body.refonte #fiche #blocimg #lst_zoom li:has(> a.hidden) {
    display: none;
}

body.refonte #fiche #blocimg #lst_zoom a.zoom_image:not(.hidden),
body.refonte #fiche #blocimg #lst_zoom figure {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0;
}

body.refonte #fiche #blocimg #lst_zoom .zoom_image img.tnimgprd {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    padding: 28px;
    box-sizing: border-box;
    object-fit: contain;
    mix-blend-mode: multiply;
}

body.refonte #fiche #blocimg .sticker_label {
    position: absolute;
    top: 16px;
    left: 16px;
}

body.refonte #fiche #blocimg .sticker_label img {
    mix-blend-mode: normal;
}

body.refonte #fiche .blocimg_content > p {
    margin-top: 10px;
    text-align: center;
    color: var(--texte-doux);
}

body.refonte #fiche #blocvignette {
    display: flex;
    justify-content: center;
}

body.refonte #fiche #lst_vignette { justify-content: center; }

body.refonte #fiche .prix,
body.refonte #fiche #prix {
    font-family: var(--titres);
    font-size: 34px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte #fiche .prixbarre { color: var(--texte-doux); }

body.refonte #btpanier,
body.refonte .button-panier {
    min-height: 54px;
    padding: 0 30px;
}

body.refonte #btpanier .icon { color: var(--lin); font-size: 22px; }

body.refonte .nav-tabs {
    gap: 6px;
    border-bottom: 1px solid var(--cire-bord);
}

body.refonte .nav-tabs .nav-link {
    border: 0;
    border-radius: 999px 999px 0 0;
    color: var(--texte-doux);
    font-weight: 500;
}

body.refonte .nav-tabs .nav-link.active {
    background: var(--cire);
    color: var(--encre);
}

body.refonte .filet_item,
body.refonte .filet .filet_item {
    background: var(--lin);
    font-family: var(--titres);
}

/* ---------- colonne panier (pages catalogue) ---------- */

body.refonte #contenu_panier .col-sticky {
    top: 150px;
}

body.refonte #contenu_panier .listing_panier_content {
    margin-top: 24px;
    padding: 16px;
    border-radius: var(--rayon);
    background: var(--carte);
    box-shadow: var(--ombre);
}

body.refonte #contenu_panier .panier_total { color: var(--encre); }

body.refonte #contenu_panier .bt_panier_buy {
    width: 100%;
    margin-top: 8px;
}

/* ---------- panier, espace client, contact ---------- */

body.refonte .bg_ec { background: var(--lin); }

body.refonte .panier-recap-content,
body.refonte .remise-recap-content {
    border: 0;
    border-radius: var(--rayon);
    background: var(--carte);
    box-shadow: var(--ombre);
}

body.refonte .step-panier .circle {
    background: var(--cire);
    color: var(--encre);
    border: 0;
}

body.refonte .step-panier .active .circle {
    background: var(--sapin);
    color: var(--lin);
}

body.refonte .formcontact,
body.refonte #coordonnees_contact {
    padding: 32px;
    border-radius: var(--rayon);
    background: var(--carte);
    box-shadow: var(--ombre);
}

/* ---------- réassurance (engagements) : bandeau vert sauge clair, discret mais distinct du pied de page ---------- */

body.refonte .rf-rassurance {
    position: relative;
    margin: 0;
    padding: 56px 0 60px;
    background: #E7E8D6;
    color: var(--encre);
}

body.refonte .rf-rassurance-entete {
    margin-bottom: 28px;
    text-align: center;
}

body.refonte .rf-rassurance .rf-surtitre { color: var(--sapin); }

body.refonte .rf-rassurance-titre {
    margin: 6px 0 0;
    font-family: var(--titres);
    font-size: clamp(24px, 2.4vw, 30px);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -.01em;
    color: var(--encre);
}

body.refonte .rf-rassurance-grille {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

body.refonte #rassurance .rf-engagement {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
    height: 100%;
    padding: 22px 22px 20px;
    border: 1px solid rgba(52, 67, 46, .12);
    border-radius: 20px;
    background: var(--lin);
    color: var(--encre);
    box-shadow: none;
    transition: transform .25s ease, border-color .25s ease;
}

body.refonte #rassurance .rf-engagement:hover {
    transform: translateY(-3px);
    border-color: var(--sapin);
    color: var(--encre);
}

body.refonte .rf-engagement-icone {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 53px;
    background: var(--miel);
    color: var(--encre);
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

body.refonte .rf-engagement-icone svg {
    width: 24px;
    height: 24px;
}

body.refonte .rf-engagement-texte {
    flex: 1 1 auto;
}

body.refonte #rassurance h3,
body.refonte #rassurance h4 {
    margin: 0 0 4px;
    font-family: var(--titres);
    font-size: 19px;
    font-weight: 500;
    line-height: 1.25;
    color: var(--encre);
    text-align: left;
}

body.refonte #rassurance p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--texte-doux);
    text-align: left;
}

/* "En savoir plus" masqué : toute la carte est déjà un lien */
body.refonte .rf-engagement-lien {
    display: none;
}

/* ---------- pied de page ---------- */

body.refonte .rf-footer {
    position: relative;
    margin: 0;
    padding: 0;
    background: var(--cire);
    color: var(--texte-doux);
    font-size: 15px;
    border-top: 1px solid var(--cire-bord);
}

body.refonte .rf-footer-grille {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
    gap: 40px;
    padding-top: 64px;
    padding-bottom: 48px;
}

body.refonte .rf-footer-grille > * {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

body.refonte .rf-footer-marque img {
    width: 300px;
    max-width: 100%;
    height: auto;
}

body.refonte .rf-footer p { margin: 0; }
body.refonte .rf-footer a { color: var(--texte-doux); }
body.refonte .rf-footer a:hover { color: var(--sapin); }

body.refonte .rf-footer-titre {
    font-weight: 600;
    color: var(--encre);
}

body.refonte .rf-footer .rf-rond {
    border: 1px solid #CDBFA3;
    color: var(--encre);
}

body.refonte .rf-footer-bas {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 20px;
    padding-bottom: 28px;
    border-top: 1px solid #DDD0B6;
    font-size: 13px;
    color: #6E6857;
}

body.refonte .rf-footer-bas .kyxar,
body.refonte .rf-footer-bas .kyxar a {
    margin: 0;
    padding: 0;
    font-size: 13px;
    color: #6E6857;
    background: none;
}

/* ---------- page blog : reprend la charte ---------- */

body.refonte .page_blog #grid_builder .box {
    border-radius: var(--rayon);
    box-shadow: var(--ombre);
    background: var(--carte);
}

body.refonte .page_blog #grid_builder .box h2 {
    font-family: var(--titres);
    font-weight: 500;
}

body.refonte .page_blog #grid_builder .box h2 a { color: var(--encre); }
body.refonte .page_blog #grid_builder .box:hover h2 a { color: var(--sapin); }
body.refonte .page_blog #grid_builder .box::after { color: var(--chataignier); }
body.refonte .page_blog h1::after { background: var(--miel); }

/* ---------- tablette / mobile ---------- */

@media (max-width: 1100px) {
    body.refonte .rf-acces { display: none; }
    body.refonte .rf-logo img { width: 280px; }
}

@media (max-width: 991px) {
    body.refonte .rf-burger { display: inline-block; }
    body.refonte .rf-fil { display: none; }

    body.refonte .rf-header-top {
        flex-wrap: wrap;
        gap: 10px 12px;
        padding-top: 10px;
        padding-bottom: 12px;
    }

    body.refonte .rf-logo { flex: 1 1 auto; }
    body.refonte .rf-logo img { width: 240px; }

    body.refonte .rf-recherche {
        order: 5;
        flex: 1 1 100%;
        max-width: none;
    }

    body.refonte #panierheaderTop .rb_total { display: none; }
    body.refonte #panierheaderTop .col-panier-item { padding: 0 14px !important; }
    body.refonte #panierheaderTop .nb_article { left: 26px; }

    /* menu des rubriques : panneau ouvert par le burger */
    body.refonte #menu-desktop,
    #home.refonte #menu-desktop {
        position: fixed;
        top: var(--rf-haut-menu, 120px);
        left: 0;
        bottom: 0;
        width: min(340px, 88vw) !important;
        overflow-y: auto;
        border: 0;
        border-right: 1px solid var(--cire-bord);
        background: var(--lin);
        box-shadow: var(--ombre);
        transform: translateX(-105%);
        transition: transform .3s ease;
    }

    body.refonte.rf-menu-ouvert #menu-desktop,
    #home.refonte.rf-menu-ouvert #menu-desktop {
        transform: none;
    }

    body.refonte #menu-principal > ul {
        flex-direction: column;
        flex-wrap: nowrap;
        padding: 12px 16px 32px;
    }

    body.refonte #menu-principal > ul > li > a {
        padding: 14px 12px;
        font-size: 17px;
        text-align: left;
        border-bottom: 1px solid var(--cire-bord);
    }

    body.refonte #menu-principal > ul > li > a:hover { box-shadow: none; }

    body.refonte #menu-principal ul li > ul.smenu,
    body.refonte #menu-principal ul li:hover > ul.smenu,
    body.refonte #menu-principal ul li:focus-within > ul.smenu {
        display: block;
        position: static;
        width: auto;
        padding: 4px 0 8px 12px;
        transform: none;
        border: 0;
        box-shadow: none;
        background: transparent;
    }

    body.refonte #menu-principal ul.smenu a.title_smenu {
        padding: 8px 12px;
        font-size: 15px;
        color: var(--texte-doux);
    }

    body.refonte .rf-hero { padding: 40px 0 64px; }

    body.refonte .rf-hero-grille,
    body.refonte .rf-deux-colonnes,
    body.refonte .rf-footer-grille {
        grid-template-columns: minmax(0, 1fr);
        gap: 40px;
    }

    body.refonte .rf-alveoles {
        max-width: 520px;
        margin: 0 auto;
    }

    body.refonte .rf-produits,
    body.refonte .rf-articles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    body.refonte .rf-rassurance { padding: 44px 0 48px; }
    body.refonte .rf-rassurance-grille { grid-template-columns: minmax(0, 1fr); gap: 20px; }

    body.refonte .rf-section { padding: 64px 0; }
}

@media (max-width: 575px) {
    body.refonte .rf-wrap,
    body.refonte .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    body.refonte .rf-infobar .rf-wrap span + span { display: none; }
    /* bandeau sur une ligne : le badge entier appelle, le numéro est masqué faute de place */
    body.refonte .rf-infobar .rf-appel-avant { padding: 2px 10px; font-size: 12.5px; }
    body.refonte .rf-infobar .rf-appel-avant-num { display: none; }
    /* « Appelez avant de passer à la boutique » (27/10/2026) : en minuscules pour tenir sur une ligne */
    body.refonte .rf-infobar .rf-appel-avant strong { letter-spacing: 0; text-transform: none; white-space: nowrap; }

    body.refonte .rf-logo img { width: 170px; }

    body.refonte .rf-deconnexion,
    body.refonte #panier_close { display: none; }

    body.refonte .rf-produits { gap: 14px; }

    body.refonte .rf-articles { grid-template-columns: minmax(0, 1fr); }

    body.refonte .fiche_produit .title_produit { font-size: 18px; }

    body.refonte .rf-mosaique img:first-child { min-height: 280px; }
}

@media (prefers-reduced-motion: reduce) {
    body.refonte *,
    body.refonte *::before,
    body.refonte *::after {
        transition: none !important;
    }
}

/* ---------- neutralisation de règles de l'ancien thème ---------- */

body.refonte #rassurance {
    margin-left: 0;
    margin-right: 0;
}

body.refonte #rassurance a::after { display: none; }


body.refonte .rf-footer-bas .kyxar {
    position: static;
    margin: 0;
    white-space: normal;
    line-height: inherit;
}

body.refonte #gotop {
    background-color: var(--sapin);
    opacity: .9;
}

body.refonte #gotop:hover { background-color: var(--chataignier); }

#home.refonte #header.rf-header,
body.refonte #header_home {
    background: var(--lin);
}

/* ---------- couleurs utilitaires de l'ancien thème remappées ---------- */

body.refonte .color1,
body.refonte .color2,
body.refonte .color4 { color: var(--sapin); }
body.refonte .color6 { color: var(--texte-doux); }
body.refonte .bg-color1 { background-color: var(--sapin); color: var(--lin); }
body.refonte .bg-color2,
body.refonte .bgcolor3 { background-color: var(--cire); }

body.refonte .filet_item::before,
body.refonte .filet_item::after,
body.refonte .color_filet_2 .filet_item::after {
    border-bottom-color: var(--cire-bord);
}

body.refonte #description_tab thead th,
body.refonte .grid_builder_content table th,
body.refonte .table thead th {
    background: var(--sapin);
    color: var(--lin);
}

body.refonte #description_tab td,
body.refonte #description_tab th,
body.refonte .grid_builder_content table td,
body.refonte .grid_builder_content table th,
body.refonte .table td,
body.refonte .table th {
    border-color: var(--cire-bord);
}

/* ---------- espace client ---------- */

body.refonte #espaceClientMenu .accm_item {
    height: 100%;
    margin-bottom: 24px;
    padding: 24px 24px 24px 96px;
    position: relative;
    border-radius: var(--rayon);
    background: var(--carte);
    box-shadow: var(--ombre);
    transition: transform .25s ease;
}

body.refonte #espaceClientMenu a:hover .accm_item { transform: translateY(-3px); }
body.refonte #espaceClientMenu a:hover,
body.refonte #espaceClientMenu a:focus { opacity: 1; }

body.refonte #espaceClientMenu a h2,
body.refonte #espaceClientMenu .accm_item h2 {
    margin: 0 0 6px;
    min-height: 0;
    padding: 0;
    font-family: var(--titres);
    font-size: 22px;
    font-weight: 500;
    line-height: 1.25;
    color: var(--encre);
    text-transform: none;
    text-align: left;
}

body.refonte #espaceClientMenu .filet_item::before,
body.refonte #espaceClientMenu .filet_item::after { display: none; }

body.refonte #espaceClientMenu a .icon {
    top: 50%;
    left: 24px;
    font-size: 48px;
    color: var(--sapin);
}

body.refonte #espaceClientMenu a p,
body.refonte #espaceClientMenu p {
    min-height: 0;
    margin: 0;
    font-size: 15px;
    color: var(--texte-doux);
}

body.refonte #espaceClientLogin,
body.refonte #espaceClientInscription,
body.refonte #espaceClientFormInscription,
body.refonte .custom-form {
    padding: 32px;
    border-radius: var(--rayon);
    background: var(--carte);
    box-shadow: var(--ombre);
}

body.refonte #espaceClient h2,
body.refonte #espaceClientInt h2 {
    color: var(--encre);
}

body.refonte #espaceClient input[type=password],
body.refonte #espaceClient input[type=text] {
    border: 1px solid var(--cire-bord);
    padding: 10px 16px;
}

body.refonte .ecLienAfficher,
body.refonte .ecLienFacture,
body.refonte .ecLienPayer,
body.refonte .ecLienAnnuler,
body.refonte #espaceClientInt .ecLienAfficher,
body.refonte #espaceClientInt .ecLienPayer,
body.refonte #espaceClientInt .ecLienAnnuler {
    padding: 6px 14px;
    border-radius: 999px;
    background-color: var(--sapin);
    color: var(--lin);
}

body.refonte .ecLienAnnuler,
body.refonte #espaceClientInt .ecLienAnnuler { background-color: #9C3B24; }

body.refonte #espaceClientInt .TH1 .aTitre,
body.refonte #espaceClientInt .cart .aTitre {
    background: var(--sapin);
    color: var(--lin);
}

body.refonte .messageboxinfo,
body.refonte .messageboxwarning {
    border: 1px solid var(--cire-bord) !important;
    border-radius: 14px;
    background: var(--cire) !important;
    background-image: none !important;
    color: var(--encre);
    text-shadow: none;
}

body.refonte .ec_erreur,
body.refonte .error_form,
body.refonte .errorcontain { color: #9C3B24; }

body.refonte .ec_erreur,
body.refonte .ec_message_box {
    border: 1px solid #E3B7A8;
    border-radius: 14px;
    background: #FBF0EB;
}

/* ---------- miniatures sous la photo de la fiche produit ---------- */

body.refonte #lst_vignette {
    gap: 10px;
    margin: 14px 0 0;
    padding: 0;
}

body.refonte #lst_vignette li { list-style: none; }

body.refonte #lst_vignette a {
    display: block;
    margin: 0;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 16px;
    background: #F3E6C4;
    transition: border-color .2s ease;
}

body.refonte #lst_vignette a.current,
body.refonte #lst_vignette a:hover { border-color: var(--sapin); }

body.refonte #lst_vignette figure { margin: 0; }

body.refonte #lst_vignette a img {
    display: block;
    width: 72px;
    height: 72px;
    padding: 4px;
    box-sizing: border-box;
    object-fit: contain;
    mix-blend-mode: multiply;
}


/* ---------- encadrés : bord cire plutôt qu'un fond blanc ---------- */

body.refonte #contenu_panier .listing_panier_content,
body.refonte .panier-recap-content,
body.refonte .remise-recap-content,
body.refonte .formcontact,
body.refonte #coordonnees_contact,
body.refonte #espaceClientMenu .accm_item,
body.refonte #espaceClientLogin,
body.refonte #espaceClientInscription,
body.refonte #espaceClientFormInscription,
body.refonte .custom-form {
    border: 1px solid var(--cire-bord);
    box-shadow: none;
}

body.refonte #espaceClientMenu a:hover .accm_item {
    border-color: var(--sapin);
}

body.refonte #espaceClientMenu,
body.refonte #espaceClient,
body.refonte #espaceClientInt,
body.refonte #contenu_panier,
body.refonte .contenu_panier,
body.refonte .col-sticky,
body.refonte .mp-pusher,
body.refonte .bg_ec,
body.refonte #grid_builder_content .row,
body.refonte #body_cms .content .container {
    background-color: transparent;
}

body.refonte .listing_panier .panier_img,
body.refonte #panier-recap-content figure,
body.refonte .panier .panier-listing .recap_article_content .line-caddy .item1 figure {
    background: transparent;
}

body.refonte .listing_panier .panier_img img,
body.refonte #panier-recap-content figure img,
body.refonte .recap_article_content figure img {
    mix-blend-mode: multiply;
}

/* ---------- pied de page et engagements sur toute la largeur (sortis de la colonne de contenu) ---------- */

body.refonte .rf-bas-de-page {
    clear: both;
    width: 100%;
}

/* ---------- colonne panier (ordinateur) : toujours affichée, titre, collée sous l'en-tête ---------- */

body.refonte .rf-panier-titre {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin: 0 0 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--cire-bord);
    font-family: var(--titres);
    font-size: 20px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte .rf-panier-nb {
    font-family: var(--texte);
    font-size: 13px;
    font-weight: 500;
    color: var(--texte-doux);
    white-space: nowrap;
}

body.refonte .rf-panier-vide {
    margin: 0 0 12px;
    font-size: 14px;
    color: var(--texte-doux);
}

body.refonte .rf-panier-vide[hidden] { display: none; }

body.refonte #contenu_panier .col-sticky {
    /* sous le bas réel de l'en-tête (bandeau d'infos compris), mesuré pendant ses animations : voir _inc/refonte/header.tpl */
    top: calc(var(--rf-bas-entete, var(--rf-h-header, 130px)) + 16px);
}

@media (min-width: 992px) {
    /* l'ancien bouton masquer/afficher n'existe plus : on neutralise l'état "panier masqué" mémorisé en cookie */
    body.refonte .hide-panier #contenu_panier,
    body.refonte .none-panier.hide-panier #contenu_panier {
        display: block;
        opacity: 1;
        flex: 0 0 235px;
        overflow: visible;
    }
}

/* menu "Promotions" : plus de fond jaune de l'ancien thème */
body.refonte #menu-principal li.c-promotions,
body.refonte #menu-principal li.menu_h_promo {
    background: transparent;
}

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

@media (max-width: 991px) {
    /* l'ancien thème remet le menu dans la page quand le panier est masqué : il reste un panneau caché */
    body.refonte #menu-desktop,
    body.refonte .hide-panier #menu-desktop,
    #home.refonte #menu-desktop {
        position: fixed;
        top: var(--rf-haut-menu, 120px);
        left: 0;
        bottom: 0;
        z-index: 60;
        width: min(340px, 88vw) !important;
        height: auto;
        overflow-y: auto;
        transform: translateX(-105%);
    }

    body.refonte.rf-menu-ouvert #menu-desktop,
    body.refonte.rf-menu-ouvert .hide-panier #menu-desktop,
    #home.refonte.rf-menu-ouvert #menu-desktop {
        /* sur l'accueil, le body est #home : la règle de fermeture #home.refonte a besoin de son pendant */
        transform: none;
    }

    /* en-tête sur une ligne : burger, logo, compte + panier ; recherche en dessous */
    body.refonte .rf-header-top {
        flex-wrap: wrap;
        align-items: center;
    }

    body.refonte .rf-burger { order: 0; flex: none; }

    body.refonte .rf-logo,
    body.refonte #header.sticky .rf-logo {
        order: 1;
        flex: 1 1 0;
        min-width: 0;
    }

    body.refonte .rf-logo img,
    body.refonte #header.sticky .rf-logo img,
    body.refonte #logo img {
        width: 100%;
        max-width: 260px;
    }

    body.refonte .rf-actions {
        order: 2;
        flex: none;
        margin-left: auto;
        gap: 2px;
    }

    body.refonte .rf-recherche { order: 3; }

    /* pas de colonne panier sur mobile : le bouton panier de l'en-tête suffit */
    body.refonte #contenu_panier { display: none !important; }

    body.refonte #contenu_body,
    body.refonte .contenu_body {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100%;
    }
}

/* ---------- règles de l'ancien thème à neutraliser (vues en capture) ---------- */

/* l'ancien thème force tous les <footer> en vert avec !important */
body.refonte footer.rf-footer {
    background-color: var(--cire) !important;
    margin-left: 0;
    margin-right: 0;
}

/* grille du catalogue : plus de bordures grises autour de chaque produit */
body.refonte #listeproduit > ul > li,
body.refonte .pres_prod > li,
body.refonte .pres_prod li:last-child,
body.refonte .pres_prod li:nth-child(6n) {
    border: 0 !important;
}

body.refonte .pres_prod { padding: 0; }

/* bloc rubrique de la colonne de gauche du catalogue */
body.refonte #menurubrique .bloc_filtre {
    padding: 18px 20px;
    border: 1px solid var(--cire-bord);
    border-radius: 20px;
    background: var(--carte);
}

body.refonte #left_column #menurubrique .h2 {
    margin: 0;
    font-family: var(--titres);
    font-size: 20px;
    font-weight: 500;
}

body.refonte #left_column #menurubrique .h2 a { color: var(--encre); }

body.refonte .nb_produit,
body.refonte .cat-description { color: var(--texte-doux); }

@media (max-width: 991px) {
    /* menu mobile : panneau opaque, accroché sous l'en-tête (le fixed est faussé par les conteneurs du menu mobile de l'ancien thème) */
    body.refonte #menu-desktop,
    body.refonte .hide-panier #menu-desktop,
    #home.refonte #menu-desktop {
        position: absolute;
        top: 100%;
        left: 0;
        bottom: auto;
        height: calc(100svh - var(--rf-haut-menu, 120px));
        min-height: 0;
        background: var(--lin);
        border-top: 1px solid var(--cire-bord);
        box-shadow: 12px 0 30px rgba(43, 42, 34, .18);
    }

    body.refonte #menu-principal > ul > li > a { color: var(--encre); }
}

/* ---------- ajustements après captures (ordinateur) ---------- */

/* barre des rubriques sur une seule ligne */
@media (min-width: 992px) {
    body.refonte #menu-principal > ul {
        flex-wrap: nowrap;
        gap: 0;
    }

    body.refonte #menu-principal > ul > li > a {
        padding: 13px 10px;
        font-size: 14.5px;
    }
}

@media (min-width: 992px) and (max-width: 1280px) {
    body.refonte #menu-principal > ul { justify-content: flex-start; overflow-x: auto; }
    body.refonte #menu-principal > ul > li > a { padding: 13px 8px; font-size: 14px; }
}

/* bouton "Valider et payer" de la colonne panier : vert sapin comme les autres */
body.refonte #contenu_panier .bt_panier_buy,
body.refonte #contenu_panier .button.btn2 {
    width: 100%;
    border-color: var(--sapin);
    background: var(--sapin);
    color: var(--lin);
}

body.refonte #contenu_panier .bt_panier_buy:hover {
    border-color: var(--sapin-fonce);
    background: var(--sapin-fonce);
}

/* titre des engagements (h2) : l'ancien thème force la taille des <p> et le style des <h2> du bloc */
body.refonte #rassurance .rf-rassurance-titre {
    margin: 6px 0 0;
    padding: 0;
    font-weight: 500;
    letter-spacing: -.01em;
    text-transform: none;
    font-family: var(--titres);
    font-size: clamp(24px, 2.4vw, 30px);
    line-height: 1.2;
    color: var(--encre);
    text-align: center;
}

body.refonte #contenu_panier #bt_panier_buy {
    min-height: 48px;
    padding: 0 18px;
    border-radius: 999px;
    font-size: 16px;
}

/* ---------- boutons : l'ancien thème force le jaune avec !important sur .button, .btn-primary et les submit ---------- */

body.refonte .button,
body.refonte .btn-primary,
body.refonte button.submit,
body.refonte input[type=submit],
body.refonte input[type=button] {
    background: var(--sapin) !important;
    color: var(--lin) !important;
    border: 1.5px solid var(--sapin);
    border-radius: 999px;
    font-family: var(--texte);
    font-size: 16px;
    font-weight: 600;
    padding: 0 26px;
    min-height: 50px;
}

body.refonte .button:hover,
body.refonte .btn-primary:hover,
body.refonte button.submit:hover,
body.refonte input[type=submit]:hover,
body.refonte input[type=button]:hover {
    background: var(--sapin-fonce) !important;
    border-color: var(--sapin-fonce);
}

body.refonte .btn-outline-primary,
body.refonte .btn-secondary {
    background: transparent !important;
    color: var(--sapin) !important;
    border: 1.5px solid var(--sapin) !important;
    border-radius: 999px;
    font-size: 16px;
}

body.refonte .btn-outline-primary:hover,
body.refonte .btn-secondary:hover {
    background: var(--sapin) !important;
    color: var(--lin) !important;
}

/* les boutons ronds des cartes produits gardent leur forme */
body.refonte .fiche_produit .add_cart {
    min-height: 0;
    padding: 0;
}

/* dernier bord : la colonne panier ne colle pas au bord droit de l'écran */
body.refonte #contenu_panier {
    padding-right: 16px;
}

/* ---------- panier : étapes et récapitulatif ---------- */

body.refonte #panier-recap-content {
    background-color: var(--carte);
    font-size: 15px;
}

body.refonte .step-panier li .step-panier-item {
    background-color: var(--cire);
    color: var(--texte-doux);
}

body.refonte .step-panier li .step-panier-item .circle {
    background-color: var(--cire-bord);
    color: var(--encre);
}

body.refonte .step-panier a { color: var(--sapin) !important; }
body.refonte .step-panier a .circle { background-color: var(--sapin) !important; color: var(--lin); }
body.refonte .step-panier li .step-panier-item .white_arrow_after { background-color: var(--sapin); }

/* étape en cours (active, sans lien) : bien visible ; avant, seules les étapes passées étaient colorées
   et le bandeau semblait en retard d'une étape */
body.refonte .step-panier li.active > span.step-panier-item {
    /* fond miel clair : --lin se confondait avec la page (27/10/2026) */
    background-color: #FBEBA8;
    color: var(--encre);
    font-weight: 700;
}
/* sur ordinateur les étapes se chevauchent (mr-md-n4) : bordure seulement quand elles sont empilées */
@media (max-width: 767px) {
    body.refonte .step-panier li.active > span.step-panier-item { box-shadow: inset 0 0 0 1.5px var(--sapin); }
}
body.refonte .step-panier li.active > span.step-panier-item .circle {
    background-color: var(--miel) !important;
    color: var(--encre) !important;
    font-weight: 700;
}

/* panier : prix jamais coupés avant le « € » ; boutons supprimer (article, code promo) en icône dessinée */
body.refonte .line-caddy .price s,
body.refonte .line-caddy .price span,
body.refonte .line-caddy [id^="prix_"],
body.refonte .product_line_total .total-price { white-space: nowrap; }
body.refonte .rf-supprimer {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: var(--texte-doux) !important;
    cursor: pointer;
}
body.refonte .rf-supprimer:hover,
body.refonte .rf-supprimer:focus-visible { background: var(--cire); color: #9C3B24 !important; }
body.refonte .rf-supprimer .rf-icone-supp { display: block; }
body.refonte .rf-supprimer::before { content: none !important; }
/* page Paiement : livraison retenue (relais, retrait, adresse) avec lien Modifier */
body.refonte .rf-livraison-resume {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin: 24px 0 8px;
    padding: 18px 22px;
    border: 2px solid var(--miel);
    border-radius: 16px;
    background: #FDF6D8;
    text-align: left;
}
body.refonte .rf-livraison-resume p { margin: 0; text-align: left; }
body.refonte .rf-livraison-resume .rf-livraison-resume-titre { margin-bottom: 4px; font-size: 17px; }
body.refonte .rf-livraison-resume a { flex: none; color: var(--sapin) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* lignes du panier sur écran moyen (992-1299 px) : la liste n'a que ~55 % de la largeur, trois colonnes se chevauchent ;
   le nom passe sur sa propre ligne, prix / quantité / total en dessous */
@media (min-width: 992px) and (max-width: 1299px) {
    body.refonte .line-caddy .item1 { flex: 0 0 100%; max-width: 100%; margin-bottom: 8px; }
    body.refonte .line-caddy .item2 { flex: 0 0 66%; max-width: 66%; }
    body.refonte .line-caddy .item3 { flex: 0 0 34%; max-width: 34%; }
}

/* liens dans les fiches (producteur…) : vert sapin, pas le doré de l'ancien thème */
body.refonte #fiche a:not(.button):not(.btn) { color: var(--sapin); }

/* ---------- bouton "Ajouter au panier" de la fiche produit ---------- */

/* l'ancien thème force un vert menthe (#34cba2 !important) sur .button.acheter */
body.refonte #btpanier.button.acheter {
    gap: 12px;
    min-height: 54px;
    padding: 0 30px;
    border: 0;
    background: var(--sapin) !important;
    color: var(--lin) !important;
    box-shadow: 0 6px 16px rgba(52, 67, 46, .18);
}

body.refonte #btpanier.button.acheter:hover {
    background: var(--sapin-fonce) !important;
}

body.refonte #btpanier.button.acheter .icon {
    color: var(--miel);
    font-size: 24px;
}

/* rupture / indisponible : bouton éteint, sans bordure grise */
body.refonte #btpanier.button.acheter.rupture,
body.refonte #btpanier.button.acheter.indispo {
    border: 0 !important;
    background: var(--cire) !important;
    color: var(--texte-doux) !important;
    box-shadow: none;
    cursor: default;
}

body.refonte #btpanier.button.acheter.rupture .icon,
body.refonte #btpanier.button.acheter.indispo .icon {
    color: var(--texte-doux);
}

body.refonte #fiche #inpQty { border-radius: 14px; }

/* ---------- pictos panier des cartes produits : centrés dans leur rond ---------- */

body.refonte .fiche_produit .add_cart {
    line-height: 1;
    font-size: 0;
}

body.refonte .fiche_produit .add_cart .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin: 0;
    font-size: 23px;
    line-height: 1;
}

body.refonte .fiche_produit .add_cart .icon::before {
    display: block;
    line-height: 1;
}

/* ---------- colonne panier : "Total à payer" sur une ligne, en face du montant ---------- */

body.refonte #contenu_panier .panier_total.panier_bloc {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    padding: 4px 0;
    color: var(--encre);
}

body.refonte #contenu_panier .panier_total .item1,
body.refonte #contenu_panier .panier_total .item2 {
    flex: none;
    width: auto;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    text-align: left;
    font-family: var(--texte);
    font-size: 15px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte #contenu_panier .panier_total .item2 strong {
    font-size: 18px;
    font-weight: 600;
}

body.refonte #contenu_panier .panier_action .item3,
body.refonte #contenu_panier .rf-panier-vide {
    font-family: var(--texte);
    font-size: 14px;
}

/* ==================================================================
 * Fiche produit : bloc d'achat
 * Le formulaire est remonté sous le nom du produit (avant les onglets de description)
 * et organisé en encadré : déclinaisons, puis prix, puis quantité + bouton.
 * CSS uniquement : les ids utilisés par js/article.js (#prix, #promo, #val_tarif_haut, #inpQty, #btpanier…) restent en place.
================================================================== */

body.refonte #fiche .bloc_description {
    display: flex;
    flex-direction: column;
}

body.refonte #fiche .bloc_description > .info-produit { order: 1; }
body.refonte #fiche .bloc_description > form[name=itemForm] { order: 2; }
body.refonte #fiche .bloc_description > #tabs_article { order: 3; }

body.refonte #fiche form[name=itemForm] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin: 24px 0 8px;
    padding: 26px 28px 28px;
    border: 1px solid var(--cire-bord);
    border-radius: var(--rayon);
    background: var(--carte);
}

body.refonte #fiche form[name=itemForm] > .row,
body.refonte #fiche form[name=itemForm] > .row > [class*=col] {
    display: block;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    flex: none;
}

/* 1. déclinaisons (poids…) */
body.refonte #fiche #bloc_option {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.refonte #fiche .option_item {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.refonte #fiche .option_item label {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--texte-doux);
}

body.refonte #fiche .option_item select {
    width: 100%;
    max-width: 320px;
}

/* 2. prix : prix en grand, ancien prix barré, pastille de réduction */
body.refonte #fiche form[name=itemForm] > .row.flex-sm-nowrap {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

body.refonte #fiche #bloc_prix,
body.refonte #fiche #acheter {
    display: block;
}

body.refonte #fiche #bloc_prix .mt-4 { display: none; }

body.refonte #fiche .blocprix {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 14px;
}

body.refonte #fiche #prix {
    order: 1;
    display: flex;
    align-items: baseline;
    height: auto;
    margin: 0;
    font-family: var(--titres);
    font-size: 40px;
    font-weight: 500;
    line-height: 1;
    color: var(--encre);
}

body.refonte #fiche #prix strong { font-weight: 500; }

/* en promo, le € est dans l'ancien prix (masqué) : on le remet après le prix promo */
body.refonte #fiche #prix strong.prix_promo::after { content: "\00a0€"; }

/* doublon de l'ancien prix (déjà dans .old_price_container, mis à jour par le JS) */
body.refonte #fiche #prix .prix_barre { display: none; }

body.refonte #fiche .old_price_container {
    order: 2;
}

body.refonte #fiche #val_tarif_haut {
    font-size: 18px;
    color: var(--texte-doux);
    text-decoration: line-through;
}

body.refonte #fiche #promo {
    order: 3;
    height: auto;
}

body.refonte #fiche #promo strong {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
}

body.refonte #fiche #promo strong.remise {
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--miel);
    color: var(--encre);
}

body.refonte #fiche #promo strong.remise::before { content: "-"; }
body.refonte #fiche #promo strong.promo { display: none; }

body.refonte #fiche .prix_kg { display: none; }

/* 3. quantité + bouton */
body.refonte #fiche #panier {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 6px;
    align-items: end;
}

body.refonte #fiche #panier > label {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--texte-doux);
}

body.refonte #fiche #panier #quantite {
    grid-column: 1;
    grid-row: 2;
    height: auto;
}

body.refonte #fiche #panier #inpQty {
    width: 100%;
    min-height: 54px;
    border-radius: 14px;
    text-align: center;
}

body.refonte #fiche #panier #btpanier {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    margin: 0;
    justify-content: center;
}

@media (max-width: 575px) {
    body.refonte #fiche form[name=itemForm] { padding: 20px; }
    body.refonte #fiche #prix { font-size: 34px; }
    body.refonte #fiche #panier { grid-template-columns: 80px minmax(0, 1fr); }
    body.refonte #fiche #panier #btpanier { padding: 0 16px; }
}

/* produit sans déclinaison : la ligne des options est vide */
body.refonte #fiche form[name=itemForm] > .row:not(:has(*)),
body.refonte #fiche form[name=itemForm] > .row:not(:has(.option_item)):not(.flex-sm-nowrap) {
    display: none;
}

body.refonte #fiche #prix strong {
    display: inline-flex;
    align-items: baseline;
}

body.refonte #fiche form[name=itemForm] > .row.flex-sm-nowrap { align-items: stretch; }

body.refonte #fiche #bloc_add_quantity,
body.refonte #fiche #panier {
    width: 100%;
}

/* le "clearfix" de Bootstrap ajoute des pseudo-éléments qui deviennent des cases vides du flex */
body.refonte #fiche form[name=itemForm]::before,
body.refonte #fiche form[name=itemForm]::after {
    display: none;
}

body.refonte #fiche #bloc_option { margin: 0 !important; }

/* .ml-5 de Bootstrap (!important) faisait déborder le bouton */
body.refonte #fiche #panier #btpanier { margin-left: 0 !important; }

/* ---------- colonne panier : lignes d'articles ---------- */

body.refonte #contenu_panier #listing_panier_article {
    margin: 0;
    padding: 0;
}

body.refonte #contenu_panier #listing_panier_article > li.item {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    margin: 0;
    padding: 12px 0;
    border-bottom: 1px solid var(--cire-bord);
}

body.refonte #contenu_panier .listing_panier .panier_img {
    width: 52px;
    height: 52px;
    margin: 0;
    overflow: hidden;
    border-radius: 12px;
    background: #F3E6C4;
}

body.refonte #contenu_panier .listing_panier .panier_img img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 3px;
    box-sizing: border-box;
    object-fit: contain;
    mix-blend-mode: multiply;
}

body.refonte #contenu_panier .listing_panier .panier_img figcaption { display: none; }

body.refonte #contenu_panier .panier_bloc_desc {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

body.refonte #contenu_panier .panier_desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--encre);
}

body.refonte #contenu_panier .panier_bloc_desc .panier_bloc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
}

/* sélecteur de quantité compact */
body.refonte #contenu_panier .quantity_container {
    gap: 2px;
    padding: 2px;
}

body.refonte #contenu_panier .quantity_container .qt_manage {
    width: 26px;
    height: 26px;
    border: 0;
    font-size: 15px;
    line-height: 26px;
}

body.refonte #contenu_panier .quantity_container .qt_manage .icon { font-size: 13px; }

body.refonte #contenu_panier .quantity_container .inpQtyCart {
    width: 26px;
    min-height: 26px;
    height: 26px;
    font-size: 14px;
}

body.refonte #contenu_panier .panier_bloc_desc .panier_price,
body.refonte #contenu_panier .panier_bloc_desc .panier_price strong {
    margin: 0;
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 600;
    color: var(--encre);
    white-space: nowrap;
}

/* ---------- fiche produit (2) : prix plus mesuré, achat en bas de la fiche, onglets mis en avant ---------- */

body.refonte #fiche .bloc_description > #tabs_article { order: 2; }
body.refonte #fiche .bloc_description > form[name=itemForm] { order: 3; margin-top: 8px; }

body.refonte #fiche #prix { font-size: 28px; }
body.refonte #fiche #val_tarif_haut { font-size: 15px; }

@media (max-width: 575px) {
    body.refonte #fiche #prix { font-size: 26px; }
}

/* onglets : bandeau cire à motif d'alvéoles, onglets en pastilles, contenu dans un encadré clair */
body.refonte #fiche #tabs_article {
    margin: 24px 0 !important;
    padding: 14px 14px 16px;
    border-radius: var(--rayon);
    background-color: var(--cire);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath fill='%23E4D7BD' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E");
}

body.refonte #fiche #tabs_article .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 12px;
    padding: 0;
    border: 0;
}

body.refonte #fiche #tabs_article .nav-item { margin: 0; }

body.refonte #fiche #tabs_article .nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid var(--cire-bord);
    border-radius: 999px;
    background: var(--lin);
    font-family: var(--texte);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--encre);
}

body.refonte #fiche #tabs_article .nav-link:hover { border-color: var(--sapin); }

body.refonte #fiche #tabs_article .nav-link.active {
    border-color: var(--sapin);
    background: var(--sapin);
    color: var(--lin);
}

body.refonte #fiche #tabs_article .tab-content {
    padding: 22px 24px;
    border: 1px solid var(--cire-bord);
    border-radius: 18px;
    background: var(--lin);
    font-size: 16px;
    line-height: 1.65;
    color: var(--encre);
}

body.refonte #fiche #tabs_article .tab-content p { margin: 0 0 6px; }

/* colonne panier un peu plus large que celle de l'ancien thème (235 px) pour que prix et quantités tiennent */
@media (min-width: 992px) {
    body.refonte .width_body {
        flex: calc(100% - 275px) !important;
        width: calc(100% - 275px) !important;
    }

    body.refonte .width_panier,
    body.refonte .hide-panier #contenu_panier,
    body.refonte .none-panier.hide-panier #contenu_panier {
        flex: 0 0 275px;
        width: 275px;
    }
}

body.refonte #contenu_panier .listing_panier_content { padding: 16px 14px; }

/* ---------- accueil : long fil des visites jusqu'au bandeau des engagements ---------- */

body.refonte .rf-zone-fil-long { position: relative; }

body.refonte .rf-fil-long {
    bottom: 0;
}

body.refonte .rf-fil-long svg {
    width: 100%;
    height: 100%;
}

/* le fil descend dans la marge de droite : il n'a de place qu'à partir de 1360 px de large */
@media (max-width: 1359px) {
    body.refonte .rf-fil-long { display: none; }
}

/* ==================================================================
 * FICHE PRODUIT — refonte complète (remplace les ajustements précédents)
 * Galerie à gauche (collante), infos + achat à droite, description pleine largeur dessous.
 * Les colonnes Bootstrap sont "aplaties" (display: contents) pour placer les blocs dans une grille.
================================================================== */


#article.refonte #fiche {
    max-width: 1240px;
    margin: 0 auto !important;
    padding: 20px 32px 56px;
    box-sizing: border-box;
}

#article.refonte #fiche #chemin { margin-bottom: 24px !important; }

#article.refonte #fiche .upper_section > .mb-5 { margin-bottom: 0 !important; }

#article.refonte #fiche .upper_section > .mb-5 > .row {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
    column-gap: 64px;
    align-items: start;
    margin: 0;
}

#article.refonte #fiche .upper_section .row > .col-lg-5 {
    grid-column: 1;
    grid-row: 1 / span 4;
    position: sticky;
    top: calc(var(--rf-h-header, 130px) + 24px);
    width: auto;
    max-width: none;
    padding: 0;
}

#article.refonte #fiche .upper_section .row > .col-lg-7,
#article.refonte #fiche .bloc_description {
    display: contents;
}

#article.refonte #fiche .bloc_description > .info-produit { grid-column: 2; grid-row: 1; }
#article.refonte #fiche .bloc_description > form[name=itemForm] { grid-column: 2; grid-row: 2; }
#article.refonte #fiche .bloc_description > .rf-garanties { grid-column: 2; grid-row: 3; }
/* encart « Envie de l'offrir ? » / « Comment ça marche ? » : sa propre ligne, détaché du bouton d'achat */
#article.refonte #fiche .bloc_description > .rf-offrir-fiche { grid-column: 2; grid-row: 4; margin: 32px 0 0; }
#article.refonte #fiche .bloc_description > #tabs_article { grid-column: 1 / -1; grid-row: 5; }
#article.refonte #fiche .bloc_description > .clear { display: none; }

/* --- galerie --- */
#article.refonte #fiche .blocimg_content { display: block; }

#article.refonte #fiche #blocimg {
    aspect-ratio: 1;
    border-radius: 32px;
    background: #F3E6C4;
}

#article.refonte #fiche #blocimg #lst_zoom .zoom_image img.tnimgprd { padding: 40px; }

#article.refonte #fiche #blocvignette { justify-content: flex-start; margin-top: 14px; }
#article.refonte #fiche #lst_vignette { justify-content: flex-start; margin: 0; }

#article.refonte #fiche .blocimg_content > p {
    margin: 10px 0 0;
    font-size: 13px;
    text-align: left;
}

/* --- titre --- */
#article.refonte #fiche .info-produit {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 8px;
}

#article.refonte #fiche .info-produit h1 {
    order: 2;
    margin: 0;
    font-size: clamp(34px, 3.4vw, 48px);
    line-height: 1.08;
    letter-spacing: -.02em;
}

/* "Producteur : …" devient un surtitre au-dessus du nom */
#article.refonte #fiche .info-produit h2 {
    order: 1;
    margin: 0 !important;
    font-family: var(--texte);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--chataignier);
}

#article.refonte #fiche .info-produit h2 .color6,
#article.refonte #fiche .info-produit h2 a { color: var(--chataignier); }
#article.refonte #fiche .info-produit .clearfix { display: none; }

/* --- achat : prix, options, quantité + bouton (sans encadré) --- */
#article.refonte #fiche form[name=itemForm] {
    margin: 26px 0 0;
    padding: 26px 0 0;
    gap: 24px;
    border: 0;
    border-top: 1px solid var(--cire-bord);
    border-radius: 0;
    background: none;
}

#article.refonte #fiche form[name=itemForm] > .row.flex-sm-nowrap { display: contents; }
#article.refonte #fiche #bloc_prix { order: 1; }
#article.refonte #fiche form[name=itemForm] > .row:not(.flex-sm-nowrap) { order: 2; }
#article.refonte #fiche #bloc_add_quantity { order: 3; }

#article.refonte #fiche #prix { font-size: 34px; }
#article.refonte #fiche #val_tarif_haut { font-size: 17px; }

/* select piloté par les boutons : gardé pour js/article.js, masqué */
#article.refonte .rf-select-pilote {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0;
    pointer-events: none;
}

#article.refonte #fiche .option_item { gap: 10px; }

#article.refonte .rf-choix {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

#article.refonte .rf-choix-bouton {
    min-height: 44px;
    min-width: 64px;
    padding: 0 18px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    background: var(--lin);
    font-family: var(--texte);
    font-size: 15px;
    font-weight: 600;
    color: var(--encre);
    cursor: pointer;
    transition: border-color .2s ease, background-color .2s ease;
}

#article.refonte .rf-choix-bouton:hover { border-color: var(--sapin); }

#article.refonte .rf-choix-bouton[aria-pressed="true"] {
    border-color: var(--sapin);
    background: var(--sapin);
    color: var(--lin);
}

#article.refonte #fiche #panier {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto;
    column-gap: 12px;
}

#article.refonte #fiche #panier > label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

#article.refonte #fiche #panier #quantite { grid-row: 1; }
#article.refonte #fiche #panier #btpanier { grid-row: 1; }

#article.refonte .rf-quantite {
    display: inline-flex;
    align-items: center;
    height: 54px;
    padding: 0 5px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    background: var(--lin);
}

#article.refonte .rf-quantite button {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    color: var(--encre);
    cursor: pointer;
}

#article.refonte .rf-quantite button:hover:not(:disabled) { background: var(--cire); }
#article.refonte .rf-quantite button:disabled { opacity: .35; cursor: default; }

#article.refonte .rf-quantite-valeur {
    min-width: 30px;
    font-size: 17px;
    font-weight: 600;
    text-align: center;
}

/* --- garanties --- */
#article.refonte .rf-garanties {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 20px;
    margin: 26px 0 0;
    padding: 22px 0 0;
    border-top: 1px solid var(--cire-bord);
    list-style: none;
}

#article.refonte .rf-garanties li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    color: var(--texte-doux);
}

#article.refonte .rf-garanties svg { flex: none; color: var(--sapin); }

/* --- description : pleine largeur sous la fiche --- */
#article.refonte #fiche #tabs_article {
    margin: 72px 0 0 !important;
    padding: 40px 32px 44px;
    border-radius: 32px;
}

#article.refonte #fiche #tabs_article .nav-tabs {
    justify-content: center;
    margin-bottom: 24px;
}

#article.refonte #fiche #tabs_article .tab-content {
    max-width: 860px;
    margin: 0 auto;
    padding: 32px 40px;
    border-radius: 24px;
    text-align: left;
}

#article.refonte #fiche #tabs_article .tab-content p { text-align: left !important; }

/* --- produits similaires / même producteur : 4 au plus --- */
#article.refonte #fiche .autre_produit,
#article.refonte #fiche .meme_producteur {
    margin-top: 64px;
    padding-top: 0 !important;
}

#article.refonte #fiche .autre_produit h2,
#article.refonte #fiche .meme_producteur h2 {
    margin: 0 0 24px;
    font-family: var(--titres);
    font-size: clamp(26px, 2.6vw, 34px);
    font-weight: 500;
    color: var(--encre);
    text-align: left;
}

#article.refonte #fiche .autre_produit h2 .filet_item,
#article.refonte #fiche .meme_producteur h2 .filet_item {
    padding: 0;
    background: none;
    color: var(--encre);
}

#article.refonte #fiche .meme_producteur h2 .icon { display: none; }

#article.refonte #fiche .pres_prod {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
    margin: 0;
}

#article.refonte #fiche .pres_prod > li {
    width: auto;
    max-width: none;
    padding: 0;
}

#article.refonte #fiche .pres_prod > li:nth-child(n+5) { display: none; }

/* --- tablette / mobile --- */
@media (max-width: 991px) {
    #article.refonte #fiche { padding: 12px 16px 40px; }

    #article.refonte #fiche .upper_section > .mb-5 > .row { grid-template-columns: minmax(0, 1fr); }

    #article.refonte #fiche .upper_section .row > .col-lg-5 {
        grid-row: auto;
        position: static;
        margin-bottom: 24px;
    }

    #article.refonte #fiche .bloc_description > .info-produit,
    #article.refonte #fiche .bloc_description > form[name=itemForm],
    #article.refonte #fiche .bloc_description > .rf-garanties,
    #article.refonte #fiche .bloc_description > .rf-offrir-fiche,
    #article.refonte #fiche .bloc_description > #tabs_article {
        grid-column: 1;
        grid-row: auto;
    }

    #article.refonte #fiche #tabs_article { margin-top: 48px !important; padding: 20px 12px 24px; border-radius: 24px; }
    #article.refonte #fiche #tabs_article .tab-content { padding: 22px 20px; }
    #article.refonte #fiche .pres_prod { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}

@media (max-width: 575px) {
    #article.refonte .rf-garanties { grid-template-columns: minmax(0, 1fr); }
    #article.refonte #fiche #blocimg #lst_zoom .zoom_image img.tnimgprd { padding: 24px; }
}

/* la photo (sur 3 lignes) ne doit pas étirer les lignes du titre et de l'achat : la dernière absorbe l'excédent */
#article.refonte #fiche .upper_section > .mb-5 > .row { grid-template-rows: auto auto auto 1fr auto; }

/* clearfix Bootstrap : ses pseudo-éléments prenaient la première case de la grille */
#article.refonte #fiche .pres_prod::before,
#article.refonte #fiche .pres_prod::after { display: none; }

/* le style de titre de section ne vise que le titre direct, pas les titres des cartes produits */
#article.refonte #fiche .autre_produit .fiche_produit h2.title_produit,
#article.refonte #fiche .meme_producteur .fiche_produit h2.title_produit {
    margin: 0;
    font-size: 19px;
}

#article.refonte #fiche .autre_produit > h2::before,
#article.refonte #fiche .autre_produit > h2::after,
#article.refonte #fiche .meme_producteur > h2::before,
#article.refonte #fiche .meme_producteur > h2::after,
#article.refonte #fiche .autre_produit > h2 .filet_item::before,
#article.refonte #fiche .autre_produit > h2 .filet_item::after,
#article.refonte #fiche .meme_producteur > h2 .filet_item::before,
#article.refonte #fiche .meme_producteur > h2 .filet_item::after { display: none; }

#article.refonte #fiche #tabs_article .tab-content { color: var(--encre); }

#article.refonte #fiche .autre_produit > h2,
#article.refonte #fiche .meme_producteur > h2 { padding-left: 0; }

/* ordre explicite (sur mobile la grille suit "order") : photo, titre, achat, garanties, encart cadeau, description */
#article.refonte #fiche .upper_section .row > .col-lg-5 { order: 0; }
#article.refonte #fiche .bloc_description > .info-produit { order: 1; }
#article.refonte #fiche .bloc_description > form[name=itemForm] { order: 2; }
#article.refonte #fiche .bloc_description > .rf-garanties { order: 3; }
#article.refonte #fiche .bloc_description > .rf-offrir-fiche { order: 4; }
#article.refonte #fiche .bloc_description > #tabs_article { order: 5; }

@media (max-width: 575px) {
    #article.refonte #fiche #btpanier { font-size: 15px; padding: 0 14px; }
    #article.refonte #fiche .sticker_promo { font-size: 12px; }
}

/* ---------- fiche produit (3) : photo fixe dans la page, description sobre façon magazine ---------- */

#article.refonte #fiche .upper_section .row > .col-lg-5 {
    position: static;
}

#article.refonte #fiche #tabs_article {
    margin: 80px 0 0 !important;
    padding: 48px 0 0;
    border-top: 1px solid var(--cire-bord);
    border-radius: 0;
    background: none;
}

#article.refonte #fiche #tabs_article .nav-tabs {
    justify-content: flex-start;
    gap: 36px;
    margin: 0 0 28px;
    border-bottom: 0;
}

#article.refonte #fiche #tabs_article .nav-link,
#article.refonte #fiche #tabs_article .nav-link:hover,
#article.refonte #fiche #tabs_article .nav-link.active {
    min-height: 0;
    padding: 0 0 8px;
    border: 0;
    border-radius: 0;
    background: none;
    font-family: var(--titres);
    font-size: clamp(22px, 2vw, 27px);
    font-weight: 500;
    color: var(--texte-doux);
    box-shadow: inset 0 -3px 0 transparent;
    transition: color .2s ease, box-shadow .2s ease;
}

#article.refonte #fiche #tabs_article .nav-link:hover { color: var(--encre); }

#article.refonte #fiche #tabs_article .nav-link.active {
    color: var(--encre);
    box-shadow: inset 0 -3px 0 var(--miel);
}

#article.refonte #fiche #tabs_article .tab-content {
    max-width: 72ch;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    font-size: 17px;
    line-height: 1.75;
    color: var(--encre);
}

#article.refonte #fiche #tabs_article .tab-content p {
    margin: 0 0 14px;
    text-align: left !important;
}

#article.refonte #fiche #tabs_article .tab-content p:empty,
#article.refonte #fiche #tabs_article .tab-content p:has(> span:only-child:empty) { display: none; }

@media (max-width: 991px) {
    #article.refonte #fiche #tabs_article { margin-top: 48px !important; padding: 32px 0 0; }
    #article.refonte #fiche #tabs_article .nav-tabs { gap: 22px; }
    #article.refonte #fiche #tabs_article .tab-content { padding: 0; font-size: 16px; }
}

/* ---------- fil de l'abeille vivant (accueil, js/refonte-fil.js) ---------- */

/* quand le fil vivant est actif, les fils fixes de l'accueil et du pied de page s'effacent */
html.rf-fil-dynamique .rf-fil { display: none; }

.rf-fil-vivant {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 44;
    overflow: visible;
    pointer-events: none;
}

.rf-fil-vivant path.rf-fil-noir,
.rf-fil-vivant path.rf-fil-jaune {
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-dasharray: 5 12;
}

.rf-fil-vivant path.rf-fil-noir { stroke: #2B2A22; opacity: .75; }
.rf-fil-vivant path.rf-fil-jaune { stroke: #F2C81B; stroke-dashoffset: -8.5; }

.rf-abeille-vivante {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 45;
    width: 34px;
    height: 35px;
    pointer-events: none;
    opacity: 0;
    transition: opacity .4s ease;
    will-change: transform;
    filter: drop-shadow(0 3px 4px rgba(43, 42, 34, .15));
}

/* les descriptions saisies dans le back-office embarquent parfois une couleur grise : texte de la charte */
#article.refonte #fiche #tabs_article .tab-content :is(p, span, li, div) { color: inherit !important; }

/* ---------- espace client : cartes aérées, espace avant les engagements ---------- */
body.refonte #espaceClientMenu { padding-top: 24px; padding-bottom: 32px; }
body.refonte #espaceClientMenu #deconnexion { margin: 0 0 24px; }
body.refonte #espaceClientMenu > .row:not(#deconnexion) { row-gap: 24px; margin-left: -12px; margin-right: -12px; }
body.refonte #espaceClientMenu > .row > [class*=col] { padding: 0 12px; }
body.refonte #espaceClientMenu > .row > [class*=col] > a { display: block; height: 100%; }
body.refonte #espaceClientMenu .accm_item { margin: 0; min-height: 140px; padding: 28px 28px 28px 104px; }
body.refonte:not(.page_home) .rf-bas-de-page { margin-top: 72px; }

/* déclinaison en rupture : éteinte, non cliquable, petite croix grise */
#article.refonte .rf-choix-bouton.rf-choix-rupture,
#article.refonte .rf-choix-bouton.rf-choix-rupture[aria-pressed="true"] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-style: dashed;
    border-color: var(--cire-bord);
    background: transparent;
    color: #A39C88;
    cursor: not-allowed;
}

#article.refonte .rf-choix-bouton.rf-choix-rupture[aria-pressed="true"] {
    border-style: solid;
    border-color: #A39C88;
}

#article.refonte .rf-choix-croix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--cire-bord);
    color: #8C8573;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

/* fiche produit avec la colonne panier : un peu moins d'espace entre photo et infos */
#article.refonte #fiche { padding-left: 24px; padding-right: 24px; }
#article.refonte #fiche .upper_section > .mb-5 > .row { column-gap: 48px; }

/* --- réservation (visites) / précommande (reines, essaims) : jours puis créneaux --- */
#article.refonte #fiche .rf-reservation {
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 22px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 24px;
    background: var(--lin);
}

#article.refonte #fiche .rf-reservation-titre {
    margin: 0;
    font-family: var(--titres);
    font-size: 20px;
    font-weight: 500;
    color: var(--encre);
}

#article.refonte #fiche .rf-reservation-erreur { border-color: #B4472F; }
#article.refonte #fiche .rf-reservation-erreur .rf-reservation-titre::after {
    content: " · à choisir";
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 600;
    color: #B4472F;
}

#article.refonte .rf-resa { display: flex; flex-direction: column; gap: 12px; }

#article.refonte .rf-resa-bouton {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.15;
    background: var(--carte);
}

#article.refonte .rf-resa-bouton small {
    font-size: 12px;
    font-weight: 500;
    opacity: .75;
}

#article.refonte .rf-resa-jour {
    margin: 4px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--chataignier);
}

#article.refonte .rf-resa-plus {
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    background: none;
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 600;
    color: var(--sapin);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

#article.refonte #fiche .rf-reservation-note,
#article.refonte #fiche .rf-reservation-vide {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--texte-doux);
}

#article.refonte #fiche .rf-reservation-vide a { color: var(--sapin); font-weight: 600; }

/* --- rubriques et sous-rubriques (pages qui listent les produits) --- */
body.refonte .rf-rubriques { margin: 0 0 24px; }

body.refonte .rf-rubriques summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    background: var(--lin);
    font-weight: 600;
    color: var(--sapin);
    cursor: pointer;
    list-style: none;
}

body.refonte .rf-rubriques summary::-webkit-details-marker { display: none; }
body.refonte .rf-rubriques summary::after { content: "▾"; font-size: 12px; }
body.refonte .rf-rubriques[open] summary::after { content: "▴"; }

body.refonte .rf-rubriques nav {
    margin-top: 12px;
    padding: 20px 22px;
    border: 1px solid var(--cire-bord);
    border-radius: 24px;
    background: var(--carte);
}

body.refonte .rf-rubriques-titre {
    margin: 0 0 10px;
    font-family: var(--titres);
    font-size: 20px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte .rf-rubriques ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

body.refonte .rf-rubriques li { margin: 0; }

/* repliée (tablette, mobile) : la liste dépliée se répartit en colonnes */
body.refonte .rf-rubriques nav > ul { columns: 3 200px; column-gap: 32px; }
body.refonte .rf-rubriques nav > ul > li { break-inside: avoid; }

body.refonte .rf-rubriques a {
    display: block;
    padding: 6px 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--encre);
    text-decoration: none;
}

body.refonte .rf-rubriques a:hover { color: var(--chataignier); }

body.refonte .rf-rubriques li ul {
    margin: 0 0 6px;
    padding-left: 12px;
    border-left: 1.5px solid var(--cire-bord);
}

body.refonte .rf-rubriques li ul a {
    padding: 4px 0;
    font-size: 14px;
    font-weight: 400;
    color: var(--texte-doux);
}

body.refonte .rf-rubriques a[aria-current] { color: var(--chataignier); }
body.refonte .rf-rubriques li ul a[aria-current] { font-weight: 600; }
body.refonte .rf-rubriques li ul a[aria-current]::before { content: "• "; color: var(--miel); }
body.refonte .rf-rubriques-promo { color: #B4472F !important; }

/* pages de rubrique : la liste remplace l'ancien menu de la colonne de gauche */
body.refonte .rf-rubriques-catalogue { margin: 0 0 24px; }

@media (min-width: 992px) {
    body.refonte .rf-rubriques-catalogue summary { display: none; }
    body.refonte .rf-rubriques-catalogue nav { margin-top: 0; padding: 18px 16px; }
    body.refonte .rf-rubriques-catalogue nav > ul { columns: auto; }
}

/* La Boutique : la colonne des rubriques prend de la place, 3 produits par ligne */
@media (min-width: 992px) {
    body.refonte #home_cat_body .cat_prod > li {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }
}

/* pages de rubrique : la colonne des rubriques démarre sous le fil d'Ariane, à hauteur du titre */
body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #breadcrumb { order: 0; }
body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #left_column { order: 1; }
body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > .cat_header { order: 2; }
body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #main_column { order: 3; }
body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > .col-lg-4:not([id]):empty { display: none; }

@media (min-width: 992px) {
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) {
        display: grid;
        grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
        /* la colonne des rubriques, plus haute que l'en-tête, s'étend sur la ligne des produits (1fr) sans écarter l'en-tête */
        grid-template-rows: auto auto 1fr;
        align-items: start;
        justify-items: stretch;
    }

    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > * {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #breadcrumb { grid-column: 1 / -1; grid-row: 1; }
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #left_column { grid-column: 1; grid-row: 2 / span 2; }
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > .cat_header { grid-column: 2; grid-row: 2; }
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) > #main_column { grid-column: 2; grid-row: 3; }
}

@media (min-width: 1200px) {
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) {
        grid-template-columns: minmax(0, 2fr) minmax(0, 10fr);
    }
}

/* ---------- tunnel de commande : choix du retrait / transporteur, paiement ---------- */
body.refonte .choix_transporteur,
body.refonte .choix_paiement { font-family: var(--texte); }

/* plus de grands cadres gris carrés de l'ancien thème */
body.refonte .choix_transporteur .bas_panier,
body.refonte .choix_paiement .bas_panier {
    margin-top: 24px;
    padding: 0 !important;
    border: 0 !important;
    background: none;
    font-family: var(--texte);
}

/* étapes : chiffre clair sur les ronds sapin */
body.refonte .step-panier a .circle { color: var(--lin) !important; }

/* options (point de retrait, transporteur, mode de paiement) : cartes arrondies */
body.refonte .liste_transporteur ul,
body.refonte .choix_mode_paiement ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.refonte .liste_transporteur li,
body.refonte .choix_mode_paiement li {
    margin: 0 !important;
    padding: 18px 22px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 20px;
    background: var(--carte);
    font-family: var(--texte);
    line-height: 1.45;
    transition: border-color .2s ease, background-color .2s ease;
}

body.refonte .liste_transporteur li:hover,
body.refonte .choix_mode_paiement li:hover { border-color: var(--sapin); }

/* option cochée (mode de livraison, mode de paiement) : bordure sapin épaisse et halo, bien visible
   (seul le rond du mode lui-même compte : pas les ronds des relais à l'intérieur) */
body.refonte .liste_transporteur li:has(> .radiobox > input:checked),
body.refonte .choix_mode_paiement li:has(input:checked) {
    border-color: var(--sapin);
    background: var(--lin);
    box-shadow: inset 0 0 0 1.5px var(--sapin), 0 0 0 4px rgba(242, 200, 27, .45);
}

body.refonte .bas_panier .radiobox { line-height: 1.45; }

body.refonte .bas_panier .radiobox label {
    font-family: var(--texte);
    font-size: 16px;
    line-height: 1.45;
    color: var(--texte-doux);
    cursor: pointer;
}

body.refonte .bas_panier .nomtr,
body.refonte .bas_panier .nommp {
    font-family: var(--texte);
    font-size: 17px;
    font-weight: 600;
    color: var(--encre);
}

body.refonte .bas_panier .cout_tr {
    margin-left: 8px;
    font-weight: 600;
    color: var(--chataignier);
}

body.refonte .bas_panier .radiobox p { margin: 2px 0 0; }
body.refonte .bas_panier .icon-map { color: var(--sapin); }

/* bouton radio dessiné : rond cire, point sapin quand choisi */
body.refonte .bas_panier .radioitem {
    width: 20px;
    height: 20px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 50%;
    background: var(--lin);
}

body.refonte .bas_panier input:checked + label .radioitem {
    border-color: var(--sapin);
    background: var(--lin);
    box-shadow: inset 0 0 0 4px var(--lin), inset 0 0 0 10px var(--sapin);
}

/* créneau de retrait en boutique */
body.refonte .liste_transporteur .disponibilites {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--cire-bord);
    font-size: 15px;
}

body.refonte .liste_transporteur .disponibilites select {
    min-height: 44px;
    padding: 0 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 12px;
    background: var(--lin);
    font-family: var(--texte);
}

/* page Livraison : adresse de facturation (ancienne étape Adresses, fusionnée le 25/10/2026) */
body.refonte .facturation[hidden],
body.refonte .facturation_choix[hidden],
body.refonte .facturation_nouvelle[hidden],
body.refonte .liste_transporteur[hidden] { display: none; }

body.refonte .facturation {
    margin-top: 24px;
    padding: 18px 22px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 20px;
    background: var(--carte);
    font-family: var(--texte);
    color: var(--texte-doux);
}

body.refonte .facturation_tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

body.refonte .facturation_titre,
body.refonte .livraison_titre,
body.refonte #espaceClientInt h2.facturation_titre,
body.refonte #espaceClientInt h2.livraison_titre {
    margin: 0;
    line-height: 1.3;
    font-family: var(--texte);
    font-size: 18px;
    font-weight: 700;
    color: var(--encre);
}
body.refonte #espaceClientInt h2.livraison_titre { margin: 28px 0 0; }
body.refonte .choix_transporteur .liste_transporteur { margin-top: 12px; }

body.refonte #espaceClientInt .facturation_modifier {
    margin: 0;
    padding: 0 16px;
    height: 38px;
    border: 1.5px solid var(--sapin);
    border-radius: 999px;
    background: var(--lin);
    color: var(--sapin);
    font-family: var(--texte);
    font-weight: 600;
    cursor: pointer;
}
body.refonte #espaceClientInt .facturation_modifier:hover { background: var(--sapin); color: var(--lin); }

body.refonte .facturation_resume,
body.refonte .facturation_aide { margin: 8px 0 0; font-size: 15px; line-height: 1.5; }
body.refonte .facturation_resume strong { color: var(--encre); }

body.refonte .facturation_choix {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--cire-bord);
}

body.refonte .facturation_option {
    position: relative;
    padding: 10px 14px 10px 44px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 14px;
    background: var(--lin);
}
body.refonte .facturation_option:has(input:checked) { border-color: var(--sapin); box-shadow: inset 0 0 0 1px var(--sapin); }

body.refonte .facturation_option input {
    position: absolute;
    top: 12px;
    left: 14px;
    width: 20px;
    height: 20px;
    margin: 0;
    opacity: 1;
    appearance: none;
    border: 1.5px solid var(--cire-bord);
    border-radius: 50%;
    background: var(--lin);
    cursor: pointer;
}
body.refonte .facturation_option input:checked {
    border-color: var(--sapin);
    box-shadow: inset 0 0 0 4px var(--lin), inset 0 0 0 10px var(--sapin);
}
body.refonte .facturation_option input:focus-visible { outline: 2px solid var(--sapin); outline-offset: 2px; }

body.refonte .facturation_option label {
    display: block;
    margin: 0;
    padding: 0 !important;
    font-size: 15px;
    line-height: 1.4;
    cursor: pointer;
}
body.refonte .facturation_option label strong { display: block; color: var(--encre); }

body.refonte .facturation_nouvelle { padding: 4px 0 0; }

body.refonte .facturation_champs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}
body.refonte .facturation_champs p { margin: 0; }
body.refonte .facturation_champs .large { grid-column: 1 / -1; }
body.refonte .facturation_champs label {
    display: block;
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--encre);
}
body.refonte #espaceClientInt .facturation_champs input,
body.refonte #espaceClientInt .facturation_champs select {
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 12px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 12px;
    background: var(--lin);
    font-family: var(--texte);
    font-size: 16px;
}
body.refonte #espaceClientInt .facturation_champs input:focus,
body.refonte #espaceClientInt .facturation_champs select:focus { border-color: var(--sapin); outline: none; }

@media (max-width: 575px) {
    body.refonte .facturation { padding: 16px; }
    body.refonte .facturation_champs { grid-template-columns: minmax(0, 1fr); }
}

/* point relais choisi sur la page Livraison : carte + liste sous l'option Mondial Relay */
body.refonte .liste_transporteur .relais[hidden],
body.refonte .liste_transporteur .relais_contenu[hidden],
body.refonte .liste_transporteur .relais_etat[hidden],
body.refonte .livraison_erreur[hidden] { display: none; }

body.refonte .liste_transporteur .relais {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--cire-bord);
    font-size: 15px;
    color: var(--texte-doux);
}

body.refonte .liste_transporteur .relais_etat { margin: 0 0 12px; }
body.refonte .liste_transporteur .relais_etat strong { color: var(--encre); }
body.refonte .liste_transporteur .relais_etat_erreur { color: #8A2A12; font-weight: 600; }
body.refonte .liste_transporteur .relais_recherche[hidden],
body.refonte .liste_transporteur .relais_communes[hidden] { display: none; }

/* livrer ailleurs : code postal ou ville */
body.refonte .liste_transporteur .relais_recherche { margin-bottom: 14px; }
body.refonte .liste_transporteur .relais_recherche label {
    display: block;
    margin: 0 0 6px;
    padding: 0;
    font-weight: 600;
    color: var(--encre);
}
body.refonte .liste_transporteur .relais_recherche_ligne { display: flex; gap: 8px; max-width: 460px; }
body.refonte .liste_transporteur .relais_recherche input {
    flex: 1;
    min-width: 0;
    height: 44px;
    margin: 0;
    line-height: normal;
    padding: 0 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 12px;
    background: var(--lin);
    font-family: var(--texte);
    font-size: 16px;
}
body.refonte .liste_transporteur .relais_recherche input:focus { border-color: var(--sapin); outline: none; }
body.refonte .liste_transporteur .relais_chercher {
    height: 44px;
    margin: 0;
    padding: 0 18px;
    border: 0;
    border-radius: 12px;
    background: var(--sapin);
    color: var(--lin);
    font-family: var(--texte);
    font-weight: 600;
    cursor: pointer;
}
body.refonte .liste_transporteur .relais_chercher:hover { background: var(--sapin-fonce); }
body.refonte .liste_transporteur .relais_communes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
body.refonte .liste_transporteur .relais_commune {
    height: 38px;
    margin: 0;
    line-height: 1;
    padding: 0 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    background: var(--lin);
    color: var(--encre);
    font-family: var(--texte);
    font-size: 15px;
    cursor: pointer;
}
body.refonte .liste_transporteur .relais_commune:hover { border-color: var(--sapin); }
/* l'ancien thème met 20 px au-dessus des boutons de #espaceClientInt form et 48 px de haut aux champs */
body.refonte #espaceClientInt .relais button { margin-top: 0; }
body.refonte #espaceClientInt .relais_recherche input,
body.refonte #espaceClientInt .relais_chercher { height: 48px; }
body.refonte .liste_transporteur .relais_retour {
    padding: 0;
    border: 0;
    background: none;
    color: var(--sapin);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
}

body.refonte .liste_transporteur .relais_grille {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    grid-template-areas: "liste carte";
    gap: 16px;
}

body.refonte .liste_transporteur .relais_carte {
    grid-area: carte;
    min-height: 420px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--cire-bord);
    z-index: 0;
}

body.refonte .liste_transporteur .relais_liste {
    grid-area: liste;
    position: relative;
    max-height: 420px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-right: 4px;
}

body.refonte .liste_transporteur .relais_item {
    position: relative;
    padding: 12px 14px 10px 44px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 14px;
    background: var(--lin);
    transition: border-color .2s ease;
}

body.refonte .liste_transporteur .relais_item:hover { border-color: var(--sapin); }

/* relais choisi : carte pleine vert sapin, texte clair, pastille miel « Choisi » */
body.refonte .liste_transporteur .relais_item.choisi {
    border: 2px solid var(--sapin);
    background: var(--sapin);
    color: var(--lin);
    box-shadow: 0 4px 14px rgba(31, 42, 27, .25);
}
body.refonte .liste_transporteur .relais_item.choisi .relais_nom,
body.refonte .liste_transporteur .relais_item.choisi .relais_adresse,
body.refonte .liste_transporteur .relais_item.choisi .relais_horaires,
body.refonte .liste_transporteur .relais_item.choisi .relais_horaires th,
body.refonte .liste_transporteur .relais_item.choisi .relais_horaires summary { color: var(--lin); }
body.refonte .liste_transporteur .relais_item.choisi input:checked {
    border-color: var(--lin);
    background: var(--sapin);
    box-shadow: inset 0 0 0 4px var(--sapin), inset 0 0 0 10px var(--miel);
}
body.refonte .liste_transporteur .relais_item.choisi::after {
    content: "✓ Choisi";
    position: absolute;
    top: 10px;
    right: 12px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--miel);
    color: var(--encre);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
}
body.refonte .liste_transporteur .relais_item.choisi label { padding-right: 76px !important; }
body.refonte .liste_transporteur .relais_item.choisi .relais_distance { display: none; }

/* rappel du relais choisi sous la liste */
body.refonte .liste_transporteur .relais_resume[hidden] { display: none; }
body.refonte .liste_transporteur .relais_resume {
    margin: 14px 0 0;
    padding: 12px 16px;
    border-left: 4px solid var(--miel);
    border-radius: 12px;
    background: #FCF1C4;
    color: var(--encre);
    font-size: 15px;
    line-height: 1.45;
}
body.refonte .liste_transporteur .relais_resume_titre {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sapin);
}

/* rond dessiné comme les autres options du tunnel (l'ancien thème rend les radios transparentes) */
body.refonte .liste_transporteur .relais_item input {
    position: absolute;
    top: 14px;
    left: 14px;
    opacity: 1;
    width: 20px;
    height: 20px;
    margin: 0;
    appearance: none;
    border: 1.5px solid var(--cire-bord);
    border-radius: 50%;
    background: var(--lin);
    cursor: pointer;
}

body.refonte .liste_transporteur .relais_item input:checked {
    border-color: var(--sapin);
    box-shadow: inset 0 0 0 4px var(--lin), inset 0 0 0 10px var(--sapin);
}

body.refonte .liste_transporteur .relais_item input:focus-visible { outline: 2px solid var(--sapin); outline-offset: 2px; }

body.refonte .liste_transporteur .relais_item label {
    padding: 0 !important;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 10px;
    margin: 0;
    cursor: pointer;
}

body.refonte .liste_transporteur .relais_nom {
    font-weight: 600;
    color: var(--encre);
    line-height: 1.3;
}

body.refonte .liste_transporteur .relais_adresse { grid-column: 1; font-size: 14px; line-height: 1.4; }

body.refonte .liste_transporteur .relais_distance {
    grid-column: 2;
    grid-row: 1;
    font-size: 13px;
    font-weight: 600;
    color: var(--chataignier);
    white-space: nowrap;
}

body.refonte .liste_transporteur .relais_horaires { margin-top: 4px; font-size: 13px; }
body.refonte .liste_transporteur .relais_horaires summary { cursor: pointer; color: var(--sapin); width: max-content; }
body.refonte .liste_transporteur .relais_horaires table { margin-top: 6px; border-collapse: collapse; }
body.refonte .liste_transporteur .relais_horaires th { padding: 1px 12px 1px 0; font-weight: 600; color: var(--encre); }
body.refonte .liste_transporteur .relais_horaires td { padding: 1px 0; }

body.refonte .liste_transporteur .relais_popup { font-family: var(--texte); font-size: 14px; }

/* repère sur la carte : épingle sapin, miel quand le relais est choisi */
body.refonte .relais_epingle { background: none; border: 0; }
body.refonte .relais_epingle span {
    display: block;
    width: 26px;
    height: 26px;
    margin: 2px 0 0 3px;
    border: 3px solid var(--lin);
    border-radius: 50% 50% 50% 0;
    background: var(--sapin);
    box-shadow: 0 2px 6px rgba(31, 42, 27, .35);
    transform: rotate(-45deg);
    transition: background-color .2s ease, transform .2s ease;
}
body.refonte .relais_epingle.choisi { z-index: 1000 !important; }
body.refonte .relais_epingle.choisi span { background: var(--miel); transform: rotate(-45deg) scale(1.2); }

body.refonte .liste_transporteur .relais_mobile {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 16px;
}

body.refonte .liste_transporteur .relais_mobile label { margin: 0; font-weight: 600; color: var(--encre); }

body.refonte .liste_transporteur .relais_mobile input {
    min-height: 44px;
    width: 220px;
    max-width: 100%;
    padding: 0 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 12px;
    background: var(--lin);
    font-family: var(--texte);
}

body.refonte .liste_transporteur .relais_mobile small { flex-basis: 100%; font-size: 13px; }

body.refonte .livraison_erreur {
    margin: 14px 0 0;
    padding: 12px 16px;
    border-radius: 12px;
    background: #FBE9E4;
    color: #8A2A12;
    font-weight: 600;
}

/* téléphone : carte au-dessus, liste en dessous */
@media (max-width: 767px) {
    body.refonte .liste_transporteur .relais_grille {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "carte" "liste";
    }
    body.refonte .liste_transporteur .relais_carte { min-height: 240px; }
    body.refonte .liste_transporteur .relais_liste { max-height: 360px; }
}

/* paiement : titre à taille raisonnable, récapitulatif sans barre vide */
body.refonte .choix_paiement .tunnel_title {
    margin: 32px 0 16px !important;
    font-size: clamp(24px, 2.4vw, 30px);
    line-height: 1.2;
}

body.refonte .choix_paiement .bas_panier,
body.refonte .choix_paiement .bas_panier td,
body.refonte .choix_paiement .bas_panier th { font-family: var(--texte); }

body.refonte #remise-recap-content:not(:has(*)) { display: none; }

body.refonte .choix_paiement .txtmp { display: block; color: var(--texte-doux); }
body.refonte .choix_paiement .iconmp { margin: 0 12px 0 6px; vertical-align: middle; }
/* mode de paiement sans logo configuré : pas d'image cassée */
body.refonte .choix_paiement .iconmp[src=""] { display: none; }

/* mode de paiement : rond | logo | nom + textes, alignés en grille (le rond de l'ancien thème était en absolu) */
body.refonte .choix_mode_paiement .radiobox label {
    display: grid;
    grid-template-columns: 20px 64px minmax(0, 1fr);
    column-gap: 16px;
    align-items: center;
    padding-left: 0;
}
body.refonte .choix_mode_paiement .radioitem {
    position: relative;
    top: auto;
    left: auto;
    margin: 0;
    grid-column: 1;
    grid-row: 1 / span 3;
}
body.refonte .choix_mode_paiement .iconmp {
    grid-column: 2;
    grid-row: 1 / span 3;
    width: 64px;
    height: 40px;
    margin: 0;
    object-fit: contain;
}
body.refonte .choix_mode_paiement .nommp,
body.refonte .choix_mode_paiement .txtmp { grid-column: 3; }
body.refonte .choix_mode_paiement .txtmp-note { margin-top: 4px; font-size: 14px; line-height: 1.4; }

@media (max-width: 575px) {
    body.refonte .choix_mode_paiement li { padding: 16px; }
    body.refonte .choix_mode_paiement .radiobox label { grid-template-columns: 20px 44px minmax(0, 1fr); column-gap: 12px; }
    body.refonte .choix_mode_paiement .iconmp { width: 44px; height: 32px; }
}

/* boutons Précédent / Continuer : texte centré (la classe inlineblock de l'ancien thème cassait l'alignement) */
body.refonte #panier_action {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}

body.refonte #panier_action .btn-custom {
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
}

body.refonte #panier_action .btn-secondary {
    background: transparent;
    color: var(--sapin);
}

body.refonte #panier_action .btn-secondary:hover { background: var(--cire); color: var(--sapin); }

/* ---------- accueil : fleurs butinées à droite de l'alvéole 7j/7 (js/refonte-prairie.js) ---------- */
/* les abeilles peuvent voler jusqu'au bord de l'écran sans créer de défilement horizontal */
body.refonte .rf-hero { position: relative; overflow-x: clip; }

/* dans le bloc des alvéoles, au pied et à droite de l'alvéole "Boutique 7j/7" */
body.refonte .rf-prairie {
    --rf-butineuse: 22px;
    position: absolute;
    bottom: 2px;
    /* juste à droite de l'alvéole 7j/7 (qui finit à 77 % de la largeur du nid) */
    left: 80.2%;
    z-index: 2;
    width: 112px;
    height: 91px;
    pointer-events: none;
}

/* écran large : les alvéoles sont centrées, la marge de droite s'élargit et la prairie s'y avance */
@media (min-width: 1600px) {
    body.refonte .rf-prairie {
        --rf-butineuse: 26px;
        left: min(calc(100% - 180px + (100vw - 1440px) / 2), calc(100% + 60px));
        width: 190px;
        height: 154px;
    }
}

body.refonte .rf-prairie svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

body.refonte .rf-fleur {
    transform-box: view-box;
    animation: rf-balance 5.5s ease-in-out infinite alternate;
}

body.refonte .rf-fleur-1 { transform-origin: 58px 209px; animation-duration: 6.2s; }
body.refonte .rf-fleur-2 { transform-origin: 138px 209px; animation-delay: -2s; }
body.refonte .rf-fleur-3 { transform-origin: 212px 209px; animation-duration: 4.8s; animation-delay: -1s; }

/* petite ruche en paille, en haut à droite du nid d'alvéoles */
body.refonte .rf-ruche {
    position: absolute;
    top: -13%;
    right: -3%;
    z-index: 2;
    width: 15%;
    pointer-events: none;
}

body.refonte .rf-ruche svg { display: block; width: 100%; height: auto; overflow: visible; }

@keyframes rf-balance {
    from { transform: rotate(-2.2deg); }
    to { transform: rotate(2.2deg); }
}

body.refonte .rf-butineuse {
    position: absolute;
    top: 0;
    left: 0;
    width: var(--rf-butineuse);
    height: var(--rf-butineuse);
    opacity: 0;
    transition: opacity .6s ease;
    will-change: transform;
}

/* sous 1200 px, les alvéoles passent sous le texte : pas de place pour les fleurs */
@media (max-width: 1199px) {
    body.refonte .rf-prairie,
    body.refonte .rf-ruche { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    body.refonte .rf-fleur { animation: none; }
}

/* liens vers une section de l'accueil (#visites…) : le titre s'arrête sous l'en-tête collant, pas dessous */
body.refonte .rf-section[id] { scroll-margin-top: calc(var(--rf-h-header, 146px) - 80px); }

@media (max-width: 991px) {
    body.refonte .rf-section[id] { scroll-margin-top: calc(var(--rf-h-header, 120px) - 40px); }
}

/* créneaux de visite : une liste pour le jour, une pour l'heure */
#article.refonte #fiche .rf-reservation-choix {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 12px;
}

@media (max-width: 575px) {
    #article.refonte #fiche .rf-reservation-choix { grid-template-columns: minmax(0, 1fr); }
}

#article.refonte #fiche .rf-reservation-champ {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}

#article.refonte #fiche .rf-reservation-champ > span {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--texte-doux);
}

#article.refonte #fiche #input_reservation:disabled { opacity: .55; cursor: default; }

#article.refonte #fiche #rf-resa-jour,
#article.refonte #fiche #input_reservation {
    width: 100%;
    min-height: 52px;
    padding: 0 44px 0 18px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 16px;
    background: var(--lin) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2334432E' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 18px center;
    font-family: var(--texte);
    font-size: 16px;
    font-weight: 600;
    color: var(--encre);
    cursor: pointer;
    appearance: none;
}

#article.refonte #fiche #rf-resa-jour:focus-visible,
#article.refonte #fiche #input_reservation:focus-visible {
    outline: 2px solid var(--sapin);
    outline-offset: 2px;
}

/* créneaux de visite avec JS (refonte-fiche.js) : calendrier des jours ouverts, les listes ci-dessus sont cachées */
#article.refonte #fiche .rf-cal {
    max-width: 400px;
    padding: 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 20px;
    background: var(--carte);
}

#article.refonte #fiche .rf-cal-entete {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

#article.refonte #fiche .rf-cal-mois {
    margin: 0;
    font-family: var(--titres);
    font-size: 18px;
    font-weight: 500;
    color: var(--encre);
}

#article.refonte #fiche .rf-cal-mois::first-letter { text-transform: uppercase; }

#article.refonte #fiche .rf-cal-nav {
    width: 40px;
    height: 40px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 50%;
    background: var(--lin);
    font-size: 22px;
    line-height: 1;
    color: var(--sapin);
    cursor: pointer;
}

#article.refonte #fiche .rf-cal-nav:disabled { opacity: .3; cursor: default; }

#article.refonte #fiche .rf-cal-grille {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
    text-align: center;
}

#article.refonte #fiche .rf-cal-semaine {
    padding: 4px 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--texte-doux);
}

#article.refonte #fiche .rf-cal-ferme,
#article.refonte #fiche .rf-cal-jour {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    min-height: 40px;
    border-radius: 50%;
    font-family: var(--texte);
    font-size: 15px;
}

#article.refonte #fiche .rf-cal-ferme { color: var(--texte-doux); opacity: .4; }

#article.refonte #fiche .rf-cal-jour {
    padding: 0;
    border: 1.5px solid var(--miel);
    background: rgba(242, 200, 27, .22);
    font-weight: 700;
    color: var(--encre);
    cursor: pointer;
    transition: background-color .2s ease;
}

#article.refonte #fiche .rf-cal-jour:hover { background: var(--miel); }

#article.refonte #fiche .rf-cal-jour[aria-pressed="true"] {
    border-color: var(--sapin);
    background: var(--sapin);
    color: var(--lin);
}

#article.refonte #fiche .rf-cal-jour:focus-visible,
#article.refonte #fiche .rf-cal-nav:focus-visible {
    outline: 2px solid var(--sapin);
    outline-offset: 2px;
}

#article.refonte #fiche .rf-cal-heures:empty { display: none; }
#article.refonte #fiche .rf-cal-heures { display: flex; flex-direction: column; gap: 8px; }
#article.refonte #fiche .rf-cal-heures .rf-resa-jour::first-letter { text-transform: uppercase; }
#article.refonte #fiche .rf-cal-message { margin: 0; font-size: 14px; color: var(--texte-doux); }

/* en-tête collant : l'ancien thème bridait le logo à 250 px (avec 20 px de marges) hors accueil ; il garde sa taille */
body.refonte #header.rf-header.sticky #logo {
    max-width: none;
    margin-top: 0;
    margin-bottom: 0;
}

/* ---------- cookies : bandeau et panneau de réglages aux couleurs du site ---------- */
body.refonte #cookies_content {
    padding: 16px 0;
    background: var(--sapin);
    box-shadow: 0 -10px 30px rgba(31, 42, 27, .18);
    font-family: var(--texte);
}

body.refonte #cookies_content,
body.refonte #cookies_content p {
    font-size: 14px;
    line-height: 1.5;
    color: var(--lin);
}

body.refonte #cookies_content .row { align-items: center; }
body.refonte #cookies_content .alert_txt { margin: 0; padding: 0; }

body.refonte #cookies_content .alert_txt a,
body.refonte #cookies_content .link_cookies { color: var(--miel); }

body.refonte #cookies_content .alert_close {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    width: auto;
    margin: 0;
}

body.refonte #cookies_content .alert_close > span {
    flex: none;
    width: auto;
    max-width: none;
    padding: 0;
}

body.refonte .alert_close a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 22px;
    border: 1.5px solid var(--sapin);
    border-radius: 999px;
    background: var(--sapin);
    font-family: var(--texte);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--lin);
    opacity: 1;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

/* bandeau : "Tout accepter" couleur miel, "Plus d'options" en contour clair */
body.refonte #cookies_content .alert_close a.accepted {
    border-color: var(--miel);
    background: var(--miel);
    color: var(--encre);
}

body.refonte #cookies_content .alert_close a.accepted:hover,
body.refonte #cookies_content .alert_close a.accepted:focus {
    border-color: #F7D961;
    background: #F7D961;
    color: var(--encre);
}

body.refonte #cookies_content .alert_close a.refused {
    border-color: rgba(251, 247, 239, .7);
    background: transparent;
    color: var(--lin);
}

body.refonte #cookies_content .alert_close a.refused:hover,
body.refonte #cookies_content .alert_close a.refused:focus {
    border-color: var(--lin);
    background: rgba(251, 247, 239, .12);
    color: var(--lin);
}

@media (max-width: 991px) {
    body.refonte #cookies_content .alert_close { justify-content: flex-start; margin-top: 12px; }
}

/* panneau "Vos paramètres de gestion des cookies" */
body.refonte #cookies_options {
    max-width: 860px;
    padding: 36px 40px;
    border-radius: 28px;
    background: var(--lin);
    font-family: var(--texte);
    color: var(--encre);
}

body.refonte #cookies_options .h3 {
    margin: 0 0 20px;
    font-family: var(--titres);
    font-size: 28px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte #cookies_options p {
    font-size: 14px;
    line-height: 1.55;
    color: var(--texte-doux);
}

body.refonte #cookies_options .cookies_options_container {
    margin: 0 0 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--cire-bord);
}

body.refonte #cookies_options .cookies_option_title strong {
    font-size: 16px;
    font-weight: 600;
    color: var(--encre);
}

body.refonte #cookies_options .cookies_option_title span { color: var(--sapin); }
body.refonte #cookies_options a.link_cookies { color: var(--sapin); font-weight: 600; }

body.refonte #cookies_options_list .cookies_options_container:first-child .swip_checkbox::before {
    top: -20px;
    color: var(--chataignier);
    font-size: 12px;
    font-weight: 600;
}

/* interrupteurs : rail cire, pastille blanche ; activé = rail sapin */
body.refonte #cookies_options .swip_checkbox [type=checkbox] + label {
    margin-bottom: 0;
    padding-left: 56px;
    min-height: 28px;
}

body.refonte #cookies_options .swip_checkbox [type=checkbox] + label:before {
    top: 0;
    width: 52px;
    height: 28px;
    border-radius: 999px;
    background: var(--cire-bord);
}

body.refonte #cookies_options .swip_checkbox [type=checkbox] + label:after {
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(31, 42, 27, .25);
}

body.refonte #cookies_options .swip_checkbox [type=checkbox]:checked + label:before { background: var(--sapin); }
body.refonte #cookies_options .swip_checkbox [type=checkbox]:checked + label:after { left: 27px; background: #fff; }
body.refonte #cookies_options .swip_checkbox [type=checkbox]:disabled + label { opacity: .6; cursor: default; }
body.refonte #cookies_options .swip_checkbox [type=checkbox]:focus-visible + label:before { outline: 2px solid var(--miel); outline-offset: 2px; }

/* croix et coche de l'ancien thème : inutiles sur un interrupteur */
body.refonte #cookies_options .swip_checkbox label .ui { display: none; }

body.refonte #cookies_options .alert_close {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 6px 0 14px;
}

body.refonte #cookies_options .alert_close a.save {
    background: transparent;
    color: var(--sapin);
}

body.refonte #cookies_options .alert_close a:hover,
body.refonte #cookies_options .alert_close a:focus {
    border-color: var(--sapin-fonce);
    background: var(--sapin-fonce);
    color: var(--lin);
}

@media (max-width: 575px) {
    body.refonte #cookies_options { padding: 28px 20px; border-radius: 22px; }
}

body.refonte #cookies_content .alert_txt span { display: block; height: auto; line-height: 1.5; }

/* en-tête collant : le logo perd ses marges (30 px dessus et dessous) en douceur, et le contenu reçoit
   la même hauteur au même rythme, pour que la page ne saute pas quand le menu se resserre */
@media (min-width: 992px) {
    body.refonte #header.rf-header #logo { transition: margin .35s ease; }
    body.refonte #contenu { transition: margin-top .35s ease; }
    body.refonte #header.rf-header.sticky ~ #contenu { margin-top: 60px; }
}

/* colonne panier : la carte ne déborde plus vers le bord de l'écran (même marge qu'à gauche) */
body.refonte #contenu_panier .listing_panier_content {
    margin-left: 0;
    margin-right: 0;
}

/* ---------- page contact ---------- */
body.refonte .rf-contact { padding: 24px 0 88px; }

body.refonte .rf-contact-entete {
    max-width: 720px;
    margin: 28px 0 40px;
}

body.refonte .rf-contact-entete h1 {
    margin: 10px 0 14px;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.08;
}

body.refonte .rf-contact-intro,
body.refonte .rf-contact-intro p {
    margin: 0;
    font-size: 18px;
    line-height: 1.6;
    color: var(--texte-doux);
}

body.refonte .rf-contact-grille {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
    gap: 32px;
    align-items: start;
}

body.refonte .rf-contact-infos {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.refonte .rf-contact-carte {
    display: flex;
    gap: 16px;
    padding: 20px 22px;
    border: 1px solid var(--cire-bord);
    border-radius: 22px;
    background: var(--carte);
}

body.refonte .rf-contact-carte > svg {
    flex: none;
    margin-top: 2px;
    color: var(--sapin);
}

body.refonte .rf-contact-carte h2 {
    margin: 0 0 4px;
    font-family: var(--titres);
    font-size: 19px;
    font-weight: 500;
    color: var(--encre);
}

body.refonte .rf-contact-carte p {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--texte-doux);
}

body.refonte .rf-contact-carte a { color: var(--sapin); font-weight: 600; }
body.refonte .rf-contact-carte .rf-lien { display: inline-block; margin-top: 8px; font-size: 14px; }

body.refonte .rf-contact-facebook {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    align-self: flex-start;
    min-height: 44px;
    padding: 0 20px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    font-weight: 600;
    color: var(--sapin);
}

body.refonte .rf-contact-facebook:hover { border-color: var(--sapin); }

body.refonte .rf-contact-formulaire {
    padding: 32px 36px;
    border: 1px solid var(--cire-bord);
    border-radius: 28px;
    background: var(--lin);
    box-shadow: 0 10px 30px rgba(52, 67, 46, .06);
}

body.refonte .rf-contact-formulaire > h2 {
    margin: 0 0 20px;
    font-family: var(--titres);
    font-size: 26px;
    font-weight: 500;
}

/* formulaire : étiquettes à gauche dans la police du site, champs arrondis */
body.refonte .rf-contact-formulaire .form_control { margin: 0; }
body.refonte .rf-contact-formulaire .form_control .row { row-gap: 0; }

body.refonte .rf-contact-formulaire .label-title {
    display: block;
    margin: 0 0 6px;
    font-family: var(--texte);
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    color: var(--encre);
}

body.refonte .rf-contact-formulaire input[type=text],
body.refonte .rf-contact-formulaire input[type=email],
body.refonte .rf-contact-formulaire input[type=tel],
body.refonte .rf-contact-formulaire select,
body.refonte .rf-contact-formulaire textarea {
    width: 100%;
    min-height: 48px;
    margin: 0 0 16px;
    padding: 10px 16px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 14px;
    background: #fff;
    font-family: var(--texte);
    font-size: 16px;
    color: var(--encre);
}

body.refonte .rf-contact-formulaire textarea { min-height: 150px; resize: vertical; }

body.refonte .rf-contact-formulaire input:focus,
body.refonte .rf-contact-formulaire select:focus,
body.refonte .rf-contact-formulaire textarea:focus {
    border-color: var(--sapin);
    outline: none;
    box-shadow: 0 0 0 3px rgba(52, 67, 46, .12);
}

body.refonte .rf-contact-formulaire .bold.small {
    margin: 0 !important;
    font-family: var(--texte);
    font-size: 13px;
    font-weight: 500;
    color: var(--texte-doux) !important;
}

body.refonte .rf-contact-formulaire .btn_orange {
    text-align: left;
}

body.refonte .rf-contact-formulaire .btn_orange .button {
    margin: 18px 0 0 !important;
    text-transform: none;
}

@media (max-width: 991px) {
    body.refonte .rf-contact-grille { grid-template-columns: minmax(0, 1fr); }
    body.refonte .rf-contact-formulaire { padding: 24px 20px; }
}

body.refonte .rf-contact-formulaire #fContact,
body.refonte .rf-contact-formulaire .formcontact {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

body.refonte .rf-contact-formulaire .bold.small { text-align: left; }

/* espace client : sa rangée Bootstrap dépassait de 15 px à droite (barre de défilement horizontale) */
body.refonte #espaceClient.row {
    margin-left: 0;
    margin-right: 0;
}

/* en-tête sur toute la largeur : logo, grande recherche au milieu, liens et boutons à droite */
@media (min-width: 992px) {
    body.refonte .rf-header-top.rf-wrap {
        max-width: 1600px;
        gap: 32px;
    }

    body.refonte .rf-logo img,
    body.refonte #header.sticky .rf-logo img,
    body.refonte #logo img { width: clamp(250px, 24.5vw, 350px); }

    body.refonte .rf-recherche {
        flex: 1 1 auto;
        min-width: 240px;
        max-width: 640px;
    }

    body.refonte #searchblock #search { min-height: 50px; font-size: 16px; }
    body.refonte #searchblock #btsearch { top: 4px; right: 4px; width: 42px; height: 42px; }

    body.refonte .rf-acces { margin-left: 0; gap: 24px; }
    body.refonte .rf-actions { gap: 10px; margin-left: auto; }
}

/* ---------- recherche en direct (js/refonte-recherche.js) ---------- */
body.refonte .rf-suggestions {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 80;
    min-width: 320px;
    max-height: min(70vh, 560px);
    overflow-y: auto;
    padding: 10px;
    border: 1px solid var(--cire-bord);
    border-radius: 22px;
    background: var(--lin);
    box-shadow: 0 18px 40px rgba(31, 42, 27, .16);
    text-align: left;
}

body.refonte .rf-suggestions[hidden] { display: none; }

body.refonte .rf-suggestions-titre {
    margin: 6px 10px 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--chataignier);
}

body.refonte .rf-suggestions-rubriques {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 8px 6px;
}

body.refonte .rf-suggestion-rubrique {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 14px;
    border: 1.5px solid var(--cire-bord);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
    color: var(--sapin);
}

body.refonte .rf-suggestion {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 14px;
    color: var(--encre);
    text-decoration: none;
}

body.refonte .rf-suggestion img,
body.refonte .rf-suggestion-sans-image {
    flex: none;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--carte);
    object-fit: contain;
}

body.refonte .rf-suggestion-texte {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

body.refonte .rf-suggestion-texte strong {
    overflow: hidden;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.refonte .rf-suggestion-texte small { font-size: 13px; color: var(--texte-doux); }

body.refonte .rf-suggestion-prix {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    font-size: 15px;
    font-weight: 600;
    color: var(--encre);
}

body.refonte .rf-suggestion-prix del { font-size: 12px; font-weight: 400; color: var(--texte-doux); }

body.refonte .rf-suggestion:hover,
body.refonte .rf-suggestion.rf-actif,
body.refonte .rf-suggestion-rubrique:hover,
body.refonte .rf-suggestion-rubrique.rf-actif,
body.refonte .rf-suggestions-tous:hover,
body.refonte .rf-suggestions-tous.rf-actif { background: var(--cire); }

body.refonte .rf-suggestions-tous {
    display: block;
    margin-top: 6px;
    padding: 12px 10px;
    border-top: 1px solid var(--cire-bord);
    border-radius: 0 0 14px 14px;
    font-size: 15px;
    font-weight: 600;
    color: var(--sapin);
}

body.refonte .rf-suggestions-vide {
    margin: 10px;
    font-size: 15px;
    color: var(--texte-doux);
}

/* bandeau d'infos : collé en haut avec l'en-tête, il se replie en douceur dès qu'on défile ;
   l'en-tête remonte au même rythme et le contenu reçoit la même hauteur, pour que rien ne saute */
body.refonte .rf-infobar {
    position: sticky;
    top: 0;
    z-index: 51;
    max-height: var(--rf-h-infobar, 40px);
    overflow: hidden;
    transition: max-height .35s ease, opacity .3s ease;
}

body.refonte #header.rf-header,
body.refonte #header.rf-header.sticky {
    top: var(--rf-h-infobar, 40px);
    transition: top .35s ease;
}

html.rf-defile body.refonte .rf-infobar { max-height: 0; opacity: 0; }

/* le navigateur ne doit pas « corriger » le défilement pendant ces replis (il gardait le bandeau replié en haut de page) */
html { overflow-anchor: none; }

html.rf-defile body.refonte #header.rf-header,
html.rf-defile body.refonte #header.rf-header.sticky { top: 0; }

body.refonte #contenu { transition: margin-top .35s ease; }
html.rf-defile body.refonte #contenu { margin-top: var(--rf-h-infobar, 40px); }

@media (min-width: 992px) {
    html.rf-defile body.refonte #header.rf-header.sticky ~ #contenu { margin-top: calc(60px + var(--rf-h-infobar, 40px)); }
}

/* ---------- articles du blog : mise en page de lecture ---------- */
body.refonte .rf-article { padding-top: 8px !important; padding-bottom: 72px; }

/* colonnes vides du constructeur (3 / 6 / 3) retirées : une colonne de lecture centrée */
body.refonte .rf-article #grid_builder .row { justify-content: center; }
body.refonte .rf-article #grid_builder .box:not(:has(*)) { display: none; }
body.refonte .rf-article #grid_builder .box {
    flex: 0 0 100%;
    max-width: 1000px;
}

/* bandeau de titre : couleur cire au lieu du gris de l'ancien thème */
body.refonte .rf-article #grid_builder .grid_builder_content:first-child {
    margin: 0 0 48px !important;
    padding: 56px 0 52px !important;
    background: var(--cire) !important;
    border-radius: 0 0 40px 40px;
}

body.refonte .rf-article #grid_builder h1 {
    margin: 0;
    font-size: clamp(34px, 4.4vw, 56px);
    line-height: 1.08;
    letter-spacing: -.02em;
    text-align: center;
    color: var(--encre);
}

body.refonte .rf-article #grid_builder h1::before {
    content: "Le blog du miel";
    display: block;
    margin-bottom: 16px;
    font-family: var(--texte);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--chataignier);
}

/* texte : plus grand, plus aéré, en couleur pleine */
body.refonte .rf-article #grid_builder .type-texte p,
body.refonte .rf-article #grid_builder .type-texte li {
    font-size: 18px;
    line-height: 1.75;
    color: var(--encre);
}

body.refonte .rf-article #grid_builder .type-texte p { margin: 0 0 18px; }
body.refonte .rf-article #grid_builder .type-texte strong { font-weight: 600; color: var(--encre); }

body.refonte .rf-article #grid_builder .type-texte ul,
body.refonte .rf-article #grid_builder .type-texte ol { margin: 0 0 22px; padding-left: 22px; }

body.refonte .rf-article #grid_builder .type-texte ul li::marker { color: var(--miel); }

body.refonte .rf-article #grid_builder .type-texte a:not(.button):not(.btn):not(.rf-carte-produit):not(.rf-encart-lien) {
    color: var(--sapin);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: var(--miel);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

/* intertitres */
body.refonte .rf-article #grid_builder h2 {
    margin: 56px 0 18px;
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1.15;
    letter-spacing: -.01em;
    color: var(--encre);
}

body.refonte .rf-article #grid_builder h3 {
    margin: 40px 0 12px;
    font-size: 26px;
    line-height: 1.2;
    color: var(--encre);
}

body.refonte .rf-article #grid_builder h4 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 30px 0 8px;
    font-size: 21px;
    color: var(--encre);
}

/* petit hexagone miel devant les sous-intertitres */
body.refonte .rf-article #grid_builder h4::before {
    content: "";
    flex: none;
    width: 12px;
    height: 14px;
    background: var(--miel);
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

body.refonte .rf-article #grid_builder .content:first-child > div > h2:first-child,
body.refonte .rf-article #grid_builder .content:first-child > div > h3:first-child { margin-top: 8px; }

/* photos : coins arrondis, pleine largeur de la colonne, de l'air autour */
body.refonte .rf-article #grid_builder img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    max-height: none;
    object-fit: contain;
    margin: 32px auto;
    border-radius: 24px;
    box-shadow: 0 14px 34px rgba(52, 67, 46, .12);
}

/* photo d'un pot (catalogue, ou image du blog nommée …-aufildumiel.jpg) sur fond blanc : carte claire, pas en pleine largeur */
body.refonte .rf-article #grid_builder img[src*="imgProduit"],
body.refonte .rf-article #grid_builder img[src*="-aufildumiel."],
body.refonte .rf-article #grid_builder img.rf-photo-pot {
    width: auto;
    max-width: min(100%, 360px);
    padding: 20px;
    background: #fff;
    border: 1px solid var(--cire-bord);
    box-shadow: none;
}

body.refonte .rf-article #grid_builder blockquote {
    margin: 32px 0;
    padding: 22px 26px;
    border-left: 4px solid var(--miel);
    border-radius: 0 18px 18px 0;
    background: var(--carte);
    font-family: var(--titres);
    font-size: 21px;
    line-height: 1.5;
}

body.refonte .rf-article #grid_builder .button,
body.refonte .rf-article #grid_builder .btn { margin: 8px 0 16px; }

/* fin d'article */
body.refonte .rf-article-fin {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    max-width: 1000px;
    margin: 56px auto 0;
    padding: 32px 32px 0;
    border-top: 1px solid var(--cire-bord);
}

@media (max-width: 767px) {
    body.refonte .rf-article #grid_builder .grid_builder_content:first-child { padding: 36px 0 32px !important; border-radius: 0 0 28px 28px; }
    body.refonte .rf-article #grid_builder .type-texte p,
    body.refonte .rf-article #grid_builder .type-texte li { font-size: 17px; }
    body.refonte .rf-article #grid_builder img { margin: 24px auto; border-radius: 18px; }
}

body.refonte .rf-article-fin .rf-btn-plein,
body.refonte .rf-article-fin .rf-btn-plein:hover { color: var(--lin) !important; }
body.refonte .rf-article-fin .rf-btn-contour { color: var(--sapin) !important; }

/* articles du blog : date et temps de lecture sous le titre */
body.refonte .rf-article-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 18px;
    margin: 18px 0 0;
    font-size: 14px;
    color: var(--texte-doux);
}

body.refonte .rf-article-meta span + span::before {
    content: "·";
    margin-right: 18px;
    color: var(--miel);
    font-weight: 700;
}

/* barre de lecture */
body.refonte .rf-lecture {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 70;
    height: 4px;
    pointer-events: none;
}

body.refonte .rf-lecture span {
    display: block;
    height: 100%;
    background: var(--miel);
    transform: scaleX(0);
    transform-origin: left center;
}

/* sommaire automatique */
body.refonte .rf-sommaire {
    margin: 8px 0 40px;
    padding: 24px 28px;
    border: 1px solid var(--cire-bord);
    border-radius: 22px;
    background: var(--carte);
}

body.refonte .rf-sommaire-titre {
    margin: 0 0 10px !important;
    font-family: var(--titres);
    font-size: 20px !important;
    font-weight: 500;
}

body.refonte .rf-sommaire ol { margin: 0; padding-left: 22px; }
body.refonte .rf-sommaire li { margin: 6px 0; font-size: 16px; line-height: 1.5; }
body.refonte .rf-sommaire li::marker { color: var(--chataignier); font-weight: 600; }
body.refonte .rf-sommaire a { color: var(--sapin); font-weight: 600; }
body.refonte .rf-sommaire a:hover { text-decoration: underline; text-decoration-color: var(--miel); }

/* intertitres atteints par le sommaire : sous l'en-tête collant */
body.refonte .rf-article #grid_builder h2 { scroll-margin-top: calc(var(--rf-h-header, 130px) + 24px); }

/* encadré de l'apiculteur */
body.refonte .rf-article-auteur {
    display: flex;
    align-items: center;
    gap: 20px;
    max-width: 1000px;
    margin: 56px auto 0;
    padding: 24px 28px;
    border-radius: 24px;
    background: var(--cire);
}

body.refonte .rf-article-auteur img {
    flex: none;
    width: 56px;
    height: auto;
    padding: 10px;
    border-radius: 50%;
    background: var(--lin);
    box-sizing: content-box;
}

body.refonte .rf-article-auteur-titre {
    margin: 0 0 4px !important;
    font-size: 12px !important;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--chataignier) !important;
}

body.refonte .rf-article-auteur p {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: var(--encre);
}

/* à lire aussi */
body.refonte .rf-article-lies {
    max-width: 1100px;
    margin: 64px auto 0;
    padding: 0 32px;
}

body.refonte .rf-article-lies h2 {
    margin: 0 0 24px;
    font-size: clamp(26px, 2.6vw, 34px);
    text-align: center;
}

body.refonte .rf-article-lies-grille {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

body.refonte .rf-article-lie {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--encre);
    text-decoration: none;
}

body.refonte .rf-article-lie-image {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 22px;
    background: var(--cire);
}

body.refonte .rf-article-lie-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

body.refonte .rf-article-lie:hover .rf-article-lie-image img { transform: scale(1.04); }

body.refonte .rf-article-lie .rf-surtitre { margin-top: 6px; font-size: 12px; }

body.refonte .rf-article-lie strong {
    font-family: var(--titres);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.25;
}

body.refonte .rf-article-lie:hover strong { color: var(--sapin); }

@media (max-width: 767px) {
    body.refonte .rf-article-lies-grille { grid-template-columns: minmax(0, 1fr); }
    body.refonte .rf-article-auteur { flex-direction: column; align-items: flex-start; margin-left: 16px; margin-right: 16px; }
    body.refonte .rf-article-lies { padding: 0 16px; }
}

/* sommaire écrit dans l'article : même carte que le sommaire automatique */
body.refonte .rf-article #grid_builder .rf-sommaire-manuel p:not(.rf-sommaire-titre) { margin: 6px 0; font-size: 16px; line-height: 1.5; }
body.refonte .rf-article #grid_builder .rf-sommaire-manuel a { text-decoration: none; font-weight: 600; color: var(--sapin); }
body.refonte .rf-article #grid_builder .rf-sommaire-manuel a:hover { text-decoration: underline; text-decoration-color: var(--miel); }
body.refonte .rf-article #grid_builder .rf-sommaire-manuel strong { font-weight: inherit; }
body.refonte .rf-article #grid_builder .rf-sommaire-manuel .rf-sommaire-titre strong { font-weight: 500; }

/* colonne de lecture élargie (1000 px) : les grandes photos sont recadrées pour ne pas remplir tout l'écran */
body.refonte .rf-article #grid_builder img:not([src*="imgProduit"]):not([src*="-aufildumiel."]):not(.rf-photo-pot) {
    max-height: 560px;
    object-fit: cover;
}

/* fil d'Ariane : les titres gardent leurs majuscules (l'ancien thème en mettait une à chaque mot) */
body.refonte #chemin,
body.refonte #chemin *,
body.refonte .breadcrumb,
body.refonte .breadcrumb * { text-transform: none !important; }

/* articles du blog : cartes produits (blocs étroits côte à côte dans une même ligne) en grille */
body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-3 + .box.col-sm-3),
body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-4 + .box.col-sm-4) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto 24px;
}

body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-3 + .box.col-sm-3) > .box,
body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-4 + .box.col-sm-4) > .box {
    max-width: none;
    padding: 20px;
    border: 1px solid var(--cire-bord);
    border-radius: 22px;
    background: var(--carte);
    text-align: center;
}

body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-3 + .box.col-sm-3) img,
body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-4 + .box.col-sm-4) img {
    max-height: 200px;
    margin: 0 auto 12px;
    padding: 0;
    border: 0;
    object-fit: contain;
    box-shadow: none;
    background: transparent;
}

body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-3 + .box.col-sm-3) p,
body.refonte .rf-article #grid_builder .row:has(> .box.col-sm-4 + .box.col-sm-4) p { margin: 0 0 6px; font-size: 15px; }

/* ---------- page d'accueil du blog : liste automatique des articles ---------- */
body.refonte .rf-blog-liste { max-width: 1240px; margin: 0 auto; padding: 8px 32px 72px; }
body.refonte .rf-blog-entete { max-width: 760px; margin: 24px 0 40px; }
body.refonte .rf-blog-entete h1 { margin: 10px 0 12px; font-size: clamp(34px, 4.4vw, 54px); line-height: 1.08; text-align: left; }
body.refonte .rf-blog-entete p { margin: 0; font-size: 18px; line-height: 1.6; color: var(--texte-doux); }

body.refonte .rf-blog-grille {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 28px;
}

body.refonte .rf-blog-carte {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--cire-bord);
    border-radius: 24px;
    background: var(--carte);
    color: var(--encre);
    text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}

body.refonte .rf-blog-carte:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(52, 67, 46, .12); }
body.refonte .rf-blog-carte-image { display: block; aspect-ratio: 16 / 10; background: var(--cire); }
body.refonte .rf-blog-carte-image img { width: 100%; height: 100%; object-fit: cover; }
body.refonte .rf-blog-carte-texte { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 20px 22px 22px; }
body.refonte .rf-blog-carte-texte .rf-surtitre { font-size: 12px; }
body.refonte .rf-blog-carte strong { font-family: var(--titres); font-size: 22px; font-weight: 500; line-height: 1.22; }
body.refonte .rf-blog-carte-extrait {
    display: -webkit-box;
    overflow: hidden;
    font-size: 15px;
    line-height: 1.5;
    color: var(--texte-doux);
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
body.refonte .rf-blog-carte-lien { margin-top: auto; padding-top: 6px; font-size: 14px; font-weight: 600; color: var(--sapin); }

/* ---------- cartes produits dans les articles : balise [produits:…] ---------- */
body.refonte .rf-cartes-produits {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 18px;
    margin: 24px 0 32px;
}

body.refonte .rf-article #grid_builder .rf-carte-produit,
body.refonte .rf-carte-produit {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px;
    border: 1px solid var(--cire-bord);
    border-radius: 20px;
    background: var(--carte);
    color: var(--encre);
    font-weight: 400;
    text-decoration: none;
}

body.refonte .rf-carte-produit:hover { border-color: var(--sapin); }
body.refonte .rf-carte-produit-image { display: block; aspect-ratio: 1; margin-bottom: 6px; border-radius: 14px; background: #fff; }
body.refonte .rf-article #grid_builder .rf-carte-produit img {
    width: 100%; height: 100% !important; max-height: none; margin: 0; padding: 10px;
    border: 0; border-radius: 14px; box-shadow: none; object-fit: contain;
}
body.refonte .rf-carte-produit strong { font-size: 15px; font-weight: 600; line-height: 1.3; }
body.refonte .rf-carte-produit-prix { font-size: 16px; font-weight: 600; }
body.refonte .rf-carte-produit-prix del { font-size: 13px; font-weight: 400; color: var(--texte-doux); }
body.refonte .rf-carte-produit-lien { margin-top: auto; font-size: 14px; font-weight: 600; color: var(--sapin); }
body.refonte .rf-blog-carte-image img[src*="-aufildumiel."],
body.refonte .rf-blog-carte-image img[src*="imgProduit"],
body.refonte .rf-article-lie-image img[src*="-aufildumiel."],
body.refonte .rf-article-lie-image img[src*="imgProduit"] { padding: 14px; background: #fff; object-fit: contain; }

/* articles du blog : tableaux (hauteurs et largeurs imposées par l'éditeur neutralisées) */
body.refonte .rf-article #grid_builder table {
    width: 100% !important;
    height: auto !important;
    margin: 24px 0 28px;
    overflow: hidden;
    border: 1px solid var(--cire-bord) !important;
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 18px;
    font-size: 15px;
}

body.refonte .rf-article #grid_builder table tr,
body.refonte .rf-article #grid_builder table td,
body.refonte .rf-article #grid_builder table th { height: auto !important; }

body.refonte .rf-article #grid_builder table th {
    padding: 12px 14px;
    border: 0 !important;
    background: var(--sapin);
    color: var(--lin);
    font-weight: 600;
}

body.refonte .rf-article #grid_builder table td {
    padding: 10px 14px;
    border: 0 !important;
    border-top: 1px solid var(--cire-bord) !important;
}

body.refonte .rf-article #grid_builder table tbody tr:nth-child(even) td { background: var(--carte); }

@media (max-width: 575px) {
    body.refonte .rf-article #grid_builder table { display: block; overflow-x: auto; font-size: 14px; }
}

@media (max-width: 575px) {
    body.refonte .rf-article-meta { gap: 4px 10px; font-size: 13px; }
    body.refonte .rf-article-meta span + span::before { margin-right: 10px; }
}

/* icônes les plus visibles (panier, retour en haut, loupe) dessinées en SVG : la police d'icônes kfont (31 Ko)
   n'est plus téléchargée pour elles. Tracés extraits de kfont, mêmes proportions (1 em de haut). */
.icon-panier-add::before, .icon-arrowup::before, .icon-loupe::before {
    content: "";
    font-family: inherit;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: var(--rf-icone) no-repeat 0 0 / 100% 100%;
    mask: var(--rf-icone) no-repeat 0 0 / 100% 100%;
}
.icon-panier-add::before { width: 1.1104em; min-width: 1.1104em; flex-shrink: 0; --rf-icone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1137 1024'%3E%3Cpath d='M737 970H209Q200 970 192.5 964.5Q185 959 182 951L2 383Q-3 369 5.5 357.0Q14 345 28 345H320V234Q318 183 339.0 137.5Q360 92 398 59Q435 30 478.5 15.0Q522 0 568.5 -0.5Q615 -1 658.5 13.5Q702 28 738 57Q778 91 799.0 138.5Q820 186 818 238V345H1109Q1124 345 1132.0 357.0Q1140 369 1136 383L1062 617Q1039 613 1016 613L1000 614L1067 402H826V529Q827 542 817.5 551.5Q808 561 795.0 560.5Q782 560 773.0 551.0Q764 542 764 529V402H381V529Q382 542 373.0 551.5Q364 561 351.0 560.5Q338 560 329.0 551.0Q320 542 320 529V402H67L228 908H728Q729 939 736 970ZM569 54Q520 54 478 72Q432 93 406 130Q377 172 377 230V345H760V238Q763 198 747.5 162.0Q732 126 703 100Q675 76 640.0 64.5Q605 53 569 54ZM992 810H1129V869H992V1024H930V869H793V810H930V667H992Z'/%3E%3C/svg%3E"); }
.icon-arrowup::before { width: 1em; --rf-icone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M904 829 512 437 120 829 0 709 512 197 1024 709Z'/%3E%3C/svg%3E"); }
.icon-loupe::before { width: 1em; --rf-icone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M364 725Q432 725 495.5 699.5Q559 674 612 627L876 865Q879 869 884.5 869.0Q890 869 893.5 865.0Q897 861 897.0 856.0Q897 851 893 847L630 609Q697 538 718 442Q739 349 711 258Q684 164 612.0 97.5Q540 31 444 9Q352 -11 260 16Q167 43 100.0 115.0Q33 187 12 283Q-9 376 18 467Q46 561 118 627Q165 675 229.0 700.0Q293 725 364 725ZM364 26Q455 26 534 72Q611 116 655 193Q701 272 701.0 363.5Q701 455 655 534Q611 611 534 655Q455 701 363.5 701.0Q272 701 193 655Q117 610 72 533Q26 454 26 364Q26 272 72 193Q116 116 193 72Q272 26 364 26ZM143 376Q149 376 152.5 372.5Q156 369 156 364Q156 309 183.0 262.5Q210 216 256.5 188.5Q303 161 358 161Q364 161 367.5 157.5Q371 154 371.0 148.5Q371 143 367.5 139.5Q364 136 358 136Q297 136 244.5 166.5Q192 197 161.5 249.5Q131 302 131 364Q131 368 134.5 372.0Q138 376 143 376Z'/%3E%3C/svg%3E"); }
.icon-loupe { text-shadow: none; filter: drop-shadow(0 0 5px rgba(0, 0, 0, .6)); }

/* accessibilité : restes de l'ancien vert (#67884a), contraste insuffisant */
body.refonte .t-producteur,
body.refonte .t-producteur * { background-color: var(--sapin); color: #FBF7EF; }
body.refonte .t-producteur * { background-color: transparent; }
#plan-site.refonte .bloc_filtre > ul > li > .m_event,
#plan-site.refonte .bloc_filtre > ul > li > .m_event .text { color: var(--sapin); }

/* lien du producteur sur les cartes produits : zone de toucher de 24 px (marge intérieure d'un élément en ligne :
   n'agrandit que la zone cliquable, pas la ligne) */
body.refonte .fiche_produit .marque_produit a { padding: 3px 0; }

/* bons cadeaux des visites et de l'initiation (app/classe/BonCadeau.php) : encart « offrir » de l'accueil (section Visites)
   et des fiches visite, « comment ça marche » des fiches bon cadeau, liste des cartes dans le détail d'une commande */
body.refonte .rf-offrir {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    margin-top: 20px;
    padding: 22px 24px;
    border: 2px dashed #D8C89F;
    border-radius: 20px;
    background: var(--lin);
}

body.refonte .rf-offrir-icone { flex: none; width: 48px; height: 48px; }

body.refonte .rf-offrir p { margin: 0 0 10px; font-size: 15px; line-height: 1.55; color: var(--texte-doux); }

body.refonte .rf-offrir p.rf-offrir-titre {
    margin-bottom: 6px;
    font-family: var(--titres);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.25;
    color: var(--encre);
}

body.refonte .rf-offrir-liens { display: flex; flex-wrap: wrap; gap: 8px; }

body.refonte .rf-offrir-liens a {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 999px;
    background: var(--miel);
    color: var(--encre);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color .2s ease;
}

body.refonte .rf-offrir-liens a:hover { background: #E8B90C; color: var(--encre); }

body.refonte .rf-offrir-liens a span { font-weight: 500; opacity: .8; white-space: nowrap; }

body.refonte .rf-offrir-fiche { margin: 0 0 24px; }

body.refonte .rf-offrir-fiche .rf-btn { margin-top: 2px; }

body.refonte .rf-bon-etapes { margin: 6px 0 0; padding-left: 20px; font-size: 15px; line-height: 1.55; color: var(--texte-doux); }

body.refonte .rf-bon-etapes li { margin-bottom: 6px; }

body.refonte .rf-bon-etapes strong { color: var(--encre); }

body.refonte .rf-bons-commande { margin: 0 0 28px; padding: 22px 24px; border-radius: 20px; background: var(--carte); }

body.refonte .rf-bons-commande h2 { margin: 0 0 6px; font-size: 22px; }

body.refonte .rf-bons-commande ul { margin: 14px 0 0; padding: 0; list-style: none; }

body.refonte .rf-bons-commande li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    border-top: 1px solid var(--cire-bord);
}

@media (max-width: 575px) {
    body.refonte .rf-offrir { flex-direction: column; gap: 10px; padding: 18px; }
    body.refonte .rf-offrir-icone { width: 40px; height: 40px; }
    body.refonte .rf-offrir-liens a { justify-content: space-between; width: 100%; border-radius: 16px; }
    body.refonte .rf-bons-commande li { flex-direction: column; align-items: flex-start; }
}

/* bandeau de message (ajout panier…) : toute la largeur de l'écran, sur sa propre ligne au-dessus du contenu
   et de la colonne panier (dans le flux : il les pousse vers le bas au lieu de les recouvrir) */
body.refonte #contenu > .alert-content {
    position: static;
    flex: 0 0 100%;
    max-width: 100%;
}
body.refonte #contenu > .alert-content .alert { margin-bottom: 0; }

/* ---------- panier : envoi possible ou retrait en boutique seul, par article ---------- */

body.refonte .livraison-article {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 13px;
    line-height: 1.5;
}

body.refonte .livraison-article::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

body.refonte .livraison-retrait {
    color: var(--chataignier);
    background: #FBEFD0;
    font-weight: 600;
}

body.refonte .frais-port-alerte {
    color: var(--chataignier);
    font-weight: 600;
}

/* ---------- articles du blog : encart produit après le premier paragraphe (CmsFrontModule::encartProduit) ---------- */
body.refonte .rf-encart-produit { margin: 24px 0 28px; }
body.refonte .rf-article #grid_builder .rf-encart-produit a.rf-encart-lien,
body.refonte .rf-encart-produit a.rf-encart-lien {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border: 1px solid var(--cire-bord);
    border-left: 5px solid var(--miel);
    border-radius: 20px;
    background: var(--carte);
    color: var(--encre);
    font-weight: 400;
    text-decoration: none;
}
body.refonte .rf-encart-produit a:hover { border-color: var(--sapin); border-left-color: var(--miel); }
body.refonte .rf-encart-produit-image { flex: 0 0 auto; width: 84px; height: 84px; border-radius: 14px; background: #fff; }
body.refonte .rf-article #grid_builder .rf-encart-produit img {
    width: 100%; height: 100% !important; max-height: none; margin: 0; padding: 6px;
    border: 0; border-radius: 14px; box-shadow: none; aspect-ratio: auto; object-fit: contain;
}
body.refonte .rf-encart-produit-texte { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
body.refonte .rf-encart-produit-surtitre { font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--chataignier); }
body.refonte .rf-encart-produit strong { font-size: 17px; font-weight: 600; line-height: 1.3; }
body.refonte .rf-encart-produit-prix { font-size: 16px; font-weight: 600; }
body.refonte .rf-encart-produit-prix del { font-size: 13px; font-weight: 400; color: var(--texte-doux); }
body.refonte .rf-encart-produit-bouton {
    flex: 0 0 auto;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--sapin);
    color: var(--lin);
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
}
@media (max-width: 575px) {
    body.refonte .rf-encart-produit a { flex-wrap: wrap; gap: 12px; padding: 14px; }
    body.refonte .rf-encart-produit-image { width: 72px; height: 72px; }
    body.refonte .rf-encart-produit-texte { flex-basis: calc(100% - 90px); }
    body.refonte .rf-encart-produit-bouton { flex-basis: 100%; text-align: center; }
}

/* ---------- commande sans compte : page connexion (AuthFrontModule::commandeInvite) et mot de passe après la commande ---------- */
body.refonte .rf-commande-invite {
    padding: 32px;
    border: 1px solid var(--cire-bord);
    border-top: 5px solid var(--miel);
    border-radius: var(--rayon);
    background: var(--carte);
}
body.refonte .rf-commande-invite .custom-form { padding: 0; border: 0; border-radius: 0; background: none; }
body.refonte .rf-invite-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; margin-top: 20px; }
body.refonte .rf-invite-champs p { display: flex; flex-direction: column; gap: 4px; margin: 0; }
body.refonte .rf-invite-champs label { font-weight: 600; }
body.refonte .rf-commande-invite input[type=text],
body.refonte .rf-commande-invite input[type=email],
body.refonte .rf-commande-invite input[type=tel],
body.refonte .rf-commande-invite input[type=password] {
    width: 100%;
    height: 48px;
    padding: 10px 16px;
    border: 1px solid var(--cire-bord);
    border-radius: 12px;
    background: #fff;
    font-size: 16px;
}
body.refonte .rf-commande-invite input.invalid { border-color: #9C3B24; }
body.refonte .rf-invite-champs .error_form,
body.refonte .rf-invite-aide { font-size: 13px; }
body.refonte .rf-invite-aide { color: var(--texte-doux); }
body.refonte .rf-invite-champs .rf-invite-option { grid-column: 1 / -1; display: block; }
body.refonte .rf-invite-compte { margin: 20px 0 0; text-align: center; font-size: 15px; }
body.refonte .rf-invite-mdp { max-width: 640px; margin: 32px auto 0; }
body.refonte .rf-invite-mdp h2 { margin-bottom: 6px; }
@media (max-width: 575px) {
    body.refonte .rf-commande-invite { padding: 22px 16px; }
    body.refonte .rf-invite-champs { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
    body.refonte #espaceClient .rf-commande-invite { margin-bottom: 24px; }
}
body.refonte .rf-commande-invite,
body.refonte .rf-commande-invite p,
body.refonte .rf-commande-invite label { text-align: left; }
body.refonte .rf-commande-invite h1,
body.refonte .rf-commande-invite h2 { text-align: center; }
body.refonte .rf-invite-option label { font-weight: 400; }

/* ---------- page connexion depuis le panier : « Finaliser ma commande », un seul formulaire,
   création de compte en option (mot de passe affiché quand la case est cochée), connexion repliée en haut ---------- */
body.refonte .rf-finaliser { max-width: 620px; margin: 8px auto 40px; }
body.refonte .rf-finaliser h1 { margin: 0 0 6px; text-align: center; }
body.refonte .rf-finaliser-intro { margin: 0 0 24px; text-align: center; color: var(--texte-doux); }

body.refonte .rf-deja-client {
    margin-bottom: 16px;
    border: 1px solid var(--cire-bord);
    border-radius: 16px;
    background: var(--lin);
}
body.refonte .rf-deja-client summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    cursor: pointer;
    list-style: none;
    font-weight: 600;
}
body.refonte .rf-deja-client summary::-webkit-details-marker { display: none; }
body.refonte .rf-deja-client summary span { color: var(--sapin); text-decoration: underline; text-underline-offset: 3px; }
body.refonte .rf-deja-client[open] summary span { display: none; }
body.refonte .rf-deja-client-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; padding: 0 20px 20px; }
body.refonte .rf-deja-client-form p { display: flex; flex-direction: column; gap: 4px; margin: 0; text-align: left; }
body.refonte .rf-deja-client-form label { font-weight: 600; }
body.refonte .rf-deja-client-form .rf-deja-client-bas {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    font-size: 15px;
}
body.refonte .rf-deja-client-bas label { font-weight: 400; }
body.refonte .rf-deja-client-form .btn-custom { grid-column: 1 / -1; justify-self: start; }
body.refonte .rf-deja-client-form input[type=email],
body.refonte .rf-deja-client-form input[type=password],
body.refonte .rf-option-compte input[type=password],
body.refonte .rf-option-compte input[type=text] {
    width: 100%;
    height: 48px;
    padding: 10px 16px;
    border: 1px solid var(--cire-bord);
    border-radius: 12px;
    background: #fff;
    font-size: 16px;
}

body.refonte .rf-option-compte {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0 12px;
    margin: 22px 0 16px;
    padding: 16px 18px;
    border: 2px solid var(--miel);
    border-radius: 16px;
    background: #FDF6D8;
}
/* l'ancien thème rend les cases invisibles (opacity 0, position absolue) : on remet des cases natives */
body.refonte .rf-finaliser input[type=checkbox] {
    position: static;
    flex: none;
    width: 20px;
    height: 20px;
    margin: 2px 0 0;
    opacity: 1;
    accent-color: var(--sapin);
    cursor: pointer;
}
body.refonte .rf-option-compte > input[type=checkbox] { width: 22px; height: 22px; }
body.refonte .rf-finaliser input[type=checkbox] + label { padding-left: 0; line-height: 1.4; }
body.refonte .rf-deja-client-bas > span input[type=checkbox] + label { display: inline; }
body.refonte .rf-deja-client-bas > span { display: inline-flex; gap: 8px; align-items: center; }
body.refonte .rf-deja-client-bas > span input[type=checkbox] { margin: 0; }
body.refonte .rf-option-compte > label { margin: 0; cursor: pointer; }
body.refonte .rf-option-compte > label strong { display: block; font-size: 17px; }
body.refonte .rf-option-compte > label span { display: block; font-weight: 400; font-size: 14px; color: var(--texte-doux); }
body.refonte .rf-option-compte-mdp { display: none; grid-column: 1 / -1; margin: 14px 0 0; }
body.refonte .rf-option-compte > input:checked ~ .rf-option-compte-mdp { display: block; }
body.refonte .rf-option-compte-mdp label { display: block; margin-bottom: 4px; font-weight: 600; }
body.refonte .rf-option-compte-mdp small { font-weight: 400; color: var(--texte-doux); }
body.refonte .rf-mdp-champ { position: relative; display: block; }
body.refonte .rf-mdp-champ input { padding-right: 92px !important; }
body.refonte .rf-mdp-voir {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--sapin);
    font-size: 14px;
    text-decoration: underline;
    cursor: pointer;
}
body.refonte .rf-option-compte .error_form { display: block; margin-top: 4px; font-size: 13px; }
body.refonte .rf-option-compte input.invalid { border-color: #9C3B24; }
body.refonte .rf-finaliser .rf-invite-option { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 22px; }
body.refonte .rf-finaliser .rf-invite-option input { margin-top: 4px; }
body.refonte .rf-finaliser .rf-invite-option label { margin: 0; font-size: 15px; }
body.refonte .rf-finaliser-bouton { display: block; width: 100%; }
body.refonte .rf-finaliser .step-panier { margin: 24px 0 28px; padding: 0; }
body.refonte .rf-finaliser p { text-align: left; }
body.refonte .rf-finaliser .rf-finaliser-intro,
body.refonte .rf-finaliser .rf-finaliser-retour { text-align: center; }
body.refonte .rf-finaliser-retour { margin: 18px 0 0; text-align: center; font-size: 15px; }
body.refonte .rf-finaliser-retour a { color: var(--sapin); text-decoration: underline; text-underline-offset: 3px; }
/* étape « Vos coordonnées » du tunnel : formulaire + récapitulatif du panier */
body.refonte .rf-tunnel { max-width: 980px; }
body.refonte .rf-tunnel-grille { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; }
body.refonte .rf-recap {
    position: sticky;
    top: 20px;
    padding: 22px;
    border: 1px solid var(--cire-bord);
    border-radius: var(--rayon);
    background: var(--lin);
}
body.refonte .rf-recap h2 { margin: 0 0 12px; font-size: 20px; text-align: left; }
body.refonte .rf-recap ul { margin: 0; padding: 0; list-style: none; }
body.refonte .rf-recap li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--cire-bord); font-size: 14px; }
body.refonte .rf-recap img { flex: none; width: 48px; height: 48px; object-fit: cover; border-radius: 8px; }
body.refonte .rf-recap-nom { flex: 1; min-width: 0; }
body.refonte .rf-recap-nom small { color: var(--texte-doux); white-space: nowrap; }
body.refonte .rf-recap-prix { flex: none; font-weight: 600; white-space: nowrap; }
body.refonte .rf-finaliser .rf-recap-total { display: flex; justify-content: space-between; margin: 14px 0 4px; font-size: 18px; }
body.refonte .rf-finaliser .rf-recap-note { margin: 0 0 12px; font-size: 13px; color: var(--texte-doux); }
body.refonte .rf-finaliser .rf-recap li,
body.refonte .rf-finaliser .rf-recap-nom { text-align: left; }
body.refonte .rf-recap .rf-recap-port { margin: 0 0 14px; }
body.refonte .rf-recap .rf-recap-port li { justify-content: space-between; padding: 4px 0; border: 0; font-size: 13px; }
body.refonte .rf-recap .rf-recap-port li span:last-child { flex: none; font-weight: 600; white-space: nowrap; }
body.refonte .rf-finaliser .rf-recap-note { margin-bottom: 4px; }
body.refonte .rf-finaliser { margin-top: 32px; }
body.refonte .rf-recap-modifier { color: var(--sapin) !important; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 860px) {
    body.refonte .rf-tunnel { max-width: 620px; }
    body.refonte .rf-tunnel-grille { grid-template-columns: 1fr; }
    body.refonte .rf-recap { position: static; }
}
/* inscription : mot de passe sur toute la largeur, mention mails */
body.refonte .rf-invite-champs .rf-invite-champs-large { grid-column: 1 / -1; }
body.refonte .rf-invite-champs small { font-weight: 400; color: var(--texte-doux); }
body.refonte .rf-finaliser .rf-inscription-mention { margin: 18px 0 20px; }
body.refonte .rf-commande-invite .rf-mdp-champ input { padding-right: 92px; }
/* page de connexion simple (icône compte) */
body.refonte .rf-connexion { max-width: 480px; }
body.refonte .rf-connexion .rf-deja-client-form { grid-template-columns: 1fr; padding: 28px; }
body.refonte .rf-connexion .rf-deja-client-form .btn-custom { justify-self: stretch; margin-top: 6px; }
body.refonte .rf-nouveau-client {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 16px;
    margin-top: 20px;
    padding: 18px 22px;
    border: 1px solid var(--cire-bord);
    border-radius: 16px;
    background: var(--lin);
}
body.refonte .rf-nouveau-client p { margin: 0; text-align: left; }
body.refonte .rf-bouton-contour {
    display: inline-block;
    padding: 10px 22px;
    border: 2px solid var(--sapin);
    border-radius: 999px;
    color: var(--sapin) !important;
    font-weight: 700;
    text-decoration: none !important;
}
body.refonte .rf-bouton-contour:hover { background: var(--sapin); color: #fff !important; }
@media (max-width: 575px) {
    body.refonte .rf-deja-client-form { grid-template-columns: 1fr; }
    body.refonte .rf-option-compte { padding: 14px; }
}

/* ---------- « Appelez avant de passer à la boutique » : à côté de chaque numéro de téléphone (boutique sur appel) ---------- */
body.refonte .rf-appel-avant {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 8px;
    margin: 6px 0;
    padding: 6px 14px;
    border-radius: 16px;
    background: var(--miel);
    color: var(--sapin-fonce);
    font-size: 15px;
    line-height: 1.35;
    letter-spacing: 0;
}

body.refonte .rf-appel-avant svg { flex: none; color: var(--sapin-fonce) !important; }
body.refonte .rf-appel-avant strong { font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
/* l'explication passe sous le titre, alignée sur le texte (icône 16px + espace 8px) */
body.refonte .rf-appel-avant-pourquoi { flex-basis: 100%; padding-left: 24px; font-size: 14px; }

/* bandeau du haut : le message passe en premier et reste seul visible sur mobile */
body.refonte .rf-infobar .rf-appel-avant { margin: 0; padding: 2px 12px; border-radius: 999px; font-size: 14px; }
body.refonte .rf-appel-avant-lien { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; color: inherit !important; text-decoration: none; }
body.refonte .rf-appel-avant-num { font-weight: 700; white-space: nowrap; }

body.refonte .rf-infos .rf-appel-avant { margin: 0; }
/* pied de page (colonne étroite) : numéro sous le titre */
/* pied de page : icône à gauche, texte puis numéro alignés à sa droite (27/10/2026 : l'icône partait seule sur une ligne) */
body.refonte .rf-footer .rf-appel-avant { display: block; margin: 4px 0; padding: 12px 16px; border-radius: 16px; font-size: 13px; }
body.refonte .rf-footer .rf-appel-avant-lien { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 4px 10px; align-items: start; }
body.refonte .rf-footer .rf-appel-avant svg { grid-row: 1 / span 2; margin-top: 1px; }
body.refonte .rf-footer .rf-appel-avant strong { grid-column: 2; letter-spacing: 0; line-height: 1.35; }
body.refonte .rf-footer .rf-appel-avant-num { grid-column: 2; padding: 0; font-size: 17px; line-height: 1.2; }

/* garanties de la fiche produit : simple ligne surlignée, la liste est trop étroite pour le badge */
#article.refonte .rf-appel-avant-texte { display: inline; padding: 1px 6px; border-radius: 6px; background: var(--miel); color: var(--sapin-fonce); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
#article.refonte .rf-appel-avant-texte a { color: inherit; text-decoration: none; white-space: nowrap; }

/* très petits écrans : sans l'icône pour que « … à la boutique » tienne sur une ligne */
@media (max-width: 380px) {
    body.refonte .rf-infobar .rf-appel-avant svg { display: none; }
}
@media (max-width: 340px) {
    body.refonte .rf-infobar .rf-appel-avant { padding: 2px 8px; font-size: 11px; }
}

/* ---------- tour des tailles d'écran (28/10/2026) ---------- */

/* menu mobile fermé : son ombre dépassait sur le bord gauche des pages */
@media (max-width: 991px) {
    body.refonte #menu-desktop,
    body.refonte .hide-panier #menu-desktop,
    #home.refonte #menu-desktop { box-shadow: none; }

    body.refonte.rf-menu-ouvert #menu-desktop,
    body.refonte.rf-menu-ouvert .hide-panier #menu-desktop,
    #home.refonte.rf-menu-ouvert #menu-desktop { box-shadow: 12px 0 30px rgba(43, 42, 34, .18); }
}

/* cartes produits : le prix ne se coupe plus (« 280,00 » / « € »), le bouton garde sa place */
body.refonte .fiche_produit .produit_infos > .row { flex-wrap: nowrap; }
body.refonte .fiche_produit .produit_infos > .row > .col-6:first-child { flex: 1 1 auto; max-width: none; min-width: 0; }
body.refonte .fiche_produit .produit_infos > .row > .col-6:last-child { flex: 0 0 auto; max-width: none; width: auto; padding-left: 8px; }
body.refonte .fiche_produit .prix_produit { white-space: nowrap; }

/* tablette : 3 produits par ligne dans les rubriques (2 cartes de 340 px faisaient une page interminable) */
@media (min-width: 700px) and (max-width: 991px) {
    body.refonte .pres_prod.cat_prod > li {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

/* barre des rubriques entre 992 et 1199 px : tout tient sur la ligne (« Producteurs locaux » était coupé) */
@media (min-width: 992px) and (max-width: 1199px) {
    body.refonte #menu-principal > ul { padding-left: 12px; padding-right: 12px; justify-content: center; }
    body.refonte #menu-principal > ul > li > a { padding: 13px 4px; font-size: 13.5px; }
}

/* fiche produit : l'alerte « Prévenez-moi » suit le bouton d'achat (sur mobile elle passait avant le titre) */
@media (max-width: 991px) {
    #article.refonte #fiche .bloc_description > #prevenir_dispo { order: 2; }
}

/* fiche produit entre 992 et 1199 px (colonne panier affichée) : moins d'espace perdu, garanties sur une colonne */
@media (min-width: 992px) and (max-width: 1199px) {
    #article.refonte #fiche .upper_section > .mb-5 > .row { column-gap: 32px; }
    #article.refonte .rf-garanties { grid-template-columns: minmax(0, 1fr); }
}

/* panier sur mobile : récapitulatif collé au bord gauche, bouton « Appliquer » qui débordait de son cadre */
@media (max-width: 767px) {
    body.refonte #panier-recap { padding-left: 15px !important; }
}
@media (max-width: 991px) {
    body.refonte #panierCodesRemises input[type=submit] { margin-left: 0 !important; max-width: 100%; }
}

/* très grands écrans : rubriques et fiches (avec colonne panier) centrées sur 1600 px comme l'en-tête, au lieu d'aller d'un bord à l'autre */
@media (min-width: 1700px) {
    #catalogue.refonte #contenu,
    #promotions.refonte #contenu,
    #marque.refonte #contenu,
    #Accueil.refonte #contenu,
    #article.refonte #contenu {
        max-width: 1600px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* tableaux saisis dans les descriptions produits (ex. doses de propolis) : défilent dans leur cadre au lieu d'élargir la page sur mobile */
body.refonte #tabs_article .tab-content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* calendrier de réservation sur petit téléphone : les ronds de 40 px débordaient de leurs colonnes */
@media (max-width: 479px) {
    #article.refonte #fiche .rf-cal { padding: 10px; }
    #article.refonte #fiche .rf-cal-ferme,
    #article.refonte #fiche .rf-cal-jour { min-height: 0; font-size: 14px; }
    #article.refonte #fiche .rf-cal-semaine { font-size: 10.5px; letter-spacing: 0; }
}

/* rubriques entre 1200 et 1400 px : la colonne des rubriques ne descend pas sous 200 px (« Nourrissement » dépassait) */
@media (min-width: 1200px) {
    body.refonte #catalog > div > .row:has(> #left_column .rf-rubriques) {
        grid-template-columns: minmax(200px, 2fr) minmax(0, 10fr);
    }
}

/* bandeau du haut : livraison offerte par l'apiculteur (29/10/2026) ; les horaires passent à la ligne (donc cachés) sous 1240 px */
body.refonte .rf-infobar-livraison strong { color: var(--miel, #f2c94c); font-weight: 600; }
@media (max-width: 1239px) {
    body.refonte .rf-infobar .rf-infobar-livraison ~ .rf-infobar-horaires { display: none; }
}

/* fiche produit, 02/11/2026 : onglets sur une seule ligne sur mobile (le 3e passait à la ligne avec un grand vide) */
@media (max-width: 575px) {
    #article.refonte #fiche #tabs_article .nav-tabs { gap: 6px 20px; margin-bottom: 20px; }
    #article.refonte #fiche #tabs_article .nav-link,
    #article.refonte #fiche #tabs_article .nav-link:hover,
    #article.refonte #fiche #tabs_article .nav-link.active { font-size: 19px; white-space: nowrap; }
}
/* pas de vide entre les onglets et le texte */
#article.refonte #fiche #tabs_article .tab-pane { padding-top: 0; }
/* cartes produits : « 500 g · Aufildumiel » sans décalage du producteur */
body.refonte .fiche_produit .marque_produit a { margin-left: 0; }

/* fiche produit, infos pratiques (02/11/2026) : libellé au-dessus, conseil de l'apiculteur en encadré */
#article.refonte #fiche #composition_tab .rf-info { margin: 0 0 16px; }
#article.refonte #fiche #composition_tab .rf-info > strong {
    display: block;
    margin-bottom: 2px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--texte-doux);
}
#article.refonte #fiche #composition_tab .rf-info-astuce {
    margin: 22px 0;
    padding: 16px 20px;
    border-left: 4px solid var(--miel);
    border-radius: 0 14px 14px 0;
    background: var(--cire, #F1E8D6);
}
#article.refonte #fiche #composition_tab .rf-info-astuce > strong { color: var(--encre); }

/* rubriques, 02/11/2026 : introduction lisible (paragraphes, liens) au lieu d'un petit texte gris */
body.refonte .cat-description { max-width: 72ch; font-size: 16px; line-height: 1.7; color: var(--texte-doux); }
body.refonte .cat-description p { margin: 0 0 10px; }
body.refonte .cat-description p:last-child { margin-bottom: 0; }
body.refonte .cat-description a { color: var(--sapin); text-decoration: underline; text-underline-offset: 3px; }

/* page introuvable (02/11/2026) */
body.refonte .rf-404 { max-width: 640px; margin: 64px auto 96px; padding: 0 16px; text-align: center; }
body.refonte .rf-404-surtitre { margin: 0 0 10px; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--texte-doux); }
body.refonte .rf-404-titre { margin: 0 0 16px; font-size: clamp(30px, 5vw, 44px); line-height: 1.15; }
body.refonte .rf-404-texte { margin: 0 0 28px; font-size: 17px; line-height: 1.7; color: var(--texte-doux); }
body.refonte .rf-404-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px 22px; margin: 0; }
body.refonte .rf-404-lien { color: var(--sapin); text-decoration: underline; text-underline-offset: 3px; }