:root{--dx-pink:#F10082;--dx-dark:#222;--dx-muted:#555;--dx-bg:#fff}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--dx-dark);background:#fff;line-height:1.65}
.dx-header{border-bottom:1px solid #eee;background:#fff;position:sticky;top:0;z-index:10}
.dx-nav{max-width:980px;margin:0 auto;padding:.5rem 1rem;display:flex;flex-wrap:wrap;gap:.75rem}
.dx-nav__link--home { font-weight: 700; }
.dx-nav__link{text-decoration:none;color:var(--dx-dark);padding:.35rem .55rem;border-radius:.5rem}
.dx-nav__link:hover{background:#f7f7f7;color:var(--dx-pink)}
.dx-main{max-width:720px;width:100%;margin:0 auto;padding:1rem}
h1.dx-hero{font-size:clamp(1.6rem,3.5vw,2.2rem);color:var(--dx-pink);margin:1rem 0 .75rem}
.dx-lead{margin:.25rem 0 1rem}
.dx-editorial,.dx-benefits{margin:1rem 0}
.dx-sub{font-size:clamp(1.2rem,3vw,1.5rem);margin:1.25rem 0 .5rem;color:#333}
.dx-list{padding-left:1.25rem}
.dx-card{border:1px solid #eee;border-radius:.75rem;padding:1rem;margin:1rem 0}
a{color:var(--dx-pink)}
img{max-width:100%;height:auto}
.number{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
/* Footer compact */
.dx-footer{
  border-top:1px solid #eee;
  margin-top:.75rem;          /* avant: 2rem */
  padding:.5rem .75rem;       /* avant: 1rem */
  text-align:center;
  color:#555;
  font-size:.82rem;           /* ~13px */
  line-height:1.3;            /* plus serré */
}
.dx-footer p{ margin:.25rem 0; }
.dx-footer small{ font-size:.78rem; }
.dx-footer a{ color:inherit; text-decoration:none; opacity:.85; }
.dx-footer a:hover{ opacity:1; text-decoration:underline; }
.dx-footer--dense{
  margin-top:.5rem;
  padding:.35rem .6rem;
  font-size:.78rem;
  line-height:1.2;
}

/* Supprime l'espace “fantôme” au-dessus du footer si le dernier bloc a un gros margin-bottom */
.dx-main > *:last-child{ margin-bottom:0 !important; }

/* Mini-menu mobile (barre collée en bas) — améliorations accessibilité + safe-area + UX */
:root{
  --navmini-pad: 12px;
  --navmini-gap: 10px;
  --navmini-safe: env(safe-area-inset-bottom, 0px);
  --navmini-h: calc(56px + var(--navmini-pad) + var(--navmini-safe));
}

.dx-navmini{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1100;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid #eee;
  padding: 8px 10px calc(var(--navmini-pad) + var(--navmini-safe));
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.dx-navmini .row{
  display:flex; justify-content:center; align-items:center; gap: var(--navmini-gap); flex-wrap:wrap;
}
.dx-navmini .btn,
.dx-navmini .chips a{
  min-height: 40px; line-height: 1.1; /* cible tactile + lisibilité */
}
.dx-navmini .btn{
  display:inline-block; padding: 10px 14px; border-radius: 12px;
  text-decoration:none; font-weight:800;
}
.dx-navmini .btn.primary{ background:#F10082; color:#fff; }
.dx-navmini .btn.secondary{ background:#111; color:#fff; }

/* Focus visible (accessibilité) */
.dx-navmini a:focus-visible{
  outline: 2px solid #4d90fe; outline-offset: 2px; border-radius: 12px;
}

.dx-navmini .chips{
  margin-top:8px; display:flex; gap:8px; overflow-x:auto; padding-bottom:6px;
  -webkit-overflow-scrolling: touch; scrollbar-width: thin;
  scroll-snap-type: x proximity;
}
.dx-navmini .chips a{
  display:inline-block; padding:8px 10px; border:1px solid #e5e5e5;
  border-radius: 999px; background:#fff; color:#111; white-space:nowrap; text-decoration:none;
  scroll-snap-align: start;
}

/* Laisse de la place pour la barre en bas (mobile) */
@media (max-width: 820px){
  body.has-navmini{ padding-bottom: calc(var(--navmini-h) + 24px); }
}

/* IMPORTANT : si cover mobile plein écran, ne masque pas la mini-nav */
body .dx-cover ~ *:not(.dx-navmini){ display:none !important; }
body .dx-navmini{ display:block !important; }

/* Éditorial (desktop) */
.dx-editorial .dx-bgtext{
  background-image: url('/Content/girls_bw.png');
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain;
  width: 655px;                 /* largeur d’origine */
  min-height: 220px;
  margin: 0 auto;               /* centré */
  text-align: center;           /* alignement desktop */
  padding-top: 8px;
  color: #F10082;
}
/* ===== Telephone_rose — sections longues ===== */
.dx-section{ max-width:980px; margin:1rem auto; padding:0 1rem; }
.dx-section h2{ font-size:clamp(1.25rem,2.6vw,1.6rem); margin:.6rem 0 .4rem; }

.dx-ol{ line-height:1.8; margin:.3rem 0 .5rem 1.2rem; }
.dx-ul{ line-height:1.8; margin:.3rem 0 0 1.2rem; }
.dx-muted{ color:#666; }

.dx-cta{
  display:inline-block; padding:.85rem 1.2rem; border-radius:12px;
  border:1px solid var(--dx-pink); background:var(--dx-pink); color:#fff;
  text-decoration:none; font-weight:800;
}

/* Grille réutilisable (tips, avantages…) */
.dx-grid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px; }
.dx-col-6{ grid-column:span 6; min-width:260px; }
@media (max-width:820px){ .dx-col-6{ grid-column:span 12; } }

/* FAQ */
.dx-faq details{ margin:.4rem 0; }
.dx-faq details>div{ padding:.5rem 0; line-height:1.65; }

/* Logo-CTA centré */
.dx-ctaimg{ text-align:center; margin:.6rem 0; }
.dx-ctaimg a{ display:inline-block; }
.dx-ctaimg img{
  display:block; margin:0 auto;
  height:auto; max-width:min(520px,92vw); /* responsive ; ajuste si besoin */
  /* option: max-height:90px;  */
}

/* === Variante STICKY (facultative) =====
   Pour utiliser sticky en haut, commente le bloc .dx-navmini ci-dessus
   et décommente-le ci-dessous :
.dx-navmini{
  position: sticky; top: 0; bottom: auto; z-index: 1100;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid #eee;
  padding: 8px 10px var(--navmini-pad);
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
@media (max-width: 820px){
  body.has-navmini{ padding-bottom: 0; }
}
======================================= */