/* =============================================================
   HYDRODIV — Universal theme overlay (refonte 2026-05-12 — Direction 02 v3 PRO)
   Source Serif 4 / Inter / DM Mono · fond blanc · accents terracotta + or
   PS chrome conservé, modules continuent de fonctionner.
   ============================================================= */

/* ============ FONTS · self-hosted ============ */
@font-face{font-family:'Source Serif 4';font-style:italic;font-weight:200 900;font-display:swap;
  src:url(../fonts/SourceSerif4-200-900-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';font-style:italic;font-weight:200 900;font-display:swap;
  src:url(../fonts/SourceSerif4-200-900-italic-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:200 900;font-display:swap;
  src:url(../fonts/SourceSerif4-200-900-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:200 900;font-display:swap;
  src:url(../fonts/SourceSerif4-200-900-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;
  src:url(../fonts/Inter-300-800-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;
  src:url(../fonts/Inter-300-800-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/DMMono-400-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/DMMono-400-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/DMMono-500-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/DMMono-500-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'DM Mono';font-style:italic;font-weight:400;font-display:swap;
  src:url(../fonts/DMMono-400-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* mask des 404 fontes héritées (Arsenal/Pavanam dans le bundle) : aliasing local sans réseau */
@font-face{font-family:'Arsenal';font-style:normal;font-weight:400;font-display:swap;
  src:local('Source Serif 4'),local('Didot'),local('Georgia');size-adjust:100%}
@font-face{font-family:'Pavanam';font-style:normal;font-weight:400;font-display:swap;
  src:local('Inter'),local('system-ui'),local('Helvetica');size-adjust:100%}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400;font-display:swap;
  src:local('Source Serif 4'),local('Didot'),local('Georgia');size-adjust:100%}

/* ============ DESIGN TOKENS ============ */
:root{
  --hd-white:#FFFFFF;
  --hd-paper:#FAFAF8;
  --hd-paper-2:#F2F0EA;
  --hd-midnight:#0D1B2A;
  --hd-midnight-2:#1B2A3C;
  --hd-forest:#2D4A3A;
  --hd-terracotta:#C26B4C;
  --hd-gold:#B8924C;
  --hd-line:#0D1B2A1F;
  --hd-line-2:#0D1B2A12;

  --hd-display:'Source Serif 4','Source Serif Pro',Georgia,serif;
  --hd-body:'Inter',system-ui,-apple-system,sans-serif;
  --hd-mono:'DM Mono',ui-monospace,monospace;
}

/* ============ RESET & BASE TYPO ============ */
/* 2026-05-21 : overflow-x retiré de body (cassait position:sticky du .hd-top).
   Le clip horizontal reste sur html. */
html{overflow-x:hidden!important}
html,body{background:var(--hd-white)!important;color:var(--hd-midnight);max-width:100vw!important;width:100%!important}
body.page-product #wrapper,
body.page-product #main,
body.page-product #content-wrapper{max-width:100vw!important;overflow-x:hidden!important}
body.page-product .product-detail-primary,
body.page-product .product-container,
body.page-product .product-info{max-width:100%!important}
@media (max-width:720px){
  body.page-product .product-detail-primary{display:block!important}
  body.page-product .product-detail-primary > *{max-width:100%!important}
  body.page-product .images-container,
  body.page-product .product-images,
  body.page-product .product-info{width:100%!important;max-width:100%!important;float:none!important}
}
html body,
html body.has-hd-chrome,
.product-list .product-list-actions,
.cart-summary .cart-summary-line,
.form-control{font-family:var(--hd-body)!important;color:var(--hd-midnight);-webkit-font-smoothing:antialiased}

/* override hydrodiv module's own --hd-font-* vars to use new fonts */
:root,html body,html body.has-hd-chrome{
  --hd-font-sans:'Inter',system-ui,-apple-system,sans-serif!important;
  --hd-font-serif:'Source Serif 4','Source Serif Pro',Georgia,serif!important;
  --hd-font-mono:'DM Mono',ui-monospace,monospace!important;
}

/* Fond propre — grille pointillée fixe + lueur dorée/terracotta discrète aux coins (pas de blobs) */
body{
  background-color:var(--hd-white)!important;
  background-image:radial-gradient(circle at 50% 50%, #0D1B2A14 1px, transparent 1px)!important;
  background-size:24px 24px!important;
  background-attachment:fixed!important;
  background-position:0 0!important;
  background-repeat:repeat!important;
  position:relative;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(70vw 50vh at 100% 0%, #B8924C12, transparent 60%),
    radial-gradient(60vw 45vh at 0% 100%, #C26B4C10, transparent 65%);
}
body > *{position:relative;z-index:1}

h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.page-title,.page-header h1,
.product-title,.product-name,
.featured-product .product-title,
.section-title{
  font-family:var(--hd-display)!important;
  font-weight:500;
  letter-spacing:-.01em;
  color:var(--hd-midnight);
  font-variation-settings:"opsz" 60,"wght" 500;
}

em,i,.text-italic{font-style:italic}

a{color:var(--hd-midnight);transition:color .2s}
a:hover,a:focus{color:var(--hd-terracotta);text-decoration:none}

::selection{background:var(--hd-gold);color:var(--hd-midnight)}

/* ============ ANNOUNCE / TOP BAR ============ */
.header-banner{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important;
  text-align:center;padding:9px 16px!important;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.2em;text-transform:uppercase;
  border:0!important
}
.header-banner a,.header-banner *{color:var(--hd-white)!important}

/* ============ HEADER ============ */
#header{
  background:rgba(255,255,255,.94)!important;backdrop-filter:blur(12px) saturate(1.1);
  border-bottom:1px solid var(--hd-line)!important;box-shadow:none!important;
  position:sticky;top:0;z-index:50;
}
#header .header-top{padding:0!important;background:transparent!important;border:0!important}
#header .header-top > .container{padding-top:14px;padding-bottom:14px}
#header .header-nav{
  background:transparent!important;border:0!important;
  font-family:var(--hd-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  padding:6px 0!important;color:var(--hd-midnight-2)
}
#header .header-nav a{color:var(--hd-midnight-2)!important}
#header .header-nav a:hover{color:var(--hd-terracotta)!important}

#_desktop_logo img,
#_mobile_logo img,
#header-logo img,
.logo img{max-height:42px!important;width:auto!important;height:auto!important}
@media (max-width:720px){
  #_desktop_logo img,#_mobile_logo img,.logo img{max-height:34px!important}
}

#_desktop_top_menu .top-menu,
.top-menu{
  font-family:var(--hd-body)!important;font-size:13px!important;letter-spacing:.06em;text-transform:uppercase;
  font-weight:500
}
#_desktop_top_menu .top-menu a,
.top-menu a{
  color:var(--hd-midnight)!important;padding:8px 14px!important;border-radius:0!important;
  position:relative;background:transparent!important
}
#_desktop_top_menu .top-menu a::after,
.top-menu > li > a::after{
  content:"";position:absolute;left:14px;right:14px;bottom:4px;height:1px;background:var(--hd-terracotta);
  transform:scaleX(0);transform-origin:center;transition:transform .25s
}
#_desktop_top_menu .top-menu a:hover::after,
.top-menu > li > a:hover::after,
.top-menu > li.current > a::after{transform:scaleX(1)}
#_desktop_top_menu .top-menu a:hover,
.top-menu a:hover{color:var(--hd-terracotta)!important;background:transparent!important}

#search_widget input,
.search-widget input[type="text"]{
  font-family:var(--hd-body)!important;border:1px solid var(--hd-line)!important;
  border-radius:999px!important;background:var(--hd-white)!important;
  padding:8px 16px!important;color:var(--hd-midnight)
}
#search_widget input:focus,
.search-widget input[type="text"]:focus{border-color:var(--hd-midnight)!important;box-shadow:none!important;outline:0}
#search_widget button,
.search-widget button{color:var(--hd-midnight)!important}

.blockcart{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important;
  border-radius:999px!important;padding:8px 16px 8px 14px!important;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.16em;text-transform:uppercase
}
.blockcart:hover{background:var(--hd-terracotta)!important}
.blockcart a,.blockcart .header,.blockcart *{color:var(--hd-white)!important}
.cart-products-count{
  background:var(--hd-gold)!important;color:var(--hd-midnight)!important;
  font-size:10px!important;padding:2px 6px!important;border-radius:999px!important;font-weight:700;font-family:var(--hd-mono)
}

.user-info,
#_desktop_user_info{font-family:var(--hd-body)!important;font-size:13px}
.user-info a{color:var(--hd-midnight)!important}

/* ============ BREADCRUMB ============ */
.breadcrumb,
nav.breadcrumb{
  background:transparent!important;padding:18px 0!important;margin:0;border:0;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.16em;text-transform:uppercase
}
.breadcrumb ol{padding:0;margin:0;list-style:none}
.breadcrumb li{display:inline-flex;align-items:center;color:var(--hd-midnight-2)}
.breadcrumb li a{color:var(--hd-midnight-2)!important}
.breadcrumb li a:hover{color:var(--hd-terracotta)!important}
.breadcrumb li:last-child{color:var(--hd-midnight)}
.breadcrumb li + li::before{
  content:"·";display:inline-block;margin:0 10px;color:var(--hd-gold);font-weight:700
}

/* ============ PAGE TITLE / HEADER ============ */
.page-header{
  text-align:center;padding:50px 0 30px;border-bottom:0;background:transparent
}
.page-header h1,
.page-header .page-title{
  font-family:var(--hd-display)!important;font-weight:400!important;
  font-size:clamp(36px,5vw,68px)!important;line-height:1!important;letter-spacing:-.015em;
  font-variation-settings:"opsz" 60,"wght" 400;color:var(--hd-midnight)!important
}
.page-header h1 em,.page-header .page-title em{color:var(--hd-terracotta);font-style:italic;font-weight:500}

/* ============ BUTTONS ============ */
.btn,
button.btn{
  font-family:var(--hd-body)!important;font-size:13px!important;letter-spacing:.12em!important;
  text-transform:uppercase!important;font-weight:500!important;
  border-radius:999px!important;padding:13px 26px!important;
  border:1px solid transparent!important;transition:all .25s;cursor:pointer
}
.btn-primary,
.btn.btn-primary,
button[type="submit"].btn-primary,
.add-to-cart,
button.add-to-cart,
.cart-detailed-actions .btn-primary{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important;border-color:var(--hd-midnight)!important
}
.btn-primary:hover,.btn-primary:focus,
.add-to-cart:hover,.add-to-cart:focus{
  background:var(--hd-terracotta)!important;border-color:var(--hd-terracotta)!important;color:var(--hd-white)!important
}
.btn-secondary,
.btn-outline-primary,
.btn.btn-outline-primary{
  background:transparent!important;color:var(--hd-midnight)!important;border-color:var(--hd-midnight)!important
}
.btn-secondary:hover,.btn-outline-primary:hover{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important
}
.btn-link,
a.btn-link{color:var(--hd-midnight)!important;text-decoration:none}
.btn-link:hover{color:var(--hd-terracotta)!important}
.btn-tertiary{background:var(--hd-paper)!important;color:var(--hd-midnight)!important;border-color:var(--hd-paper)!important}
.btn-tertiary:hover{background:var(--hd-paper-2)!important}

.bootstrap-touchspin{border-radius:999px!important;overflow:hidden;border:1px solid var(--hd-midnight)!important}
.bootstrap-touchspin .btn,
.bootstrap-touchspin .input-group-btn-vertical .btn{
  background:var(--hd-white)!important;color:var(--hd-midnight)!important;border:0!important;
  padding:0 14px!important;height:44px!important
}
.bootstrap-touchspin .btn:hover{background:var(--hd-midnight)!important;color:var(--hd-white)!important}
.bootstrap-touchspin input{
  border:0!important;background:transparent!important;font-family:var(--hd-mono)!important;
  text-align:center;font-weight:500;color:var(--hd-midnight)
}

/* ============ FORMS ============ */
.form-control,
input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input[type="number"],
textarea,select{
  font-family:var(--hd-body)!important;
  border:1px solid var(--hd-line)!important;border-radius:8px!important;
  background:var(--hd-white)!important;padding:11px 16px!important;
  color:var(--hd-midnight);font-size:14px!important;
  /* 2026-06-02 : laisser la box grandir pour contenir padding(11px)+line-height.
     theme.css épingle height:calc(1.3em + 1rem)≈34px → le texte des <select>
     "Standard"/"Maxi" était coupé en deux. height:auto résout le conflit. */
  height:auto!important;line-height:1.3!important;
  box-shadow:none!important
}
.form-control:focus,
input:focus,textarea:focus,select:focus{
  border-color:var(--hd-midnight)!important;outline:0;box-shadow:none!important
}
.form-label,label{font-family:var(--hd-body)!important;font-size:12px;font-weight:600;color:var(--hd-midnight);letter-spacing:.02em}
.form-text,.help-text,small{font-family:var(--hd-body)!important;color:var(--hd-midnight-2);font-size:12px}

/* ============ PRODUCT MINIATURE ============ */
.product-miniature,
.featured-product,
article.product-miniature{
  background:var(--hd-white)!important;border:1px solid var(--hd-line)!important;
  border-radius:4px!important;padding:0!important;overflow:hidden;
  transition:all .3s;position:relative
}
.product-miniature::before{
  content:"";position:absolute;inset:6px;border:1px solid var(--hd-gold);
  opacity:.3;pointer-events:none;border-radius:2px;transition:opacity .3s;z-index:1
}
.product-miniature:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px #0D1B2A33}
.product-miniature:hover::before{opacity:.7}

.product-miniature .thumbnail-container,
.product-miniature .product-thumbnail{
  background:#FFFFFF!important;
  padding:24px!important;border:0!important;border-bottom:1px solid var(--hd-line)!important;
  border-radius:0!important;box-shadow:none!important;text-align:center;position:relative
}
.product-miniature .thumbnail-container::after,
.product-miniature .product-thumbnail::after{
  content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 50% 50%, #0D1B2A0A 1px, transparent 1px);background-size:18px 18px;opacity:.55;pointer-events:none
}
.product-miniature .thumbnail-container img,
.product-miniature .product-thumbnail img{
  max-width:80%!important;height:auto!important;mix-blend-mode:multiply;
  transition:transform .4s;filter:drop-shadow(0 14px 24px #0D1B2A30)
}
.product-miniature:hover .thumbnail-container img{transform:scale(1.04)}

.product-miniature .product-description,
.product-miniature .product-info{
  padding:20px 22px 22px!important;text-align:center!important;background:var(--hd-white)
}
.product-miniature .product-title,
.product-miniature h2.product-title,
.product-miniature h3.product-title{
  font-family:var(--hd-display)!important;font-weight:500!important;
  font-size:20px!important;line-height:1.1!important;letter-spacing:-.005em;
  font-variation-settings:"opsz" 60,"wght" 500;margin:0 0 10px;text-align:center
}
.product-miniature .product-title a{color:var(--hd-midnight)!important;text-decoration:none}
.product-miniature .product-title a:hover{color:var(--hd-terracotta)!important}

.product-miniature .product-price-and-shipping,
.product-miniature .price{
  font-family:var(--hd-display)!important;font-style:italic;font-weight:500;
  font-size:24px!important;color:var(--hd-midnight)!important;letter-spacing:-.01em;
  font-variation-settings:"opsz" 60,"wght" 500
}
.product-miniature .regular-price{color:var(--hd-midnight-2)!important;text-decoration:line-through;font-size:14px;margin-right:6px}
.product-miniature .discount-percentage,
.product-miniature .discount-amount{
  background:var(--hd-terracotta)!important;color:var(--hd-white)!important;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.1em;text-transform:uppercase;
  padding:3px 8px;border-radius:999px
}
.product-flags{padding:0!important;position:absolute;top:12px;left:12px;z-index:2}
.product-flag{
  background:var(--hd-gold)!important;color:var(--hd-midnight)!important;
  font-family:var(--hd-mono)!important;font-size:10px!important;letter-spacing:.16em;text-transform:uppercase;
  padding:4px 10px!important;border-radius:999px!important;margin:0 4px 4px 0;border:0!important
}
.product-flag.new,.product-flag.online-only{background:var(--hd-midnight)!important;color:var(--hd-white)!important}
.product-flag.discount,.product-flag.on-sale{background:var(--hd-terracotta)!important;color:var(--hd-white)!important}

/* ============ CATEGORY / LISTING ============ */
#js-product-list-header h1,
.page-category h1{
  font-family:var(--hd-display)!important;font-weight:400!important;
  font-size:clamp(40px,5.5vw,72px)!important;letter-spacing:-.015em;
  text-align:center;padding:24px 0;font-variation-settings:"opsz" 60,"wght" 400;
  text-transform:none
}
#category-description,.category-description{
  font-family:var(--hd-body);font-size:15px;color:var(--hd-midnight-2);
  max-width:60ch;margin:0 auto 36px;text-align:center;line-height:1.6
}
.products-sort-order,
.products-selection,
.sort-by-row{
  font-family:var(--hd-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--hd-midnight-2)
}
.products-sort-order .select-title,
.dropdown-toggle{
  background:var(--hd-white)!important;border:1px solid var(--hd-line)!important;
  border-radius:999px!important;color:var(--hd-midnight)!important;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 16px!important
}

#search_filters,
.block-categories{
  background:var(--hd-paper)!important;border:1px solid var(--hd-line)!important;
  border-radius:8px;padding:18px;box-shadow:none!important
}
#search_filters .facet-title,
#search_filters .h6,
.block-categories .h3,
.block-categories .title-block{
  font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;
  font-size:20px!important;color:var(--hd-midnight);text-transform:none!important;
  font-variation-settings:"opsz" 60,"wght" 500;letter-spacing:-.005em;margin-bottom:10px
}
#search_filters .facet-label,
#search_filters .custom-checkbox{font-family:var(--hd-body);font-size:13px;color:var(--hd-midnight-2)}
#search_filters .facet-label:hover{color:var(--hd-terracotta)}

.pagination,nav.pagination{font-family:var(--hd-mono);font-size:12px;letter-spacing:.1em}
.pagination .current a,
.pagination li.current a,
.pagination .active a{background:var(--hd-midnight)!important;color:var(--hd-white)!important;border-color:var(--hd-midnight)!important;border-radius:999px}
.pagination a{color:var(--hd-midnight)!important;border-radius:999px}

/* ============ PRODUCT PAGE ============ */
body.page-product{
  background-color:var(--hd-white)!important;
  background-image:radial-gradient(circle at 50% 50%, #0D1B2A14 1px, transparent 1px)!important;
  background-size:24px 24px!important;
  background-attachment:fixed!important;
  background-repeat:repeat!important;
}
body.page-product .product-detail-name,
body.page-product .product-title,
body.page-product h1.h1{
  font-family:var(--hd-display)!important;font-weight:400!important;
  /* 2026-06-02 : titre réduit (était clamp 34/4vw/54px) */
  font-size:clamp(24px,2.6vw,36px)!important;line-height:1.1!important;letter-spacing:-.02em;
  font-variation-settings:"opsz" 60,"wght" 400;color:var(--hd-midnight)!important;
  text-transform:none!important
}
/* 2026-06-02 : sur les pages produit, l'orange remplacé par le VERT du logo (#8DC641).
   1) Redéfinit --hd-terracotta localement → couvre d'un coup l'onglet actif
      (.nav-tabs .nav-link.active), les survols, le badge .discount, etc.
   2) Override de l'orange Bootstrap #FD7E14 du "Derniers articles en stock".
   (Pour basculer en navy/gold : changer #8DC641 ci-dessous.) */
body.page-product{--hd-terracotta:#8DC641;}
body.page-product #product-availability.last_remaining_items,
body.page-product .product-availability.last_remaining_items,
body.page-product .product-actions .text-warning,
body.page-product .product-information .text-warning{color:#8DC641!important;}
body.page-product .current-price,
body.page-product .product-price{
  font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;
  font-size:44px!important;color:var(--hd-midnight)!important;letter-spacing:-.02em;
  font-variation-settings:"opsz" 60,"wght" 500
}
body.page-product .product-discount{margin-left:8px;font-family:var(--hd-mono);font-size:13px;color:var(--hd-midnight-2)}
body.page-product .discount{
  background:var(--hd-terracotta)!important;color:var(--hd-white)!important;
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 10px;border-radius:999px
}
body.page-product .product-information{font-family:var(--hd-body);font-size:15px;line-height:1.65;color:var(--hd-midnight-2)}
body.page-product .product-information strong,
body.page-product .product-information b{color:var(--hd-midnight);font-weight:600}
body.page-product .product-quantity{align-items:center;gap:14px}
body.page-product .add-to-cart{height:54px;padding:0 30px!important;font-size:13px!important;letter-spacing:.16em!important}
body.page-product .images-container .product-cover{
  background:#FFFFFF!important;
  border-radius:6px;border:1px solid var(--hd-line);overflow:hidden;position:relative;box-shadow:none!important
}
body.page-product .images-container .product-cover::after{
  content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 50% 50%, #0D1B2A0A 1px, transparent 1px);background-size:18px 18px;opacity:.6;pointer-events:none;z-index:0
}
body.page-product .images-container .product-cover img{position:relative;z-index:1}
body.page-product .js-thumb{background:#FFFFFF!important}
body.page-product .images-container .product-cover::before{
  content:"";position:absolute;inset:8px;border:1px solid var(--hd-gold);opacity:.35;pointer-events:none;border-radius:2px;z-index:1
}
body.page-product .images-container .product-cover img{
  mix-blend-mode:multiply;filter:drop-shadow(0 30px 60px #0D1B2A40)
}
body.page-product .product-additional-info,
body.page-product .product-info-block{
  background:var(--hd-paper)!important;border:1px solid var(--hd-line);border-radius:4px;padding:16px;font-family:var(--hd-body)
}
body.page-product .js-thumb{
  border:1px solid var(--hd-line)!important;border-radius:4px;background:var(--hd-paper-2)!important;
  overflow:hidden;padding:6px
}
body.page-product .js-thumb.selected,
body.page-product .js-thumb:hover{border-color:var(--hd-gold)!important;border-width:2px!important}
body.page-product .product-variants{font-family:var(--hd-body)}
body.page-product .product-variants .control-label,
body.page-product .product-variants > .product-variants-item label{
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;
  color:var(--hd-midnight-2);font-weight:600
}
body.page-product .product-variants .input-color{width:30px;height:30px;border-radius:50%;border:1px solid var(--hd-line)}
body.page-product .product-variants .input-color:checked + span,
body.page-product .product-variants .input-color.selected{border:2px solid var(--hd-gold)}
body.page-product .product-reference{font-family:var(--hd-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--hd-midnight-2)}

body.page-product .nav-tabs,
body.page-product .product-tabs .nav-tabs{border-bottom:1px solid var(--hd-line);background:transparent}
body.page-product .nav-tabs .nav-link,
body.page-product .nav-tabs .nav-item .nav-link{
  font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;
  color:var(--hd-midnight-2)!important;border:0!important;padding:14px 22px!important;background:transparent!important
}
body.page-product .nav-tabs .nav-link.active{
  color:var(--hd-midnight)!important;border-bottom:2px solid var(--hd-terracotta)!important;background:transparent
}

/* ============ CART / CHECKOUT ============ */
.cart-grid,#cart{background:var(--hd-white)}
.cart-summary,.cart-detailed,.cart-detailed-totals{
  background:var(--hd-paper)!important;border:1px solid var(--hd-line)!important;
  border-radius:4px;padding:22px;box-shadow:none!important
}
.cart-summary .h4,
.cart-summary h2,
.cart-summary .summary-title{
  font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;
  font-size:24px!important;text-transform:none!important;color:var(--hd-midnight);
  font-variation-settings:"opsz" 60,"wght" 500;margin-bottom:14px
}
.cart-summary .cart-summary-line{font-size:14px;color:var(--hd-midnight-2);padding:6px 0}
.cart-summary .cart-summary-line .value{color:var(--hd-midnight);font-weight:600}
.cart-summary .cart-summary-line.cart-total{
  font-family:var(--hd-display)!important;font-style:italic;font-weight:500;font-size:22px;color:var(--hd-midnight);
  border-top:1px solid var(--hd-line);padding-top:14px;margin-top:10px;
  font-variation-settings:"opsz" 60,"wght" 500
}
.cart-item{padding:16px 0;border-bottom:1px solid var(--hd-line-2)}
.cart-item .product-line-info .label{font-family:var(--hd-mono);font-size:11px;letter-spacing:.12em;color:var(--hd-midnight-2);text-transform:uppercase}
.cart-item .product-line-info .value{font-family:var(--hd-body);font-weight:600;color:var(--hd-midnight)}
.cart-item .product-line__title{font-family:var(--hd-display);font-weight:500;font-size:18px;font-variation-settings:"opsz" 60,"wght" 500}
.cart-item .product-line__price{font-family:var(--hd-display);font-style:italic;font-weight:500;font-variation-settings:"opsz" 60,"wght" 500}
.product-line-info{font-family:var(--hd-body)}

#checkout-personal-information-step,
#checkout-addresses-step,
#checkout-delivery-step,
#checkout-payment-step{
  background:var(--hd-white);border:1px solid var(--hd-line);border-radius:4px;padding:24px;margin-bottom:14px
}
.step-title{
  font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;
  font-size:22px!important;color:var(--hd-midnight);text-transform:none!important;
  font-variation-settings:"opsz" 60,"wght" 500
}
.step-number,.checkout-step .step-number{
  background:var(--hd-gold)!important;color:var(--hd-midnight)!important;
  font-family:var(--hd-mono)!important;font-weight:700!important;
  width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:12px
}

/* ============ CMS / CUSTOMER / ACCOUNT ============ */
body.page-cms,
body.page-customer-account,
body.page-my-account,
body.page-addresses,
body.page-history,
body.page-contact{background:var(--hd-white)}

body.page-cms #content,
body.page-customer-account #content,
body.page-my-account #content{
  background:var(--hd-white);max-width:900px;margin:24px auto;padding:36px;
  border:1px solid var(--hd-line);border-radius:4px;position:relative
}
body.page-cms #content::before,
body.page-customer-account #content::before,
body.page-my-account #content::before{
  content:"";position:absolute;inset:8px;border:1px solid var(--hd-gold);opacity:.3;pointer-events:none;border-radius:2px
}
body.page-cms #content p,
body.page-cms #content li{font-family:var(--hd-body);font-size:16px;line-height:1.7;color:var(--hd-midnight-2)}

.links a{color:var(--hd-midnight)!important;text-decoration:none}
.links a:hover{color:var(--hd-terracotta)!important}

/* ============ FOOTER ============ */
#footer{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important;
  padding:70px 0 30px!important;position:relative;overflow:hidden;border:0
}
#footer::after{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 20% 30%, #ffffff05 0, transparent 50%),radial-gradient(circle at 80% 70%, #ffffff05 0, transparent 50%);
  pointer-events:none
}
#footer .footer-container{background:transparent!important;color:var(--hd-white)!important;padding:0;position:relative;z-index:2}
#footer *{color:#ffffffCC}
#footer a{color:#ffffffCC!important;font-family:var(--hd-body);font-size:14px;line-height:2}
#footer a:hover{color:var(--hd-terracotta)!important}
#footer h3,
#footer .h3,
#footer .links .title,
#footer .block-contact .title,
#footer .links .h3{
  font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;
  font-size:18px!important;color:var(--hd-gold)!important;
  font-variation-settings:"opsz" 60,"wght" 500;text-transform:none!important;letter-spacing:-.005em;
  margin-bottom:18px
}
#footer .block-contact{font-family:var(--hd-body);font-size:14px;color:#ffffffCC}
#footer .block-contact .address{line-height:1.6}

#footer #footer-logo img,
#footer .logo img{max-height:36px!important;width:auto!important;height:auto!important;margin-bottom:14px}

.copyright,
#copyright_link,
#footer .copyright{
  font-family:var(--hd-mono)!important;font-size:10px!important;letter-spacing:.2em;text-transform:uppercase;
  color:#ffffff70!important;border-top:1px solid #ffffff20;padding-top:24px;margin-top:24px
}
.copyright a{color:#ffffff90!important}

/* reassurance bar (4 garanties) */
.block-reassurance{background:transparent!important}
.block-reassurance > div,.block-reassurance ul{
  background:var(--hd-white)!important;border-top:1px solid var(--hd-line);border-bottom:1px solid var(--hd-line);
  padding:24px 0!important
}
.block-reassurance li{font-family:var(--hd-body);color:var(--hd-midnight)}
.block-reassurance li .h6,
.block-reassurance li span:not(.icon){
  font-family:var(--hd-display)!important;font-style:italic;font-weight:500;font-size:15px!important;color:var(--hd-midnight)!important;
  font-variation-settings:"opsz" 60,"wght" 500
}
.block-reassurance li svg,
.block-reassurance li i{color:var(--hd-gold)!important;fill:var(--hd-gold)!important}

/* newsletter */
.block_newsletter,
.ps-emailsubscription-block{background:transparent!important;color:var(--hd-white)}
.block_newsletter input[type="email"]{
  background:transparent!important;border:1px solid #ffffff40!important;color:var(--hd-white)!important;
  border-radius:999px!important;padding:11px 18px!important
}
.block_newsletter input[type="email"]::placeholder{color:#ffffff80}
.block_newsletter button{
  background:var(--hd-gold)!important;color:var(--hd-midnight)!important;border:0!important;border-radius:999px!important;
  padding:11px 22px!important;font-family:var(--hd-mono)!important;font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;font-weight:700
}
.block_newsletter button:hover{background:var(--hd-terracotta)!important;color:var(--hd-white)!important}

.block-social ul,.block-social{padding:0;margin:0}
.block-social li a{
  width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:#ffffff10;color:#ffffffCC!important;border:1px solid #ffffff20;transition:all .2s
}
.block-social li a:hover{background:var(--hd-terracotta)!important;border-color:var(--hd-terracotta)!important;color:var(--hd-white)!important}

/* ============ HOME · ajustements compatibles ============ */
body.page-index{background:var(--hd-white)!important}
body.page-index h1,
body.page-index h2,
body.page-index h3,
body.page-index .section-title{
  font-family:var(--hd-display)!important;font-variation-settings:"opsz" 60
}
body.page-index em,body.page-index i{color:var(--hd-terracotta);font-style:italic}
body.page-index .btn-primary{background:var(--hd-midnight)!important;color:var(--hd-white)!important;border-color:var(--hd-midnight)!important}
body.page-index .btn-primary:hover{background:var(--hd-terracotta)!important;border-color:var(--hd-terracotta)!important}
body.page-index .btn-secondary{background:transparent!important;color:var(--hd-midnight)!important;border:1px solid var(--hd-midnight)!important}
body.page-index .btn-secondary:hover{background:var(--hd-midnight)!important;color:var(--hd-white)!important}

/* ============ COOKIE BANNER · non-bloquant ============ */
#gdpr_consent_modal,
.gdpr-modal,
#gdpr_consent_modal_box{
  position:fixed!important;bottom:20px!important;left:20px!important;right:auto!important;top:auto!important;
  transform:none!important;max-width:380px;width:auto!important;
  background:var(--hd-white)!important;border:1px solid var(--hd-line)!important;border-radius:8px!important;
  padding:20px!important;box-shadow:0 30px 60px -20px #0D1B2A40!important;
  z-index:9999
}
#gdpr_consent_modal::before,
.gdpr-modal::before{content:"";position:absolute;inset:4px;border:1px solid var(--hd-gold);opacity:.4;pointer-events:none;border-radius:6px}
#gdpr_consent_modal .gdpr-text,
.gdpr-modal p{font-family:var(--hd-body);font-size:13px;line-height:1.55;color:var(--hd-midnight-2)}
.gdpr-overlay,#gdpr_consent_overlay{display:none!important}

/* ============ DECORATIVE BITS ============ */
.section-ornament{display:flex;align-items:center;gap:14px;color:var(--hd-gold);font-family:var(--hd-display);font-style:italic;justify-content:center;padding:24px 0}
.section-ornament::before,.section-ornament::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--hd-gold),transparent);max-width:200px}

/* ============ ALERTS ============ */
.alert{font-family:var(--hd-body)!important;border-radius:4px!important;font-size:14px}
.alert-success{background:#E9F3EC!important;color:var(--hd-forest)!important;border:1px solid var(--hd-forest)!important}
.alert-danger{background:#F9E8E3!important;color:var(--hd-terracotta)!important;border:1px solid var(--hd-terracotta)!important}
.alert-info{background:var(--hd-paper)!important;color:var(--hd-midnight)!important;border:1px solid var(--hd-line)!important}

/* ============ RECAP panel (fiche produit) ============ */
.hd-recap{
  background:linear-gradient(135deg, var(--hd-midnight) 0%, var(--hd-midnight-2) 100%);
  color:var(--hd-white);border-radius:6px;padding:22px 24px;position:relative;overflow:hidden;
  margin:18px auto;
  width:auto!important;
  max-width:min(100%, calc(100vw - 40px))!important;
  box-sizing:border-box
}
@media (max-width:720px){
  .hd-recap{padding:18px 16px;max-width:calc(100vw - 24px)!important}
  .hd-recap-total .v{font-size:28px!important}
}
.hd-recap::before{content:"";position:absolute;inset:6px;border:1px solid var(--hd-gold);opacity:.4;border-radius:3px;pointer-events:none}
.hd-recap::after{content:"hydrodiv";position:absolute;font-family:var(--hd-display);font-style:italic;font-weight:300;font-size:18vw;line-height:.7;color:#ffffff05;right:-5%;bottom:-8vw;font-variation-settings:"opsz" 60, "wght" 300;pointer-events:none}
.hd-recap-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;position:relative}
.hd-recap-h .title{font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;font-size:20px!important;color:var(--hd-gold)!important;font-variation-settings:"opsz" 14, "wght" 500;line-height:1.2}
.hd-recap-h .ref{font-family:var(--hd-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#ffffff60}
.hd-recap-rows{display:flex;flex-direction:column;gap:10px;padding:14px 0;border-top:1px dashed #ffffff20;border-bottom:1px dashed #ffffff20;position:relative}
.hd-recap-row{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.hd-recap-row .k{font-family:var(--hd-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#ffffffB0}
.hd-recap-row .v{color:var(--hd-white)!important;font-weight:500;font-family:var(--hd-body)}
.hd-recap-row .v em{font-family:var(--hd-display);font-style:italic;color:var(--hd-gold);font-weight:500;font-variation-settings:"opsz" 14, "wght" 500;margin-right:6px}
.hd-recap-row .sw{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid #ffffff30;vertical-align:middle;margin-right:6px;background:#5B6770}
.hd-recap-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;position:relative}
.hd-recap-total .lbl{font-family:var(--hd-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#ffffffCC}
.hd-recap-total .v{font-family:var(--hd-display)!important;font-style:italic!important;font-weight:500!important;font-size:36px!important;color:var(--hd-gold)!important;letter-spacing:-.02em;line-height:1;font-variation-settings:"opsz" 60, "wght" 500}
.hd-recap-total .v .c{font-size:14px;color:var(--hd-terracotta);vertical-align:14px;margin-left:2px}
.hd-recap-foot{margin-top:10px;font-family:var(--hd-mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#ffffff70;display:flex;align-items:center;gap:8px;position:relative}
.hd-recap-foot::before{content:"";width:6px;height:6px;background:var(--hd-gold);border-radius:50%}

/* ============ HYDRODIV CUSTOM HEADER (.hd-top) — surcouche guide.css ============ */
.hd-top{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--hd-line)!important;
  backdrop-filter:blur(12px) saturate(1.1);
}
.hd-top__inner{padding:14px 24px!important}
@media (max-width:720px){.hd-top__inner{padding:10px 16px!important}}
/* 2026-05-21 : Hydrodiv logo + Epuractif logo doivent être visuellement
   équivalents. Le sélecteur [class*="logo"] embrassait les 2 et les
   forçait à 42 px ; on cible désormais explicitement chaque variante.
   2026-05-22 : rééquilibrage avec hydrodiv.com — HYDRODIV cible ~24 px
   (image 800x125, mot = 76% de la hauteur → image height = 32 px).
   Epuractif ratio préservé (36/32 sur .work originel, ici 36) car son
   fichier source contient plus de marge verticale. */
.hd-top__logo:not(.hd-top__logo--epuractif),
.hd-top img.hd-top__logo:not(.hd-top__logo--epuractif){
  max-height:32px!important;height:32px!important;width:auto!important;min-width:0
}
.hd-top__logo--epuractif,
.hd-top img.hd-top__logo--epuractif{
  max-height:36px!important;height:36px!important;width:auto!important;min-width:0
}
.hd-top.is-scrolled .hd-top__logo:not(.hd-top__logo--epuractif){
  max-height:25px!important;height:25px!important
}
.hd-top.is-scrolled .hd-top__logo--epuractif{
  max-height:28px!important;height:28px!important
}
@media (max-width:720px){
  .hd-top__logo:not(.hd-top__logo--epuractif){max-height:25px!important;height:25px!important}
  .hd-top__logo--epuractif{max-height:28px!important;height:28px!important}
  .hd-top.is-scrolled .hd-top__logo:not(.hd-top__logo--epuractif){max-height:20px!important;height:20px!important}
  .hd-top.is-scrolled .hd-top__logo--epuractif{max-height:22px!important;height:22px!important}
}
.hd-top__nav,
.hd-top__nav a{
  font-family:var(--hd-body)!important;font-size:13px!important;letter-spacing:.06em;text-transform:uppercase;
  color:var(--hd-midnight)!important;font-weight:500
}
.hd-top__nav a::after{background:var(--hd-navy)!important}
.hd-top__nav a:hover{color:var(--hd-navy)!important}
.hd-top__nav a.is-current{color:var(--hd-green-deep)!important}
.hd-top__actions a,
.hd-top__actions button,
.hd-top__icon{color:var(--hd-midnight)!important}

/* Cacher la grille .hd-catnav sur mobile pour décongestionner le header sticky de la fiche produit */
@media (max-width:720px){
  .hd-catnav,.hd-categories,.hd-top__cats,.hd-top .hd-catnav{display:none!important}
}

/* Hydrodiv-guide-page titles override */
.hd-guide-page h1,
.hd-guide-page h2,
.hd-guide-page h3,
.hd-guide-page h4,
.hd-guide-page h5,
body.has-hd-chrome h1,
body.has-hd-chrome h2,
body.has-hd-chrome h3{
  font-family:var(--hd-display)!important;
  font-variation-settings:"opsz" 60,"wght" 500;
  color:var(--hd-midnight)!important;
  font-weight:500
}

/* Product detail name — force Source Serif 4 HARDCODED + bigger size (bypass --hd-font-serif var) */
html .product-detail-name,
html h1.product-detail-name,
html .product-detail h1,
html .hd-top .product-detail-name,
html body.page-product .product-detail-name,
html body.page-product h1,
html body.page-product h1.h1,
html body.page-product .product-title,
html body.page-product h1.product-title,
html body.page-product .product-detail-primary h1,
html body .product-detail-primary h1.product-title,
html body .product-detail-primary .product-title{
  font-family:'Source Serif 4','Source Serif Pro',Georgia,serif!important;
  font-variation-settings:"opsz" 60,"wght" 400;
  font-weight:400!important;
  /* 2026-06-02 : titre produit réduit (était 54px / 42 / 28) */
  font-size:36px!important;
  line-height:1.1!important;
  text-transform:none!important;
  letter-spacing:-.02em!important
}
@media (max-width:1024px){
  html body.page-product h1.product-title,html body .product-title{font-size:32px!important}
}
@media (max-width:720px){
  html body.page-product h1.product-title,html body.page-product .product-title,html body.page-product h1{font-size:24px!important}
}

/* Generic H1/H2/H3 hardcoded fallback (in case CSS var is overridden by other CSS) */
body h1:not(.product-miniature h1):not(.featured-product h1),
body h2:not(.product-miniature h2):not(.featured-product h2),
body h3:not(.product-miniature h3):not(.featured-product h3),
body .h1,body .h2,body .h3,
body .page-title{
  font-family:'Source Serif 4','Source Serif Pro',Georgia,serif!important
}

/* Reassurance / catalogue / category-specific Fraunces overrides */
.hd-catnav__name,
.hd-product-name,
.hd-card__title{
  font-family:'Source Serif 4','Source Serif Pro',Georgia,serif!important
}

/* Body background — pointillé technique, pas de blobs (override has-hd-chrome aussi) */
html body.has-hd-chrome,
body.has-hd-chrome{
  background-color:var(--hd-white)!important;
  background-image:radial-gradient(circle at 50% 50%, #0D1B2A14 1px, transparent 1px)!important;
  background-size:24px 24px!important;
  background-attachment:fixed!important;
  background-position:0 0!important;
  background-repeat:repeat!important;
  color:var(--hd-midnight)!important
}

/* Bandeau cookies — compact en bas-droite, taille raisonnable */
body #gdpr_consent_modal,
body .gdpr-modal,
body .gdpr_consent,
body .gdpr_consent_modal,
body #cookie-consent-banner,
body .cookie-consent-banner,
body .cookie-modal,
html body #gdpr_consent_modal,
html body #cookie-consent-banner,
html body .gdpr-modal,
html body div.gdpr_consent{
  position:fixed!important;
  top:auto!important;bottom:20px!important;left:auto!important;right:20px!important;
  transform:none!important;max-width:420px!important;width:420px!important;
  height:auto!important;min-height:0!important;max-height:none!important;
  margin:0!important;
  background:var(--hd-white)!important;border:1px solid var(--hd-line)!important;border-radius:10px!important;
  padding:16px 18px!important;box-shadow:0 30px 60px -20px #0D1B2A50!important;color:var(--hd-midnight);
  display:block!important;align-items:initial!important;justify-content:initial!important
}
/* contenu cookie compact */
body #cookie-consent-banner h3,body #gdpr_consent_modal h3,body #gdpr_consent_modal .title{
  font-family:var(--hd-display)!important;font-style:italic!important;font-size:18px!important;font-weight:500!important;
  text-align:left!important;margin:0 0 6px!important;color:var(--hd-midnight)!important;line-height:1.2!important
}
body #cookie-consent-banner p,body #gdpr_consent_modal p{
  font-family:var(--hd-body)!important;font-size:11px!important;color:var(--hd-midnight-2)!important;
  line-height:1.4!important;margin:0 0 8px!important;text-align:left!important;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}
body #cookie-consent-banner .cookie-consent-options{
  display:flex!important;flex-wrap:wrap!important;gap:8px 14px!important;margin:0 0 12px!important;justify-content:flex-start!important
}
body #cookie-consent-banner .cookie-consent-options label{
  font-family:var(--hd-body)!important;font-size:11px!important;color:var(--hd-midnight-2);font-weight:500;letter-spacing:.01em;
  display:inline-flex;align-items:center;gap:4px;margin:0!important
}
body #cookie-consent-banner .cookie-consent-options label input{margin:0 4px 0 0!important}
body #cookie-consent-banner .cookie-consent-buttons{
  display:flex!important;gap:10px!important;flex-wrap:wrap!important;justify-content:flex-end!important;
  margin:14px 0 0!important;width:100%!important
}
body #cookie-consent-banner .cookie-consent-buttons button{
  font-family:var(--hd-body)!important;font-size:13px!important;letter-spacing:.04em!important;text-transform:none!important;
  font-weight:600!important;
  padding:11px 18px!important;height:auto!important;min-height:40px!important;width:auto!important;min-width:130px!important;
  border-radius:999px!important;border:1.5px solid transparent!important;cursor:pointer!important;
  pointer-events:auto!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  line-height:1.2!important;
  transition:all .2s
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-grayscale,
body #cookie-consent-banner #cookie-consent-btn-reject-all{
  background:var(--hd-white)!important;color:var(--hd-midnight-2)!important;border-color:var(--hd-line)!important
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-grayscale:hover,
body #cookie-consent-banner #cookie-consent-btn-reject-all:hover{
  background:var(--hd-paper)!important;color:var(--hd-midnight)!important;border-color:var(--hd-midnight)!important
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-outline,
body #cookie-consent-banner #cookie-consent-btn-accept-some{
  background:var(--hd-white)!important;color:var(--hd-midnight)!important;border-color:var(--hd-midnight)!important
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-outline:hover,
body #cookie-consent-banner #cookie-consent-btn-accept-some:hover{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-success,
body #cookie-consent-banner #cookie-consent-btn-accept-all{
  background:var(--hd-terracotta)!important;color:var(--hd-white)!important;border-color:var(--hd-terracotta)!important
}
body #cookie-consent-banner .cookie-consent-buttons button.btn-success:hover,
body #cookie-consent-banner #cookie-consent-btn-accept-all:hover{
  background:var(--hd-midnight)!important;color:var(--hd-white)!important;border-color:var(--hd-midnight)!important
}

@media (max-width:720px){
  html body #cookie-consent-banner,body #cookie-consent-banner{
    left:10px!important;right:10px!important;bottom:10px!important;max-width:none!important;width:auto!important;padding:14px!important
  }
  body #cookie-consent-banner h3{font-size:15px!important}
  body #cookie-consent-banner p{font-size:11px!important}
}

/* overlay sombre */
.gdpr-overlay,#gdpr_consent_overlay,.modal-backdrop.gdpr,#cookie-consent-overlay{display:none!important}
@media (max-width:720px){
  body #cookie-consent-banner,body #gdpr_consent_modal,body .gdpr-modal{
    left:12px!important;right:12px!important;bottom:12px!important;max-width:none!important;width:auto!important
  }
}

/* ============ MOBILE OVERRIDES ============ */
@media (max-width:720px){
  body{font-size:15px}
  #header .header-top > .container{padding-top:10px;padding-bottom:10px}
  .header-banner{font-size:9px!important;letter-spacing:.14em;padding:7px 12px!important}
  #_desktop_logo img,#_mobile_logo img,.logo img{max-height:32px!important}
  .btn,button.btn{padding:11px 20px!important;font-size:12px!important;letter-spacing:.1em!important}
  .page-header{padding:32px 0 18px}
  .product-miniature .product-title{font-size:17px!important}
  .product-miniature .product-price-and-shipping,.product-miniature .price{font-size:20px!important}
  body.page-product .product-detail-name,body.page-product h1.h1{font-size:28px!important}
  body.page-product .current-price,body.page-product .product-price{font-size:32px!important}
  #footer{padding:50px 0 24px!important}
  #footer h3,#footer .h3{font-size:16px!important;margin-bottom:12px}
  #js-product-list-header h1,.page-category h1{font-size:32px!important}
  .breadcrumb{font-size:10px!important;letter-spacing:.12em}
}

/* 2026-05-22 : Cormorant Garamond italic — utilisé pour l'ampersand entre HYDRODIV et EPURACTIF */
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;
  src:url(../fonts/CormorantGaramond-500-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* 2026-05-22 : angles arrondis sur les images des descriptions produit (rétabli, perdu lors de la refonte 2026-05-12) */
body.page-product .product-description img{
  border-radius:var(--hd-radius-md,16px);
  max-width:100%;
  height:auto;
}

/* maquillage Hydrodiv — masquer blocs défaut sur home */
#index section.featured-products{display:none!important;}
#index .custom-text{display:none!important;}

/* maquillage Hydrodiv — retirer sections inutiles en bas de la home (2026-05-27) */
#index #hd-products{display:none!important;}        /* section Filtroscope */
#index .hd-guide-hero{display:none!important;}       /* bloc Aide au choix (module hydrodiv) */

/* 2026-06-02 : l'override "agrandi 40px" (2026-05-27) puis "36px égal" rendaient
   HYDRODIV visuellement PLUS GROS qu'EpurActif (le wordmark HYDRODIV remplit ~91%
   de sa boîte, EpurActif ~68%). On laisse donc les proportions d'origine des
   lignes 739-757 (HYDRODIV 32/25/25/20, EpurActif 36/28/28/22, ratio ~91%) qui
   équilibrent visuellement les deux logos dans tous les états (scroll + mobile).
   → plus aucun override de taille de logo ici. */

/* 2026-06-02 : fond blanc des logos JPG rendu transparent. Le header est blanc
   (rgba 255,255,255,.94) donc mix-blend-mode:multiply efface le "carré blanc"
   du JPG et ne laisse que le contenu sombre du logo. */
.hd-top__logo{mix-blend-mode:multiply}

/* maquillage Hydrodiv — petit écart entre "sans odeurs." et le sous-titre (2026-06-02)
   .page-home p { margin-top:0 } écrasait le margin-top:30px de home.css → on le rétablit, version courte */
#index .hd-hero__lede,
.page-home .hd-hero .hd-hero__lede{margin-top:16px!important;}

/* =====================================================================
   2026-06-02 — OPTIMISATION MOBILE (layout uniquement, AUCUNE couleur touchée)
   ===================================================================== */

/* FIX 1 — Le menu nav desktop restait visible sur mobile (catalogue/produit/
   panier) et poussait les icônes hors écran → scroll horizontal de 266-290px.
   La règle coupable est home.css `.has-hd-chrome:not(.page-index) .hd-top__nav
   {display:flex!important}` (spécificité 0,4,0). On la bat avec des sélecteurs
   plus spécifiques (préfixe html + 4 classes). Le nav est desktop-only. */
@media (max-width:768px){
  html body .hd-top .hd-top__nav,
  html body:not(.page-index) .hd-top .hd-top__nav,
  html body.has-hd-chrome:not(.page-index) .hd-top .hd-top__nav{display:none!important}
}

/* FIX 2 — Galerie produit : le carrousel owl explosait à ~1100px de large sur
   mobile (product.css met les colonnes en grid avec max-width:none + min-width
   auto → la piste grandit à la largeur intrinsèque du carrousel). On force la
   colonne unique + min-width:0 + clamp 100% sous 992px. Corrige aussi le bouton
   "Ajouter au panier" qui se retrouvait à hauteur 0 dans la piste débordée. */
@media (max-width:991px){
  html body.page-product .product-detail-primary .product-container{
    grid-template-columns:1fr!important;
  }
  html body.page-product .product-detail-primary .product-images,
  html body.page-product .product-detail-primary .product-info{
    max-width:100%!important;min-width:0!important;width:auto!important;
  }
  html body.page-product .product-images #js-product-images,
  html body.page-product .product-images .owl-carousel,
  html body.page-product .product-images .owl-stage-outer{
    max-width:100%!important;overflow:hidden!important;
  }
  html body.page-product .product-images img,
  html body.page-product .product-cover img{
    max-width:100%!important;height:auto!important;
  }
}

/* FIX 3 — Pied de page : `.hd-foot__cols` est forcé en 4 colonnes par
   home.css:3462 (!important, hors media query), ce qui débordait de ~32px sur
   mobile (la ligne contact 121px ne tient pas dans une cellule de ~58px) sur
   TOUTES les pages. On repasse en 1 colonne sous 600px (= intention de
   home.css:1538, écrasée). Layout uniquement, aucune couleur. */
@media (max-width:600px){
  html body .hd-foot__cols{grid-template-columns:1fr!important;gap:20px!important}
  html body .hd-foot__contact,
  html body .hd-foot__contact a{word-break:break-word;overflow-wrap:anywhere}
}

/* FIX 4 — Débordement horizontal résiduel (~27px) sur home/catalogue dû aux
   transforms des animations .hd-reveal / au schéma. On clippe l'overflow-x du
   conteneur de contenu (overflow-x:clip garde le scroll vertical ET ne casse
   pas le sticky du .hd-top, qui est reparenté hors de #wrapper). Layout only. */
@media (max-width:768px){
  html body #wrapper,
  html body #content-wrapper,
  html body main#content,
  html body .page-home,
  html body .hd-cat-page{overflow-x:clip}
}

/* ============================================================
   FIX HEADER MOBILE — 2026-06-02
   Bugs corrigés (diagnostic agent) :
   1) Logos co-marque HYDRODIV + EpurActif écrasés ×3 par le flexbox
      (min-width:0 → flex-shrink crush, ratio 1.95 au lieu de 5.74).
      → flex-shrink:0 + object-fit:contain : ratio respecté.
      → hauteurs mobiles réduites pour que la rangée tienne dans 360-390px.
   2) Icônes d'action 54px (énormes sur mobile) → 36px : libère la place.
   3) Barre d'info sous le titre : email + "fabriqué en France" étaient
      masqués (hidden-sm) mais le 1er séparateur "·" restait orphelin →
      aspect cassé / "il manque des choses". On ré-affiche tout, wrap centré.
   Layout/proportions uniquement — aucune couleur touchée.
   2026-06-03 : breakpoint élargi 600 → 768px (toute la zone où le nav
   est masqué) pour que le header se mette à l'échelle de façon CONTINUE
   sur mobile ET tablette — plus de paliers fixes 25/28px entre 600-720.
   ============================================================ */
@media (max-width: 768px) {
  /* — Header = UN SEUL BLOC qui se met à l'échelle avec le zoom de la page.
       Tout (logos, icônes, espacements, police) est dimensionné en vw plafonné
       (clamp) : à pleine largeur (≥~430px) = tailles nominales ; dès que la page
       est zoomée (largeur effective réduite), TOUT rétrécit ensemble,
       proportionnellement, sur une seule ligne. Plus de "bug" au zoom. — */
  /* 2026-06-03 : plafonds des clamp calés sur les tailles DESKTOP atteintes
     pile à 768px (vw ≈ taille_desktop / 768) → échelle 100% continue, aucun
     saut au passage mobile→desktop. Sur smartphone (≤430px) tout reste petit. */
  .hd-top__inner {
    gap: clamp(4px, 2.4vw, 18px) !important;
    padding: clamp(7px, 1.85vw, 14px) clamp(8px, 3.1vw, 24px) !important;
    flex-wrap: nowrap !important; justify-content: center !important;
  }
  .hd-top__brands { gap: clamp(3px, 1.9vw, 14px) !important; min-width: 0 !important; flex-shrink: 1 !important; }
  .hd-top__brand  { min-width: 0 !important; flex-shrink: 1 !important; }
  .hd-top__brand-amp { font-size: clamp(.82rem, 4.2vw, 2rem) !important; padding: 0 clamp(1px, .8vw, 6px) !important; flex-shrink: 0 !important; }

  /* Logos : max-height en vw → l'échelle suit la largeur (ratio toujours conservé) */
  .hd-top__logo:not(.hd-top__logo--epuractif),
  .hd-top img.hd-top__logo:not(.hd-top__logo--epuractif) {
    height: auto !important; max-height: clamp(13px, 4.17vw, 32px) !important;
    width: auto !important; max-width: 100% !important; min-width: 0 !important;
    flex-shrink: 1 !important; object-fit: contain !important;
  }
  .hd-top__logo--epuractif,
  .hd-top img.hd-top__logo--epuractif {
    height: auto !important; max-height: clamp(13px, 4.69vw, 36px) !important;
    width: auto !important; max-width: 100% !important; min-width: 0 !important;
    flex-shrink: 1 !important; object-fit: contain !important;
  }
  .hd-top.is-scrolled .hd-top__logo:not(.hd-top__logo--epuractif) { max-height: clamp(11px, 3.26vw, 25px) !important; }
  .hd-top.is-scrolled .hd-top__logo--epuractif { max-height: clamp(11px, 3.65vw, 28px) !important; }

  /* Icônes : taille en vw → rétrécissent AVEC les logos (bloc homogène) */
  .hd-top__actions { gap: clamp(1px, .8vw, 6px) !important; flex-shrink: 0 !important; }
  .hd-icon { width: clamp(26px, 7.03vw, 54px) !important; height: clamp(26px, 7.03vw, 54px) !important; flex-shrink: 0 !important; }
  .hd-icon svg { width: clamp(14px, 3.39vw, 26px) !important; height: clamp(14px, 3.39vw, 26px) !important; }

  /* — Barre d'info : téléphone + email sur UNE ligne propre, séparateurs "·"
       masqués, et mention "fabriqué en France" cachée sur smartphone (c'est
       elle qui forçait le retour à la ligne moche) — */
  .hd-info {
    gap: 4px clamp(8px, 3vw, 16px) !important; padding: clamp(4px, 1.5vw, 7px) clamp(10px, 3vw, 24px) !important;
    font-size: clamp(.6rem, 2.1vw, .72rem) !important; flex-wrap: wrap !important;
  }
  .hd-info__item.hidden-sm { display: inline-flex !important; }
  .hd-info__item--mute.hidden-sm { display: none !important; }
  .hd-info__sep { display: none !important; }
}
