/* ==================================================
   MEDIWALK — FICHE PRODUIT MONTRE ELYA · charte pro
   Même système que la VP2 (Manrope + Inter).
   Tout est limité à #ely-product : aucun effet sur le reste du site.
   ================================================== */

#ely-product,
#sticky-buy-bar,
#mw-modal,
#mwv-overlay {
  --ink: #0f2d4a;
  --text: #33475b;
  --muted: #5b6b7b;
  --blue: #1194d6;
  --blue-dark: #0b74ad;
  --blue-soft: #e8f4fc;
  --coral: #ff5a1f;
  --coral-dark: #e14a12;
  --coral-soft: #fff0e9;
  --green: #14a37f;
  --green-dark: #0b7a5e;
  --green-soft: #e4f6f0;
  --amber: #f2a516;
  --amber-soft: #fff6e0;
  --violet: #6c5ce7;
  --line: #dfe7ee;
  --bg-soft: #f4f8fb;
  --radius: 18px;
  --shadow: 0 14px 40px rgba(15, 45, 74, .08);
  --shadow-strong: 0 22px 60px rgba(15, 45, 74, .16);
  --font-title: "Manrope", "Segoe UI", Arial, sans-serif;
  --font-text: "Inter", "Segoe UI", Arial, sans-serif;
}

/* ---------- Base ---------- */

#ely-product {
  display: block;
  position: relative;
  /* Neutralise les règles du site qui limitent <main> (largeur, flottement, marges) */
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 0 0 100% !important;
  float: none !important;
  clear: both !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border: 0 !important;
  padding-top: 70px;              /* hauteur du menu fixe */
  color: var(--text);
  background: #fff;
  font: 400 17px/1.7 var(--font-text);
  -webkit-font-smoothing: antialiased;
  text-align: left;
}
#ely-product *, #ely-product *::before, #ely-product *::after { box-sizing: border-box; }
#ely-product img { display: block; max-width: 100%; height: auto; }
#ely-product a { color: var(--blue-dark); }
#ely-product p { margin: 0 0 14px; text-align: left; hyphens: none; }
#ely-product strong, #ely-product b, #ely-product em { font-family: inherit; }
#ely-product strong { font-weight: 700; color: var(--ink); }

#ely-product h1, #ely-product h2, #ely-product h3, #ely-product h4, #ely-product h5 {
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--ink);
  font-family: var(--font-title);
  text-transform: none;
  letter-spacing: -.01em;
}
#ely-product h2 { font-size: clamp(28px, 3vw, 38px); font-weight: 800; line-height: 1.2; }
#ely-product h3 { margin-bottom: 12px; font-size: 22px; font-weight: 800; line-height: 1.3; }
#ely-product h4 { font-size: 17px; font-weight: 700; line-height: 1.4; }
#ely-product h2 em, #ely-product h3 em, #ely-product h4 em { font-style: normal; }

#ely-product .ep-wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 32px; }

#ely-product .ep-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--blue-dark);
  font: 700 12.5px/1.3 var(--font-text);
  letter-spacing: .12em;
  text-transform: uppercase;
}
#ely-product .ep-kicker::before { content: ""; width: 20px; height: 3px; border-radius: 3px; background: var(--coral); }

/* ---------- Boutons ---------- */

#ely-product .ep-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 14px 22px;
  border: 0;
  border-radius: 14px;
  font: 700 16px/1.2 var(--font-text);
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s, background .2s;
  -webkit-tap-highlight-color: transparent;
}
#ely-product .ep-btn:hover { transform: translateY(-1px); text-decoration: none; }
#ely-product .ep-btn--buy { background: linear-gradient(180deg, #ff6a33, var(--coral)); color: #fff; box-shadow: 0 10px 24px rgba(255, 90, 31, .32); }
#ely-product .ep-btn--buy:hover { background: var(--coral-dark); color: #fff; }
#ely-product .ep-btn--ghost { border: 1.5px solid rgba(255, 255, 255, .7); background: rgba(255, 255, 255, .08); color: #fff; }
#ely-product .ep-btn--ghost:hover { background: rgba(255, 255, 255, .18); color: #fff; }
#ely-product .ep-btn--soft { border: 1px solid var(--line); background: #fff; color: var(--ink); }
#ely-product .ep-btn--soft:hover { background: var(--blue-soft); color: var(--ink); }
#ely-product .ep-btn--violet { background: var(--violet); color: #fff; }
#ely-product .ep-btn--navy { background: var(--ink); color: #fff; }
#ely-product .ep-btn--light { background: #fff; color: var(--ink); }
#ely-product .ep-btn--light:hover { background: var(--blue-soft); color: var(--ink); }
#ely-product .ep-btn--block { width: 100%; }
#ely-product .ep-btn:focus-visible { outline: 3px solid var(--amber); outline-offset: 3px; }

#ely-product .ep-link { font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Hero ---------- */

#ely-product .ep-hero {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  min-height: 460px;
  overflow: hidden;
  background: var(--ink);
}
#ely-product .ep-hero__bg {
  position: absolute;
  inset: 0;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center 18%;
}
/* Ordinateur : photo entière sur la hauteur du cadre, calée à droite, fondue vers le texte */
@media (min-width: 861px) {
  #ely-product .ep-hero__bg {
    left: auto !important;
    right: 0;
    width: auto !important;
    max-width: 78% !important;
    object-fit: cover;
    object-position: right top;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28%);
    mask-image: linear-gradient(90deg, transparent 0, #000 28%);
  }
  #ely-product .ep-hero { background: linear-gradient(90deg, #0a1e32 0%, #0f2d4a 55%, #0f2d4a 100%); }
  #ely-product .ep-hero::after { background: linear-gradient(90deg, rgba(10, 30, 50, .75) 0%, rgba(10, 30, 50, .35) 40%, rgba(10, 30, 50, 0) 60%); }
}
#ely-product .ep-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 30, 50, .88) 0%, rgba(10, 30, 50, .6) 45%, rgba(10, 30, 50, 0) 75%);
}
#ely-product .ep-hero__inner { position: relative; z-index: 1; width: 100%; padding-top: 48px; padding-bottom: 56px; }
#ely-product .ep-hero__inner > * { max-width: 600px; }
#ely-product .ep-breadcrumb { display: flex; gap: 10px; margin-bottom: 18px; color: rgba(255, 255, 255, .8); font-size: 14px; }
#ely-product .ep-breadcrumb a { color: #fff; }
#ely-product .ep-hero h1 { color: #fff; font-size: clamp(38px, 4.4vw, 56px); font-weight: 800; line-height: 1.08; letter-spacing: -.02em; }
#ely-product .ep-hero__lead { margin: 16px 0 4px; color: #fff; font-size: 21px; font-weight: 600; }
#ely-product .ep-hero__sub { color: #cfe7f7; font-size: 18px; }
#ely-product .ep-hero__sub em { font-style: normal; font-weight: 700; color: #fff; }
#ely-product .ep-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }

/* ---------- Mise en page à 2 colonnes ---------- */

#ely-product .ep-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  grid-template-areas: "main buy" "main side";
  grid-template-rows: auto 1fr;
  column-gap: 48px;
  padding-top: 56px;
  padding-bottom: 24px;
}
#ely-product .ep-layout > * { min-width: 0; }
#ely-product .ep-main { grid-area: main; min-width: 0; }
#ely-product .ep-buy { grid-area: buy; }
#ely-product .ep-side { grid-area: side; }

/* ---------- Introduction ---------- */

#ely-product .ep-intro { margin-bottom: 36px; text-align: center; }
#ely-product .ep-intro h2 em { color: var(--blue); }
#ely-product .ep-intro__sub { margin: 8px 0 22px; color: var(--muted); font-size: 18px; text-align: center; }

#ely-product .ep-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 22px; padding: 0; list-style: none; }
#ely-product .ep-chips li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
}
#ely-product .ep-chips i { color: var(--blue); }
#ely-product .ep-chips .is-price { background: var(--coral); color: #fff; }
#ely-product .ep-chips .is-price i, #ely-product .ep-chips .is-price strong { color: #fff; }

#ely-product .ep-certif { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px; margin-bottom: 22px; }
#ely-product .ep-certif h4 { color: var(--muted); font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
#ely-product .ep-certif span { padding: 4px 12px; border: 1.5px solid #b8c4cf; border-radius: 8px; color: #7a8896; font: 800 16px/1.2 Arial, sans-serif; }

#ely-product .ep-highlight { padding: 20px 22px; border-radius: var(--radius); background: var(--green-soft); }
#ely-product .ep-highlight h3 { margin: 0 0 4px; color: var(--green-dark); font-size: 20px; }
#ely-product .ep-highlight h4 { color: var(--ink); font-size: 16px; font-weight: 600; }

/* ---------- Blocs de contenu ---------- */

#ely-product .ep-block { margin-bottom: 26px; }

#ely-product .ep-card {
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
#ely-product .ep-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 16px;
  border-radius: 15px;
  font-size: 22px;
}
#ely-product .tone-blue  { background: var(--blue-soft);  color: var(--blue-dark); }
#ely-product .tone-coral { background: var(--coral-soft); color: var(--coral-dark); }
#ely-product .tone-green { background: var(--green-soft); color: var(--green-dark); }
#ely-product .tone-amber { background: var(--amber-soft); color: #b67900; }

#ely-product .ep-media {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  align-items: center;
  gap: 32px;
  padding: 30px;
  border-radius: var(--radius);
  background: var(--bg-soft);
}
#ely-product .ep-media > img { width: 100%; border-radius: 14px; mix-blend-mode: multiply; }
#ely-product .ep-media--small { grid-template-columns: 150px minmax(0, 1fr); }
#ely-product .ep-media h4 { margin: -4px 0 12px; color: var(--muted); font-size: 16px; font-weight: 600; }
#ely-product .ep-media__full { grid-column: 1 / -1; margin: 0; }
#ely-product .ep-h3-sub { color: var(--muted) !important; font-size: 17px !important; font-weight: 600 !important; }

#ely-product .ep-prose { padding: 0 4px; }


#ely-product .ep-note {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-left: 4px solid var(--blue);
  border-radius: 10px;
  background: var(--blue-soft);
  color: var(--ink);
  font-size: 15.5px;
  line-height: 1.55;
}
#ely-product .ep-note em { font-style: normal; }
#ely-product .ep-note--amber { border-left-color: var(--amber); background: var(--amber-soft); }

#ely-product .ep-badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
#ely-product .ep-badges li {
  padding: 7px 12px;
  border-radius: 999px;
  background: var(--coral-soft);
  color: #a33a0f;
  font-size: 14px;
  font-weight: 700;
}
#ely-product .ep-badges li::before { content: "✓ "; }

#ely-product .ep-checks { margin: 0 0 16px; padding: 0; list-style: none; }
#ely-product .ep-checks li { position: relative; padding: 5px 0 5px 32px; color: var(--ink); font-weight: 600; }
#ely-product .ep-checks li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 6px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--green-soft);
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
  line-height: 22px;
  text-align: center;
}

/* ---------- Colonne achat ---------- */

#ely-product .ep-buy__card {
  position: sticky;
  top: 96px;
  margin-bottom: 24px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  box-shadow: var(--shadow-strong);
  text-align: center;
}
#ely-product .ep-buy__card > img:first-child { width: 190px; margin: 0 auto 10px; }
#ely-product .ep-buy__price { color: var(--ink); font: 800 46px/1 var(--font-title); letter-spacing: -.03em; }
#ely-product .ep-buy__price small { font-size: 20px; letter-spacing: 0; }
#ely-product .ep-buy__tag { margin: 10px 0 16px; color: var(--green-dark); font-size: 15px; font-weight: 700; text-align: center; }
#ely-product .ep-buy__list { margin: 0 0 18px; padding: 0; list-style: none; text-align: left; }
#ely-product .ep-buy__list li { padding: 9px 0 9px 28px; border-bottom: 1px solid var(--line); position: relative; color: var(--ink); font-size: 15.5px; }
#ely-product .ep-buy__list li::before { content: "✓"; position: absolute; left: 2px; color: var(--green); font-weight: 800; }
#ely-product .ep-buy__alt { display: block; margin: 14px 0; font-size: 15px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
#ely-product .ep-buy__pay { width: 180px; margin: 0 auto 8px; }
#ely-product .ep-buy__sim { margin: 0; color: var(--muted); font-size: 13.5px; text-align: center; }

/* ---------- Colonne infos ---------- */

#ely-product .ep-side__box {
  margin-bottom: 20px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}
#ely-product .ep-side__box h3 { font-size: 19px; }
#ely-product .ep-side__box h3:not(:first-child) { margin-top: 22px; }
#ely-product .ep-side__box h4 { margin: -4px 0 10px; color: var(--muted); font-size: 15px; }
#ely-product .ep-side__box p { font-size: 15.5px; line-height: 1.65; }
#ely-product .ep-side__title { margin-bottom: 12px !important; color: var(--ink); font: 800 17px/1.3 var(--font-title) !important; }
#ely-product .ep-side__actions { display: grid; gap: 10px; }
#ely-product .ep-side__actions .ep-btn { width: 100%; font-size: 15.5px; }
#ely-product .ep-side__box-img { width: 45%; margin: 6px auto 14px; }
#ely-product .ep-side__box h3.ep-side__big { margin-top: 0; }
#ely-product .ep-side__big { margin-bottom: 8px !important; color: inherit; font: 800 20px/1.3 var(--font-title) !important; }

#ely-product .ep-side__box--green { border: 0; background: linear-gradient(135deg, #14a37f, #0b7a5e); color: #fff; }
#ely-product .ep-side__box--navy  { border: 0; background: linear-gradient(135deg, #0f2d4a, #1c4670); color: #fff; }
#ely-product .ep-side__box--green h3, #ely-product .ep-side__box--navy h3,
#ely-product .ep-side__box--green p,  #ely-product .ep-side__box--navy p { color: #fff; }
#ely-product .ep-side__box--green h3 em, #ely-product .ep-side__box--navy h3 em { color: rgba(255, 255, 255, .8); font-size: 15px; letter-spacing: .08em; text-transform: uppercase; }

#ely-product .ep-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 0; padding: 0; list-style: none; }
#ely-product .ep-pills h3 { margin: 0 !important; color: #fff; font: 600 14px/1.3 var(--font-text) !important; letter-spacing: 0; }
#ely-product .ep-pills li { padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, .18); color: #fff; font-size: 14px; font-weight: 600; }

#ely-product .ep-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
#ely-product .ep-share p { flex: 1 0 100%; margin: 0 0 4px; color: var(--muted); font-size: 14px; }
#ely-product .ep-share button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  font-size: 17px;
  cursor: pointer;
}
#ely-product .ep-share button:hover { background: var(--blue-soft); }

#ely-product .ep-reviews > img { width: 100%; margin-bottom: 16px; border-radius: 12px; }
#ely-product .ep-reviews > img:last-child { margin: 16px 0 0; }
#ely-product .ep-reviews figure { margin: 0 0 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
#ely-product .ep-stars { color: #feb300; font-size: 18px; letter-spacing: 2px; }
#ely-product .ep-reviews blockquote { margin: 6px 0 10px; padding: 0; border: 0; color: var(--text); font-size: 15px; line-height: 1.65; }
#ely-product .ep-reviews figcaption h4 { margin: 0; font-size: 14.5px; }
#ely-product .ep-reviews figcaption h5 { margin: 2px 0 0; color: var(--muted); font: 600 13.5px/1.3 var(--font-text); }

/* ---------- Pleine largeur ---------- */

#ely-product .ep-full { padding-top: 16px; padding-bottom: 56px; }
#ely-product .ep-full .ep-media { grid-template-columns: 320px minmax(0, 1fr); }

#ely-product .ep-table-wrap { overflow-x: auto; margin: 18px 0 0; border: 1px solid var(--line); border-radius: 14px; -webkit-overflow-scrolling: touch; }
#ely-product .ep-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15.5px; }
#ely-product .ep-table th, #ely-product .ep-table td { padding: 13px 14px; border-bottom: 1px solid var(--line); text-align: center; }
#ely-product .ep-table thead th { background: var(--ink); color: #fff; font: 700 14px/1.3 var(--font-text); }
#ely-product .ep-table tbody th { color: var(--ink); font-weight: 600; text-align: left; }
#ely-product .ep-table td { color: var(--green); font-weight: 800; }
#ely-product .ep-table td:last-child { color: #b9c4ce; }
#ely-product .ep-table tr.is-key th { font-weight: 800; }
#ely-product .ep-table tr.is-key td:last-child { color: var(--green); }
#ely-product .ep-table tbody tr:nth-child(even) { background: var(--bg-soft); }
#ely-product .ep-table tbody tr:last-child > * { border-bottom: 0; }
#ely-product .ep-table tr.is-key { background: var(--coral-soft) !important; }
#ely-product .ep-table-legend { margin: 12px 2px 0; font-size: 14.5px; color: var(--muted); }

#ely-product .ep-colors h3 { text-align: center; }
#ely-product .ep-colors__grid { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 12px; }
#ely-product .ep-colors figure { margin: 0; text-align: center; }
#ely-product .ep-colors img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 14px; background: var(--bg-soft); }
#ely-product .ep-colors figcaption { margin-top: 6px; color: var(--muted); font-size: 13px; font-weight: 600; line-height: 1.3; }

#ely-product .ep-brand {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px 32px;
  margin: 10px 0 30px;
  padding: 30px 34px;
  border-radius: 22px;
  background: linear-gradient(120deg, #0f2d4a, #0b74ad);
  color: #fff;
}
#ely-product .ep-brand > div { flex: 1 1 420px; }
#ely-product .ep-brand h3 { color: #fff; }
#ely-product .ep-brand p { margin: 0; color: #d5e6f3; }

#ely-product .ep-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
#ely-product .ep-spec { padding: 26px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); }
#ely-product .ep-spec--wide { grid-column: 1 / -1; }
#ely-product .ep-spec h3 { display: flex; align-items: center; gap: 10px; font-size: 19px; }
#ely-product .ep-spec h3 i { color: var(--blue); }
#ely-product .ep-spec dl { margin: 0; }
#ely-product .ep-spec dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); }
#ely-product .ep-spec dl > div:last-child { border-bottom: 0; }
#ely-product .ep-spec dt { color: var(--muted); font-weight: 600; }
#ely-product .ep-spec dd { margin: 0; color: var(--ink); font-weight: 700; text-align: right; }
#ely-product .ep-grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
#ely-product .ep-grid4 > div { padding: 14px; border-radius: 12px; background: var(--bg-soft); }
#ely-product .ep-grid4 strong { display: block; margin-bottom: 2px; font-size: 15px; }
#ely-product .ep-grid4 span { color: var(--text); font-size: 14.5px; line-height: 1.45; }
#ely-product .ep-spec__note { margin: 14px 0 0; color: var(--green-dark); font-size: 15px; font-weight: 600; }

#ely-product .ep-closing { margin-top: 30px; padding: 30px; border-radius: 22px; background: var(--bg-soft); }
#ely-product .ep-closing__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
#ely-product .ep-financing { margin-top: 20px; padding: 20px 22px; border-left: 4px solid var(--green); border-radius: 12px; background: var(--green-soft); }
#ely-product .ep-financing strong { color: var(--green-dark); font-size: 17px; }
#ely-product .ep-financing p { margin: 6px 0 0; }

/* ---------- Modales vidéo / présentation ---------- */

#mw-modal, #mwv-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .88);
  backdrop-filter: blur(4px);
}
#mw-modal > button, #mwv-overlay > button {
  position: absolute;
  top: 14px;
  right: 18px;
  z-index: 100000;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .15);
  color: #fff;
  font-size: 22px;
  cursor: pointer;
}
#mw-content { width: min(94vw, 1120px); }
#mwv-player { max-width: min(94vw, 420px); max-height: 85vh; border-radius: 12px; box-shadow: 0 30px 80px rgba(0, 0, 0, .7); }

/* ---------- Tablette ---------- */

@media (max-width: 1100px) {
  #ely-product .ep-layout { grid-template-columns: minmax(0, 1fr) 330px; column-gap: 32px; }
  #ely-product .ep-media, #ely-product .ep-full .ep-media { grid-template-columns: 200px minmax(0, 1fr); gap: 24px; }
  #ely-product .ep-colors__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #ely-product .ep-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Smartphone ---------- */

@media (max-width: 860px) {
  #ely-product { padding-top: 64px; font-size: 16.5px; }
  #ely-product .ep-wrap { padding: 0 18px; }

  #ely-product .ep-hero { min-height: 0; }
  #ely-product .ep-hero::after { background: linear-gradient(180deg, rgba(10, 30, 50, .55) 0%, rgba(10, 30, 50, .9) 100%); }
  #ely-product .ep-hero__inner { padding-top: 34px; padding-bottom: 36px; text-align: center; }
  #ely-product .ep-hero__inner > * { margin-left: auto; margin-right: auto; }
  #ely-product .ep-breadcrumb { justify-content: center; font-size: 13px; }
  #ely-product .ep-hero h1 { font-size: 38px; }
  #ely-product .ep-hero__lead { font-size: 19px; text-align: center; }
  #ely-product .ep-hero__sub { text-align: center; }
  #ely-product .ep-hero__ctas { justify-content: center; }
  #ely-product .ep-hero__ctas .ep-btn { flex: 1 1 100%; }

  /* Ordre mobile : carte d'achat, contenu, infos */
  #ely-product .ep-layout { grid-template-columns: 1fr; grid-template-areas: "buy" "main" "side"; grid-template-rows: auto; padding-top: 24px; }
  #ely-product .ep-buy__card { position: static; margin-bottom: 36px; }

  #ely-product h2 { font-size: 28px; }
  #ely-product h3 { font-size: 20px; }
  #ely-product .ep-intro__sub { font-size: 16.5px; }
  #ely-product .ep-chips li { font-size: 14px; padding: 8px 12px; }

  #ely-product .ep-card, #ely-product .ep-media { padding: 22px 18px; }
  #ely-product .ep-media, #ely-product .ep-media--small, #ely-product .ep-full .ep-media { grid-template-columns: 1fr; gap: 18px; }
  #ely-product .ep-media > img { max-width: 260px; margin: 0 auto; }
  #ely-product .ep-media--small > img { max-width: 140px; }

  #ely-product .ep-side__box { padding: 20px 18px; }

  #ely-product .ep-colors__grid { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  #ely-product .ep-colors figure { flex: 0 0 36%; scroll-snap-align: start; }

  #ely-product .ep-brand { padding: 24px 20px; text-align: center; }
  #ely-product .ep-brand .ep-btn { width: 100%; white-space: normal; }

  #ely-product .ep-specs { grid-template-columns: 1fr; }
  #ely-product .ep-spec { padding: 20px 18px; }
  #ely-product .ep-closing { padding: 22px 18px; }
  #ely-product .ep-closing__ctas .ep-btn { width: 100%; }

  /* Bouton flottant du site masqué : remplacé par la barre d'achat */
  .container16 { display: none !important; }
}

@media (max-width: 380px) {
  #ely-product .ep-hero h1 { font-size: 33px; }
  #ely-product .ep-grid4 { grid-template-columns: 1fr; }
}

/* ==================================================
   BARRE D'ACHAT COLLANTE (#sticky-buy-bar)
   ================================================== */

@media (max-width: 860px) {
  body { padding-bottom: 84px; }
  #sticky-buy-bar {
    position: fixed !important;
    left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    border-top: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 -10px 30px rgba(15, 45, 74, .12) !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  #sticky-buy-bar .sbb-product,
  #sticky-buy-bar .sbb-sep,
  #sticky-buy-bar .sbb-no-sub,
  #sticky-buy-bar .sbb-btn-vir { display: none !important; }
  #sticky-buy-bar .sbb-price-block { display: block !important; flex: 0 0 auto !important; margin: 0 !important; padding: 0 6px !important; }
  #sticky-buy-bar .sbb-price { color: var(--ink) !important; font: 800 26px/1 var(--font-title) !important; }
  #sticky-buy-bar .sbb-actions { display: flex !important; flex: 1 1 auto !important; gap: 8px !important; margin: 0 !important; }
  #sticky-buy-bar .sbb-actions button {
    flex: 1 1 0 !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border-radius: 14px !important;
    font: 700 15px/1.2 var(--font-text) !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
  #sticky-buy-bar .sbb-btn-cb { border: 0 !important; background: linear-gradient(180deg, #ff6a33, var(--coral)) !important; color: #fff !important; box-shadow: 0 8px 18px rgba(255, 90, 31, .3) !important; }
  #sticky-buy-bar .sbb-btn-cb img { display: none !important; }
  #sticky-buy-bar .sbb-btn-call { flex: 0 0 auto !important; display: inline-flex !important; align-items: center; gap: 6px; border: 1.5px solid var(--ink) !important; background: #fff !important; color: var(--ink) !important; }
}
#sticky-buy-bar .sbb-btn-call { display: none; }
@media (max-width: 430px) {
  #sticky-buy-bar .sbb-btn-call { width: 52px !important; padding: 0 !important; }
  #sticky-buy-bar .sbb-btn-call span { display: none; }
  #sticky-buy-bar .sbb-btn-call i { font-size: 19px; }
}

/* PDF sur mobile : pas de fenêtre intégrée, ouverture directe (voir script) */


/* ==================================================
   FENÊTRES PDF (Magnific Popup) — identique VP2
   ================================================== */
.ep-pdf-modal {
  position: relative;
  width: min(1000px, 90vw);
  height: 80vh;
  margin: 5vh auto;
  padding: 50px 14px 14px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .38);
}
.ep-pdf-modal iframe { display: block !important; width: 100%; height: 100%; border: 0; border-radius: 8px; background: #fff; }
.ep-pdf-modal .mfp-close { top: 5px; right: 8px; width: 40px; height: 40px; color: #0f2d4a; font-size: 34px; line-height: 40px; opacity: .9; }
.ep-pdf-mfp.mfp-bg { background: #0f2d4a; opacity: .35; }
.ep-pdf-mfp .mfp-content { filter: drop-shadow(0 30px 60px rgba(15, 45, 74, .35)); }
.ep-pdf-mfp .mfp-container { padding: 10px; }
/* Secours sans Magnific Popup */
body:has(.ep-pdf-modal--open)::after { content: ""; position: fixed; inset: 0; z-index: 2147482999; background: rgba(15, 45, 74, .35); }
.ep-pdf-modal.ep-pdf-modal--open {
  position: fixed !important;
  inset: 0;
  z-index: 2147483000;
  width: auto;
  height: auto;
  margin: 3vh auto;
  max-width: min(1100px, 94vw);
  max-height: 94vh;
}
.ep-pdf-modal .ep-pdf-close {
  position: absolute; top: 6px; right: 10px;
  width: 40px; height: 40px; border: 0; border-radius: 50%;
  background: #f4f8fb; color: #0f2d4a; font-size: 28px; line-height: 40px; cursor: pointer;
}

/* Neutralise les barres décoratives ajoutées par l'ancienne CSS du site sur les titres */
#ely-product h1::before, #ely-product h2::before, #ely-product h3::before, #ely-product h4::before, #ely-product h5::before,
#ely-product h1::after,  #ely-product h2::after,  #ely-product h3::after,  #ely-product h4::after,  #ely-product h5::after {
  content: none !important;
  display: none !important;
}
#ely-product h1, #ely-product h2, #ely-product h3, #ely-product h4, #ely-product h5 { border-left: 0 !important; padding-left: 0 !important; }

/* ==================================================
   BADGES APPLICATIONS (iOS · Android · Web)
   ================================================== */
#ely-product .ep-apps { margin: 4px 0 24px; text-align: center; }
#ely-product .ep-apps__title { margin: 0 0 12px; color: var(--muted); font-size: 15px; font-weight: 600; text-align: center; }
#ely-product .ep-apps__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
#ely-product .ep-app {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 168px;
  padding: 9px 18px 9px 14px;
  border-radius: 12px;
  background: #0b0f14;
  color: #fff;
  text-align: left;
  text-decoration: none;
}
#ely-product .ep-app { cursor: default; }
#ely-product .ep-app i { width: 26px; font-size: 26px; text-align: center; }
#ely-product .ep-app span { display: flex; flex-direction: column; font: 700 17px/1.1 var(--font-title); }
#ely-product .ep-app small { margin-bottom: 2px; color: rgba(255, 255, 255, .75); font: 500 11px/1.2 var(--font-text); letter-spacing: .02em; }
#ely-product .ep-app--web { background: var(--blue-dark); }
#ely-product .ep-media .ep-apps { margin: 6px 0 0; text-align: left; }
#ely-product .ep-media .ep-apps__title { text-align: left; }
#ely-product .ep-media .ep-apps__list { justify-content: flex-start; }
@media (max-width: 860px) {
  #ely-product .ep-app { flex: 1 1 100%; justify-content: center; }
  #ely-product .ep-media .ep-apps__list { justify-content: center; }
  #ely-product .ep-media .ep-apps, #ely-product .ep-media .ep-apps__title { text-align: center; }
}

/* ==================================================
   MOYENS DE PAIEMENT (carte d'achat) — version discrète
   ================================================== */
#ely-product .ep-pay { margin: 2px 0 10px; }
#ely-product .ep-pay__title { margin: 0 0 7px; color: var(--muted); font-size: 12.5px; text-align: center; }
#ely-product .ep-pay__title i { color: var(--green); margin-right: 3px; font-size: 11px; }
#ely-product .ep-pay__title strong { color: #635bff; }
#ely-product .ep-pay__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin: 0; padding: 0; list-style: none; }
#ely-product .ep-pay__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  height: 24px;
  padding: 0 8px;
  border-radius: 6px;
  font: 700 11.5px/1 var(--font-text);
  white-space: nowrap;
}
#ely-product .ep-pay__item i { font-size: 12px; }
#ely-product .ep-pay--apple  { background: #000; color: #fff; }
#ely-product .ep-pay--google { border: 1px solid var(--line); background: #fff; color: #3c4043; }
#ely-product .ep-pay--google i { color: #4285f4; font-size: 11px; }
#ely-product .ep-pay--link   { background: #00d66f; color: #011e0f; gap: 3px; }
#ely-product .ep-pay--klarna { background: #ffa8cd; color: #17120f; }
#ely-product .ep-pay--cards  { border: 1px solid var(--line); background: #fff; color: var(--ink); gap: 3px; }
#ely-product .ep-pay--cards i { font-size: 15px; }
#ely-product .ep-pay--cards .fa-cc-visa { color: #1a1f71; }
#ely-product .ep-pay--cards .fa-cc-mastercard { color: #eb001b; }
#ely-product .ep-pay--cards span { font-size: 10.5px; }
#ely-product .ep-pay--stripe { background: #635bff; color: #fff; padding: 0 6px; }
#ely-product .ep-pay--stripe i { font-size: 24px; }

/* ==================================================
   FOOTER PRO (.ep-footer) + signature ELYA by Mediwalk
   ================================================== */
.ep-footer {
  --f-bg: #0c243b;
  --f-text: #b9cadb;
  --f-muted: #8aa1b8;
  --f-line: rgba(255, 255, 255, .1);
  position: relative;
  clear: both;
  margin-top: 40px;
  background:
    radial-gradient(700px 300px at 100% 0%, rgba(17, 148, 214, .18), transparent 70%),
    var(--f-bg);
  color: var(--f-text);
  font: 400 15px/1.6 "Inter", "Segoe UI", Arial, sans-serif;
  text-align: left;
}
.ep-footer::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, #1194d6, #14a37f 50%, #ff5a1f); }
.ep-footer *, .ep-footer *::before, .ep-footer *::after { box-sizing: border-box; }
.ep-footer a { color: var(--f-text); text-decoration: none; transition: color .2s; }
.ep-footer a:hover { color: #fff; text-decoration: none; }
.ep-footer ul { margin: 0; padding: 0; list-style: none; }
.ep-footer p { margin: 0; }
.ep-footer__wrap { max-width: 1240px; margin: 0 auto; padding: 64px 32px 0; }
.ep-footer__grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1.15fr; gap: 44px; padding-bottom: 44px; }

/* Signature ELYA by Mediwalk (reprise du logo) */
.ep-sign {
  display: inline-flex;
  align-items: flex-end;
  gap: 12px;
  padding: 24px 22px 12px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
  text-decoration: none !important;
  line-height: 1;
}
.ep-sign__mark { display: inline-flex; flex-direction: column; }
.ep-sign__name {
  color: #1d2a4f;
  font: italic 800 44px/0.9 "Playfair Display", Georgia, serif;
  letter-spacing: .02em;
}
.ep-sign__y { position: relative; display: inline-block; color: #f39200; }
.ep-sign__y i {
  position: absolute;
  top: -.26em;
  left: 50%;
  width: .2em;
  height: .2em;
  border-radius: 50%;
  background: #f39200;
  transform: translateX(-10%);
}
.ep-sign__brush { display: block; width: 118%; height: 12px; margin: 2px 0 0 -6%; }
.ep-sign__by {
  margin-bottom: 14px;
  color: #1d2a4f;
  font: 500 15px/1 "Inter", Arial, sans-serif;
  letter-spacing: .14em;
}
.ep-sign__by b { font-weight: 700; }
.ep-sign__by sup { font-size: 10px; letter-spacing: 0; }
.ep-sign:hover { box-shadow: 0 14px 36px rgba(0, 0, 0, .35); }

.ep-footer__tagline { margin: 18px 0 16px !important; max-width: 320px; color: var(--f-text); font-size: 14.5px; }
.ep-footer__addr { margin-bottom: 12px !important; font-size: 14.5px; }
.ep-footer__addr i { width: 18px; color: #33b6e8; }
.ep-footer__phone {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 14px; padding: 10px 16px;
  border-radius: 12px; background: #fff; color: #0f2d4a !important;
  font: 800 18px/1 "Manrope", Arial, sans-serif;
}
.ep-footer__phone i { color: #14a37f; }
.ep-footer__phone:hover { background: #e8f4fc; }
.ep-footer__hours { margin-bottom: 18px !important; font-size: 13.5px; }
.ep-footer__hours li { display: flex; justify-content: space-between; gap: 12px; max-width: 280px; padding: 3px 0; border-bottom: 1px dashed var(--f-line); }
.ep-footer__hours span { color: #fff; font-weight: 600; }
.ep-footer__social { display: flex; gap: 8px; }
.ep-footer__social a {
  display: grid; place-items: center;
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(255, 255, 255, .08); color: #fff; font-size: 15px;
}
.ep-footer__social a:hover { background: #1194d6; }

/* Colonnes */
.ep-footer__title { margin: 4px 0 14px !important; color: #fff; font: 700 13px/1.3 "Inter", Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.ep-footer__title--sub { margin-top: 26px !important; }
.ep-footer__col li { padding: 5px 0; font-size: 15px; }
.ep-footer__col li a { position: relative; }
.ep-footer__col li a:hover { padding-left: 4px; }
.ep-footer__account {
  display: inline-flex; align-items: center; gap: 8px;
  margin-bottom: 24px; padding: 9px 14px;
  border: 1px solid rgba(255, 255, 255, .25); border-radius: 10px;
  color: #fff !important; font-size: 14.5px; font-weight: 600;
}
.ep-footer__account:hover { background: rgba(255, 255, 255, .08); }
.ep-footer__small { color: var(--f-muted); font-size: 13.5px; line-height: 1.55; }
.ep-footer__pay { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ep-footer__pay span {
  display: inline-flex; align-items: center; gap: 3px;
  height: 26px; padding: 0 9px; border-radius: 6px;
  background: rgba(255, 255, 255, .1); color: #fff;
  font: 700 12px/1 "Inter", Arial, sans-serif;
}
.ep-footer__pay i { font-size: 16px; }

/* Barre légale */
.ep-footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px;
  padding: 20px 0 26px; border-top: 1px solid var(--f-line);
  color: var(--f-muted); font-size: 13px;
}
.ep-footer__bottom ul { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.ep-footer__bottom a { color: var(--f-muted); }
.ep-footer__bottom a:hover { color: #fff; }

@media (max-width: 1000px) {
  .ep-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .ep-footer__wrap { padding: 48px 18px calc(84px + env(safe-area-inset-bottom)); }
  .ep-footer__grid { grid-template-columns: 1fr 1fr; gap: 32px 20px; }
  .ep-footer__brand { grid-column: 1 / -1; text-align: center; }
  .ep-footer__tagline { margin-left: auto !important; margin-right: auto !important; }
  .ep-footer__hours li { max-width: 300px; margin: 0 auto; }
  .ep-footer__social { justify-content: center; }
  .ep-footer__col:last-child { grid-column: 1 / -1; }
  .ep-footer__bottom { flex-direction: column; text-align: center; }
  .ep-footer__bottom ul { justify-content: center; }
}

/* Formulaire de commande et menu mobile au-dessus de la barre d'achat */
.form-overlay { z-index: 2147482000 !important; }
.slide-form, #myModal { z-index: 2147482001 !important; }
.site-mobile-menu { z-index: 2147482500 !important; }

/* Le style mobile du site impose  p { font-family: Nautica; font-size: 1.2em }  : on garde la police de la page */
#ely-product p, #ely-product li, .ep-footer p, .ep-footer li { font-family: var(--font-text, "Inter", Arial, sans-serif); font-size: inherit; }
@media (max-width: 860px) {
  #ely-product { font-size: 16px !important; line-height: 1.65 !important; }
}
/* Formulaire : ouverture immédiate sur mobile (plus d'attente de l'animation) */
@media (max-width: 860px) {
  .slide-form, #myModal { transition: none !important; }
}
body > .site-wrap, #sticky-wrapper { max-width: 100%; }

/* Croix de fermeture du formulaire de commande : toujours visible */
#myModal .close-form, .slide-form .close-form {
  position: absolute !important; top: 10px !important; right: 12px !important; left: auto !important; float: none !important;
  display: flex !important; align-items: center; justify-content: center;
  width: 40px !important; height: 40px !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; border-radius: 50% !important;
  background: #0f2d4a !important; color: #fff !important;
  font: 400 26px/1 Arial, sans-serif !important;
  box-shadow: 0 4px 12px rgba(15, 45, 74, .25); cursor: pointer; z-index: 5; opacity: 1 !important;
}
#myModal .close-form:hover, .slide-form .close-form:hover { background: #ff5a1f !important; }