/*
 * LMI Partitions : nouvelle structure (en-tête, accueil, listes, fiche, pied de page) aux couleurs d'origine (30/10/2026)
 * Chargée après la feuille compilée du thème (assets/index.*.css) et la feuille du menu.
 * Identité visuelle d'origine gardée (décision de Baptiste du 30/10 : couleurs, logo, thème inchangés) :
 * valeurs relevées dans assets/scss/_variables.scss et la feuille compilée, reprises en variables ci-dessous.
 * Ce fichier ne change que la mise en page ; les couleurs, polices, rayons et ombres sont ceux d'avant.
 */

:root {
    /* Bleus d'origine */
    --lmi-bleu: #4f97e4;          /* $color-blue-2 : en-tête, menu, titres, prix */
    --lmi-bleu-fonce: #3e85d5;    /* $color-blue-4 : bandeau « Nos garanties », boutons secondaires */
    --lmi-bleu-3: #4687ce;        /* $color-blue-3 : encadré téléphone de l'ancien en-tête */
    --lmi-bleu-5: #3c7fcc;        /* $color-blue-5 : menu téléphone déplié */
    --lmi-bleu-lisible: #2f74c0;  /* bleu des liens des blocs de l'accueil (22/10), lisible sur blanc */
    --lmi-bleu-clair: #3fa9f3;    /* $color-blue-1 : couleur du navigateur sur téléphone */
    /* Orange d'origine */
    --lmi-orange: #e16939;        /* $primary : boutons d'action, liens, Déstockage, total du panier */
    --lmi-orange-survol: #d45320; /* bouton orange au survol */
    --lmi-lien-survol: #b2461b;   /* lien au survol */
    --lmi-rouge: #fd2f1d;         /* $color-red : « en stock » sur la fiche */
    /* Blancs et gris d'origine */
    --lmi-texte: #212529;
    --lmi-gris-1: #f3f3f3;        /* fond disponibilité de la fiche */
    --lmi-gris-2: #e8e8e8;        /* fond du panier de l'en-tête */
    --lmi-gris-filtres: #ebebeb;  /* blocs de filtres */
    --lmi-gris-fond-filtres: #f6f6f6;
    --lmi-gris-ombre: #ababab;    /* ombre des cartes produit */
    --lmi-gris-3: #afafaf;        /* bouton gris */
    --lmi-gris-texte: #6c757d;    /* liens du bas de page */
    --lmi-gris-fonce: #4c4c4c;
    /* Formes d'origine */
    --lmi-rayon: 5px;             /* boutons, champs */
    --lmi-rayon-carte: 10px;      /* cartes produit et blocs de l'accueil */
    --lmi-ombre: 0 0 10px #ababab;
    --lmi-ombre-douce: 0 0 10px rgba(0, 0, 0, .16); /* blocs de l'accueil (22/10) */
    --lmi-police: open_sans, "Helvetica Neue", Arial, sans-serif;
    --lmi-police-logo: "Times New Roman", "Bitstream Charter", Times, serif;
}

/* ---------------------------------------------------------------------------------------------------------------
   Base : fond « notes de musique » d'origine, allégé (même dessin posé sur blanc : 19 Ko en WebP au lieu de 158 Ko)
   --------------------------------------------------------------------------------------------------------------- */

.content-area {
    background-image: url(fond-notes.jpg);
    background-image: image-set(url(fond-notes.webp) type("image/webp"), url(fond-notes.jpg) type("image/jpeg"));
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, .btn:focus-visible {
    outline: 3px solid var(--lmi-orange);
    outline-offset: 2px;
}

.lmi-evitement {
    background: var(--lmi-bleu-fonce);
    color: #fff;
    left: 16px;
    padding: .5rem 1rem;
    position: absolute;
    top: -100px;
    z-index: 2000;
}

.lmi-evitement:focus {
    color: #fff;
    top: 8px;
}

@media (max-width: 575.98px) {
    .container,
    .site-main {
        padding-left: 16px;
        padding-right: 16px;
    }
}

/* Ordinateurs portables (1200 à 1399 px) : 1200 px de large au lieu de 960 */
@media (min-width: 1200px) and (max-width: 1399.98px) {
    .container,
    .site-main {
        max-width: 1200px;
    }
}

/* ---------------------------------------------------------------------------------------------------------------
   Bandeau du haut (bleu de l'en-tête) : phrase d'accueil et « Besoin d'un conseil ? » de l'ancien en-tête
   --------------------------------------------------------------------------------------------------------------- */

.lmi-bandeau-service {
    background: var(--lmi-bleu);
    color: #fff;
}

.lmi-bandeau-service-ligne {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    justify-content: space-between;
    padding-bottom: .5rem;
    padding-top: .625rem;
}

.lmi-bandeau-service .header-slogan {
    font-size: 1.0625rem;
    line-height: 1.3;
    margin: 0;
}

.lmi-bandeau-service .header-phone {
    align-items: center;
    background: var(--lmi-bleu-3);
    border-radius: var(--lmi-rayon);
    display: flex;
    flex-wrap: wrap;
    gap: 0 .75rem;
    padding: .25rem .75rem;
}

.lmi-bandeau-service .header-phone p {
    margin: 0;
}

.lmi-bandeau-service .header-phone a {
    align-items: center;
    color: #fff;
    display: inline-flex;
    gap: .375rem;
    min-height: 44px;
    text-decoration: none;
}

.lmi-bandeau-service .header-phone a.contact-phone {
    font-size: 1.375rem;
    font-weight: 500;
}

.lmi-bandeau-service .header-phone a.contact-mail,
.lmi-bandeau-service .header-phone a.contact-facebook {
    justify-content: center;
    min-width: 32px;
}

.lmi-bandeau-service .header-phone svg {
    height: 1rem;
    width: 1rem;
}

.lmi-bandeau-service .header-phone svg * {
    fill: #fff;
}

@media (max-width: 575.98px) {
    .lmi-bandeau-service .header-phone {
        flex-wrap: nowrap;
        gap: 0 .5rem;
        justify-content: space-between;
        width: 100%;
    }

    .lmi-bandeau-service .header-phone p {
        font-size: .875rem;
        white-space: nowrap;
    }

    .lmi-bandeau-service .header-phone a.contact-phone {
        font-size: 1.125rem;
        white-space: nowrap;
    }
}

@media (min-width: 992px) {
    .lmi-bandeau-service .header-slogan {
        font-size: 1.25rem;
    }
}

/* Bandeau blanc d'origine (« Votre partition classique... »), visible aussi sur téléphone */
@media (max-width: 767.98px) {
    .site-subheader {
        display: block;
        padding: 14px 0;
    }

    .site-subheader .slogan1 {
        font-size: 1.0625rem;
    }

    .site-subheader .slogan2 {
        font-size: .9375rem;
    }
}

.site-subheader .subheader-row .subheader-text {
    margin-right: 0;
}

/* ---------------------------------------------------------------------------------------------------------------
   En-tête bleu d'origine : logo cœur et nom en italique, recherche, compte, panier gris
   --------------------------------------------------------------------------------------------------------------- */

.site-header,
body.header-sticky .site-header {
    background: var(--lmi-bleu);
    border-bottom: 1px solid rgba(255, 255, 255, .25);
    color: #fff;
    position: relative;
    width: auto;
    z-index: 1020;
}

body.header-sticky {
    padding-top: 0;
}

.site-header .header-row,
body.header-sticky .site-header .header-row {
    align-items: center;
    column-gap: .75rem;
    display: grid;
    flex-wrap: nowrap;
    grid-template-areas: "menu logo compte panier" "recherche recherche recherche recherche";
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    margin: 0 auto;
    padding-bottom: .75rem;
    padding-top: .625rem;
    row-gap: .625rem;
}

.site-header .col-logo,
.site-header .col-search,
.site-header .col-account,
.site-header .col-cart,
body.header-sticky .site-header .col-logo,
body.header-sticky .site-header .col-search {
    display: block;
    flex: none;
    margin: 0;
    max-width: none;
    order: 0;
    padding: 0;
    width: auto;
}

.lmi-bouton-menu {
    align-items: center;
    color: #fff;
    display: inline-flex;
    flex-direction: column;
    font-size: .6875rem;
    font-weight: 500;
    grid-area: menu;
    justify-content: center;
    line-height: 1;
    min-height: 44px;
    min-width: 44px;
    text-decoration: none;
}

.lmi-bouton-menu i {
    font-size: 1.5rem;
    margin-bottom: 3px;
}

.lmi-bouton-menu:hover {
    color: #fff;
    text-decoration: none;
}

/* Logo : le cœur et « LMI Partitions » en italique dessous, comme avant */
.site-header .col-logo {
    grid-area: logo;
    min-width: 0;
}

.site-header .col-logo a.logo,
body.header-sticky .site-header .col-logo a.logo {
    align-items: center;
    color: #fff;
    display: inline-flex;
    flex-direction: column;
    margin: 0;
    max-width: none;
    text-decoration: none;
}

.lmi-logo-image {
    flex: none;
}

.lmi-logo-image img {
    display: block;
    height: 44px;
    max-width: none;
    width: auto;
}

.site-header .col-logo .blogname,
.lmi-pied-logo .blogname {
    color: #fff;
    font-family: var(--lmi-police-logo);
    font-size: .9375rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
}

/* Compte : bouton à contour blanc d'origine */
.site-header .col-account {
    grid-area: compte;
    position: relative;
}

.site-header .col-account .dropdown > .btn-header-account,
.site-header .col-account .dropdown > a.btn-header-account {
    align-items: center;
    border: 1px solid #fff;
    border-radius: var(--lmi-rayon);
    color: #fff;
    display: inline-flex;
    gap: .5rem;
    min-height: 44px;
    padding: .25rem .75rem;
    text-transform: none;
}

.site-header .col-account .btn-header-account svg {
    height: 24px;
    left: auto;
    position: static;
    top: auto;
    width: 24px;
}

.site-header .col-account .btn-header-account svg * {
    fill: #fff;
}

.site-header .col-account .btn-header-account i {
    font-size: .75rem;
    margin: 0;
}

.lmi-compte-libelle {
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-header .col-account .dropdown > .dropdown-menu {
    margin-top: .375rem;
    min-width: 17rem;
    top: 100% !important;
    width: auto;
}

/* Panier : bloc gris d'origine, total en orange */
.site-header .col-cart {
    align-items: stretch;
    display: flex;
    grid-area: panier;
}

.site-header .subheader-cart .cart-link {
    min-height: 44px;
    min-width: 180px;
    padding: 8px 16px;
}

.site-header .subheader-cart-pro {
    display: flex;
    margin-left: 4px;
}

.site-header .subheader-cart-pro > button {
    background-color: var(--lmi-gris-2);
    min-width: 36px;
}

/* Téléphone : compte et panier réduits à l'icône (texte gardé pour les lecteurs d'écran) */
@media (max-width: 575.98px) {
    .site-header .header-row {
        column-gap: .5rem;
    }

    .lmi-logo-image img {
        height: 36px;
    }

    .lmi-compte-libelle,
    .site-header .col-account .btn-header-account i,
    .site-header .subheader-cart .cart-title > :not(svg) {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        white-space: nowrap;
        width: 1px;
    }

    .site-header .subheader-cart .cart-title {
        flex: none;
        font-size: 0;
        margin: 0;
    }

    .site-header .subheader-cart .cart-title svg {
        height: 26px;
        margin: 0;
        width: 30px;
    }

    .site-header .subheader-cart .cart-count {
        display: none;
    }

    .site-header .subheader-cart .cart-total {
        margin: 0 0 0 .375rem;
    }

    .site-header .col-account .dropdown > .btn-header-account,
    .site-header .col-account .dropdown > a.btn-header-account {
        justify-content: center;
        min-width: 44px;
        padding: .25rem;
    }

    .site-header .subheader-cart .cart-link {
        align-items: center;
        flex-wrap: nowrap;
        min-width: 0;
        padding: .25rem .5rem;
    }
}

/* Ordinateur : une ligne, en haut de l'écran pendant le défilement */
@media (min-width: 992px) {
    .site-header,
    body.header-sticky .site-header {
        position: sticky;
        top: 0;
    }

    body.admin-bar .site-header {
        top: 32px;
    }

    .site-header:has(#advanced-search.show),
    .site-header:has(#advanced-search.collapsing) {
        position: relative;
    }

    html {
        scroll-padding-top: 130px;
    }

    .site-header .header-row,
    body.header-sticky .site-header .header-row {
        column-gap: 1.5rem;
        grid-template-areas: "logo recherche compte panier";
        grid-template-columns: auto minmax(0, 1fr) auto auto;
        padding-bottom: .75rem;
        padding-top: .75rem;
    }

    .lmi-bouton-menu {
        display: none;
    }

    .lmi-logo-image img {
        height: 60px;
    }

    .site-header .col-logo .blogname {
        font-size: 1.125rem;
    }

    .site-header .col-search {
        max-width: 760px;
        width: 100%;
    }
}

/* Recherche : champ blanc et bouton orange d'origine, posés sur le bleu */
.site-header .col-search {
    grid-area: recherche;
}

.site-header .search-form .input-group-search {
    margin: 0;
}

/* Téléphone : bouton sous le champ, toute la largeur, comme avant ; à partir de 768 px : sur la même ligne */
@media (min-width: 768px) {
    .site-header .search-form .input-group-search {
        flex-wrap: nowrap;
    }

    .site-header .search-form .input-group-search .form-control {
        flex: 1 1 auto;
        min-width: 0;
        width: 1%;
    }

    .site-header .search-form .input-group-search > .input-group-append {
        flex: none;
        width: auto;
    }

    .site-header .search-form .input-group-search > .input-group-append .btn {
        white-space: nowrap;
    }
}

.site-header .search-form-extras {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-size: .8125rem;
    gap: .25rem 1rem;
    justify-content: space-between;
    margin-top: .375rem;
}

.site-header .search-form-extras .form-check {
    margin: 0;
}


/* ---------------------------------------------------------------------------------------------------------------
   Menu principal : bleu d'origine (ordinateur) ; sur téléphone, fenêtre « Menu » d'origine
   --------------------------------------------------------------------------------------------------------------- */

.header-menu {
    display: none;
}

@media (min-width: 992px) {
    .header-menu {
        display: block;
    }
}

.header-menu .nav-menu {
    flex-wrap: wrap;
    justify-content: space-between;
}

/* Menu sur une ligne : entrées un peu plus petites qu'avant (1,2 rem), mêmes couleurs */
@media (min-width: 1200px) {
    .header-menu .nav-menu {
        flex-wrap: nowrap;
    }

    .header-menu .nav-menu > li > a {
        font-size: 1.0625rem;
        padding-left: .625rem;
        padding-right: .625rem;
        white-space: nowrap;
    }
}

/* Petits ordinateurs (992 à 1199 px) : menu sur une ligne */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .header-menu .nav-menu {
        flex-wrap: nowrap;
    }

    .header-menu .nav-menu > li > a {
        font-size: .875rem;
        padding-left: .3125rem;
        padding-right: .3125rem;
        white-space: nowrap;
    }
}

/* Menu « Instruments » long (24 pages et plus) : 3 colonnes dès 992 px */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .header-menu .nav-menu > li.lmi-menu-colonnes-3 > ul.dropdown-menu.show {
        align-items: start;
        display: grid;
        grid-auto-flow: row dense;
        grid-template-columns: repeat(3, auto);
    }

    .header-menu .nav-menu > li.lmi-menu-colonnes-3 .lmi-col-1 {
        grid-column: 1;
    }

    .header-menu .nav-menu > li.lmi-menu-colonnes-3 .lmi-col-2 {
        grid-column: 2;
    }

    .header-menu .nav-menu > li.lmi-menu-colonnes-3 .lmi-col-3 {
        grid-column: 3;
    }
}

.modal-mobile-menu .menu-top-bar {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: .375rem 16px;
}

.modal-mobile-menu .menu-top-bar a {
    align-items: center;
    display: inline-flex;
    float: none;
    font-weight: 500;
    gap: .5rem;
    min-height: 44px;
}

.modal-mobile-menu .menu-top-bar svg {
    height: 24px;
    width: 28px;
}

.modal-mobile-menu .nav-menu > li > a,
.modal-mobile-menu .nav-menu > li > ul > li > a {
    display: block;
    min-height: 44px;
}

/* ---------------------------------------------------------------------------------------------------------------
   Accueil : titre et chapeau centrés comme avant, puis sections (blocs du 22/10)
   --------------------------------------------------------------------------------------------------------------- */

.accueil-entree {
    margin: 0 auto 2.5rem;
    max-width: 920px;
    text-align: center;
}

.accueil-entree .content-title {
    margin-bottom: 1rem;
}

.accueil-intro {
    font-size: 1.125rem;
}

.accueil-intro p {
    margin: 0;
}

.accueil-section {
    margin: 0 0 2.5rem;
}

.content-page .accueil-section-titre {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.25;
    margin: 0 0 .25rem;
}

.accueil-section-accroche {
    color: #5b6670;
    margin: 0 0 1rem;
}

.content-page .accueil-ventes-titre {
    margin-bottom: .25rem !important;
}

.accueil-section ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.accueil-carte {
    background: #fff;
    border-radius: var(--lmi-rayon-carte);
    box-shadow: var(--lmi-ombre-douce);
}

.accueil-section a:focus-visible {
    outline: 3px solid var(--lmi-orange);
    outline-offset: 2px;
}

.instruments-nav-bandeau:focus-visible,
.instruments-nav-filles a:focus-visible {
    outline-offset: -3px;
}

/* Piano et Guitare : grandes cartes, bandeau bleu sur une portée blanche (dessin CSS du 22/10) */
.instruments-nav-vedettes {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
    margin-bottom: 1rem !important;
}

.instruments-nav-vedette {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.instruments-nav-bandeau {
    background: var(--lmi-bleu) repeating-linear-gradient(to bottom, rgba(255, 255, 255, .22) 0 1px, transparent 1px 8px) 0 center / 100% 33px no-repeat;
    color: #fff !important;
    display: block;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 1.25rem;
    text-decoration: none !important;
    transition: background-color .15s;
}

.instruments-nav-bandeau:hover {
    background-color: var(--lmi-bleu-lisible);
}

.instruments-nav-filles {
    padding: .5rem 0 1rem !important;
}

.instruments-nav-filles li + li {
    border-top: 1px solid #e6edf6;
}

.instruments-nav-filles a {
    color: var(--lmi-texte);
    display: block;
    min-height: 44px;
    padding: .6rem 1.25rem;
    text-decoration: none;
}

.instruments-nav-filles a:hover {
    background: #f0f6fd;
    color: var(--lmi-bleu-lisible);
}

.instruments-nav-tout {
    background: var(--lmi-orange);
    border-radius: var(--lmi-rayon);
    color: #fff !important;
    font-weight: 600;
    margin: auto 1.25rem 1.25rem;
    padding: .6rem 1rem;
    text-align: center;
    text-decoration: none !important;
    transition: background-color .15s;
}

.instruments-nav-bandeau + .instruments-nav-tout {
    margin-top: 1.25rem;
}

.instruments-nav-tout:hover {
    background: var(--lmi-orange-survol);
}

.instruments-nav-autres {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.accueil-tuile {
    align-items: center;
    color: var(--lmi-bleu-lisible);
    display: flex;
    font-weight: 600;
    height: 100%;
    line-height: 1.25;
    min-height: 3.25rem;
    padding: .5rem 1rem;
    text-decoration: none;
    transition: background-color .15s, color .15s;
}

.accueil-tuile:hover {
    background: var(--lmi-bleu-lisible);
    color: #fff;
    text-decoration: none;
}

@media (min-width: 576px) {
    .instruments-nav-autres {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .instruments-nav-vedettes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .instruments-nav-autres {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

/* Encart saisonnier (Noël) : bandeau bleu sur la même portée, bouton orange et bouton à contour blanc */
.accueil-saison {
    align-items: center;
    background: var(--lmi-bleu) repeating-linear-gradient(to bottom, rgba(255, 255, 255, .22) 0 1px, transparent 1px 8px) 0 center / 100% 33px no-repeat;
    border-radius: var(--lmi-rayon-carte);
    box-shadow: var(--lmi-ombre-douce);
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.5rem;
    justify-content: space-between;
    margin: -1rem 0 2.5rem;
    padding: 1.25rem;
}

.accueil-saison-titre {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    margin: 0;
}

.accueil-saison-liens {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
    margin: 0;
}

.accueil-saison-lien {
    align-items: center;
    background: var(--lmi-orange);
    border: 1px solid var(--lmi-orange);
    border-radius: var(--lmi-rayon);
    color: #fff !important;
    display: inline-flex;
    font-weight: 600;
    min-height: 44px;
    padding: .5rem 1.125rem;
    text-decoration: none !important;
}

.accueil-saison-lien:hover {
    background: var(--lmi-orange-survol);
    border-color: var(--lmi-orange-survol);
}

.accueil-saison-lien.accueil-saison-lien-second {
    background: transparent;
    border-color: #fff;
}

.accueil-saison-lien.accueil-saison-lien-second:hover {
    background: #fff;
    color: var(--lmi-bleu-lisible) !important;
}

/* Rayons : une carte par groupe (titre souligné de bleu + liste) */
.rayons-nav-groupes {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

.rayons-nav-liens {
    column-gap: 1rem;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rayons-nav-groupe {
    padding: 1rem 1.25rem .5rem;
}

.content-page .rayons-nav-groupe-titre {
    border-bottom: 2px solid var(--lmi-bleu);
    color: var(--lmi-texte);
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0 0 .25rem;
    padding-bottom: .5rem;
}

.rayons-nav-liens a {
    color: var(--lmi-bleu-lisible);
    display: block;
    line-height: 1.35;
    min-height: 44px;
    padding: .625rem 0;
    text-decoration: none;
}

.rayons-nav-liens a:hover {
    color: var(--lmi-orange);
    text-decoration: underline;
}

@media (min-width: 576px) {
    .rayons-nav-groupes {
        grid-auto-flow: row dense;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rayons-nav-groupe-large {
        grid-column: span 2;
    }

    .rayons-nav-groupe:not(.rayons-nav-groupe-large) .rayons-nav-liens {
        display: block;
    }

    .rayons-nav-groupe-large .rayons-nav-liens {
        column-gap: 1.5rem;
    }
}

@media (min-width: 992px) {
    .rayons-nav-groupes {
        grid-auto-flow: row;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .rayons-nav-liens a {
        min-height: 0;
        padding: .5rem 0;
    }
}

/* Nos boutiques : 3 cartes blanches */
.accueil-boutiques-liste {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

.accueil-boutiques-liste li {
    background: #fff;
    border-radius: var(--lmi-rayon-carte);
    box-shadow: var(--lmi-ombre-douce);
    padding: 1rem 1.25rem;
}

.content-page .accueil-boutiques-liste h3 {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 .25rem;
}

.accueil-boutiques-liste h3 a {
    color: var(--lmi-bleu-lisible);
}

.accueil-boutiques-liste p {
    margin: 0;
}

.accueil-boutiques-liste p a {
    display: inline-block;
    font-weight: 600;
    padding-top: .375rem;
}

@media (min-width: 768px) {
    .accueil-boutiques-liste {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Texte principal : colonne de lecture */
.accueil-texte {
    padding-top: 1rem;
}

.accueil-texte > * {
    max-width: 75ch;
}

.content-page .accueil-texte h2 {
    font-size: 1.5rem;
    margin: 0 0 .75rem;
}

.accueil-texte p {
    line-height: 1.7;
    margin-bottom: 1.125rem;
}

.accueil-liste .site-search-wrapper {
    margin-bottom: 3rem;
}

@media (prefers-reduced-motion: reduce) {
    .instruments-nav-bandeau, .instruments-nav-tout, .accueil-tuile, article.product-card {
        transition: none;
    }
}

/* ---------------------------------------------------------------------------------------------------------------
   Pages catégorie, rayons, recherche : titre bleu d'origine en pleine largeur, filtres à gauche, liste à droite
   --------------------------------------------------------------------------------------------------------------- */

@media (min-width: 992px) {
    /* Le contenu de l'accueil est aussi dans un .site-search-wrapper (sans en-tête de liste) : bloc simple */
    .site-search-wrapper:not(:has(> .woocommerce-products-header)) {
        display: block;
    }

    .site-search-wrapper:has(> .woocommerce-products-header) {
        column-gap: 2rem;
        display: grid;
        grid-template-areas: "titre titre" "filtres liste";
        grid-template-columns: 270px minmax(0, 1fr);
    }

    .site-search-wrapper > .woocommerce-products-header {
        display: contents;
    }

    .site-search-wrapper > .woocommerce-products-header > h1 {
        grid-area: titre;
    }

    .site-search-wrapper > .woocommerce-products-header > form {
        align-self: start;
        grid-area: filtres;
        margin-bottom: 30px;
    }

    .site-search-wrapper > .products-column {
        grid-area: liste;
        min-width: 0;
    }
}

.categorie-sous-categories {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.categorie-sous-categories .btn {
    margin: 0 !important;
}

.product-toolbar .search-orderby .col-form-label {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Grille de fiches régulière : prix et bouton alignés en bas de chaque carte (cartes d'origine) */
ul.products {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 0 1.5rem;
}

ul.products > li,
ul.products > li.product {
    flex: none;
    margin: 0;
    max-width: none;
    padding: 0;
    width: auto;
}

@media (min-width: 768px) {
    ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1700px) {
    ul.products {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

article.product-card .product-image figure {
    align-items: center;
    display: flex;
    justify-content: center;
}

article.product-card .product-image figure img {
    max-width: 100%;
    object-fit: contain;
}

article.product-card .price {
    margin-top: auto;
}

article.product-card .product-cart,
article.product-card [data-cart-dropdown] {
    width: 100%;
}

@media (max-width: 575.98px) {
    ul.products {
        gap: 12px;
    }

    article.product-card {
        padding: 10px;
    }

    article.product-card .product-image figure {
        height: 180px;
    }

    article.product-card .price {
        font-size: 1.375rem;
    }

    article.product-card .btn-cart {
        min-height: 44px;
        padding-left: 46px;
        padding-right: 12px;
    }
}

/* ---------------------------------------------------------------------------------------------------------------
   Fiche produit : couleurs d'origine ; encadré d'achat à droite du texte à partir de 1200 px, image en tête sur téléphone
   --------------------------------------------------------------------------------------------------------------- */

@media (min-width: 1200px) {
    article.product .product-header-wrapper {
        align-items: start;
        column-gap: 2rem;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
    }

    article.product .product-header-wrapper .product-header {
        margin: 0;
    }

    article.product .product-header-wrapper .product-summary {
        align-self: start;
        margin: 0;
    }
}

@media (max-width: 991.98px) {
    article.product .product-medias {
        margin-bottom: 1.25rem;
        order: -1;
    }

    article.product .product-medias .product-image img {
        max-height: 320px;
        width: auto;
    }
}

/* ---------------------------------------------------------------------------------------------------------------
   Panier : actions par lot (Supprimer, Transférer pour les pros) sur plusieurs lignes au lieu de déborder sur téléphone
   --------------------------------------------------------------------------------------------------------------- */

@media (max-width: 575.98px) {
    .btn-group[data-bulk-actions] {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        max-width: 100%;
    }

    .btn-group[data-bulk-actions] > .btn,
    .btn-group[data-bulk-actions] > .btn-group,
    .btn-group[data-bulk-actions] > .btn-group > .btn {
        border-radius: var(--lmi-rayon) !important;
        flex: 1 1 100%;
        margin: 0 !important;
        white-space: normal;
    }
}

/* ---------------------------------------------------------------------------------------------------------------
   Pied de page : « Nos garanties », bandeau bleu (Nos magasins, Qui sommes-nous ?, Besoin d'un conseil ?) et menu du
   bas d'origine ; le bandeau bleu reçoit en plus les colonnes instruments, thèmes et magasins
   --------------------------------------------------------------------------------------------------------------- */

.lmi-pied {
    color: #fff;
    font-size: .9375rem;
}

.lmi-pied-grille {
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr;
}

.lmi-pied-conseil-bloc .footer-links {
    margin-bottom: 1rem;
}

.lmi-pied .footer-links .btn-white {
    min-height: 44px;
}

.lmi-pied .lmi-pied-titre {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 500;
    margin: 0 0 .75rem;
    text-transform: uppercase;
}

.lmi-pied .lmi-pied-titre-suite {
    margin-top: 1.5rem;
}

.lmi-pied-liens {
    list-style: none;
    margin: 0;
    padding: 0;
}

.lmi-pied-liens li a,
.lmi-pied-boutiques a {
    color: #fff;
    display: inline-block;
    padding: .3125rem 0;
    text-decoration: none;
}

.lmi-pied-liens li a:hover,
.lmi-pied-boutiques a:hover {
    color: #fff;
    text-decoration: underline;
}

.lmi-pied-liens-instruments,
.lmi-pied-liens-themes {
    column-gap: 1.5rem;
    columns: 2;
}

.lmi-pied-boutiques {
    display: grid;
    gap: 1rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.lmi-pied-boutiques h3 {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 .125rem;
}

.lmi-pied-boutiques h3 a {
    padding: 0;
    text-decoration: underline;
}

.lmi-pied-boutiques p {
    margin: 0;
}

.lmi-pied-boutiques p a {
    font-weight: 600;
    padding: .25rem 0;
}

@media (min-width: 768px) {
    .lmi-pied-grille {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-conseil .lmi-pied-conseil-bloc .footer-links {
        justify-content: flex-start;
    }

    .footer-conseil .lmi-pied-conseil-bloc .footer-content {
        text-align: left;
    }
}

@media (min-width: 992px) {
    .lmi-pied-grille {
        grid-template-columns: 1.2fr 1.1fr 1fr;
    }

    .footer-conseil .lmi-pied-conseil-bloc .footer-content p {
        display: block;
    }
}

/* Menu du bas : zones cliquables plus hautes */
.footer-menu .nav-menu > li a {
    display: inline-block;
    padding: .5rem 0;
}

@media (max-width: 379.98px) {
    .lmi-bandeau-service .header-phone p {
        font-size: .8125rem;
    }

    .lmi-bandeau-service .header-phone a.contact-phone {
        font-size: 1rem;
    }
}