/* ==========================================================================
   DZ COFFEE MACHINE — Gabarit fiche produit v1.0 (thème Elessi / WooCommerce)
   À coller UNE SEULE FOIS pour tout le site :
   Apparence > Personnaliser > CSS additionnel  (ou style.css du thème enfant)
   Toutes les classes sont préfixées "dzc-" : aucun conflit avec Elessi.
   Icônes : SVG encodés ici en CSS (mask-image) -> aucun <svg> dans l'éditeur.
   ========================================================================== */
.btn-fiche-technique {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: #333333; /* Couleur de fond (gris foncé) - modifiable */
    color: #ffffff !important; /* Couleur du texte (blanc) */
    padding: 12px 24px;
    border-radius: 5px; /* Bords légèrement arrondis */
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    transition: background-color 0.3s ease, transform 0.2s ease;
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.btn-fiche-technique:hover {
    background-color: #000000; /* Couleur au survol */
    color: #ffffff !important;
    transform: translateY(-2px); /* Petit effet de soulèvement au survol */
}

.btn-fiche-technique svg {
    flex-shrink: 0;
}
.dzc{
  /* Charte DZ Coffee Machine */
  --dzc-green: #12271E;      /* vert profond : fonds forts, icônes   */
  --dzc-cashmere: #EFDDCD;   /* cachemire : bloc réassurance, texte sur vert */
  --dzc-gold: #FFE297;       /* jaune doux : boutons, accents sur vert */
  --dzc-black: #1D1D1D;      /* noir : texte courant                 */
  /* Rôles (dérivés de la charte) */
  --dzc-tint: #F8F1EA;       /* cachemire très clair : cartes, visuels */
  --dzc-muted: #5C605D;      /* texte secondaire                     */
  --dzc-line: #E6DDD4;       /* filets                               */
  --dzc-on-dark: #EFDDCD;
  --dzc-on-dark-soft: rgba(239, 221, 205, .78);
  --dzc-radius: 14px;
  /* Icônes */
  --dzc-ico-pressure: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='8'/%3E%3Cpath d='M12 13l3.5-3.5M8.5 17.5h7M12 5v1.5M5 13h1.5M17.5 13H19'/%3E%3C/svg%3E");
  --dzc-ico-timer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13.5' r='7.5'/%3E%3Cpath d='M12 9.5v4l2.5 2M9.5 2.5h5M12 2.5V6'/%3E%3C/svg%3E");
  --dzc-ico-drop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5s6 6.3 6 10.5a6 6 0 0 1-12 0c0-4.2 6-10.5 6-10.5z'/%3E%3Cpath d='M9 14.5a3 3 0 0 0 3 3'/%3E%3C/svg%3E");
  --dzc-ico-cup: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h12v4a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5z'/%3E%3Cpath d='M16 11.5h1.5a2.5 2.5 0 0 1 0 5H16'/%3E%3Cpath d='M8 3.5v3M12 3.5v3'/%3E%3Cpath d='M3 21.5h14'/%3E%3C/svg%3E");
  --dzc-ico-power: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v8'/%3E%3Cpath d='M7 6.2a7.5 7.5 0 1 0 10 0'/%3E%3C/svg%3E");
  --dzc-ico-capsule: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8h15'/%3E%3Cpath d='M6.5 8l1.8 10.5a1 1 0 0 0 1 .8h5.4a1 1 0 0 0 1-.8L17.5 8'/%3E%3Cpath d='M9 4.5h6l1.5 3.5h-9z'/%3E%3C/svg%3E");
  --dzc-ico-glass: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h8l-1.2 17.2a1 1 0 0 1-1 .8h-3.6a1 1 0 0 1-1-.8z'/%3E%3Cpath d='M8.5 9.5h7'/%3E%3C/svg%3E");
  --dzc-ico-truck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.5h11v10h-11zM13.5 10h4l3.5 3.5v3h-7.5'/%3E%3Ccircle cx='6.5' cy='17.5' r='1.8'/%3E%3Ccircle cx='17' cy='17.5' r='1.8'/%3E%3C/svg%3E");
  --dzc-ico-cash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='6' width='19' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3Cpath d='M6 9.5v.01M18 14.5v.01'/%3E%3C/svg%3E");
  --dzc-ico-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5.2c0 4.4-3 7.9-7 9.8-4-1.9-7-5.4-7-9.8V6z'/%3E%3Cpath d='M9 12l2.2 2.2L15.5 10'/%3E%3C/svg%3E");
  --dzc-ico-wrench: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E");
  --dzc-ico-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 3.5h3.5l1.8 4.6-2.3 1.5a11 11 0 0 0 5.4 5.4l1.5-2.3 4.6 1.8V18a2 2 0 0 1-2 2A15.5 15.5 0 0 1 3 5.5a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
  --dzc-ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --dzc-ico-store: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10v10h16V10'/%3E%3Cpath d='M3 10l2-6h14l2 6c0 1.4-1.1 2.5-2.5 2.5S16 11.4 16 10c0 1.4-1.8 2.5-4 2.5S8 11.4 8 10c0 1.4-1.1 2.5-2.5 2.5S3 11.4 3 10z'/%3E%3Cpath d='M10 20v-4.5h4V20'/%3E%3C/svg%3E");
  --dzc-ico-box: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5L12 3l8.5 4.5v9L12 21l-8.5-4.5z'/%3E%3Cpath d='M3.5 7.5L12 12l8.5-4.5M12 12v9'/%3E%3C/svg%3E");
  color: var(--dzc-black);
  font-family: inherit;
  line-height: 1.6;
  box-sizing: border-box;
}
.dzc *, .dzc *::before, .dzc *::after{ box-sizing: border-box; }
.dzc p{ margin: 0 0 1em; }
.dzc p:empty{ display: none; }               /* sécurité wpautop */
.dzc ul, .dzc ol{ list-style: none; margin: 0; padding: 0; }
.dzc li{ list-style: none; margin: 0; padding: 0; }
.dzc li::marker{ content: none; }
.dzc a{ color: inherit; text-decoration: underline; text-decoration-color: var(--dzc-green); text-underline-offset: 3px; }
.dzc a:focus-visible, .dzc summary:focus-visible{ outline: 2px solid var(--dzc-green); outline-offset: 3px; border-radius: 4px; }
.dzc img{ max-width: 100%; height: auto; }

/* ---------- Icônes (pseudo-élément : rien de vide dans le HTML) ---------- */
.dzc .dzc-i::before,
.dzc .dzc-checks li::before{
  content: "";
  flex: 0 0 auto;
  width: 1.3em;
  height: 1.3em;
  background-color: currentColor;
  -webkit-mask: var(--dzc-icon) center / contain no-repeat;
          mask: var(--dzc-icon) center / contain no-repeat;
}
.dzc .dzc-i--pressure{--dzc-icon:var(--dzc-ico-pressure)}
.dzc .dzc-i--timer{--dzc-icon:var(--dzc-ico-timer)}
.dzc .dzc-i--drop{--dzc-icon:var(--dzc-ico-drop)}
.dzc .dzc-i--cup{--dzc-icon:var(--dzc-ico-cup)}
.dzc .dzc-i--power{--dzc-icon:var(--dzc-ico-power)}
.dzc .dzc-i--capsule{--dzc-icon:var(--dzc-ico-capsule)}
.dzc .dzc-i--glass{--dzc-icon:var(--dzc-ico-glass)}
.dzc .dzc-i--truck{--dzc-icon:var(--dzc-ico-truck)}
.dzc .dzc-i--cash{--dzc-icon:var(--dzc-ico-cash)}
.dzc .dzc-i--shield{--dzc-icon:var(--dzc-ico-shield)}
.dzc .dzc-i--wrench{--dzc-icon:var(--dzc-ico-wrench)}
.dzc .dzc-i--phone{--dzc-icon:var(--dzc-ico-phone)}
.dzc .dzc-i--check{--dzc-icon:var(--dzc-ico-check)}
.dzc .dzc-i--store{--dzc-icon:var(--dzc-ico-store)}
.dzc .dzc-i--box{--dzc-icon:var(--dzc-ico-box)}
.dzc .dzc-checks li{ --dzc-icon: var(--dzc-ico-check); display: flex; gap: 10px; align-items: flex-start; margin: 0 0 8px; }
.dzc .dzc-checks li::before{ color: var(--dzc-green); margin-top: .15em; width: 1.15em; height: 1.15em; }

/* ---------- Titres ---------- */
.dzc h2.dzc-h2{ font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.2rem); line-height: 1.15; font-weight: 600; letter-spacing: -.015em; margin: 0 0 .5em; color: inherit; text-transform: none; }
.dzc h3.dzc-h3{ font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); line-height: 1.25; font-weight: 600; letter-spacing: -.01em; margin: 0 0 .5em; color: inherit; text-transform: none; }
.dzc .dzc-lede{ font-size: 1.08em; color: var(--dzc-muted); max-width: 62ch; }
.dzc .dzc-head{ max-width: 62ch; margin-bottom: 28px; }

/* ==========================================================================
   DESCRIPTION COURTE
   ========================================================================== */
.dzc.dzc-sd{ margin: .25em 0 1.25em; font-size: 15px; }
.dzc .dzc-sd__lead{ font-size: 1.05em; color: var(--dzc-muted); margin-bottom: 14px; }

.dzc .dzc-feats{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 14px; }
.dzc .dzc-feat{ display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; background: var(--dzc-tint); border-radius: 10px; font-size: .92em; line-height: 1.35; }
.dzc .dzc-feat::before{ color: var(--dzc-green); width: 1.5em; height: 1.5em; }
.dzc .dzc-feat strong{ display: block; font-size: 1.1em; font-weight: 600; }

.dzc .dzc-compat{ display: flex; gap: 8px; align-items: center; font-size: .92em; margin: 0 0 14px; }
.dzc .dzc-compat::before{ color: var(--dzc-green); }

.dzc .dzc-trust{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; padding: 14px 0; border-top: 1px solid var(--dzc-line); border-bottom: 1px solid var(--dzc-line); margin: 0 0 12px; }
.dzc .dzc-trust__item{ display: flex; gap: 8px; align-items: center; font-size: .88em; line-height: 1.3; }
.dzc .dzc-trust__item::before{ color: var(--dzc-green); }

.dzc .dzc-help{ display: flex; gap: 8px; align-items: center; font-size: .9em; color: var(--dzc-muted); margin: 0; }
.dzc .dzc-help::before{ color: var(--dzc-green); }
.dzc .dzc-help a{ color: var(--dzc-black); font-weight: 600; }

/* ==========================================================================
   DESCRIPTION LONGUE
   ========================================================================== */
.dzc.dzc-ld{ font-size: 16px; }
.dzc.dzc-ld > * + *{ margin-top: clamp(44px, 6vw, 80px); }
.dzc.dzc-ld > .dzc-hero + .dzc-kpis{ margin-top: 24px; }

/* Visuels : placeholder puis <img> */
.dzc .dzc-media{ margin: 0; border-radius: var(--dzc-radius); overflow: hidden; background: var(--dzc-tint); aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.dzc .dzc-media img{ display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; }
.dzc .dzc-media__ph{ font-size: .85em; line-height: 1.4; color: var(--dzc-muted); text-align: center; padding: 16px 20px; border: 1px dashed currentColor; border-radius: 10px; max-width: 80%; }

/* Hero sombre : le seul moment "fort" de la page */
.dzc .dzc-hero{ background: var(--dzc-green); color: var(--dzc-on-dark); border-radius: var(--dzc-radius); overflow: hidden; display: grid; grid-template-columns: 1.05fr 1fr; align-items: stretch; }
.dzc .dzc-hero__text{ padding: clamp(28px, 5vw, 64px); align-self: center; }
.dzc .dzc-hero .dzc-lede{ color: var(--dzc-on-dark-soft); }
.dzc .dzc-hero .dzc-media{ border-radius: 0; aspect-ratio: auto; min-height: 340px; background: #1B3A2C; }
.dzc .dzc-hero .dzc-media__ph{ color: var(--dzc-on-dark-soft); }

/* Focus visible sur fond vert */
.dzc .dzc-hero a:focus-visible, .dzc .dzc-cta a:focus-visible{ outline-color: var(--dzc-gold); }

/* Boutons */
.dzc .dzc-actions{ display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.dzc a.dzc-btn{ display: inline-flex; align-items: center; gap: 8px; padding: 13px 24px; border-radius: 999px; font-weight: 600; font-size: .95em; line-height: 1.2; text-decoration: none; border: 1.5px solid transparent; transition: background-color .2s, color .2s; }
.dzc a.dzc-btn--primary{ background: var(--dzc-gold); color: var(--dzc-green); }
.dzc a.dzc-btn--primary:hover{ background: #FFD66B; }
.dzc a.dzc-btn--ghost{ border-color: currentColor; color: inherit; }
.dzc a.dzc-btn--ghost:hover{ background: rgba(127, 127, 127, .14); }
.dzc .dzc-btn::before{ width: 1.1em; height: 1.1em; }

/* Chiffres clés */
.dzc .dzc-kpis{ display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--dzc-line); border-bottom: 1px solid var(--dzc-line); }
.dzc .dzc-kpi{ padding: 22px 16px; text-align: center; }
.dzc .dzc-kpi + .dzc-kpi{ border-left: 1px solid var(--dzc-line); }
.dzc .dzc-kpi__value{ display: block; font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.3rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.1; color: var(--dzc-green); }
.dzc .dzc-kpi__label{ display: block; font-size: .85em; color: var(--dzc-muted); margin-top: 6px; }

/* Blocs texte + visuel alternés */
.dzc .dzc-split{ display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 64px); align-items: center; }
.dzc .dzc-split + .dzc-split{ margin-top: clamp(36px, 5vw, 64px); }
.dzc .dzc-split--rev .dzc-media{ order: 2; }
.dzc .dzc-split__text{ max-width: 52ch; }
.dzc .dzc-split__text .dzc-checks{ margin-top: 16px; }

/* Étapes (vraie séquence) */
.dzc .dzc-steps{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; counter-reset: dzc-step; }
.dzc .dzc-step{ counter-increment: dzc-step; padding: 20px; border-radius: var(--dzc-radius); background: var(--dzc-tint); }
.dzc .dzc-step::before{ content: counter(dzc-step); display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--dzc-green); color: var(--dzc-gold); font-weight: 600; font-size: .9em; margin-bottom: 12px; }
.dzc .dzc-step strong{ display: block; margin-bottom: 4px; }
.dzc .dzc-step p{ margin: 0; font-size: .92em; color: var(--dzc-muted); }
.dzc .dzc-note{ font-size: .9em; color: var(--dzc-muted); margin: 14px 0 0; }

/* Liens complémentaires (cross-sell) */
.dzc .dzc-links{ display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.dzc a.dzc-link{ display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 18px 20px; border: 1px solid var(--dzc-line); border-radius: 12px; text-decoration: none; transition: border-color .2s; }
.dzc a.dzc-link:hover{ border-color: var(--dzc-green); }
.dzc .dzc-link strong{ font-weight: 600; }
.dzc .dzc-link span{ font-size: .88em; color: var(--dzc-muted); line-height: 1.45; }

/* Pourquoi DZ Coffee Machine */
.dzc .dzc-why{ background: var(--dzc-cashmere); border-radius: var(--dzc-radius); padding: clamp(24px, 4.5vw, 52px); }
.dzc .dzc-why__grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px 36px; }
.dzc .dzc-why__item{ display: flex; gap: 14px; align-items: flex-start; }
.dzc .dzc-why__item::before{ color: var(--dzc-green); width: 1.7em; height: 1.7em; }
.dzc .dzc-why__item strong{ display: block; margin-bottom: 2px; }
.dzc .dzc-why__item span{ color: var(--dzc-muted); font-size: .95em; }
.dzc .dzc-why__item strong{ color: var(--dzc-black); }

/* Fiche technique */
.dzc .dzc-cols{ display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.dzc table.dzc-specs{ width: 100%; border-collapse: collapse; margin: 0; font-size: .95em; border: 0; background: none; }
.dzc table.dzc-specs th, .dzc table.dzc-specs td{ padding: 13px 0; border: 0; border-bottom: 1px solid var(--dzc-line); text-align: left; vertical-align: top; background: none; }
.dzc table.dzc-specs tr:first-child th, .dzc table.dzc-specs tr:first-child td{ border-top: 1px solid var(--dzc-line); }
.dzc table.dzc-specs th{ font-weight: 500; color: var(--dzc-muted); width: 46%; padding-right: 16px; }
.dzc .dzc-inbox{ padding: 24px; border-radius: var(--dzc-radius); background: var(--dzc-tint); }

/* FAQ (details/summary natif : sans JavaScript, indexable) */
.dzc .dzc-faq{ border-top: 1px solid var(--dzc-line); max-width: 820px; }
.dzc .dzc-faq details{ border-bottom: 1px solid var(--dzc-line); }
.dzc .dzc-faq summary{ list-style: none; cursor: pointer; padding: 18px 40px 18px 0; font-weight: 600; position: relative; }
.dzc .dzc-faq summary::-webkit-details-marker{ display: none; }
.dzc .dzc-faq summary::after{ content: ""; position: absolute; right: 8px; top: 50%; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-70%) rotate(45deg); transition: transform .2s; }
.dzc .dzc-faq details[open] summary::after{ transform: translateY(-25%) rotate(-135deg); }
.dzc .dzc-faq details p{ margin: 0; padding: 0 0 20px; color: var(--dzc-muted); max-width: 70ch; }

/* Appel à l'action final */
.dzc .dzc-cta{ background: var(--dzc-green); color: var(--dzc-on-dark); border-radius: var(--dzc-radius); padding: clamp(28px, 5vw, 56px); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; }
.dzc .dzc-cta__title{ font-size: clamp(1.35rem, 1.1rem + 1vw, 1.8rem); font-weight: 600; letter-spacing: -.015em; line-height: 1.2; margin: 0 0 6px; }
.dzc .dzc-cta__text{ margin: 0; color: var(--dzc-on-dark-soft); }
.dzc .dzc-cta .dzc-actions{ margin: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .dzc .dzc-hero, .dzc .dzc-split, .dzc .dzc-cols{ grid-template-columns: 1fr; }
  .dzc .dzc-split--rev .dzc-media{ order: 0; }
  .dzc .dzc-hero .dzc-media{ min-height: 0; aspect-ratio: 4 / 3; }
  .dzc .dzc-steps{ grid-template-columns: repeat(2, 1fr); }
  .dzc .dzc-kpis{ grid-template-columns: repeat(2, 1fr); }
  .dzc .dzc-kpi:nth-child(3){ border-left: 0; }
  .dzc .dzc-kpi:nth-child(n+3){ border-top: 1px solid var(--dzc-line); }
}
@media (max-width: 560px) {
  .dzc .dzc-why__grid, .dzc .dzc-steps{ grid-template-columns: 1fr; }
  .dzc .dzc-feat{ flex-direction: column; gap: 6px; padding: 10px 12px; font-size: .88em; }
  .dzc .dzc-trust{ gap: 8px 12px; }
  .dzc .dzc-trust__item{ font-size: .84em; }
  .dzc .dzc-actions, .dzc a.dzc-btn{ width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .dzc *, .dzc *::before, .dzc *::after{ transition: none !important; }
}


/* hada css fiche produit */ 
/* UPSEL IMAGE */
#wps-ob-st .wps-ob-st__m-in img {aspect-ratio:0 !important;
}
/* rendre les images responsivie banner produits description produits*/
/* Banner responsive */
.wp-caption.alignnone {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center; /* Centrer le texte sous l'image */
}

.wp-caption img {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
}


@media only screen and (max-width: 600px) {


  .topbar-service {
    font-size: 11px; /* Ajustez la taille de police selon vos besoins */
		text-align:center;
  }
}


/** neuf et occasion column repartition **/
.sub-neuf {
   column-count: 2;
  column-width: 250px;
  column-fill: balance;
}
.sub-occasion {
   column-count: 2;
  column-width: 250px;
  column-fill: balance;
}

/** image de megamenu café : redimensionner **/
.nasa-megamenu>.nav-dropdown>ul>.menu-item>a img {
    margin: 0px;
    padding-top: 0px;
}
.sub-cafe .nasa-mega-img {
    width: 50%;
    height: 50%;
}


/** mobile nav menu uppercase**/

.nav-dropdown-mobile li a {
    text-transform: uppercase;
}

/** meta article cacher **/
.entry-meta {display:none;}


/**  **/
/* ndiro icone equivalente */
body.elementor-page .mobile-search.pe-7s-search::before {
    content: "\e618" !important;  /* puisque elementor force */
    display: inline-block !important;
    font-family: 'pe-icon-7-stroke',"pe-icon-7-stroke Fallback"!important;
    font-size: 25px !important;
    font-style: normal !important;
    font-weight: normal !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    color: inherit !important; /* couleur du theme*/
    vertical-align: middle !important;
    margin-left: 0px !important;
}

/* Désactive l'icône originale */
body.elementor-page .mobile-search.pe-7s-search {
    font-size: 0 !important;
}
/* Conteneur global */
.score-row {
  display: flex;
  flex-direction: column; /* label au-dessus, barre en dessous */
  gap: 4px;
  font-size: 14px;
}

/* Label sur la première ligne */
.score-label {
  font-weight: 500;
}

/* Conteneur barre + valeur */
.score-bar-container {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Barre globale */
.score-bar {
  position: relative;
  flex: 1;
  height: 8px;
  border-radius: 6px;
  overflow: hidden;
  background-color: #efddcd;
  max-width: 100%;
}

/* Remplissage continu */
.score-fill {
  height: 100%;
  background-color: #122620;
  transition: width 0.3s ease;
}

/* Masque de segmentation flexible */
.score-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    to right,
    transparent 0,
    transparent calc(100% / 5 - 1px),
    #ffffff calc(100% / 5 - 1px),
    #ffffff calc(100% / 5)
  );
  pointer-events: none;
}

/* Valeur de la note */
.score-value {
  font-weight: bold;
  white-space: nowrap; /* empêcher le saut sur mobile */
}

/* Responsive mobile */
@media (max-width: 480px) {
  .score-row {
    font-size: 12px;
    gap: 2px;
  }

  .score-bar {
    height: 6px;
  }

  .score-bar::after {
    background: repeating-linear-gradient(
      to right,
      transparent 0,
      transparent calc(100% / 5 - 0.5px),
      #ffffff calc(100% / 5 - 0.5px),
      #ffffff calc(100% / 5)
    );
  }

  .score-bar-container {
    gap: 4px;
  }
}