/* Règles de mise en page des pages, chargées en dernier.
   Texte étalé sur ordinateur, photos du corps à côté du texte,
   pas de glissement horizontal au téléphone. */
@media (min-width:901px){
  html:root body section:has(figure),
  html:root body .container:has(figure),
  html:root body .intro-text:has(figure),
  html:root body .article-body:has(figure),
  html:root body .art-body:has(figure),
  html:root body .si:has(figure){
    display:flow-root !important;
  }
  html:root body .container h2,
  html:root body .container h3,
  html:root body .article-body h2,
  html:root body .article-body h3,
  html:root body .art-body h2,
  html:root body .art-body h3,
  html:root body .intro-text h2,
  html:root body .intro-text h3,
  html:root body .gs-eyebrow,
  html:root body .split-photo,
  html:root body .spec-cards-grid,
  html:root body .spec-intro,
  html:root body .crit-grid,
  html:root body .criteres-grid,
  html:root body .alire-grid,
  html:root body .kf-wrap,
  html:root body .key-figures-section,
  html:root body .faq-wrap,
  html:root body .tldr,
  html:root body .rdv-strip,
  html:root body .qc-grid,
  html:root body table{
    clear:both !important;
  }
  html:root body .split-photo:not(:has(img)):not(:has(picture)){
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  html:root body .split-photo:not(:has(img)):not(:has(picture)) > div:first-child:empty,
  html:root body .split-photo:not(:has(img)):not(:has(picture)) > div:first-child:not(:has(p)):not(:has(h2)):not(:has(h3)):not(:has(span)):not(:has(img)){
    display:none !important;
  }
}
@media (min-width:901px){
  html:root body .container > figure,
  html:root body .intro-text > figure,
  html:root body .intro-text figure,
  html:root body main.article-body > figure,
  html:root body .article-body > figure,
  html:root body .art-body > figure,
  html:root body .si > figure,
  html:root body article > figure,
  html:root body section > figure,
  html:root body .section > figure,
  html:root body > figure,
  html:root body .fw-photo,
  html:root body .inline-img-full,
  html:root body figure.photo-fig{
    float:right !important;
    width:520px !important;
    max-width:520px !important;
    margin:6px 0 16px 22px !important;
    clear:right !important;
  }
  html:root body > .fw-photo,
  html:root body > figure{
    float:none !important;
    width:520px !important;
    max-width:520px !important;
    margin:16px auto !important;
    clear:both !important;
  }
  html:root body .fw-photo,
  html:root body .split-photo,
  html:root body .photo-gallery,
  html:root body figure.photo-fig,
  html:root body > figure{
    left:auto !important;
    right:auto !important;
  }
  html:root body .fw-photo > figure,
  html:root body .inline-img-full > figure,
  html:root body .split-photo figure,
  html:root body .spec-card figure,
  html:root body .crit-card figure,
  html:root body .alire-card figure,
  html:root body .kf-card figure,
  html:root body .hero-photo figure,
  html:root body header figure,
  html:root body footer figure,
  html:root body .page-hero figure,
  html:root body .article-hero figure{
    float:none !important;
    width:auto !important;
    max-width:100% !important;
    margin:0 0 12px !important;
    clear:none !important;
  }
  html:root body .container figure img,
  html:root body .intro-text figure img,
  html:root body .article-body figure img,
  html:root body .art-body figure img,
  html:root body .main-article figure img,
  html:root body .section-gs figure img,
  html:root body section.section figure img,
  html:root body > figure img,
  html:root body .si figure img,
  html:root body .fw-photo img,
  html:root body .inline-img-full img,
  html:root body .inline-img-grid img,
  html:root body .split-photo img,
  html:root body .photo-gallery img,
  html:root body figure.photo-fig img{
    width:520px !important;
    height:340px !important;
    max-width:520px !important;
    max-height:340px !important;
    aspect-ratio:520 / 340 !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
  html:root body .spec-cards-grid,
  html:root body .signs-wrap,
  html:root body .alire-grid,
  html:root body .faq-wrap,
  html:root body .criteres-grid,
  html:root body .kf-wrap,
  html:root body .split-photo,
  html:root body .intro-grid,
  html:root body .tldr,
  html:root body .crit-grid,
  html:root body table{
    clear:both !important;
  }
  html:root body .container:has(> figure),
  html:root body .intro-text:has(> figure),
  html:root body main.article-body:has(> figure),
  html:root body .article-body:has(> figure),
  html:root body .art-body:has(> figure),
  html:root body section:has(> figure),
  html:root body .si:has(> figure),
  html:root body .container:has(> .fw-photo),
  html:root body .container:has(> .inline-img-full),
  html:root body .article-body:has(> .fw-photo),
  html:root body .article-body:has(> .inline-img-full){
    display:flow-root !important;
  }
}
@media (max-width:900px){
  html:root body .photo-gallery{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
  }
  html:root body .photo-gallery figure{
    width:100% !important;
    max-width:100% !important;
    float:none !important;
  }
  html:root body .split-photo,
  html:root body .inline-img-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:100% !important;
  }
  html:root body .split-photo .sp-img,
  html:root body .split-photo picture,
  html:root body .inline-img-grid picture,
  html:root body .inline-img-grid > div{
    width:100% !important;
    max-width:100% !important;
  }
  html:root body .container > figure,
  html:root body .intro-text figure,
  html:root body main.article-body > figure,
  html:root body .article-body figure,
  html:root body .art-body figure,
  html:root body .si figure,
  html:root body article > figure,
  html:root body section > figure,
  html:root body > figure,
  html:root body .fw-photo,
  html:root body .inline-img-full,
  html:root body .split-photo figure,
  html:root body figure.photo-fig{
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    margin:1rem 0 !important;
    clear:both !important;
  }
  html:root body .container figure img,
  html:root body .intro-text figure img,
  html:root body .article-body figure img,
  html:root body .art-body figure img,
  html:root body .main-article figure img,
  html:root body .section-gs figure img,
  html:root body section.section figure img,
  html:root body > figure img,
  html:root body .si figure img,
  html:root body .fw-photo img,
  html:root body .inline-img-full img,
  html:root body .inline-img-grid img,
  html:root body .split-photo img,
  html:root body .photo-gallery img,
  html:root body figure.photo-fig img{
    display:block !important;
    width:320px !important;
    max-width:320px !important;
    height:210px !important;
    max-height:210px !important;
    aspect-ratio:320 / 210 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}
html:root body .fw-photo,
html:root body .split-photo,
html:root body .photo-gallery,
html:root body figure.photo-fig{
  left:auto !important;
  right:auto !important;
}
html:root body .nav-logo img{
  float:none !important;
  width:48px !important;
  height:48px !important;
  max-width:48px !important;
  max-height:48px !important;
  object-fit:cover !important;
}
html:root body .ft-logo img{
  float:none !important;
  width:52px !important;
  height:52px !important;
  max-width:52px !important;
  max-height:52px !important;
  object-fit:cover !important;
}
html:root body header.page-hero .ph-bg img,
html:root body .hero-photo img[data-photo-hero],
html:root body .article-hero img[data-photo-hero],
html:root body img[data-photo-hero]{
  float:none !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  max-height:none !important;
}

/* Ordinateur : le texte occupe la largeur utile. La photo reste à droite. */
@media (min-width:1101px){
  html:root body .intro-grid{
    display:block !important;
    max-width:none !important;
    width:100% !important;
  }
  html:root body .intro-text,
  html:root body .intro-text p,
  html:root body .tldr,
  html:root body .main-article p,
  html:root body .section-gs p,
  html:root body .main-article h2,
  html:root body .section-gs h2,
  html:root body .main-article li,
  html:root body .section-gs li,
  html:root body .geo-cite-inner,
  html:root body section.geo-block p,
  html:root body .s p,
  html:root body .si p,
  html:root body .intro-paragraphs,
  html:root body .intro-paragraphs p{
    max-width:none !important;
    width:auto !important;
  }
  html:root body .tldr{ margin-top:1.6rem !important; }
  html:root body #questions-cles > div{
    max-width:none !important;
    width:100% !important;
    padding-left:clamp(24px,4vw,72px) !important;
    padding-right:clamp(24px,4vw,72px) !important;
    box-sizing:border-box !important;
  }
  html:root body .geo-cite-inner,
  html:root body section.geo-block p{
    width:100% !important;
    box-sizing:border-box !important;
  }
}

/* Téléphone : la page ne défile pas de côté. Le sommaire, lui, suit le doigt
   (pan-x pan-y). pan-y sur html ou body coupe le geste horizontal des enfants. */
@media (max-width:900px){
  html:root{
    overflow-x:hidden !important;
    overflow-y:auto !important;
    max-width:100vw !important;
    width:100% !important;
    touch-action:pan-x pan-y !important;
  }
  html:root body{
    overflow-x:clip !important;
    overflow-y:visible !important;
    max-width:100vw !important;
    width:100% !important;
    touch-action:pan-x pan-y !important;
  }
  html:root body header,
  html:root body footer,
  html:root body section,
  html:root body .container,
  html:root body figure,
  html:root body .qc-grid,
  html:root body .rdv-strip,
  html:root body .rdv-strip-inner,
  html:root body .final-cta,
  html:root body table,
  html:root body img,
  html:root body picture{
    max-width:100vw !important;
    overflow-x:hidden !important;
  }
  /* clip, pas hidden : hidden sur main calcule overflow-y en auto
     et le sommaire ne suit plus le défilement. */
  html:root body main{
    max-width:100vw !important;
    overflow-x:clip !important;
    overflow-y:visible !important;
  }
  html:root body nav.sec-nav,
  html:root body .sec-nav-inner{
    touch-action:pan-x pan-y !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  html:root body [data-onglet-rdv-josamcha]{
    right:8px !important;
    left:auto !important;
    max-width:calc(100vw - 16px) !important;
  }
  html:root body #zchat-bubble{
    right:12px !important;
    max-width:calc(100vw - 24px) !important;
  }
  html:root body .lang-switcher{
    max-width:calc(100vw - 16px) !important;
  }
}

/* Cartes et colonnes étroites : la photo remplit la carte, elle ne déborde pas. */
@media (min-width:901px){
  html:root body .lib-card figure,
  html:root body .lib-card-body figure,
  html:root body .why-card figure,
  html:root body .spec-card figure,
  html:root body .alire-card figure,
  html:root body .crit-card figure,
  html:root body .kf-card figure,
  html:root body .concernee-text figure,
  html:root body .quick-defs figure,
  html:root body .hero-spec figure,
  html:root body .split-text figure,
  html:root body .split-photo figure{
    float:none !important;
    clear:both !important;
    width:100% !important;
    max-width:100% !important;
    margin:12px 0 !important;
  }
  html:root body .lib-card figure img,
  html:root body .lib-card-body figure img,
  html:root body .why-card figure img,
  html:root body .spec-card figure img,
  html:root body .alire-card figure img,
  html:root body .crit-card figure img,
  html:root body .kf-card figure img,
  html:root body .concernee-text figure img,
  html:root body .quick-defs figure img,
  html:root body .hero-spec figure img,
  html:root body .split-text figure img,
  html:root body .split-photo figure img{
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    max-height:240px !important;
    aspect-ratio:auto !important;
    object-fit:cover !important;
    margin:0 !important;
  }
}

/* Mammographe (fichier portrait) : même paysage cover que les autres photos du corps. */
@media (min-width:901px){
  html:root body img[src*="mammographe-amulet"]{
    width:520px !important;
    height:340px !important;
    max-width:520px !important;
    max-height:340px !important;
    aspect-ratio:520 / 340 !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}
@media (max-width:900px){
  html:root body img[src*="mammographe-amulet"]{
    display:block !important;
    width:320px !important;
    max-width:320px !important;
    height:210px !important;
    max-height:210px !important;
    aspect-ratio:320 / 210 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}

/* Menu mobile : icône blanche sur pastille marine (charte.css).
   L’ancien rose #ff2d78 restait peu lisible sur la photo du héros. */
@media (max-width:1100px){
  html:root body button.hamburger{
    position:relative !important;
    background:transparent !important;
    background-color:transparent !important;
    background-image:none !important;
    border-radius:0 !important;
    isolation:isolate !important;
  }
  html:root body button.hamburger::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    border-radius:999px !important;
    background:#0d1f35 !important;
    background-color:#0d1f35 !important;
    z-index:-1 !important;
    pointer-events:none !important;
  }
  html:root body button.hamburger span{
    background:transparent !important;
    background-color:transparent !important;
    background-image:none !important;
  }
  html:root body button.hamburger span.bar{
    background:#ffffff !important;
    background-color:#ffffff !important;
  }
  html:root body button.hamburger .m-label,
  html:root body button.hamburger .m-arrow{
    color:#ffffff !important;
  }
}

/* Bouton Doctolib de l’encart RDV : fond blanc, texte orange lisible. */
html:root body .qc-grid a[href*="doctolib"]:hover,
html:root body #questions-cles .qc-grid a[href*="doctolib"]:hover{
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  color:#c2410c !important;
  border-color:#0d1f35 !important;
}
html:root body .qc-grid a[href*="doctolib"]:hover *,
html:root body #questions-cles .qc-grid a[href*="doctolib"]:hover *{
  color:#c2410c !important;
  background:transparent !important;
}

/* Téléphone : la pastille ne s’étale plus sur le titre.
   FR/EN restent en bas à gauche. Le héros s’arrête au-dessus de la bande. */
@media (max-width:900px){
  html:root body .lang-switcher{
    position:fixed !important;
    top:auto !important;
    right:auto !important;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    left:12px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
    z-index:9000 !important;
    transform:none !important;
  }
  html:root body [data-onglet-rdv-josamcha]{
    left:auto !important;
    right:12px !important;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    width:max-content !important;
    max-width:calc(100vw - 84px) !important;
    box-sizing:border-box !important;
  }
  html:root body a.jz-teleconsult{
    padding:8px 12px !important;
    gap:8px !important;
    white-space:normal !important;
  }
  html:root body header.page-hero .ph-content,
  html:root body section.page-hero .ph-content,
  html:root body section.hero .hero-left,
  html:root body section.hero .hero-content,
  html:root body section.ip-hero .ip-hero-content{
    padding-bottom:calc(128px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing:border-box !important;
  }
  html:root body section.hero .hero-right{
    max-height:max(180px, calc(100dvh - 540px - env(safe-area-inset-bottom, 0px))) !important;
  }
  html:root body header.page-hero .hero-right{
    max-height:200px !important;
  }
  html:root body header.page-hero:has(.hero-right) .ph-content{
    padding-top:16px !important;
  }
  html:root body section.ip-hero .ip-hero-right{
    max-height:220px !important;
  }
  html:root body:has(> section#essentiel):has(> header.page-hero){
    display:flex !important;
    flex-direction:column !important;
  }
  html:root body:has(> section#essentiel):has(> header.page-hero) > header.page-hero{
    order:-1 !important;
  }
}

/* Téléphone : FR/EN compacts, gouttière à gauche, pastille au-dessus de Sophie.
   Les trois contrôles ne se recouvrent pas. Le début des lignes reste lisible. */
@media (max-width:900px){
  html:root{
    --jz-lang-gutter:54px;
    --jz-ctrl-edge:8px;
    --jz-sophie:56px;
    --jz-ctrl-gap:12px;
  }
  html:root body .lang-switcher{
    position:fixed !important;
    top:auto !important;
    right:auto !important;
    bottom:calc(var(--jz-ctrl-edge) + env(safe-area-inset-bottom, 0px)) !important;
    left:var(--jz-ctrl-edge) !important;
    display:flex !important;
    flex-direction:column !important;
    gap:4px !important;
    z-index:9000 !important;
    transform:none !important;
    width:36px !important;
    max-width:36px !important;
    margin:0 !important;
  }
  html:root body .lang-switcher .lang-btn{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    max-width:36px !important;
    min-height:36px !important;
    max-height:36px !important;
    flex:0 0 36px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    line-height:1 !important;
    font-size:12px !important;
    letter-spacing:.02em !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }
  html:root body #zchat-bubble{
    position:fixed !important;
    top:auto !important;
    left:auto !important;
    right:var(--jz-ctrl-edge) !important;
    bottom:calc(var(--jz-ctrl-edge) + env(safe-area-inset-bottom, 0px)) !important;
    width:var(--jz-sophie) !important;
    height:var(--jz-sophie) !important;
    max-width:var(--jz-sophie) !important;
    margin:0 !important;
    transform:none !important;
  }
  html:root body [data-onglet-rdv-josamcha]{
    position:fixed !important;
    top:auto !important;
    left:auto !important;
    right:calc(var(--jz-ctrl-edge) + 8px) !important;
    bottom:calc(var(--jz-ctrl-edge) + var(--jz-sophie) + var(--jz-ctrl-gap) + env(safe-area-inset-bottom, 0px)) !important;
    width:max-content !important;
    max-width:calc(100vw - var(--jz-lang-gutter) - var(--jz-ctrl-edge)) !important;
    box-sizing:border-box !important;
    transform:none !important;
  }
  html:root body a.jz-teleconsult{
    padding:8px 12px !important;
    gap:8px !important;
    white-space:normal !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  html:root body [data-deux-josamcha] > a.jz-teleconsult{
    margin-left:var(--jz-lang-gutter) !important;
    max-width:calc(100% - var(--jz-lang-gutter)) !important;
  }
  html:root body [data-onglet-rdv-josamcha] a span,
  html:root body a.jz-teleconsult span{
    white-space:normal !important;
  }
  html:root body section:not(.hero),
  html:root body header.page-hero,
  html:root body section.page-hero,
  html:root body .hero-left,
  html:root body section.hero .hero-left,
  html:root body .s,
  html:root body .avis-section,
  html:root body .art-section,
  html:root body .spec-intro,
  html:root body .sc,
  html:root body .ig-inner,
  html:root body .parc-text,
  html:root body .ft-top,
  html:root body .ft-base,
  html:root body .sophie-section,
  html:root body .avis-strip,
  html:root body .nl-section,
  html:root body .cta-strip,
  html:root body .reass-section,
  html:root body .creds-line,
  html:root body .hbf-l,
  html:root body [data-identite-josamcha],
  html:root body > div[style*="padding"]:not(.lang-switcher):not([data-onglet-rdv-josamcha]){
    padding-left:var(--jz-lang-gutter) !important;
  }
  html:root body header.page-hero .ph-content,
  html:root body section.page-hero .ph-content,
  html:root body section.hero .hero-left,
  html:root body section.hero .hero-content,
  html:root body section.ip-hero .ip-hero-content{
    padding-bottom:calc(176px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing:border-box !important;
  }
  /* La barre fait 88 px. Sans portrait, le surtitre ne doit pas passer dessous. */
  html:root body section.hero .hero-eyebrow,
  html:root body header.page-hero .ph-eyebrow{
    margin-top:32px !important;
  }
}

/* Barre fixe + sommaire : un titre d'ancre ne passe plus dessous.
   Hauteur mesurée : 72 px sur ordinateur, 88 px au téléphone, sommaire ~48 px. */
html:root{
  scroll-padding-top:120px;
}
html:root body h2,
html:root body h3,
html:root body section[id],
html:root body article[id]{
  scroll-margin-top:120px !important;
}
html:root body nav.sec-nav,
html:root body .sec-nav{
  top:72px !important;
  background:#0d1f35 !important;
  z-index:398 !important;
}
@media (max-width:900px){
  html:root{
    scroll-padding-top:136px;
  }
  html:root body h2,
  html:root body h3,
  html:root body section[id],
  html:root body article[id]{
    scroll-margin-top:136px !important;
  }
  html:root body nav.sec-nav,
  html:root body .sec-nav{
    top:88px !important;
  }
}

/* Survol d'un encart : le texte reste lisible (fond navy, lettres claires). */
html:root body .qc-grid:hover{
  background:#162844 !important;
  color:#fff !important;
}
html:root body .qc-grid:hover p,
html:root body .qc-grid:hover div,
html:root body .qc-grid:hover strong,
html:root body .qc-grid:hover span{
  color:#fff !important;
}
html:root body .qc-grid:hover a[href*="doctolib"],
html:root body .qc-grid:hover a[href*="doctolib"] *{
  color:#fff !important;
  background:#b8856a !important;
}
html:root body .samuel-cta-band a:hover,
html:root body .samuel-cta-band a:hover span{
  color:#fff !important;
}
html:root body .samuel-cta-band{background:#0d1f35 !important;color:#fff !important;padding:36px 20px;border-top:1px solid rgba(184,133,106,.35);}
html:root body .samuel-cta-inner{max-width:760px;margin:0 auto;text-align:center;}
html:root body .samuel-cta-band p{color:#fff !important;font-size:1.02rem;line-height:1.55;margin:0 auto 16px;max-width:640px;}
html:root body .samuel-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
html:root body .samuel-cta-band .cta-primary{font-family:Inter,system-ui,sans-serif;font-size:.73rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;padding:14px 22px;background:#b8856a !important;color:#fff !important;text-decoration:none !important;display:inline-flex !important;align-items:center;gap:8px;border:1px solid #b8856a;}
html:root body .samuel-cta-band .cta-secondary{font-family:Inter,system-ui,sans-serif;font-size:.69rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;padding:12px 22px;border:1px solid rgba(255,255,255,.55) !important;color:#fff !important;text-decoration:none !important;display:inline-flex !important;align-items:center;gap:8px;background:transparent !important;}

/* Ordinateur 1440 : le menu et les deux boutons tiennent dans l'écran. */
@media (min-width:1101px){
  html:root body nav.nav{
    padding:0 12px !important;
    gap:8px !important;
    max-width:100vw !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }
  html:root body .nav-l{min-width:0 !important;gap:8px !important;}
  html:root body .nav-id .nn{font-size:.76rem !important;}
  html:root body .nav-id .ns{font-size:.46rem !important;letter-spacing:.03em !important;}
  html:root body .nav-menu{min-width:min-content !important;flex:1 1 auto !important;margin-left:6px !important;}
  html:root body .nav-menu > li > a{
    font-size:9.5px !important;
    letter-spacing:.01em !important;
    padding:0 3px !important;
  }
  html:root body .nav-ctas{flex:0 0 auto !important;margin-left:22px !important;}
  html:root body .nav-rdv-rappel,
  html:root body .nav-rdv-doctolib{
    font-size:9px !important;
    letter-spacing:.04em !important;
    padding:8px 9px !important;
  }
}

/* Sommaire : une seule ligne, collée sous la barre, jamais dessous. */
html:root body nav.sec-nav,
html:root body .sec-nav{top:72px !important;}
html:root body .sec-nav-inner{
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
}
@media (max-width:900px){
  html:root body nav.sec-nav,
  html:root body .sec-nav{top:88px !important;}
}

/* Menu téléphone opaque. La pastille passe sous le menu ouvert et sous les mentions. */
html:root body .mobile-menu{
  background:#0d1f35 !important;
  background-color:#0d1f35 !important;
  z-index:8000 !important;
}
html:root body [data-onglet-rdv-josamcha]{z-index:3000 !important;}
html:root body:has(.mobile-menu.open) [data-onglet-rdv-josamcha]{
  visibility:hidden !important;
  pointer-events:none !important;
}
html:root body footer{padding-bottom:calc(130px + env(safe-area-inset-bottom, 0px)) !important;}
html:root body .creds-line{color:rgba(255,255,255,.78) !important;}

/* Sommaire téléphone : même barre que le cancer du sein.
   La hauteur figée à 44 px coupait les libellés (padding 16 px).
   Elle reste collée sous le menu pendant le défilement. */
@media (max-width:900px){
  html:root body nav.sec-nav,
  html:root body .sec-nav{
    display:block !important;
    position:sticky !important;
    top:88px !important;
    height:auto !important;
    min-height:52px !important;
    max-height:none !important;
    overflow:visible !important;
    background:#0d1f35 !important;
    background-color:#0d1f35 !important;
    z-index:398 !important;
  }
  html:root body .sec-nav-inner{
    height:auto !important;
    min-height:52px !important;
    align-items:stretch !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  html:root body .sn-a{
    color:rgba(255,255,255,.82) !important;
    opacity:1 !important;
    visibility:visible !important;
    height:auto !important;
    max-height:none !important;
    line-height:1.35 !important;
    overflow:visible !important;
  }
}

/* Cause commune du texte sombre sur fond sombre.
   L'encre du corps (#111827, var(--n), var(--ink)) était prévue
   pour l'ancien fond clair. Deux cas, corrigés ici pour toutes
   les pages :
   1. un titre posé sur le corps, hors section, hérite cette encre
      alors que le fond du corps est marine ;
   2. les encadrés (.spec-intro et cartes du même gabarit) gardent
      cette encre sur un fond devenu transparent. On leur rend une
      carte blanche. Au survol, fond marine et lettres claires. */
html:root body > h1,
html:root body > h2,
html:root body > h3,
html:root body > p:not(.article-byline):not(.creds-line),
html:root body > h2 em,
html:root body > h3 em{
  color:rgba(255,255,255,.92);
}
/* Chapeau et signature posés sur une page claire : l'encre reste sombre. */
html:root body > p.article-byline,
html:root body > p.creds-line{
  color:#3d4a5c !important;
}
html:root body .s-navy,
html:root body .s-navy2,
html:root body .s-navy3,
html:root body .sec-navy,
html:root body main:not(.article-body),
html:root body .cta-strip{
  color:rgba(255,255,255,.88);
}
html:root body .prose-navy,
html:root body .prose-navy p,
html:root body .prose-navy li{
  color:rgba(255,255,255,.88) !important;
}
html:root body .prose-navy a{
  color:#d4a88c !important;
}
html:root body nav.breadcrumb,
html:root body .breadcrumb,
html:root body .breadcrumb a,
html:root body .breadcrumb span{
  color:rgba(255,255,255,.78) !important;
}
html:root body .rdv-wrap,
html:root body .rdv-wrap label,
html:root body .rdv-form-col label{
  color:rgba(255,255,255,.9) !important;
}
html:root body .cta-article,
html:root body .cta-article p,
html:root body .cta-article strong,
html:root body .cta-article h2,
html:root body .cta-article h3,
html:root body .cta-article a{
  color:#fff !important;
}
/* En-tête marine : la règle « première colonne en encre sombre »
   (prévue pour les cellules du corps) écrasait aussi le titre de colonne.
   On ne touche pas aux thead clairs (.j-table sur fond gris). */
html:root body .age-rt thead th,
html:root body .persist-rt thead th,
html:root body .depist-rt thead th,
html:root body .evi-rt thead th,
html:root body .brca-rt thead th,
html:root body table.brca-rt thead th,
html:root body thead[style*="0d1f35"] th,
html:root body tr[style*="0d1f35"] th,
html:root body th[style*="0d1f35"]{
  color:#fff !important;
}
html:root body .s-navy p,
html:root body .s-navy li,
html:root body .s-navy h2,
html:root body .s-navy h3,
html:root body .s-navy strong,
html:root body .s-navy2 p,
html:root body .s-navy2 li,
html:root body .s-navy2 h2,
html:root body .s-navy2 h3,
html:root body .s-navy2 strong,
html:root body .s-navy3 p,
html:root body .s-navy3 li,
html:root body .sec-navy p,
html:root body .sec-navy li,
html:root body .sec-navy strong,
html:root body .sec-navy h2,
html:root body .sec-navy h3{
  color:rgba(255,255,255,.9) !important;
}
html:root body .cta-strip .btn-primary{
  /* Bouton blanc, texte cuivre foncé : il ressort sur les encarts cuivre (31 pages) comme sur les
     encarts marine. L'ancien fond cuivre se confondait avec l'encart cuivre (01/10). */
  background:#ffffff !important;
  border:1px solid #ffffff !important;
  color:#7d5342 !important;
  -webkit-text-fill-color:#7d5342 !important;
}
html:root body .cta-strip .btn-primary:hover{
  background:#0d1f35 !important;
  border-color:#0d1f35 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}
/* Pas de titre blanc forcé sur tout héros qui a un .ph-ov vide.
   Les pages au voile marine posent déjà color:#fff sur leur h1.
   Un héros clair (photo sans voile) garde l'encre navy, lisible. */
html:root body .faq-item,
html:root body .photo-fig,
html:root body .geo-cite,
html:root body .geo-cite-inner,
html:root body .s-white,
html:root body .s-off,
html:root body .s-off-warm,
html:root body .article-body{
  color:#1a2538;
}
html:root body .spec-intro,
html:root body .crit-card,
html:root body .spec-card,
html:root body .signs-wrap,
html:root body .triage-box{
  background-color:#fff !important;
  color:#1a2538 !important;
}
html:root body .spec-intro p,
html:root body .spec-intro li,
html:root body .spec-intro strong,
html:root body .spec-intro em,
html:root body .crit-card p,
html:root body .crit-card li,
html:root body .crit-card h3,
html:root body .spec-card p,
html:root body .spec-card li,
html:root body .spec-card h3,
html:root body .signs-wrap p,
html:root body .signs-wrap li,
html:root body .signs-wrap strong,
html:root body .triage-box p,
html:root body .triage-box li,
html:root body .triage-box h3{
  color:#1a2538 !important;
}
html:root body .spec-intro:hover,
html:root body .crit-card:hover,
html:root body .spec-card:hover,
html:root body .signs-wrap:hover,
html:root body .triage-box:hover{
  background-color:#0d1f35 !important;
  color:#fff !important;
}
html:root body .spec-intro:hover p,
html:root body .spec-intro:hover li,
html:root body .spec-intro:hover strong,
html:root body .spec-intro:hover em,
html:root body .crit-card:hover p,
html:root body .crit-card:hover li,
html:root body .crit-card:hover h3,
html:root body .spec-card:hover p,
html:root body .spec-card:hover li,
html:root body .spec-card:hover h3,
html:root body .signs-wrap:hover p,
html:root body .signs-wrap:hover li,
html:root body .signs-wrap:hover strong,
html:root body .triage-box:hover p,
html:root body .triage-box:hover li,
html:root body .triage-box:hover h3{
  color:#fff !important;
}
html:root body .photo-fig,
html:root body .photo-fig p,
html:root body .photo-fig figcaption,
html:root body .geo-cite-inner,
html:root body .geo-cite-inner p{
  color:#1a2538 !important;
}
/* Bibliographie sur fond clair : le gras était resté blanc (encre prévue pour un fond marine). */
html:root body .s-off li strong[style*="255,255,255"],
html:root body .s-off li strong[style*="255, 255, 255"],
html:root body .s-white li strong[style*="255,255,255"],
html:root body .s-white li strong[style*="255, 255, 255"],
html:root body .article-body li strong[style*="255,255,255"],
html:root body .article-body li strong[style*="255, 255, 255"]{
  color:#1a2538 !important;
}

/* Boutons Doctolib des encarts du milieu : texte blanc sur cuivre.
   La règle des liens d'article (.art-body a{color:var(--r)}) l'emportait : cuivre sur cuivre (01/10). */
html:root body a.cta-mid-doctolib,
html:root body a.rdv-mid-btn-r{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* Encart « À savoir » marine (style inline #162844, hystéroscopie FR/EN) : la règle commune
   .signs-wrap le passait en blanc alors que son texte reste blanc → blanc sur blanc (01/10). */
html:root body .signs-wrap[style*="#162844"],
html:root body .signs-wrap[style*="#162844"]:hover{
  background-color:#162844 !important;
  color:#ffffff !important;
}
html:root body .signs-wrap[style*="#162844"] h3,
html:root body .signs-wrap[style*="#162844"] p,
html:root body .signs-wrap[style*="#162844"] strong{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* Menu desktop : le sous-menu reste ouvert jusqu'a l'entree.
   overflow:hidden sur la barre coupait les liens (le clic tombait
   sur la page). Au scroll, top:60px laissait un trou sous le
   libelle raccourci : la souris sortait du survol et le menu
   se fermait. Le panneau colle au libelle, avec un pont de 8 px. */
@media (min-width:1101px){
  html:root body nav.nav,
  html:root body #nav,
  html:root body nav.nav.up,
  html:root body #nav.up{
    overflow:visible !important;
  }
  html:root body .nav-menu > li.has-drop{
    position:relative !important;
  }
  html:root body .nav-menu > li.has-drop::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:100%;
    height:22px;
    z-index:10001;
  }
  html:root body .nav-menu > li.has-drop > ul.dropdown{
    top:calc(100% - 8px) !important;
    margin-top:0 !important;
    z-index:10002 !important;
    padding-top:8px !important;
    background-clip:padding-box !important;
  }
  html:root body .nav-menu > li.has-drop > ul.dropdown li{
    pointer-events:auto !important;
  }
}
@media (hover:hover){
  html:root body .nav-menu > li.has-drop:hover > ul.dropdown,
  html:root body .nav-menu > li.has-drop:focus-within > ul.dropdown{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    transform:none !important;
    pointer-events:auto !important;
  }
  html:root body .nav-menu > li.has-drop:hover > ul.dropdown a,
  html:root body .nav-menu > li.has-drop:focus-within > ul.dropdown a{
    pointer-events:auto !important;
  }
}
html:root body .nav-menu > li.has-drop:focus-within > ul.dropdown{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
}
html:root body nav.nav,
html:root body #nav{
  z-index:2147483600 !important;
}
html:root body .mobile-menu.open{
  z-index:2147483600 !important;
}
html:root body .mobile-menu.open a{
  pointer-events:auto !important;
}