/* style.css : Squelette & utilitaires
   Réorganisation : variables regroupées dans :root, media queries en bas.
*/

/*======================================================================
  Variables
======================================================================*/
:root {
  --color-primary:#04a64a;
  --color-primary-rgb:4 166 74;
  --color-primary-dark:#005d32;
  --color-primary-light:#eff6ee;
  --color-bg:#ffffff;
  --color-text:#1d1f1e;
  --color-text-light:#ffffff;
  --color-border:#e9f3e9;
  --color-placeholder:#6f736f;
  --cat-sante:#ef7c00;
  --cat-micronutrition:#0075be;
  --cat-gemmotherapie:#005d32;
  --cat-aromatherapie:#04a64a;
  --cat-phytotherapie:#a2c516;
  --cat-infusions:#8b331b;
  --cat-sante-light:#fdf2e6;
  --cat-micronutrition-light:#e9eef9;
  --cat-gemmotherapie-light:#e5eeea;
  --cat-aromatherapie-light:#e9f3e9;
  --cat-phytotherapie-light:#f4f6e3;
  --cat-infusions-light:#f5e9e3;

  /* Pack implantation colors */
  --pi-line-color:#005d32;
  --pi-phone-color:#04a64a; /* matches --color-primary */
  --pi-hours-color:#000000;

  --radius-xs:3px;
  --radius-s:6px;
  --radius-m:10px;

  --shadow-sm:0 2px 4px rgba(0,0,0,.06);
  --shadow-md:0 4px 12px rgba(0,0,0,.12);

  --font-size:15px;
  --font-base:Arial, system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;

  --transition:150ms ease;
  --container-max:1280px;

  --space-2xs:.25rem;
  --space-xs:.5rem;
  --space-s:.75rem;
  --space-m:1rem;
  --space-l:1.5rem;
  --space-xl:2rem;
  --space-2xl:80px;

  --line-max:68ch;
}

.fav-btn .icon-heart path {
  fill: #ef7c00;
}

.fav-btn.is-active .icon-heart path {
  fill: #ef7c00;
  stroke: #ef7c00;
}

/*======================================================================
  Reset / Base
======================================================================*/
*{box-sizing:border-box;}
html{font-size:16px;}
body{
  margin:0;
  font-family:var(--font-base);
  font-size:var(--font-size);
  line-height:1.5;
  color:var(--color-text);
  background:var(--color-bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block;}
h1,h2,h3,h4{line-height:1.15;margin:0 0 var(--space-m);}
p{margin:0 0 var(--space-m);}
ul{margin:0;padding:0;list-style:none;}
input,button,select,textarea{font:inherit;}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;}
[hidden]{display:none !important;}
.bg-primary a{color:#fff;}
.d-flex{display:flex;}
.align-center{align-items:center;}
.justify-center{justify-content:center;}
.gap-sm, .gap-8{gap:10px;}
.green{color:var(--color-primary)!important;}
.no-underline{text-decoration:none;}
.m-top-sm{margin-top:var(--space-s)!important;}
.color-primary{color:var(--color-primary);}
.my-auto{
  margin-left:auto;
  margin-right:auto;
}
.uv-feature-h3.mb-4.solutions-title + .uv-feature-grid{margin-top:40px;}

p a, .faq-item a{color:var(--color-primary);}
/*======================================================================
  Layout Helpers & Utilities
======================================================================*/
.container{
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  /*padding-inline:var(--space-m);*/
}
.container-960{
  width:100%;
  max-width:960px;
  margin-inline:auto;
  /*padding-inline:var(--space-m);*/
}
.full-bleed{width:100%;}
.section.uv-hero{
  padding:var(--space-xl) 0 calc(var(--space-xl)*2);
}
.section.uv-feature, section.partners-section, section.blog-section, 
section.near-office-section, section.home-besoins-section, section.home-sliders-section,
section.fp-section-mea{
  padding:calc(var(--space-xl)*2) 0 calc(var(--space-xl)*2) 0;
}
.section.uv-feature h3.solutions-title{
  margin-bottom:calc(var(--space-xl)*2);
}
.section.no-bg{background:white!important;}
.section.no-padding{padding:0;}
.section.no-padding-top{padding-top:0;}
.flex{display:flex;}
.center-y{align-items:center;}
.center-x{justify-content:center;}
.between{justify-content:space-between;}
.wrap{flex-wrap:wrap;}
.grow{flex:1;}
.gap-xs{gap:var(--space-xs);}
.gap-s{gap:var(--space-s);}
.gap-m{gap:var(--space-m);}
.text-center{text-align:center;}
.text-left{text-align:left!important;}
.text-on-primary{color:var(--color-text-light);}
.small{font-size:.8125rem;}
.link-underline{text-decoration:underline;text-underline-offset:2px;}
.u-mb-0{margin-bottom:0;}
.u-mb-xs{margin-bottom:var(--space-xs);}
.u-mb-s{margin-bottom:var(--space-s);}
.u-mb-m{margin-bottom:var(--space-m);}
.bg-primary{background:var(--color-primary);}
.bg-primary-gradient{background:linear-gradient(180deg, var(--color-primary) 60%, #03853b 100%);}
.bg-secondary{background:var(--cat-sante);}
.bg-light{background:var(--color-primary-light);}
.font-normal{font-weight:400!important;}
/* Alternance sections auto (peut être retiré si besoin) */
.section:nth-of-type(even):not(.bg-primary):not(.bg-light):not(.bg-none){
  background:var(--color-primary-light);
}
.display-none{display:none!important;}

.notif-bar{top:135px!important;}

  .filters-advanced-toggle,
  .sep-dash{
    display:none;
  }
/*======================================================================
  Buttons
======================================================================*/
.btn{
  --btn-bg:#f3f5f3;
  --btn-color:var(--color-text);
  --btn-border:var(--color-border);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5ch;
  padding:.25rem 1.5rem;;
  font-weight:600;
  font-size:1.15rem;
  text-decoration:none;
  border:1px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-color);
  cursor:pointer;
  transition:var(--transition);
  border-radius: 999px;
}
.btn:hover{filter:brightness(.95);}
.btn:active{transform:translateY(1px);}
.btn-primary{
  --btn-bg:var(--color-primary);
  --btn-color:#fff;
  --btn-border:var(--color-primary);
}
section .btn-primary{
  --btn-bg:var(--cat-color, var(--color-primary));
  --btn-color:#fff;
  --btn-border:var(--cat-color, var(--color-primary));
}
.btn-primary.btn-inverse{
  --btn-bg:transparent;
  --btn-color:var(--color-primary);
  --btn-border:var(--color-primary);
}
.btn-primary.btn-white{
  --btn-bg:#fff;
  --btn-color:var(--color-primary);
  --btn-border:#fff;
}
.btn-primary.btn-white:hover{
  --btn-bg:transparent;
  --btn-color:#fff;
  --btn-border:#fff;
}

.btn-primary.btn-white-plain{
  --btn-bg:#fff;
  --btn-color:var(--color-primary);
  --btn-border:var(--color-primary);
}
.btn-primary.btn-white-plain:hover{
  --btn-bg:#e9f3e9;
  --btn-color:var(--color-primary);
  --btn-border:var(--color-primary);
}
.btn-small{font-size:15px!important;}
.btn-outline{
  --btn-bg:transparent;
  --btn-color:var(--color-primary);
  --btn-border:var(--color-primary);
}
.btn-white{
  --btn-bg:#fff;
  --btn-color:var(--color-primary);
  --btn-border:#fff;
}
.btn-slim{
  padding:.25rem 1.5rem;;
  font-size:calc(15/14 * var(--font-size));
  color:#fff;
}
.btn-large{
  padding:.5rem 1.5rem;;
  font-size:calc(15/14 * var(--font-size));
  color:#fff;
}

/*======================================================================
  FAQ Navigation (cats)
  Matches customer menu: grey text, green hover, left indicator bar
======================================================================*/
.faq-cats{margin:0 0 var(--space-m);}
.faq-cats{position:relative}
.faq-cats ul{display:flex;flex-direction:column;gap:8px}
.faq-cats a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:6px;text-decoration:none;color:#9d9d9c;border:none;font-family:Arial, Helvetica, sans-serif;font-weight:bold;font-size:18px;position:relative;}
.faq-cats a:hover{color:var(--color-primary)}
.faq-cats a.is-active{color:var(--color-primary);background:#fff}
.faq-cats a.is-active::before{content:"";position:absolute;left:0;top:0;height:100%;width:4px;background:var(--color-primary);border-radius:4px}

/* Animated indicator bar like customer menu */
.faq-cats .faq-indicator{position:absolute;left:0;top:0;width:4px;background:var(--color-primary);border-radius:0;transform:translateY(0);transition:transform 200ms ease, height 200ms ease, opacity 150ms ease;opacity:0}
.faq-cats.has-indicator .faq-indicator{opacity:1}
.faq-cats.has-indicator a.is-active::before{display:none}

/*======================================================================
  FAQ Q&A styles
======================================================================*/
.faq-qa{width:100%;}
.faq-qa h3 h3{ text-align:left!important; }
.cat-left section h3:not(.blog-title){ text-align:left; }
.cat-left section h2, .cat-partenaires section h2{
    font-size: 35px;
    margin: 0 0 var(--font-size);
    font-weight: 700;
    color: var(--cat-aromatherapie);
}
.faq-item{ border-top:1px solid #c6c6c6; padding:20px 0; }
.faq-item summary{ cursor:pointer; display:flex; align-items:center; gap:10px; color:#005d32; font-size:20px; font-weight:700; text-align:left; list-style:none; }
.faq-item summary::after{ content:""; margin-left:auto; width:22px; height:22px; background-image:url('/assets/img/Fleche_bas_PICTO.svg'); background-repeat:no-repeat; background-position:center; background-size:22px 22px; }
.faq-item[open] summary::after{ background-image:url('/assets/img/Fleche_haut_PICTO.svg'); }
/* Hide native summary marker */
details > summary{ list-style:none; }
summary::-webkit-details-marker{ display:none; }
.faq-a{ font-size:16px; color:#000; font-weight:400; text-align:left; padding:20px 0 0 0; }

/* Spacing between category blocks when showing all */
.faq-qa.is-all .faq-cat-block:not(:first-child){ padding-top:20px; }
.faq-cat-block h3{text-align:left!important;}

/* Add bottom border to last question in each category */
.faq-cat-block .faq-item:last-of-type{ border-bottom:1px solid #c6c6c6; padding-bottom:20px; }

.btn-orange{
  --btn-bg:#ef7c00;
  --btn-border:#ef7c00;
  --btn-color:#fff;
  background:var(--btn-bg);
  border:1px solid var(--btn-border);
  color:var(--btn-color);
}
.btn-orange:hover{filter:brightness(.95);}
.btn-orange:active{transform:translateY(1px);}
.btn.no-round{border-radius:0;}
.btn.pad-side{padding-inline:var(--space-xs);}
.btn.uppercase{text-transform:uppercase;}
.btn.white{color:#fff !important;}
.back-to-top{position:fixed;right:16px;bottom:16px;width:48px;height:48px;border-radius:999px;border:none;display:flex;align-items:center;justify-content:center;background:var(--color-primary);color:#fff;box-shadow:var(--shadow-md);cursor:pointer;z-index:13000;transition:opacity 150ms ease, transform 150ms ease}
.back-to-top:hover{transform:translateY(-2px)}
.back-to-top[hidden]{display:none!important}
/*======================================================================
  Top bar
======================================================================*/
.top-bar{min-height:35px;font-size:.8125rem;}
.top-bar__msg{margin:0;font-weight:500;display:flex;    align-items: center;
    gap: 10px;}
.top-bar a{color:inherit;text-decoration:none;font-weight:500;}
.sep{opacity:.4;}

/*======================================================================
  Header / Navigation / Drawer
======================================================================*/
.site-header{
  background:#fff;
  border-bottom:1px solid var(--color-border);
  position:relative;
  z-index:10;
}
.icons-cluster, .nav-toggle{display:none;}

/* Header nav items (buttons and anchors share the same class) */
.nav-list .nav-root{font-weight:600; position:relative; background:none; border:0; cursor:pointer; padding:.25rem .75rem; color:inherit; text-decoration:none}
.nav-list .nav-root::after{content:""; position:absolute; left:0; right:0; bottom: calc(-2px - var(--underline-shift, 0px)); height:3px; background: var(--color-primary);}
.nav-list .nav-root.produits{background:var(--color-primary);color:#fff!important;border-radius:0;padding:5px 1em;}
.nav-list .nav-root.produits:hover{background:var(--color-primary-dark);}

/* Fixed header behavior */
.top-bar.is-fixed{position:fixed;top:0;left:0;right:0;z-index:3}
.site-header.is-fixed{position:fixed;left:0;right:0;z-index:1099;top:var(--fixed-header-top, 35px)}
/* Raise header above top-bar when search suggest is open */
.site-header.suggest-open{z-index:13001 !important}
body.has-fixed-header{padding-top:var(--fixed-header-offset, 120px)}
.notif-bar{z-index:2!important;}
.fiche-produit-page .top-bar{z-index:5!important;}

.icon-btn{position:relative; display:inline-flex; align-items:center; justify-content:center}
.icon-btn img{display:block}
.cart-badge{position:absolute; top:-2px; right:-2px; min-width:18px; height:18px; padding:0 0; border-radius:999px; background:transparent; color:#fff; font-size:11px; font-weight:700; line-height:18px; text-align:center; box-shadow:none;display:block;}

/* Force header inline SVG icons (loupe, panier, compte) to primary green when using stroke="currentColor" */
.search-bar__icon, .user-icons .icon-btn { color: var(--color-primary); }

/*======================================================================
  Toast notifications
======================================================================*/
.toast-wrap{position:fixed;top:8px;right:max(8px, calc((100vw - var(--container-max)) / 2));z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.toast{pointer-events:auto;min-width:300px;max-width:420px;width:var(--toast-width, auto);background:#fff;border:1px solid #e5e7eb;border-radius:var(--toast-radius, 10px);box-shadow:var(--shadow-md);padding:10px 12px;display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(-8px);animation:toast-in .2s ease forwards}
.toast + .toast{animation-delay:.05s}
.toast-head{display:flex;align-items:center;gap:10px}
.toast-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;font-size:12px;font-weight:700;color:#fff}
.toast-icon.add{background: var(--color-primary)}
.toast-icon.fav{background: #ef7c00}
.toast-icon.remove{background: #e9e9e9;color:#666}
.toast-title.add{color: var(--color-primary)}
.toast-title.fav{color: #ef7c00}
.toast-title.remove{color: #9d9d9c}
.toast-close{margin-left:auto;background:none;border:0;cursor:pointer;font-size:16px;line-height:1;color:#666}
.toast-body{display:flex;align-items:center;gap:10px;}
.toast-thumb{width:48px;height:48px;overflow:hidden;flex:0 0 auto;background:#f3f4f6;border:1px solid #eef0f2;display:flex;align-items:center;justify-content:center}
.toast-name{margin:0;font-size:14px;font-weight:700;}
.toast-thumb img{width:100%;height:100%;object-fit:cover}
.toast-content{flex:1 1 auto}
.toast-title{margin:0 0 2px 0;font-size:.93rem}
.toast-sub{margin:0;color:#475569;font-size:.875rem;line-height:1.3}
.toast-close{background:transparent;border:0;color:#64748b;cursor:pointer;line-height:1;padding:4px;flex:0 0 auto}
.toast-close:hover{color:#111827}

/*======================================================================
  Utilities (spacing, sizing, typography, display)
  Note: additive only; do not remove existing utilities.
======================================================================*/
/* Spacing */
.pt-0{padding-top:0 !important}
.pb-0{padding-bottom:0 !important}
.p-12{padding:12px !important}
.px-12{padding-left:12px !important; padding-right:12px !important}
.py-8{padding-top:8px !important; padding-bottom:8px !important}
.mt-s{margin-top:var(--space-s) !important}
.mt-m{margin-top:var(--space-m) !important}
.mt-24{margin-top:24px !important}
.mb-8{margin-bottom:8px !important}
.mb-12{margin-bottom:var(--font-size) !important}
.m-0{margin:0 !important}
.my-6{margin-top:6px !important; margin-bottom:6px !important}
.ml-auto{margin-left:auto !important}
/* Gaps */
.gap-10{gap:10px !important}
/* Display helpers */
.flex{display:flex !important}
.center-y{align-items:center !important}
.between{justify-content:space-between !important}
/* Typography */
.fs-13{font-size:13px !important}
.fs-90{font-size:.9rem !important}
.fw-800{font-weight:700 !important}
.text-555{color:#555 !important}
/* Sizing / color */
.min-h-250{min-height:250px !important}
.bg-danger{background:#FF4456 !important; color:#fff}

/*======================================================================
  Header small tweaks
======================================================================*/
.user-icons{display:flex;gap:10px;align-items:baseline;padding-top:25px}
.user-icons .icon-btn svg{display:block}
.nav-list .nav-root.nav-root--connected{color:var(--color-primary)}


/* fiche produit styles are now in assets/css/fiche_produit.css */

/*======================================================================
  Slider widget generic (moved from inline styles in pages)
======================================================================*/
.slider-widget .dyn-slider-viewport{overflow:hidden;position:relative}
.slider-widget .dyn-slider-track{display:flex;gap:1rem;transition:transform .4s}
.slider-widget .dyn-nav{background:#fff;border:1px solid #e2e8f0;padding:.4rem .6rem;border-radius:4px;margin:.5rem .25rem;font-size:14px;cursor:pointer}
.slider-widget .dyn-dots{display:flex;gap:.35rem;margin-top:.5rem}
.slider-widget .dyn-dots button{width:8px;height:8px;border-radius:50%;background:#cbd5e1;border:0}
.slider-widget .dyn-dots button.is-active{background:#FF4456}
.p-badge{display:inline-block;background:#FF4456;color:#fff;padding:2px 6px;border-radius:12px;font-size:12px;margin-top:4px}
@keyframes toast-in{to{opacity:1;transform:translateY(0)}}
@keyframes toast-out{to{opacity:0;transform:translateY(-8px)}}
.header-grid{
  display:flex;
  align-items:center;
  gap:var(--space-xl);
  min-height:100px;
  position:relative;
}
.logo{
  flex:0 0 auto;
  font-size:1.4rem;
  font-weight:700;
  color:var(--color-primary);
  text-decoration:none;
  display:inline-block;
  position:absolute;
  top:0;
}
.logo img{width:100px;height:auto;display:block;}
.nav-middle{
  flex:0 1 auto;
  width:auto;
  min-width:0;
  display:inline-flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--space-s);
  margin-left:150px;
  height: auto;
  justify-content: center;
}
.search-bar{
  --icon-size:16px;
  position:relative;
  display:flex;
  align-items:center;
  gap:var(--space-xs);
  padding:.25rem 0 .35rem;
  margin:0;
  width:100%;
  max-width:100%;
  border:0;
  border-bottom:2px solid var(--color-primary);
  border-radius:0;
  background:transparent;
  color:var(--color-primary);
  font-size:var(--font-size);
  line-height:1.2;
}
.search-bar__icon{
  display:inline-flex;
  width:var(--icon-size);
  height:var(--icon-size);
  flex:0 0 var(--icon-size);
  color:var(--color-primary);
}
.search-bar input{
  flex:1;
  min-width:0;
  border:0;
  padding:0;
  font:inherit;
  background:transparent;
  color:var(--color-text);
  outline:0;
}
.search-bar input::placeholder{
  color:var(--color-placeholder);
  opacity:1;
  font-size:var(--font-size);
}
.search-bar button{display:none;}

.nav-list{
  display:flex;
  gap:var(--space-m);
  font-weight:500;
  flex-wrap:nowrap;
}
section h3:not(.blog-title) { font-size:25px; text-align:center; margin:0 0 var(--font-size); font-weight:700; color:var(--color-primary,#005d32); }
.filters:not(.cart-summary) h3 { font-size:15px!important; text-align:left!important; margin:0 0 var(--font-size); font-weight:700; color:var(--color-primary,#005d32); }
.default-page section:not(.footer-nav-section)  h2:not(.blog-title), .cat-webinaires section h2:not(.blog-title) { font-size:35px; margin:0 0 var(--font-size); font-weight:700; color:var(--color-primary,#005d32); }
.default-page section:not(.footer-nav-section)  h3:not(.blog-title) { font-size:25px; margin:0 0 var(--font-size); font-weight:700; color:var(--color-primary,#005d32); }
.default-page section:not(.footer-nav-section) h4:not(.blog-title) { font-size:20px; margin:0 0 var(--font-size); font-weight:700; color:var(--color-primary,#005d32); }
.citation h3{color:var(--color-primary-dark)!important;}
.univers-page section:not(.footer-nav-section)  h2 { font-size:35px; margin:0 0 var(--font-size); font-weight:700; color:var(--cat-color,#005d32); }
.univers-page section:not(.footer-nav-section)  h3 { font-size:25px; margin:0 0 var(--font-size); font-weight:700; color:var(--cat-color,#005d32); text-align: left;}
h5 { font-size:25px; margin:0 0 var(--font-size); font-weight:700; color:var(--cat-color,#005d32); text-align:center; }
.univers-page section:not(.footer-nav-section)  p:not(.uv-h1-sub) { margin:0; }
.univers-page section:not(.footer-nav-section)  .uv-feature p{ margin:0 0 1rem 0;}
.uv-feature.uv-invert .uv-feature-flex { flex-direction:row-reverse; }
section h3.solutions-title{margin:0;}
/*======================================================================
  Contact Form Choices (radio groups)
======================================================================*/
.contact-grid{margin-bottom:40px;}
.contact-radio-group{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.4rem}
.contact-radio{display:flex;align-items:center;gap:.4rem;position:relative}
.contact-radio input{position:absolute;opacity:0;pointer-events:none}
.contact-radio span{position:relative;display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .75rem;border:1px solid #9d9d9c;color:#9d9d9c;border-radius:4px;transition:var(--transition)}
.contact-radio input:checked + span{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
.contact-radio input:checked + span::before{content:"✓";display:inline-block;color:#fff;font-weight:700}
.contact-note{margin:.5rem 0;font-size:.9rem}
.contact-note.primary{color:var(--color-primary)}
.contact-consent{color:#9d9d9c}

.contact-info-col{
  display:flex;
  flex-direction:column;
  gap:25px;
}
.contact-info-col h4{
  font-size:20px;
  color:var(--color-primary-dark);
}
/* This Month section styles */
.this-month h4, .cat-offres .section h4{font-size:25px;font-weight:700;color:#005d32;line-height:1.25;text-align:center;margin:0;}
.pi-label{font-size:18px;font-weight:700;color:#000;text-align:center;line-height:1;margin-top:15px;}
.tm-items{gap:50px;}
.tm-item{max-width:225px;}
.this-month .tm-file-card{box-sizing:border-box;border:1px solid transparent;padding:2px;transition:border-color .15s ease;}
.this-month .tm-file-card:hover{border-color:var(--color-primary);}
.this-month .tm-file-item{position:relative;display:flex;align-items:center;justify-content:center;width:100%;}
.this-month .tm-link,.this-month .tm-placeholder{display:flex;align-items:center;justify-content:center;width:100%;}
.this-month .tm-link img{display:block;width:200px;height:auto;object-fit:cover;background:#fff;border:1px solid #e2e8f0;}
.this-month .tm-placeholder{width:125px;min-height:176px;color:#9aa3a8;font-weight:600;font-size:14px;background:linear-gradient(135deg,#ffffff,#f3f7f3);border:1px solid #e2e8f0;}
.this-month .tm-file-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;pointer-events:none;}
.this-month .tm-file-card:hover .tm-file-overlay{opacity:1;pointer-events:auto;}
.this-month .tm-ov-bg{position:absolute;inset:0;background:rgba(255,255,255,.5);}
.this-month .tm-ov-actions{position:relative;display:flex;gap:0;z-index:1;}
.this-month .tm-ov-actions a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;transition:transform .15s ease;}
.this-month .tm-ov-actions a:hover{transform:translateY(-2px);}
.this-month .tm-ov-actions img{max-width:35px;max-height:35px;background:none !important;border:0 !important;width:auto;height:auto;}
.tm-items, .tm-actions{margin-top:50px}

/* Access blocks (Pharmacien / Particulier) */
.access-blocks .ab-grid{display:flex;gap:50px;justify-content:center;align-items:stretch}
.access-blocks .ab-card{background:var(--cat-aromatherapie-light, var(--color-primary-light));padding:40px;text-align:center;border-radius:var(--radius-m);flex:0 1 420px;box-shadow:var(--shadow-sm)}
.access-blocks .ab-card h3{margin-bottom:12px}
.access-blocks .ab-card p{font-size:18px}
.access-blocks .ab-actions{display:flex;flex-direction:column;gap:10px;align-items:center}
.access-blocks .ab-or{color:var(--color-primary-dark);font-weight:700;margin:6px 0}
.access-blocks .ab-links{list-style:none;margin:10px 0 0 0;padding:0;display:flex;flex-direction:column;gap:6px;align-items:center}
.access-blocks .ab-links a{text-decoration:underline;color:var(--color-primary);font-weight:bold;font-size:18px}
.access-blocks .ab-links a:hover{text-decoration:underline}
.access-blocks .ab-image{margin-top:50px;    justify-items: center;}
.institution-partners .ip-grid{display:flex;justify-content:center;align-items:flex-start;gap:50px;margin-top:50px}
.institution-partners .ip-card{text-align:center;max-width:290px}
.institution-partners .ip-img img{width:100%;height:190px;object-fit:cover;display:block;}
.institution-partners .ip-logo{background:#fff;display:flex;justify-content:center;align-items:center;margin-top:0;height:100px;}
.institution-partners .ip-logo img{max-width:200px;height:auto;display:block}
.institution-partners .ip-text{margin-top:25px;text-align:left}
.institution-partners .ip-text h4{color:var(--color-primary-dark);font-size:25px;font-weight:700;}
.institution-partners .ip-text p{color:#000;font-size:14px;}
.partenaires-page .uv-feature-text-inner h2{font-size:35px;font-weight:700;color:var(--color-primary);line-height:1;margin:0 0 25px 0;}
.uv-feature-text-inner h5{font-size:25px;text-align:center;}
.cat-partenaires .uv-feature-text-inner h5{text-align:left!important;}
/* Quote highlight */
.quote-highlight .qh-quote{text-align:center}
.quote-highlight .qh-text{font-weight:700;font-size:2em;line-height:1.25;color:var(--color-primary);font-family:var(--font-base)}
.quote-highlight .qh-author{font-weight:400;font-size:18px;color:var(--color-primary);font-family:var(--font-base)}
.nav-list a{
  text-decoration:none;
  color:var(--color-text);
  position:relative;
  padding:.25rem 0;
}
.nav-list a:after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  height:2px;
  width:0;
  background:var(--color-primary);
  transition:width var(--transition);
}
.nav-list a:hover:after{width:100%;}
.header-cta{
  flex:0 0 auto;
  margin-left:auto;
  white-space:nowrap;
  text-align:right;
}
.header-cta p{
  display:inline-flex;
  color:var(--color-primary);
  font-weight:bold;
}
.header-cta .btn{white-space:nowrap;}
.drawer{
  background:#fff;
  border-bottom:1px solid var(--color-border);
  padding:var(--space-m);
  display:grid;
  gap:var(--space-m);
}

/* Header popin (connected only) */
.header-popin{ position:fixed; z-index:1200; top:calc(var(--fixed-header-offset, 120px)); /* right set dynamically via JS to align with .container .header-grid */ }
.header-popin-tab{ border:none; background:#fff; padding:0 8px; width:auto; height:20px; display:flex; align-items:center; justify-content:center; border-radius:0 0 10px 10px; box-shadow:0 2px 8px rgba(0,0,0,.15); cursor:pointer; gap:4px; }
.header-popin-tab img{ display:block; width:15px; height:7px; }
.header-popin-box{ width:320px; /* auto height */ background:#fff; box-shadow:0 8px 24px rgba(0,0,0,.18); border-radius:0 0 5px 5px; overflow:hidden; position:absolute; right:0; }
.header-popin[aria-expanded="true"] .header-popin-tab{ display:none; }
.header-popin .popin-head{ display:flex; align-items:center; justify-content:space-between; padding:8px 12px 6px; }
.header-popin .popin-greet{ margin:0; font-weight:normal; font-family:Arial, sans-serif; font-size:14px; }
.header-popin .popin-close{ background:none; border:none; padding:4px; cursor:pointer; }
.header-popin .popin-body{ padding:10px 12px; }
.header-popin .popin-row{ display:flex; align-items:center; justify-content:space-between; font-size:14px; margin-bottom:6px; }
.header-popin .popin-progress{ --p:0%; background:#f2f2f2; height:8px; border-radius:4px; overflow:hidden; position:relative; }
.header-popin .popin-progress > span{ display:block; height:100%; width:var(--p); background:#2a7d2e; }
.header-popin .popin-cart-btn{ display:inline-flex; align-items:center; gap:5px; margin:8px 0 15px 0; padding:5px 10px; background:#fff; color:var(--color-primary); font-family:Arial, sans-serif; font-size:14px; font-weight:bold; border:2px solid var(--color-primary); border-radius:50px; text-decoration:none; transition:background .15s ease, color .15s ease, border-color .15s ease; float:right; }
.header-popin .popin-cart-btn:hover span{ text-decoration:underline; }
.popin-reload-btn{ display:flex; width:100%; align-items:center; gap:5px; background:var(--color-primary); color:#fff; text-decoration:none; font-weight:bold; font-family:Arial, sans-serif; font-size:14px; padding:5px 10px; border-radius:50px; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.15); transition:background .15s ease, color .15s ease, border-color .15s ease; border:2px solid var(--color-primary); }
.popin-reload-btn img{ width:20px; height:20px; display:block; }
.popin-reload-btn:hover span{ text-decoration:underline; }
.header-popin .popin-labels{ margin-top:6px; }
.header-popin .popin-franco{ color:var(--color-primary); font-weight:bold; font-family:Arial, sans-serif; font-size:14px; }
.header-popin .popin-franco sup{ font-size:.8em; line-height:0; }
.header-popin .popin-total{ display:flex; align-items:baseline; gap:8px; }
.header-popin .popin-total-text{ font-family:Arial, sans-serif; font-weight:normal; color:#111; font-size:14px; }
.header-popin .popin-total-value{ font-family:Arial, sans-serif; font-weight:bold; color:#111; font-size:20px; }
.header-popin .popin-total-value .pt-sup{ font-size:.6em; line-height:0; }
.drawer .nav-list.vertical{
  flex-direction:column;
  gap:var(--space-s);
}
.drawer{display:none;}
.drawer.is-open{display:grid;}

/*======================================================================
  Hero
======================================================================*/
.hero{
  background: url('../img/banner_bg.png') center/cover no-repeat;
  position: relative;
  min-height:720px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero__track{ position:static; width:100%; height:100%; display:block; }

.hero__slide{ display:none; /* was display:grid */
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  align-items:center;
  gap:var(--space-2xl);
  animation:fade .6s;
}
.hero__slide.is-active{ display:grid; }
@keyframes fade{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
.hero__content{max-width:480px;}
.hero__media .media-placeholder{
  background:#dfeee3;
  aspect-ratio:4/3;
  border-radius:var(--radius-m);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  color:var(--color-primary);
  font-size:1.2rem;
}
.hero__nav{
  position:absolute;
  top:50%;
  translate:0 -50%;
  background:transparent;
  border:0;
  width:20px;
  height:38px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero__nav img{ display:block; width:20px; height:38px; max-width:none; }
.hero__nav--prev{left:clamp(0px,(100vw - var(--container-max))/2 - 60px,40px);}
.hero__nav--next{right:clamp(0px,(100vw - var(--container-max))/2 - 60px,40px);}
.hero__dots{
  position:absolute;
  bottom:var(--space-l);
  left:50%;
  translate:-50% 0;
  display:flex;
  gap:.5rem;
}
.hero__dots button{
  width:12px;height:12px;
  border-radius:50%;
  border:0;
  background:rgba(255,255,255,.5);
  cursor:pointer;
  transition:var(--transition);
}
.hero__dots button.is-active,
.hero__dots button:hover{background:#fff;scale:1.15;}
.hero > .label-nouveau{ position:absolute; top:0; right:0; z-index:2; background:transparent; width:180px; }
.hero > .label-nouveau img{ display:block; width:100%; height:auto; }
/* Hide per-slide label elements; overlay is managed globally to prevent jank */
.hero__slide .label-nouveau{ display:none !important; }
.hero__grid{ display:flex; align-items:center; gap:24px; }
.hero__col--visual{ flex:0 0 75%; }
.hero__col--cta{ flex:0 0 25%; display:flex; flex-direction:column; align-items:center; gap:12px; }
.hero__visual{
  max-width: 100%;
  height: auto;
  display: block;
}
.hero__headline{
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  line-height: 1.2;
  margin: 0;
  color: #005d32;
      text-align: center;
}
@media (max-width: 900px){
  .hero__grid{ flex-direction: column; align-items: stretch; }
  .hero__col--visual, .hero__col--cta{ flex: 1 1 100%; }
  .hero__slide{ padding: 24px 0; }
}
/*======================================================================
  Categories (petits blocs)
======================================================================*/
.cat-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
}
.cat-block{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:1rem;
  font-weight:600;
  text-decoration:none;
  color:#fff;
  line-height:1;
  font-size:1rem;
  background:#ccc;
  transition:var(--transition);
}
.cat-block:hover{filter:brightness(.95);}
.cat--sante{background:#ef7c00;}
.cat--micro{background:#0075be;}
.cat--aroma{background:#04a64a;}
.cat--gemmo{background:#005d32;}
.cat--phyto{background:#a2c516;}
.cat--infusions{background:#8b331b;}

/*======================================================================
  USP (valeurs)
======================================================================*/
.usp-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--space-m);
  margin:0;
}
.usp-item{
  text-align:center;
  padding:80px 0;
  font-size:calc(25/14 * var(--font-size));
  font-weight:600;
  line-height:1.2;
  color:var(--color-primary);
}

/*======================================================================
  Solutions (produits / sliders)
======================================================================*/
.solutions-title{
  color:var(--color-primary);
  font-size:calc(35/14 * var(--font-size))!important;
  margin:var(--space-l) auto;
  line-height:1.15;
}
.univers-page h2.solutions-title{margin:50px 0 0 0; color:var(--cat-color,#005d32);}
.univers-page .uv-btn-cat{
  margin-top:40px;
}
.ps-tabs{
  display:flex;
  justify-content:center;
  gap:var(--space-xl);
  margin:0 0 var(--space-l);
}
.ps-tab{
  background:none;
  border:0;
  padding:.4rem .75rem;
  font:600 14px var(--font-base);
  cursor:pointer;
  position:relative;
  color:#c6c6c6;
  text-transform: uppercase;
}
.ps-tab:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-4px;
  height:3px;
  background:var(--color-primary);
  scale:0 1;
  transform-origin:left;
  transition:scale var(--transition);
}
.ps-tab.is-active,
.ps-tab:focus-visible{color:var(--color-primary);}
.ps-tab.is-active:after{scale:1 1;}
.products-slider{
  position:relative;
  max-width:960px;
  margin:0 auto 50px;
}
.products-slider[hidden]{display:none;}
.products-slider .product-price{
  max-width:none;
  margin-bottom:20px;
  gap:10px;
}
.products-slider .price-badge-group{
  display:flex;
  flex-direction: column;
}
.ps-viewport{overflow:hidden;width:100%;}
.ps-track{
  display:flex;
  transition:transform 400ms ease;
  width:100%;
}
.ps-page{
  flex:0 0 100%;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--space-m);
  padding:var(--space-s) 0;
}
.product-card{
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:var(--space-m) var(--space-s);
  text-align:center;
  font-size:calc(13/14 * var(--font-size));
  gap:0;
}
.product-card .p-thumb{
  width:100%;
  aspect-ratio:1/1;
  background:#f2f5f2;
  border-radius:var(--radius-xs);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  color:var(--color-primary);
  font-size:.85rem;
}
.product-card .p-title{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  font-size:20px;
  line-height:1.25;
  font-weight:bold;
  color:#000;
}
.product-card .p-quantity{
  font-family: Arial, Helvetica, sans-serif;
  font-size:14px;
  line-height:1.4;
  font-weight:400;
  color:#000;
}
.product-card.home .product-main-left { display:flex; flex-direction:column; gap:0; align-items:center; }
.product-card.home .product-main-left .product-price{margin-top:20px;}
.ps-nav{
  position:absolute;
  top:50%;
  translate:0 -50%;
  width:20px;
  height:38px;
  border-radius:0;
  border:0;
  background:transparent;
  color:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0; /* hide arrow characters */
  box-shadow:none;
}
.ps-prev{
  left:0;
  background-image:url('/assets/img/Fleche_gauche_PICTO.svg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.ps-next{
  right:0;
  background-image:url('/assets/img/Fleche_droite_PICTO.svg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.ps-more-wrap{text-align:center;}

/*======================================================================
  Catégories pleine largeur (carrés images)
======================================================================*/
.cat-wide-section{padding:0;overflow:hidden;}
.cat-wide-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:5px;
  width:100%;
  margin-inline:0;
  background:white;
}
.cat-wide-item{
  position:relative;
  aspect-ratio:1/1;
  display:block;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  isolation:isolate;
}
.cat-wide-item:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.55));
  z-index:0;
}
.cat-wide-item.cat--sante{background:var(--cat-sante-light) no-repeat;}
.cat-wide-item.cat--micro{background:var(--cat-micronutrition-light) no-repeat;}
.cat-wide-item.cat--aroma{background:var(--cat-aromatherapie-light) no-repeat;}
.cat-wide-item.cat--gemmo{background:var(--cat-gemmotherapie-light) no-repeat;}
.cat-wide-item.cat--phyto{background:var(--cat-phytotherapie-light) no-repeat;}
.cat-wide-item.cat--infusions{background:var(--cat-infusions-light) no-repeat;}

.cat-wide-item.cat--sante:after{background:url('/assets/img/Visuel_Sante_bien-etre.webp') var(--cat-sante-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-item.cat--micro:after{background:url('/assets/img/Visuel_Micronutrition.webp') var(--cat-micronutrition-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-item.cat--aroma:after{background:url('/assets/img/Visuel_Aromatherapie.webp') var(--cat-aromatherapie-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-item.cat--gemmo:after{background:url('/assets/img/Visuel_Gemmotherapie.webp') var(--cat-gemmotherapie-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-item.cat--phyto:after{background:url('/assets/img/VIsuel_Phytotherapie.webp') var(--cat-phytotherapie-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-item.cat--infusions:after{background:url('/assets/img/Visuel_Infusions_et_thes.webp') var(--cat-infusions-light) no-repeat;background-origin: content-box;background-size:contain;background-position: center;}
.cat-wide-label{
  position:absolute;
  left:50%;
  bottom:25px;
  transform:translateX(-50%);
  display:inline-block;
  background:var(--cat-color);
  color:#fff;
  font-weight:600;
  font-size:calc(15/14 * var(--font-size));
  line-height:1;
  padding:.85rem 1.4rem;
  border-radius:999px;
  text-align:center;
  text-decoration:none;
  box-shadow:0 4px 10px rgba(0,0,0,.18);
  z-index:1;
  transition:filter var(--transition);
}
.cat-wide-item:hover .cat-wide-label{filter:brightness(.95);}

/*======================================================================
  Needs (icônes)
======================================================================*/
.needs-grid{
  --cols:4;
  display:grid;
  grid-template-columns:repeat(var(--cols),1fr);
  gap:var(--space-xl) var(--space-l);
  padding:var(--space-l) 0 0;
  margin:0;
  list-style:none;
}
.need-item{text-align:center;}
.need-link{
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:var(--space-s);
  height:100%;
  outline:0;
  padding:.25rem;
  border-radius:var(--radius-s);
  transition:all var(--transition);
}
.need-link:focus-visible{background:var(--color-primary-light);}
.need-icon{
  width:70px;
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.75rem;
  font-weight:600;
  color:var(--color-primary);
  background:linear-gradient(135deg,#ffffff,#f3f7f3);
  background-size: auto;
  background-repeat: no-repeat;
  background-position: center;
}
.need-text{
  color:var(--color-primary-dark);
  margin:0;
  font-size:calc(16/14 * var(--font-size));
  font-weight:600;
  line-height:1.15;
  text-transform:none;
}
.need-text .alt-line{display:unset;font-weight:inherit;}

.need-link:hover .need-text{
  text-decoration:underline;
}

/*======================================================================
  Section Avantages (ancienne .pharma-adv / nouvelle renommée)
======================================================================*/
.pharma-adv-section{
  background:var(--color-primary-light);
  padding:80px 0;
}
.pharma-adv-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--space-xl) var(--space-l);
  margin:0 0 60px;
  text-align:center;
}
.pharma-adv-item img{
  width:100%;
  height:auto;
  display:block;
  margin:0 auto var(--space-m);
}
.adv-text{
  color:var(--color-primary-dark);
  margin:0;
  font-size:calc(25/14 * var(--font-size));
  font-weight:600;
  line-height:1.15;
}
.adv-actions{
  display:flex;
  justify-content:center;
  gap:var(--space-l);
  flex-wrap:wrap;
}

/* Nouvelle version renommée (éviter bloqueurs) */
.pharma-benefits-section{
  background:var(--color-primary-light);
  padding:80px 0;
}
.pharma-benefits-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--space-xl) var(--space-l);
  margin:60px 0;
  text-align:center;
}
.pharma-benefits-grid .pharma-benefit{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:var(--space-m);
}
.pharma-benefit img{
  height:auto;
  display:block;
  margin:0 auto var(--space-m);
}
.ph-benefit-text{
  color:var(--color-primary-dark);
  margin:auto 0 0 0;
  font-size:calc(25/14 * var(--font-size));
  font-weight:600;
  line-height:1.15;
}
.ph-benefit-actions{
  display:flex;
  justify-content:center;
  gap:var(--space-l);
  flex-wrap:wrap;
}
.ph-benefit-actions .btn{border-radius:2rem;}
/* Fallback si ancien markup */
html body .adv-text{display:block !important;}

/*======================================================================
  Proximité officine
======================================================================*/
.near-office-section{background:#fff;}
.near-office-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:var(--space-2xl) var(--space-xl);
  align-items:start;
  margin-top:var(--space-xl);
}
.near-office-item{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  max-width:520px;
  margin-inline:auto;
  gap:0;
}

.near-office-heading{
  margin:20px 0 0 0!important;
  font-size:calc(30/14 * var(--font-size))!important;
  line-height:1.15;
  color:var(--color-primary-dark)!important;
  font-weight:700;
}
.near-office-sub{
  margin:0;
  font-size:calc(25/14 * var(--font-size));
  line-height:1.2;
  font-weight:600;
  color:var(--color-primary);
}
.near-office-text{
  margin:20px 0!important;
  font-size:var(--font-size);
  line-height:1.45;
  color:var(--color-text);
  max-width:46ch;
}

/*======================================================================
  Full CTA Section
======================================================================*/
.full-cta-section{
  background:var(--color-primary)!important;
  padding:40px 0;
  color:#fff;
}
.customer-page .full-cta-section{
  margin-top:40px;
}
.full-cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-xl);
  flex-wrap:wrap;
}
.full-cta-left{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:var(--space-l);
  flex:1 1 520px;
}
.full-cta-lead{
  margin:0;
  font-size:calc(20/14 * var(--font-size));
  font-weight:600;
  line-height:1.25;
}
.full-cta-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  padding:.25rem 1.5rem;
  border:2px solid #fff;
  background:#fff;
  color:var(--color-primary);
  font-weight:600;
  font-size:calc(15/14 * var(--font-size));
  text-decoration:none;
  border-radius:999px;
  transition:var(--transition);
}
.full-cta-btn:hover{
  background:var(--color-primary);
  color:#fff;
}
.full-cta-right{
  display:flex;
  align-items:center;
  gap:var(--space-m);
  flex:0 0 auto;
}
.full-cta-follow{
  font-size:calc(20/14 * var(--font-size));
  font-weight:600;
}
.full-cta-socials{
  display:flex;
  gap:var(--space-s);
}
.full-cta-social{
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px white solid;
  border-radius: 2px;
  color:var(--color-primary);
  text-decoration:none;
  transition:var(--transition);
}
.full-cta-social:hover{
  background:var(--color-primary);
  color:#fff;
}

/*======================================================================
  Footer
======================================================================*/
.site-footer{
  background:#fff;
  border-top:1px solid var(--color-border);
}

/* Partenaires */
.partners-slider{
  position:relative;
  max-width:1280px;
  width:100%;
  margin:0 auto;
}
.partners-viewport{overflow:hidden;width:100%;}
.partners-track{
  display:flex;
  transition:transform 450ms ease;
  width:100%;
}
.partners-page{
  flex:0 0 100%;
  padding:var(--space-l) 0;
}
.partners-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr); /* 3 colonnes */
  gap:var(--space-l) var(--space-xl);
  align-items:center;
}
.partner-item{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:.5rem .75rem;
  height:140px;                /* cellule fixe compacte */
  overflow:hidden;
  transition:box-shadow var(--transition),border-color var(--transition);
  text-decoration:none;
}
.partner-item img{
  max-width:300px;
  max-height:auto;            /* contrainte hauteur logo */
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
}
.partners-nav{
  position:absolute;
  top:50%;
  translate:0 -50%;
  width:20px;
  height:38px;
  border-radius:0;
  border:0;
  background:transparent;
  color:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0;
  box-shadow:none;
}
.partners-prev{left:-56px;background-image:url('/assets/img/Fleche_gauche_PICTO.svg');background-repeat:no-repeat;background-position:center;background-size:contain;}
.partners-next{right:-56px;background-image:url('/assets/img/Fleche_droite_PICTO.svg');background-repeat:no-repeat;background-position:center;background-size:contain;}
.partners-dots{
  display:flex;
  justify-content:center;
  gap:.6rem;
  margin-top:var(--space-m);
}
.partners-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  border:0;
  background:#c8d8c8;
  cursor:pointer;
  transition:background var(--transition),scale var(--transition);
}
.partners-dot.is-active,
.partners-dot:hover{
  background:var(--color-primary);
  scale:1.2;
}

/* Blog */
.blog-slider{
  position:relative;
  max-width:960px;
  margin:0 auto var(--space-2xl);
}
.blog-viewport{overflow:hidden;width:100%;}
.blog-track{
  display:flex;
  transition:transform 450ms ease;
  width:100%;
}
.blog-page{
  flex:0 0 100%;
  display:flex;
  justify-content:center;
  gap:var(--space-xl);
  padding:var(--space-m) 0;
}
.blog-card{
  width:100%;
  max-width:225px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:var(--space-s);
  font-size:var(--font-size);
}
.blog-img-wrap{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  background:#f2f5f2;
  border-radius:var(--radius-s);
  overflow:hidden;
}
.blog-img-wrap img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:scale 400ms ease;
}
.blog-img-wrap:hover img{scale:1.05;}
.blog-meta{
  margin:0;
  font-size:calc(12/14 * var(--font-size));
  font-weight:600;
  color:var(--color-primary);
}
.blog-title{
  font-size:calc(20/14 * var(--font-size));
  line-height:1.15;
  margin:.2rem 0;
}
.blog-title-link{
  color:var(--color-text);
  text-decoration:none;
}
.blog-title-link:hover{color:var(--color-primary);}
.blog-excerpt{
  margin:0;
  font-size:calc(12/14 * var(--font-size));
  line-height:1.35;
  color:var(--color-text);
  display:-webkit-box;
  line-clamp:2;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  max-width:100%;
}
.blog-more{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.55rem 1.15rem;
  font-size:calc(13/14 * var(--font-size));
  font-weight:600;
  text-decoration:none;
  color:var(--color-primary);
  background:#fff;
  border:1px solid var(--color-primary);
  border-radius:999px;
  transition:var(--transition);
}
.blog-more:hover{
  background:var(--color-primary);
  color:#fff;
}
.blog-nav{
  position:absolute;
  top:50%;
  translate:0 -50%;
  width:42px;
  height:42px;
  border-radius:50%;
  border:0;
  background:rgba(var(--color-primary-rgb)/0.9);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  box-shadow:var(--shadow-sm);
}
.blog-prev{left:-56px;}
.blog-next{right:-56px;}
.blog-dots{
  display:flex;
  justify-content:center;
  gap:.6rem;
  margin:var(--space-m) 0 calc(var(--space-m) * 2 ) 0;
}
.blog-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  border:0;
  background:#c8d8c8;
  cursor:pointer;
  transition:background var(--transition),scale var(--transition);
}
.blog-dot.is-active,
.blog-dot:hover{
  background:var(--color-primary);
  scale:1.2;
}
.blog-all-wrap{
  text-align:center;
}
.blog-quote-block{
  text-align:center;
}
body:not(.home) .blog-quote-block{
  margin:calc( var(--space-xl) * 2) auto 0;
}
.blog-quote{
  margin:0 0 var(--space-s);
  font-size:calc(30/14 * var(--font-size));
  line-height:1.25;
  font-weight:600;
  color:var(--color-primary);
  font-style:normal;
}
.blog-quote-source{
  font-size:calc(18/14 * var(--font-size));
  color:var(--color-primary);
  font-weight:500;
  margin:0;
}

/* --- Univers Page Helpers --- */
.univers-page .section { padding: 50px 0; }
.cat-sante, .cat--sante, .univers-page.cat-sante { --cat-color:var(--cat-sante); }
.cat-micro, .cat--micro, .univers-page.cat-micro { --cat-color:var(--cat-micronutrition); }
.cat-gemmo, .cat--gemmo, .univers-page.cat-gemmo { --cat-color:var(--cat-gemmotherapie); }
.cat-aroma, .cat--aroma, .univers-page.cat-aroma { --cat-color:var(--cat-aromatherapie); }
.cat-phyto, .cat--phyto, .univers-page.cat-phyto { --cat-color:var(--cat-phytotherapie); }
.cat-infusions, .cat--infusions, .univers-page.cat-infusions { --cat-color:var(--cat-infusions); }

.uv-breadcrumb { font-size:12px; margin-bottom:calc(18/14 * var(--font-size)); display:flex; flex-wrap:wrap; gap:4px; }
.uv-breadcrumb a { text-decoration:none; color:#444; }
.uv-bc-sep { color:#999; }
.uv-h1 { font-size:35px; line-height:1.15; text-align:center; font-weight:700; margin:0; color:#111; }
.uv-h1-sub { font-size:25px; line-height:1.25; text-align:center; margin:10px auto 0; max-width:820px; color:#111; font-weight:400; }

.univers-page .section:nth-of-type(even):not(.bg-primary):not(.bg-light){ background:#fff; }
.uv-cat-band { padding:0 0 0 0; background:#e9f3e9; }
.cat-sante .uv-cat-band{ padding:0 0 0 0; background:var(--cat-sante-light)!important; }
.cat-micro .uv-cat-band{ padding:0 0 0 0; background:var(--cat-micronutrition-light)!important; }
.cat-gemmo .uv-cat-band{ padding:0 0 0 0; background:var(--cat-gemmotherapie-light)!important; }
.cat-aroma .uv-cat-band{ padding:0 0 0 0; background:var(--cat-aromatherapie-light)!important; }
.cat-phyto .uv-cat-band{ padding:0 0 0 0; background:var(--cat-phytotherapie-light)!important; }
.cat-infusions .uv-cat-band{ padding:0 0 0 0; background:var(--cat-infusions-light)!important; }


.uv-intro-flex { display:flex; gap:40px; align-items:center; flex-wrap:wrap; }
.uv-intro-text { flex:1 1 380px; }
.uv-intro-media { flex:1 1 360px; max-width:520px; }
.uv-intro-h2 { font-size:35px;color:var(--cat-color,#005d32); margin:0 0 14px; line-height:1.15; font-weight:700; }
.uv-intro-sub { font-size:14px; line-height:1.4; margin:0 0 18px; color:#222; }
.uv-btn { display:inline-block; font-size:13px; padding:10px 20px; border-radius:999px; font-weight:600; text-decoration:none; transition:.25s; }

.uv-btn-cat {
  background:var(--cat-color,#005d32);
  color:#fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5ch;
  padding: .25rem 1.5rem;
  font-weight: 600;
  font-size: 1.15rem;
  text-decoration: none;
  border: 1px solid var(--btn-border);
  cursor: pointer;
  transition: var(--transition);
  border-radius: 999px;
}
.uv-btn-cat:hover { background:#fff; color:var(--cat-color,#005d32); box-shadow:0 0 0 1px var(--cat-color,#005d32) inset; }

.uv-ratio { position:relative; padding-top:60%; overflow:hidden; background:#ddd; margin:0; }
.uv-ratio img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.uv-ratio-sm { position:relative; padding-top:66%; overflow:hidden; margin:0; }
.uv-ratio-sm img { position:absolute; inset:0; object-fit:cover; }

.uv-feature-col { display:flex; gap:50px; align-items:center; flex-wrap:wrap; }
.uv-feature-col.justify-center { justify-content:center;}
.v-align-top{ align-items: baseline;}
.uv-feature-text { flex:1 1 380px; }
.uv-feature-media { flex:1 1 320px; }
.bloc-vert{
  text-align:center;
  padding:1rem;
  background:var(--color-border);
  height: fit-content;
  max-height: fit-content;
  justify-content: center;
  width:250px;
  justify-self: flex-end;
}
.bloc-vert h4{
  font-size:20px!important;
  color:var(--color-primary-dark)!important;
  margin:0 0 5px 0!important;
}
.bloc-vert hr{
  border:0;
  height:2px;
  background:#a9d2a5;
  margin:1rem 0;
}
.bloc-gris{
  text-align:center;
  padding:1rem;
  background:#ededed;
  max-height: fit-content;
  width:250px;
  justify-self: flex-end;
}


/* align for two-column uv-feature grid */
.uv-feature--align-left { text-align: left;  justify-content:flex-start;}
.uv-feature--align-right { text-align: right; justify-content:flex-end; }

/* ensure image block behaves correctly */
.uv-feature--align-left img { display:inline-block; max-width:100%; height:auto; }
.uv-feature--align-right img { display:inline-block; max-width:100%; height:auto; }

/* optional: align inner text blocks if needed */
.uv-feature--align-left .uv-feature-text-inner { text-align:left;  justify-content:flex-start; }
.uv-feature--align-right .uv-feature-text-inner { text-align:right; justify-content:flex-end; }

.uv-testimony-section{
  padding:20px 0;
  background:var(--color-primary-light);
}
.uv-testimony-grid{
  display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 2em;
  }
.uv-testimony-content p, .uv-testimony-content div{
  color:var(--cat-color,#005d32);
}
.univers-page.cat-sante .uv-testimony-section,
section.cat-sante-light
{background:var(--cat-sante-light);}
.univers-page.cat-micro .uv-testimony-section,
section.cat-micronutrition-light{background:var(--cat-micronutrition-light);}
.univers-page.cat-gemmop .uv-testimony-section,
section.cat-gemmotherapie-light{background:var(--cat-gemmotherapie-light);}
.univers-page.cat-aroma .uv-testimony-section,
section.cat-aromatherapie-light{background:var(--cat-aromatherapie-light);}
.univers-page.cat-phyto .uv-testimony-section,
section.cat-phytotherapie-light{background:var(--cat-phytotherapie-light);}
.univers-page.cat-infusions .uv-testimony-section,
section.cat-infusions-light{background:var(--cat-infusions-light);}
/* Listing produits styles moved to assets/css/produits.css */
/* Responsive */
.uv-testimony-author{
  text-align:left;
  margin-bottom:0;
}
@media (max-width:900px){
  .uv-testimony-grid{gap:40px;}
  .uv-testimony-author{font-size:20px;}
}
@media (max-width:640px){
  .uv-testimony-grid{flex-direction:column;align-items:flex-start;}
  .uv-testimony-media{max-width:220px;}
  .uv-testimony-author{font-size:19px;}
  .uv-testimony-sub{font-size:13.5px;}
}
@media (max-width:480px){
  .uv-testimony-section{padding:44px 0;}
  .uv-testimony-author{font-size:18px;}
  .uv-testimony-sub{font-size:13px;}
}

@media (max-width:820px){
  .uv-intro-h2 { font-size:30px; }
  .uv-h1 { font-size:30px; }
  .uv-h1-sub { font-size:21px; }
  .uv-feature-h3 { font-size:22px; }
}

@media (max-width:600px){
  .uv-intro-flex { gap:24px; }
  .uv-feature-flex { gap:32px; }
  .uv-h1 { font-size:28px; }
  .uv-h1-sub { font-size:20px; }
}

/* Responsive blog */
@media (max-width:1100px){
  .blog-prev{left:0;}
  .blog-next{right:0;}
}
@media (max-width:820px){
  .blog-page{gap:var(--space-l);}
}
@media (max-width:680px){
  .blog-page{
    flex-wrap:wrap;
  }
  .blog-card{
    max-width:calc(50% - var(--space-l));
  }
}
@media (max-width:520px){
  .blog-card{
    max-width:100%;
  }
}

/* Responsive partenaires */
@media (max-width:1100px){
  .partners-grid{grid-template-columns:repeat(4,1fr);}
}
@media (max-width:1000px){
  .partners-grid{gap:var(--space-m) var(--space-l);}
}
@media (max-width:800px){
  .partners-prev{left:0;}
  .partners-next{right:0;}
  .partners-grid{grid-template-columns:repeat(2,1fr);}
  .partner-item{height:130px;}
}
@media (max-width:580px){
  .partners-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:480px){
  .partners-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-m);}
  .partner-item{height:120px;padding:.4rem .5rem;}
  .partner-item img{max-height:105px;}
}
@media (max-width:400px){
  .partners-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-m) var(--space-s);}
  .partner-item{aspect-ratio:3/2;padding:.5rem;}
}

/*======================================================================
  Media Queries (max-width) - ordre décroissant
======================================================================*/
@media (max-width:1200px){
  .ps-prev{left:0;}
  .ps-next{right:0;}
  .footer-nav-grid{grid-template-columns:repeat(4,1fr);}
}

@media (max-width:1100px){
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .cat-wide-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:1000px){
  .usp-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
}

@media (max-width:960px){
  .nav-middle{display:none;}
  .nav-toggle{display:inline-flex;}
  .header-cta{display:none;}
  #drawer .search-bar{width:100%;}
  .header-grid{grid-template-columns:auto auto 1fr;min-height:80px;}
}

@media (max-width:900px){
  .needs-grid{--cols:3;}
  .pharma-adv-grid{grid-template-columns:repeat(2,1fr);}
  .pharma-benefits-grid{grid-template-columns:repeat(2,1fr);}
  .ph-benefit-text,
  .adv-text{font-size:calc(22/14 * var(--font-size));}
  .near-office-grid{grid-template-columns:1fr;}
  .near-office-heading{font-size:calc(28/14 * var(--font-size));}
  .near-office-sub{font-size:calc(23/14 * var(--font-size));}
  .footer-nav-grid{grid-template-columns:repeat(3,1fr);}
}

@media (max-width:800px){
  .ps-page{grid-template-columns:repeat(1,1fr);}
  .full-cta-left{flex-direction:column;gap:var(--space-m);}
  .full-cta-lead{font-size:calc(20/14 * var(--font-size));}
  .full-cta-right{width:100%;justify-content:space-between;flex-wrap:wrap;}
}

@media (max-width:700px){
  .footer-nav-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:640px){
  .needs-grid{--cols:2;gap:var(--space-l) var(--space-m);}
  .need-icon{width:60px;}
  .need-text{font-size:calc(15/14 * var(--font-size));}
}

@media (max-width:600px){
  .hero{min-height:560px;}
  .nav-list{gap:var(--space-m);}
  .hero__nav--prev{left:25px;}
  .hero__nav--next{right:25px;}
  .usp-item{padding:40px 2.5rem;}
  .cat-wide-label{font-size:calc(14/14 * var(--font-size));padding:.7rem 1.1rem;bottom:18px;}
}

@media (max-width:520px){
  .pharma-adv-grid{grid-template-columns:1fr;}
  .pharma-adv-item img{width:70px;}
  .adv-text{font-size:calc(20/14 * var(--font-size));}
  .ph-benefit-text{font-size:calc(20/14 * var(--font-size));}

  .ps-page{grid-template-columns:1fr;}
  /* Keep arrows vertically centered on mobile */
  .ps-prev,.ps-next{top:50%;bottom:auto;translate:0 -50%;}

  .near-office-img{max-width:100%;aspect-ratio:16/10;}
  .near-office-heading{font-size:calc(26/14 * var(--font-size));}
  .near-office-sub{font-size:calc(21/14 * var(--font-size));}
}

@media (max-width:480px){
  .footer-nav-grid{grid-template-columns:1fr;}
  .footer-legal{flex-direction:column;align-items:flex-start;}
}

@media (max-width:400px){
  .needs-grid{--cols:1;}
}

/*======================================================================
  Footer Navigation
======================================================================*/
.footer-nav-section{
  padding:var(--space-2xl) 0;
}
.footer-nav-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:var(--space-xl) var(--space-l);
  align-items:start;
}
.footer-nav-grid.connected{
  grid-template-columns:repeat(8,1fr);
}
.f-col-title{
  margin:0;
  font-size:calc(14/14 * var(--font-size));
  text-transform:uppercase;
  color:var(--color-primary-dark);
  font-weight:700;
}
h5.f-col-title{
  text-transform:none;
  text-align: left;
}
.f-links{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:0;
}
.f-links a{
  text-decoration:none;
  font-size:calc(12/14 * var(--font-size));
  line-height:1.25;
  color:var(--color-primary-dark);
  transition:color var(--transition);
}
.f-links a:hover{color:var(--color-primary);}
.f-brand .f-logo img{display:block;width:70px;height:auto;}
.f-brand-text{
  font-size:14px;
  color:var(--color-primary);
  font-weight:bold;
  margin:10px 0 0;
}
.f-subhead{
  margin:var(--space-m) 0 var(--space-s);
  font-size:calc(12/14 * var(--font-size));
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
  color:var(--color-primary-dark);
}
.f-contact{
  position:relative;
  font-size:calc(14/14 * var(--font-size));
  color:var(--color-primary);
  display:flex;
  flex-direction:column;
  gap:07px;
}
.f-contact-bar{
  width:30px;
  height:2px;
  background:var(--color-primary);
  display:inline-block;
  margin-bottom:15px;
}
.f-contact-line{
  margin:0;
  font-size:14px;
  line-height:1;
  color:var(--color-primary);
}
.f-contact-line:first-of-type{font-weight:bold;}
.footer-bottom{
  background:#fff;
  border-top:1px solid var(--color-border);
  padding:1.2rem 0;
  font-size:calc(12/14 * var(--font-size));
}
.footer-bottom-inner{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-m);
  justify-content:center;
  align-items:center;
}
.footer-legal{
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
}
.footer-legal li{
  padding:0 1rem;
  border-right: 1px solid #000;
}
.footer-legal a{
  text-decoration:none;
  color:var(--color-text);
  font-size:calc(12/14 * var(--font-size));
}
.footer-legal a:hover{color:var(--color-primary);}

/* Mega panels */
.mega-panels{
  position:absolute;
  top:100%;
  left:0;
  width:100vw;
  pointer-events:none;
  z-index:13000; /* above header-popin (1200) and toast-wrap (9999) */
}
.mega-panel{
  position:relative;
  width:100%;
  background:var(--color-primary-light);
  padding:0 0 44px;
  border-bottom:1px solid var(--color-border);
  box-shadow:0 4px 14px rgba(0,0,0,.08);
  pointer-events:auto;
  animation:megaFade .25s;
  max-height:260px;
  overflow:hidden;
}
@keyframes megaFade{from{opacity:0;translate:0 -6px}to{opacity:1;translate:0 0;}}
.mega-panel-inner{
  padding-top:30px;
  display:flex;
  gap:60px;
  align-items:stretch;
  padding-left:var(--mega-left, 0);
  padding-right:clamp(24px,6vw,120px);
  box-sizing:border-box;
  max-height:260px;
  padding:20px clamp(24px,5vw,100px) 24px;
  gap:48px;
}
.mega-left{
  flex:1 1 auto;
  display:flex;
  max-height:100%;
  overflow:hidden;
}
.mega-right{
  display:flex;
  align-items:stretch;
  max-height:100%;
}
.mega-right .mega-article{height:100%;}
.mega-links-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  max-width:620px;
  gap:40px 50px;
  display:flex;
  gap:48px;
  max-width:100%;
}
.mega-cols{
  display:flex;
  gap:48px;
  max-width:100%;
}
.mega-col{
  flex:1 1 0;
  min-width:180px;
  max-width:240px;
  display:flex;
  flex-direction:column;
}
.mega-group-title,
.mega-subhead{
  margin:0 0 .6rem;
  font-size:calc(13/14 * var(--font-size));
  font-weight:700;
  color:var(--color-primary-dark);
}

.mega-links{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.35rem;
}
.mega-links a, .drawer-commande a{
  text-decoration:none;
  font-size:calc(13/14 * var(--font-size));
  line-height:1.25;
  color:var(--color-primary-dark);
  position:relative;
  padding:.15rem 0;
  font-weight: bold;
}
.mega-links a:hover{color:var(--color-primary);}
/* Aide à la vente: links not bold in this specific panel */
.mega-panel[data-panel="aide"] .mega-links a{font-weight:400;}
/* Ensure real buttons inside mega-links render as buttons */

.mega-links a.btn:hover,
.mega-links .btn:hover{
  color:var(--btn-color);
  filter:brightness(.95);
}
/* Uniform padding for any button inside mega panels (covers special layouts) */
.mega-links a.btn{color:white;padding:3px 8px;}
.mega-article{
  background:#fff;
  border:1px solid var(--color-border);
  padding:25px;
  display:flex;
  flex-direction:column;
  position:relative;
  text-decoration:none;
  color:inherit;
  width:100%;
}
.mega-article img{
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio:4/3;
  display:block;
  transition:scale 400ms ease;
}
.mega-article:hover img{scale:1.05;}
.mega-article-label{
  color:var(--color-primary-dark);
  font-size:calc(12/14 * var(--font-size));
  padding: .75rem 0;
  font-weight:600;
  line-height:1;
}
.mega-multicol{
  columns:3 180px;           /* max 3 colonnes */
  column-gap:40px;
  max-height:calc(260px - 48px); /* (panel height - approx headings / padding) */
  overflow:hidden;
}
.mega-multicol > li{
  break-inside:avoid;
  padding:0;
  margin:0 0 .35rem;
}

/* Mega: service box (right column for sub-navs) */
.mega-service{display:flex; background:#fff; border:1px solid var(--color-border); padding:10px; width:100%;}
.mega-service-inner{padding:16px; display:flex; flex-direction:column; gap:0; align-items:center; justify-content:center; text-align:center; height:100%;}
.mega-service .mega-subhead, .bloc-vert h4{margin:0; font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:700; color:var(--color-primary-dark); line-height:1.15;}
.mega-service-phone, .bloc-vert h3{margin:.15rem 0 .25rem!important; font-family:Arial, Helvetica, sans-serif; font-weight:700; font-size:25px; color:var(--color-primary); line-height:1.15;}
.mega-service-desc, .bloc-vert p{margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#000; line-height:1.2;}

/* Mega: Devenir client public panel */
.mega-panel[data-panel="devenir-public"]{max-height:none;}
.mega-panel[data-panel="devenir-public"] .mega-panel-inner{align-items:center; justify-content:center;}
.mega-panel[data-panel="devenir-public"] .mega-left{flex:1 1 100%; justify-content:center; max-width:100%;}
.mega-panel[data-panel="devenir-public"] .mega-links-grid{width:100%; max-width:100%; justify-content:center;}
.mega-public{width:100%; display:flex; flex-direction:column; align-items:center;}
.mega-public-intro{
  margin:0 auto 12px;
  font-size:calc(15/14 * var(--font-size));
  line-height:1.25;
  font-weight:600;
  color:var(--color-primary-dark);
  max-width:72ch;
  text-align:center;
}
.mega-public-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(120px,1fr));
  gap:12px;
  width:100%;
  max-width:980px;
  justify-items:center;
}
.mega-public-card{
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:center;
  text-align:center;
  width:100%;
  max-width:220px;
}
.mega-public-card img{
  width:100%;
  height:72px;
  object-fit:contain;
  background:transparent;
  border:1px solid var(--color-border);
  padding:6px;
}
.mega-public-card span{
  font-size:calc(13/14 * var(--font-size));
  line-height:1.2;
  color:var(--color-primary-dark);
  font-weight:700;
  text-align:center;
}
.mega-public-card:hover span{color:var(--color-primary);}
.mega-public-cta .mega-service-inner{align-items:stretch; text-align:left;}
.mega-public-actions{display:flex; flex-direction:row; justify-content:center; align-items:center; gap:12px; margin-top:14px; flex-wrap:wrap;}
.mega-public-actions .btn{display:inline-flex; justify-content:center; min-width:220px;}

/* Invert effect on primary button when needed */
.btn-primary.btn-invert:hover{
  --btn-bg:#fff;
  --btn-color:var(--color-primary);
  --btn-border:var(--color-primary);
}

/* Wider horizontal padding for special CTA */
.btn-xpad{padding-left:2rem; padding-right:2rem;}

/* Mega: NOS OFFRES special layout */
.mega-panel[data-panel="commande"]{max-height:none;}
.mega-offres{justify-content:center;}
.mega-offres-wrap{display:flex; flex-direction:column; align-items:center; gap:16px; width:100%;}
.mega-offres-title{margin:0; font-weight:700; letter-spacing:.5px; font-size:calc(15/14 * var(--font-size)); color:var(--color-primary-dark); text-transform:uppercase; text-align:center;}
.mega-offres-grid{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:40px;}
.mega-offres-col{display:flex; flex-direction:column; align-items:center; gap:12px;}
.mega-offres-img{width:220px; height:100px; border-radius:0; background:transparent; border:0; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.mega-offres-img img{width:220px; height:100px; object-fit:contain;}
.mega-offres-sep{font-weight:700; color:var(--color-primary-dark);}

@media (max-width:1100px){
  .mega-panel{max-height:none;}
  .mega-panel-inner{flex-direction:column;max-height:none;height:auto;}
  .mega-left{max-height:none;overflow:visible;}
  .mega-multicol{columns:2 160px;max-height:none;}
  .mega-public-grid{grid-template-columns:repeat(2,minmax(150px,1fr));}
}
@media (max-width:680px){
  .mega-links-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:28px 32px;}
  .mega-panel-inner{padding-left:var(--space-m)!important;}
  .mega-multicol{columns:1;}
  .mega-public-grid{grid-template-columns:1fr;}
}
.nav-list button.nav-root{
  position:relative;
  background:none;
  border:0;
  padding:.25rem 0;
  font:600 15px var(--font-base);
  cursor:pointer;
  color:var(--color-text);
}
.nav-list button.nav-root::after{
  content:"";
  position:absolute;
  left:0;
  bottom:calc(var(--underline-shift,0px) * -1); /* aligne sur bas .header-grid */
  height:3px;
  width:100%;
  background:var(--color-primary);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .35s ease;
  will-change:transform;
}
.nav-list button.nav-root:hover::after,
.nav-list button.nav-root.is-active::after{
  transform:scaleX(1);
}

@media (min-width:992px) and (max-width:1220px){
  .nav-list button.nav-root,
  .nav-list .nav-root{
    font-size:13px!important;
  }
}
@media (max-width:1279px){
  .container{
    padding:0 25px;
  }
}
/* Mega panels reprise (viewport left:0) */
.mega-panels{
  position:absolute; /* hors header, placé après calcul JS */
  left:0;
  top:0;
  width:100vw;
  pointer-events:none;
  z-index:13000; /* ensure always on top when active */
}
.mega-panels.is-active{pointer-events:auto;}
.mega-panel{
  background:var(--color-primary-light);
  width:100%;
  border-bottom:1px solid var(--color-border);
  box-shadow:0 4px 14px rgba(0,0,0,.08);
  animation:megaFade .25s;
}
.mega-panel-inner{
  display:flex;
  gap:60px;
  padding:34px clamp(24px,5vw,120px) 48px;
  padding-left:calc(var(--mega-left, 0) + 0px); /* alignement côté nav */
  padding-right:calc(var(--mega-right, 0) + 0px); /* alignement côté nav */
  box-sizing:border-box;
}
.mega-panel-inner{
  /* Remplacé: on aligne l’enveloppe sur le header, puis on décale le contenu gauche sur nav-middle */
  margin-left: var(--mega-container-left,0);
  margin-right: var(--mega-container-right,0);
  width: calc(100vw - var(--mega-container-left,0) - var(--mega-container-right,0));
  padding-left: calc(var(--mega-offset-left,0) + 0px);
  padding-right: 0; /* déjà aligné à droite du header */
}
@media (max-width:1100px){
  .mega-panel-inner{flex-direction:column;gap:40px;}
}
@media (max-width:680px){
  .mega-panel-inner{padding-left:var(--space-m)!important;padding-right:var(--space-m);}
}

/* === FIX multi‑colonnes mega menu (Besoins) ===
   Le problème venait de:
   1) .mega-links { display:grid } empêchant le layout multi-colonnes
   2) overflow:hidden + max-height coupant les colonnes
*/
.mega-links.mega-multicol{
  display:block !important;          /* annule le grid */
  -webkit-columns:3 180px;
          columns:3 180px;           /* jusqu'à 3 colonnes de min 180px */
  -webkit-column-gap:40px;
          column-gap:40px;
  column-fill:auto;                  /* remplit colonne puis passe à la suivante */
  height:calc(260px - 80px);         /* 260px moins padding interne approx */
  overflow:visible;                  /* ne pas masquer les autres colonnes */
  padding-right:4px;
}
.mega-links.mega-multicol > li{
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  page-break-inside:avoid;
}

/* Panel hauteur fixe */
.mega-panel{
  height:260px;
  max-height:260px;
}
.mega-panel-inner{
  height:100%;
  max-height:100%;
}
.mega-left{overflow:visible;}

/* Option: si trop de contenu crée un scroll vertical, décommenter:
.mega-links.mega-multicol{overflow:auto;}
*/

/* Responsive (réduire colonnes sur petits écrans) */
@media (max-width:900px){
  .mega-links.mega-multicol{
    -webkit-columns:2 160px;
            columns:2 160px;
    height:auto;
  }
}
@media (max-width:600px){
  .mega-links.mega-multicol{
    -webkit-columns:1;
            columns:1;
  }
}

    .fp-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
    @media(max-width:980px){.fp-wrapper{grid-template-columns:1fr;}}
    .fp-gallery{display:flex;flex-direction:column;gap:14px;}
    .fp-main{position:relative;width:100%;aspect-ratio:1/1;background:#f2f5f2;border:1px solid #e2e8e2;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;}
    .fp-main img{width:100%;height:100%;object-fit:cover;}
    .fp-thumbs{display:flex;gap:10px;flex-wrap:wrap;}
    .fp-thumbs button{background:#fff;border:2px solid #e2e8e2;padding:0;border-radius:8px;cursor:pointer;width:72px;height:72px;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:border-color .2s;}
    .fp-thumbs button.is-active{border-color:var(--color-primary);}
    .fp-thumbs img{width:100%;height:100%;object-fit:cover;display:block;}
    .fp-nav{position:absolute;top:50%;translate:0 -50%;width:44px;height:44px;background:rgba(0,0,0,.45);color:#fff;border:0;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.5rem;}
    .fp-nav.prev{left:10px;}
    .fp-nav.next{right:10px;}
  .fp-info h2{font-size:35px;margin:0 0 var(--font-size);line-height:1.15;}
  .fp-indications{margin:0 0 var(--font-size);font-size:20px;color:#000;font-weight:600;display:flex;flex-wrap:wrap;gap:0px;flex-direction:column;}
    .fp-short{font-size:12px;line-height:1;margin:0;}
    .fp-labels{display:flex;gap:8px;margin:16px 0;}
    .fp-label{background:var(--color-primary-dark);color:#fff;font-size:11px;font-weight:700;padding:4px 10px;letter-spacing:.5px;}
    .fp-label.promo{background:#ef7c00;}
    .fp-price-block{display:flex;align-items:flex-end;gap:14px;}
    .fp-price{font-size:2.4rem;font-weight:700;color:var(--color-primary);display:flex;align-items:flex-start;gap:2px;line-height:1;}
    .fp-old-price{font-size:1rem;color:#999;text-decoration:line-through;font-weight:600;}
    .fp-reduc{color:#ef7c00;font-weight:700;font-size:.95rem;}
    .fp-buy-row{display:flex;align-items:center;gap:20px;margin:0 0 30px;flex-wrap:wrap;}
    .fp-back{display:inline-flex;align-items:center;gap:6px;font-weight:700;margin-bottom:25px;text-decoration:none;background:#fff;border:2px solid var(--color-primary);padding:6px 14px;border-radius:999px;line-height:1;color:var(--color-primary);transition:background .2s;}
    .fp-back:hover{background:var(--color-primary);color:white;}
    /* Force icon to white on hover regardless of original color */
    .fp-back:hover img{filter:grayscale(1) brightness(0) invert(1);}
    .fp-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
    .fp-add{--btn-bg:var(--color-primary);--btn-color:#fff;--btn-border:var(--color-primary);padding:.8rem 1.6rem;border-radius:999px;font-size:15px;}
    .fp-tabs{margin:60px auto;}
    .fp-tablist{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 0 30px;padding:0;}
    .fp-tablist button{background:none;border:0;padding:0 0 10px;font:600 15px var(--font-base);cursor:pointer;position:relative;color:#c6c6c6;}
    /* Grey base underline always visible */
    .fp-tablist button:before{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;background:#c6c6c6;}
    /* Green overlay underline animates in on hover/active */
    .fp-tablist button:hover:after, .fp-tablist button.is-active:after{scale:1 1;}
    .fp-tablist button:hover{color:var(--color-primary);}
    .fp-tablist button.is-active{color:var(--color-primary);}
    .fp-tabpanel{display:none;animation:fade .4s;}
    .fp-tabpanel.is-active{display:block;}
    @keyframes fade{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
    .fp-tabpanel h4{margin:0 0 10px;font-size:18px;color:var(--color-primary)}
    .fp-mea{display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between;}
    .fp-mea-item{text-align:center;max-width:300px;display:flex;flex-direction:column;gap:var(--font-size);}
    .fp-mea-item img{object-fit:contain;margin:0 auto;}
    .fp-mea-item p{margin:0;font-weight:600;font-size:calc(25/14 * var(--font-size));color:var(--color-primary);line-height:1.25;}
    .fp-related{margin:40px 0 40px 0;}
    .fp-related h3{font-size:28px;margin:0 0 24px;text-align:center;color:var(--color-primary);}
    .fp-related .ps-viewport{overflow:hidden;}
    .fp-related .ps-track{display:flex;transition:transform .45s; width:100%;}
    .fp-related .ps-page{flex:0 0 100%;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
    @media(max-width:960px){.fp-related .ps-page{grid-template-columns:repeat(3,1fr);} }
    @media(max-width:720px){.fp-related .ps-page{grid-template-columns:repeat(2,1fr);} }
    @media(max-width:520px){.fp-related .ps-page{grid-template-columns:1fr;} }

    @media(max-width:1220px){.fp-related .ps-prev{left:0}.fp-related .ps-next{right:0}}
    .fp-short ul, .fp-tabpanel ul{padding-left:20px;list-style:disc;}
  .fp-rupture{color:#FF4456;font-weight:700;margin-top:var(--font-size);}
  /* Icon trio section: 3 centered icons with caption */
  .icon-trio { text-align: center; }
  .icon-trio .it-row { display: flex; justify-content: center; align-items: flex-start; gap: 0; flex-wrap: wrap; margin-left: auto; margin-right: auto; }
  .icon-trio .it-item { text-align: center; width: 320px; flex: 0 0 320px; }
  .icon-trio .it-item img, .icon-trio .it-item svg { height: auto; display: block; margin: 0 auto 8px; }
  .icon-trio .it-placeholder { width: 120px; height: 120px; border: 2px dashed #ddd; border-radius: 8px; margin: 0 auto 8px; }
  .icon-trio .it-label { font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: 700; color: var(--color-primary); line-height:1.25; }
  .icon-trio .it-caption { margin-top: 12px; font-size: 1rem; color: #1a1a1a; }

  .pack-impl { text-align:center; }
  .pack-impl hr{border:none; border-top:2px solid #ededed; margin:50px 0;}
  .pack-impl:not(.is-list) .pi-grid.pi-grid-large .pi-item,
  .pack-impl:not(.is-list) .pi-grid.pi-grid-large .pi-item img{height: 89px;}
  .pack-impl h4{color:#005d32; font-size:20px; text-align:left;margin-top:50px;}
.pack-impl .pi-actions { margin: 0 0 var(--space-2xl); }
.pack-impl .pi-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 50px; margin: 20px 0; }
.pack-impl .pi-card { display:flex; flex-direction:column; align-items:center; }
.pack-impl .pi-item { position:relative; aspect-ratio: 4 / 3; background:transparent; border:1px solid #e2e8f0; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.pack-impl .pi-item img { width:100%; height:100%; object-fit:cover; display:block; }
.pack-impl .pi-item a.pi-link{ display:block; width:100%; height:100%; }
.pack-impl .pi-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#9aa3a8; font-weight:600; font-size:14px; background:linear-gradient(135deg,#ffffff,#f3f7f3); }
.pack-impl .pi-label { margin-top:8px; text-align:center; color:#000; font-weight:700; font-size:18px; }
.pack-impl .pi-contact { margin: 50px 0 0; }
.pack-impl .pi-line { margin:0 0 6px; font-size:25px; font-weight:700; color:var(--pi-line-color); }
.pack-impl .pi-phone { margin:0 0 4px; font-weight:700; font-size:35px; color:var(--pi-phone-color); }
.pack-impl .pi-hours { margin:0; font-size:15px; font-weight:400; color:var(--pi-hours-color); }

  /* Conditions table block */
  .conditions-block { background:#fff; padding:40px;}
  .conditions-table { width:100%; border-collapse:collapse; text-align:center; }
  .conditions-table th, .conditions-table td { padding:8px; }
  .conditions-table thead th { font-weight:700; }
  .conditions-table tbody th { text-align:left; font-weight:700; }
  .conditions-table tbody tr + tr { border-top:2px solid #e9f3e9; }
  .conditions-table thead th{color:var(--color-primary-dark);font-size:20px;}
  .conditions-table tbody th{color:#000;font-size:14px;}
  .conditions-table tbody td { color:var(--color-primary-dark); font-weight:700; }
  /* Inner vertical borders between columns, no outer edges */
  .conditions-table th + th,
  .conditions-table th + td ,
  .conditions-table td + td { border-left: 2px solid #e9f3e9; }

  .pourquoi-dayang-table thead th { color:var(--color-primary-dark); text-align:center; font-size:25px;}
  .pourquoi-dayang-table tbody td { text-align:left; font-size:18px; position:relative; padding-left:56px; font-weight: normal; }

  /* Pourquoi Dayang table: inner borders only, collapsed layout */
  .pourquoi-dayang-table { width:100%; border-collapse:collapse; border:none; }
  .pourquoi-dayang-table th, .pourquoi-dayang-table td { padding:12px; }
  /* Apply inner grid lines with #e9f3e9, omit outer table border */
  .pourquoi-dayang-table th, .pourquoi-dayang-table td { border-right:1px solid #e9f3e9; border-bottom:1px solid #e9f3e9; }
  .pourquoi-dayang-table tr:last-child td, .pourquoi-dayang-table tr:last-child th { border-bottom:none; }
  .pourquoi-dayang-table tr td:last-child, .pourquoi-dayang-table tr th:last-child { border-right:none; }
  /* Add validation icon before each td content */
  .pourquoi-dayang-table tbody td::before { content:""; position:absolute; left:10px; top:50%; width:35px; height:35px; transform:translateY(-50%); background:url('/assets/img/Check_valide_PICTO.svg') no-repeat center/contain; }

  /* Grid helpers for feature sections */
  .uv-feature-col.row-full { width:100%; }

  /* Center the block within the section */
  .conditions-block { width:100%; max-width:960px; margin-inline:auto; }

  /* CTA section under conditions table */
  .conditions-cta{ display:flex; flex-direction:column; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:16px; }
  .conditions-cta-lead{ margin:0; font-weight:700; font-size:20px; color:var(--color-primary-dark); }
  .conditions-cta-actions{ display:flex; align-items:center; gap:10px; }

@media (max-width: 900px){
  .pack-impl .pi-grid, .pack-impl .pi-grid.pi-grid-large { grid-template-columns: repeat(2, 1fr)!important; }
}
@media (max-width: 520px){
  .pack-impl .pi-grid { grid-template-columns: repeat(2, 1fr);}
}

/* Login Modal */
.modal[hidden]{display:none!important;}
.modal{position:fixed;inset:0;z-index:20000;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto;}
.modal-overlay{position:absolute;inset:0;background:rgba(0,93,50,.3);z-index:0;} /* #005d32 at 30% */
.modal .modal-content{position:relative;background:#fff;border:1px solid var(--color-border);box-shadow:var(--shadow-md);border-radius:0;max-width:min(560px,92vw);width:100%;padding:40px;z-index:1;text-align:center;}
.modal .modal-content h2{margin:0 0 12px;font-size:24px;font-weight:700;color:#000;}
.modal .modal-content .modal-message{margin:0;font-size:16px;color:#000;}
.modal .modal-close{position:absolute;top:16px;right:16px;background:#fff;border:1px solid var(--color-border);border-radius:999px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:22px;line-height:1;color:#000;padding:0;z-index:2;}
.login-modal{position:relative;background:#fff;border:1px solid var(--color-border);box-shadow:var(--shadow-md);border-radius:0;width:min(960px, 92vw);}
.login-modal--small{width:auto;max-width:min(560px, 92vw);}
.modal-close{position:absolute;top:16px;right:16px;background:#fff;border:1px solid var(--color-border);border-radius:999px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:22px;line-height:1;color:#000;padding:0;z-index:2;}
.login-modal-inner{padding:70px;}
.login-cols{display:flex;gap:50px;align-items:flex-start;}
.login-col{flex:0 0 350px;max-width:350px;text-align:center;}
.login-col h3{font-size:30px;font-weight:700;color:#000;margin:0 0 12px;}
.login-sep{flex:0 0 1px;width:1px;align-self:stretch;background:#e2e8f0;}
.login-form{display:flex;flex-direction:column;align-items:center;}
.login-form .field{display:flex;flex-direction:column;gap:6px;margin:8px 0;width:100%;max-width:350px;}
.login-form .field span{display:none;}
.login-form .field.inline{flex-direction:row;align-items:center;gap:8px;}
.login-form input[type="email"],
.login-form input[type="password"]{border:1px solid var(--color-border);border-radius:0;padding:10px;font-size:16px;}
.login-actions{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:12px;flex-direction:column;}
.login-actions .reset-link{color:var(--color-primary);font-size:14px;font-weight:700;text-decoration:none;}
.login-actions .reset-link:hover{text-decoration:underline;}
.login-small{font-size:14px;color:#ef7c00;margin:8px 0 16px;}
.login-advantages{font-weight:700;color:var(--color-primary);margin:0 0 8px;font-size:18px;}
.login-list{margin:0 0 12px 0;padding-left:0;list-style:none;color:#000;text-align:center;}

/* Catalogue Pro modal specific tweaks */
#catalogueModal .login-modal{width:min(640px, 92vw);}
#catalogueModal .login-modal .login-modal-inner{padding:70px 0;}
#catalogueModal .login-actions{margin-top:16px;}
#catalogueModal .login-col{flex:0 0 100%;}
#catalogueModal .login-col h3{font-size:30px; font-weight:700; color:#000;}
#catalogueModal .catalogue-subtitle{font-size:18px; font-weight:700; color:var(--color-primary);}

/* Prevent background scroll when modal is open */
body.modal-open{overflow:hidden;}

@media (max-width:900px){
  .login-modal{max-height:none;}
  .login-modal-inner{padding:24px;}
  .login-cols{flex-direction:column;gap:24px;}
  .login-col{flex:1 1 auto;max-width:100%;}
  .login-sep{display:none;}
}

/* Login Error Modal tweaks */
#loginErrorModal .login-col{max-width:100%;}
#loginErrorModal h3{color:var(--color-primary);} /* light green title */
#loginErrorModal a:not(.btn){color:var(--color-primary);text-decoration:none;font-weight:700;}