:root {
  --pix-color-primary: #FBDF95;
  --pix-color-secondary: #081119;
  --pix-color-background: #ffffff;

  --pix-space-s: clamp(10px, 2vw, 20px);
  --pix-space-m: clamp(15px, 3vw, 30px);
  --pix-space-l: clamp(20px, 4vw, 40px);

  --pix-section-space-m: clamp(40px, 5vw, 80px);
  --pix-section-space-l: clamp(60px, 8vw, 120px);
  --pix-section-space-xl: clamp(80px, 10vw, 160px);


  --pix-radius-s: 12px;


  --pix-heading-font: "Cormorant Garamond", serif;
  --pix-body-font: "Cormorant Garamond", serif;

  --pix-base-font-size: 21px;
}


html {
    font-size: 100%;
}

body {
    font-size: var(--pix-base-font-size);
    font-weight: 400;
    line-height: 1.4;
    /* margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    overflow-x: hidden;
 */
    font-family: var(--pix-body-font);
    /* color: var(--pix-color-primary); */
    /* font-size: var(--pix-base-font-size); */

    /* background-color: var(--pix-color-background); */

}

/* @media (max-width: 600px) {
    body {
        font-size: 17px;
    }
} */

::selection {}

html {
    overflow-y: scroll !important;
    /* scroll-behavior: smooth; */
}

a {
    color: #AF906D;
}

a:hover {
    color: #7e6343;
}


.wrapper-pix-site {
    overflow: hidden;
    position: relative;
    z-index: 200;
}

.brxe-container {width:1680px;}

.brxe-text  {width: 100%;}

.pix-wrapper-contenu {
    z-index: 0;
    position: relative;
}

body:not(.home) .pix-wrapper-contenu {
    margin: var(--pix-section-space-m) 20px;
}

.pix-wrapper-contenu::before, .pix-wrapper-contenu::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 100%;
    /* background: url('i/pattern-papier-peint-fond-clair.svg') repeat top left; */
    background-size: 120px auto;
    pointer-events: none;
    z-index: -2;
    mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 0.1;
}
.pix-wrapper-contenu::after {
    left: auto;
    right: 0;
    mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
}


/* div.pix-wrapper-contenu {
    padding-top: 30px;
}

@media (max-width: 500px) {
    div.pix-wrapper-contenu {
        padding-top: 15px;
    }
}
 */

body.pix-bandeau-fullwidth-loaded div.pix-wrapper-contenu {
    padding-top: 0px;
}

h2.brxe-heading {font-size: clamp(25px, 2vw, 40px); line-height:1;}

h3 {line-height:1;}

/*
h1 span.dl,
h2 span.dl {
    font-family: "Bitter", serif;
    display: block;
    color: currentColor;
    font-weight: 400;
    font-size: max(18px, 0.7em);
    text-transform: none;
    color: currentColor;
    margin-top: 0.4em;
    text-align: inherit;
}

body:not(home) span.dl,
body:not(home) h2 span.dl{text-align: left;} */

a.pix-backtotop {
    display: none;
    width: 48px;
    height: 48px;
    text-indent: -9999px;
    position: fixed;
    z-index: 9999;
    right: 50%;
    bottom: 10px;
    transform: translateX(50%);
    background: var(--pix-color-primary) url("i/arrow-up.svg") no-repeat center center;
    background-size: 18px 18px;
    border-radius: 99px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.27);
    transition: background 0.2s ease 0s;
}

a.pix-backtotop:hover {
    background: var(--pix-color-primary) url("i/arrow-up.svg") no-repeat center center;
    background-size: 21px 21px;
}


.site-branding {
    max-width: initial;
    position: relative;
    z-index: 2;
    display: inline-block;
}

.pix-site-header {
    position: relative;
    z-index: 2000;
}

.pix-bouton,
.bricks-button,
.ywraq-form-table-wrapper input[type=submit] {
    font-family: "Cormorant Garamond", serif;
    font-style: normal;
    text-shadow: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.4em 1em;
    color: #fff;
    border: none;
    text-align: center;
    font-size: 1em;
    font-weight: 700;
    text-decoration: none;
    border-radius: 0;
    background: #0B2231;
    position: relative;
    text-transform: uppercase;
    transition: background 0.2s ease 0s, color 0.2s ease 0s;
}



.pix-bouton:not(.pix-bouton-lien)::after,
.bricks-button:not(.pix-bouton-lien)::after {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    mask-image: url("i/btn-arrow.svg");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    background-color: currentColor;
    transition: transform 0.2s ease 0s;
}


.pix-bouton--light {
    background: #FBDF95;
    color: #081119;
}


.pix-bouton:hover,
.bricks-button:hover,
.ywraq-form-table-wrapper input[type=submit]:hover {
    background: #FBDF95;
    color: #081119;
}


.pix-bouton:hover::after,
.bricks-button:hover::after {
    transform: translateX(0.2em);
}

.brx-no-active-filter {
    display: none;
}

.pix-bouton-lien {
    background: transparent;
    padding: 0;
    color: #AF906D;
    text-decoration: none;
    text-transform: none;
}
.pix-bouton-lien:hover {
    background: transparent;
    color: #081119;
}



#map iframe {
    vertical-align: top;
}



.grecaptcha-badge {
    visibility: hidden;
}

.elementor-widget-image img,
.elementor-widget-gallery div div a {

}

.no-shadow img {
    box-shadow: none;
}

.pix-image-border {
    outline: 4px solid var(--pix-color-background);
    outline-offset: -12px;
}




.pix-wrapper-contenu ul.puce {
    margin: 0;
    padding: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-left: 14px;
}

.pix-wrapper-contenu ul.puce>li {
    list-style-type: none;
    background-image: url(i/puce.svg);
    background-repeat: no-repeat;
    padding-left: 18px;
    padding-right: 2px;
    background-position: 0px 6px;
    background-size: 12px;
    margin: 0px 0px 7px 0px;
    overflow: hidden;
}



.list-3-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}

.list-2-columns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}



@media (max-width:800px) {
    .list-3-columns {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media (max-width:490px) {

    .list-3-columns,
    .list-2-columns {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}



ul.list-3-columns li,
ul.list-2-columns li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}




.pix-right-responsive, .pix-xl-right-responsive {
    box-shadow: 2px 2px 10px rgba(0,0,0,0.5) !important;
    margin:0;float:right; margin-left:16px;max-width:100%;
}
.pix-left-responsive, .pix-xl-left-responsive {
    box-shadow: 2px 2px 10px rgba(0,0,0,0.5) !important;
    margin:0;float:left; margin-right:16px;max-width:100%;
}


@media (max-width:1200px) {
    .pix-xl-right-responsive, .pix-xl-left-responsive {
        margin:0;float:none;width:auto;padding:0;text-align: center;
        display: block;
        margin: auto;margin-bottom:20px;
    }
}





@media (max-width:560px) {
    .pix-right-responsive, .pix-left-responsive {
        margin:0;float:none;width:auto;padding:0;text-align: center;
        display: block;
        margin: auto;margin-bottom:20px;
    }
}




.pix-vertical-separator {
    position: relative;
    width: 100%;
    height: 100%;
}
.pix-vertical-separator::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 60%;
    background: url('i/spirale-verticale.svg') no-repeat center top;
    background-size: 100% auto;
}
.pix-vertical-separator::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60%;
    background: url('i/spirale-verticale.svg') no-repeat center top;
    background-size: 100% auto;
    transform: scaleY(-1);
}

.pix-wrapper-reseaux {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
}
.pix-wrapper-reseaux__link {
    display: inline-block;
}
.pix-wrapper-reseaux__link:hover .pix-wrapper-reseaux__link-image {
    filter: brightness(0) saturate(100%) invert(86%) sepia(35%) saturate(646%) hue-rotate(162deg) brightness(98%) contrast(79%);
}



.pix-polaroid {
    position: relative;
    padding: 15px 15px 15px 15px;
    display: flex;
    flex-direction: column;
    transform: rotate(6deg);
    overflow: visible;
    box-shadow: 0 4px 20px color-mix(in srgb, var(--pix-color-primary) 20%, transparent);
    transition: transform 0.2s ease;
}

.pix-polaroid figcaption {
    position: static;
    background: none;
    color: var(--pix-color-primary);
    margin-top: 15px;
}

.pix-polaroid::before {
    content: '';
    position: absolute;
    inset: 0;
    background: #fff;
    transform: rotate(-3deg);
    z-index: -1;
    box-shadow: 0 4px 20px color-mix(in srgb, var(--pix-color-primary) 20%, transparent);

    transition: transform 0.2s ease;
}

.pix-polaroid::after {
    content: '';
    position: absolute;
    inset: 0;
    background: #fff;
    z-index: -1;
    box-shadow: 0 4px 20px color-mix(in srgb, var(--pix-color-primary) 20%, transparent);
}

.pix-polaroid:hover {
    transform: rotate(3deg);
}
.pix-polaroid:hover::before  {
    transform: rotate(-2deg);
}


.pix-background-texture {
    background: url('i/bg-texture.webp') no-repeat center center;
    background-size: cover;
}

@media
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .pix-background-texture {
        background-image: url('i/bg-texture-2x.webp');
    }
}


.pix-wrapper-produit {margin-bottom: 10px;transition: filter 0.2s ease;padding: 5px 10px 5px;}
.pix-wrapper-produit:hover {
    filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.1));transition: filter 0.2s ease;
    }


/*Accueil des catégories*/
.pix-texte-presentation {
    margin-top: 20px;
    margin-bottom: 20px;
}


/*Produit Single*/

.brxe-product-title {
    line-height: 0.9;
}

.pix-square-img {
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.pix-square-img a {
    display: block;
    width: 100%;
    height: 100%;
}

.pix-square-img img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    object-position: center;
}

.pix-igp {}
.pix-prixlitre {}


.pix-degre, .pix-contenance, .pix-cepage, .pix-region, .pix-prixlitre, .pix-labels, .pix-ronstyle, .pix-attribute-badges {
    margin-top:10px;
}

.pa_contenance a {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}



.brxe-shortcode.pix-cepage {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

.brxe-shortcode.pix-cepage::before {
    content: '';
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url('i/grape.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 6px;
}

.pix-cepage .attr-badge, .pix-ronstyle .attr-badge, .pix-attribute-badges .pix-badge {
    display: inline-block;
    background-color: #282735;
    color: #ffffff;
    font-weight: 600;
    padding: 1px 6px;
    font-size: 15px;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.15s ease;
    margin-right: 10px;
    margin-bottom: 4px;
}

.pix-cepage .attr-badge:hover {
    background-color: #010101;
}



.brxe-shortcode.pix-region {
display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pix-region .attr-badge {
    display: inline-block;
    background-color: #AF906D;
    color: #ffffff;
    font-weight: 600;
    padding: 1px 6px;
    font-size: 15px;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.15s ease;
}

.pix-region .attr-badge:hover {
    background-color: #8A6D4F;
}


.brxe-shortcode.pix-region::before {
    content: '';
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url('i/france.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


body.single-product .pix-price {font-size:28px;}

.pix-labels {
    margin-top: 25px;
display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pix-labels .pix-label-icon {
    width: auto;
    height: 20px;
}


.woocommerce-cart-form .product-thumbnail img {max-width:250px;}

.pix-produit__thumbnail {
    position: relative;
}

.pix-produit__thumbnail--bio::after {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    width: 40px;
    height: 40px;
    background-image: url('i/bio.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
}

/*Page request a quote*/
/* .cart_item .product-thumbnail {
   height:100px;
   width:100px;
   padding:10px;
}

.cart_item .product-thumbnail img {
    width: 100px;
    height: auto;
    object-fit: cover;
}

.product-name {
    width:20%;
    max-width: 200px;
}

.input-text.qty.text {max-width:50px;padding: 0px 5px;font-size:23px;} */


/*Sous-menu boutique*/
/* ul#menu-sous-menu-boutique li a {
    color:#153346;
    text-decoration:none;
    font-weight: 600;
}

ul#menu-sous-menu-boutique li.pix-menu-selected a {
    color: #282735;
    position: relative;
}

ul#menu-sous-menu-boutique li a::after {
    content: '';
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: -5px;
    background-color: #282735;
    opacity: 0;
    transition: opacity 0.3s ease;
}

ul#menu-sous-menu-boutique li.pix-menu-selected a::after,
ul#menu-sous-menu-boutique li a:hover::after {
    opacity: 1;
} */
/* Texte : hover + sélectionné */
/* Texte : hover + sélectionné */
#pix-menu-desktop li a:hover,
#pix-menu-desktop .pix-menu-selected > a,
#pix-menu-desktop .pix-menu-selected > a div {
    color: #fff;
}

/* Soulignement : hover + sélectionné (apparition douce) */
#pix-menu-desktop li a {
    position: relative;
}

#pix-menu-desktop li a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 8px;
    width: 100%;
    max-width: calc(100% - 30px);
    height: 2px;
    background-color: #fff;
    opacity: 0;
    transform: translateX(-50%) scaleX(0);
    transform-origin: center;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

#pix-menu-desktop li a:hover::after,
#pix-menu-desktop > li.pix-menu-selected > a::after,
#pix-menu-desktop li ul li.pix-menu-selected > a::after,
#pix-menu-desktop li:has(ul li:hover) > a::after {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
}

/* Flèche : hover + sélectionné */
#pix-menu-desktop li a:hover .menu-arrow-svg,
#pix-menu-desktop .pix-menu-selected > a .menu-arrow-svg {
    -webkit-mask-image: url(i/arrow-s.svg);
    mask-image: url(i/arrow-s.svg);
    background-color: #fff;
}

/* Parent coloré quand un sous-menu (li imbriqué) est survolé */
#pix-menu-desktop li:has(ul li:hover) > a,
#pix-menu-desktop li:has(ul li:hover) > a div {
    color: #fff;
}

#pix-menu-desktop li:has(ul li:hover) > a .menu-arrow-svg {
    -webkit-mask-image: url(i/arrow-s.svg);
    mask-image: url(i/arrow-s.svg);
    background-color: #fff;
}

#menu-sous-menu-boutique.bricks-nav-menu > li {
    margin: 0;
}

#menu-sous-menu-boutique {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
    justify-content: center;
}

#menu-sous-menu-boutique .bricks-menu-item a {
    display: inline-block;
    padding: clamp(4px, 0.5vw, 6px) clamp(10px, 1.2vw, 16px);
    border: 1px solid #282735;
    font-size: clamp(15px, 2vw, 22px);
    color: #282735;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}

#menu-sous-menu-boutique .bricks-menu-item a:hover {
    background-color: #282735;
    color: #fff;
}

#menu-sous-menu-boutique .pix-menu-selected a {
    background-color: #282735;
    color: #fff;
}






/*Personnalisatin extension devis*/
.yith-ywraq-add-button img.ajax-loading {
    display: none !important;
}

.yith-ywraq-add-button img.ajax-loading[style*="visibility: visible"] {
    display: inline-block !important;
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' stroke='%23282735' stroke-width='2.5' fill='none' stroke-dasharray='20' stroke-dashoffset='20'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='0.7s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E");
    width: 16px;
    height: 16px;
}

/* css filtres bricks */

.pix-filtres {margin-top: var(--pix-space-s)}

.value-wrap .value::after {
    content: ' €';
}


.pix-filtres .brxe-block .brxe-filter-checkbox {
    overflow: hidden;
    max-height: 3000px;
    opacity: 1;
    visibility: visible;
    transition: max-height 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;
}

.pix-filtres .brxe-block.pix-collapsed .brxe-filter-checkbox {
    max-height: 0;
    opacity: 0;
    visibility: hidden;

}

.pix-filtres .brxe-block .brxe-text {
    cursor: pointer;
    user-select: none;
}

.pix-filtres .brxe-block .brxe-text p {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: clamp(18px, 1.5vw, 22px);
}

.pix-filtres .brxe-block .brxe-text p::before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    border-right: 2px solid #282735;
    border-bottom: 2px solid #282735;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.pix-filtres .brxe-block.pix-collapsed .brxe-text p::before {
    transform: rotate(-45deg);
}

.pix-filtres .brxe-block + .brxe-block {
    margin-top: 18px;
}

/* supprimer catégories parentes quand il n'y a que des sous-catégories */
.brxe-filter-checkbox li[data-depth="0"] {
    display: none;
}


.container-padding {
    padding-left: var(--pix-space-s);
    padding-right: var(--pix-space-s);
}

/*Page devis*/
.pix-texte-devis {margin:30px auto;padding: 25px 35px; background-color: #f7f7f7;}



/*Notices woocommerce*/
.woocommerce-notices-wrapper .woocommerce-message a, .woocommerce-info a, .woocommerce-error a {
    color: #fff;
}
.woocommerce-info a.showlogin, .woocommerce-error a.showlogin {
    color: unset;
}

/* Checkout "demande de devis" : le paiement est factice (une seule passerelle
   forcée côté functions.php, cf. Pix_Gateway_Devis) et ne demande aucune
   saisie. On masque toute la section paiement, seul reste le bouton
   "Envoyer la demande" (+ la case CGV le cas échéant). */
.woocommerce-checkout-payment ul.wc_payment_methods,
.woocommerce-checkout-payment ul.payment_methods {
    display: none;
}


.pix-heading__heading .pix-heading__title  {line-height:1;}
@media (max-width: 520px) {
    .pix-heading__heading .pix-heading__title {max-width: 300px; width: 90%;margin: 0 auto;}
}

form.woocommerce-checkout h3 {
   font-size: clamp(20px, 1.4vw, 28px);
}


/*Page archive articles*/
.pix-presentation-articles ul li {padding:10px 10px 20px; background-color: #f7f7f7; margin-bottom: 10px; border-radius: 5px;}
.pix-presentation-articles ul li h3 {font-size: clamp(18px, 2vw, 22px); color:#153346;}
.pix-presentation-articles ul li a {color:#000;}
.pix-presentation-articles .bricks-layout-inner .dynamic {line-height:1;}
