/* Remplace ce que faisaient les scripts WordPress (OceanWP, Elementor) sur l'ancien site.
   Chargé après toutes les autres feuilles. */

/* Sous-menu « Séries sur papier » : affiché au survol ou au clavier (autrefois par le script Superfish) */
.sf-menu li:hover > ul.sub-menu,
.sf-menu li:focus-within > ul.sub-menu {
  visibility: visible;
}

/* Section « pleine largeur » de l'accueil (autrefois calculée par Elementor en JavaScript) */
.elementor-section.elementor-section-stretched {
  width: 100vw;
  left: calc(50% - 50vw);
}
#outer-wrap {
  overflow-x: clip;
}

/* Archives : tous les articles sont affichés d'un coup; la ligne de fin de liste reste visible */
.blog-masonry-grid + .scroller-status,
.scroller-status .infinite-scroll-last {
  display: block;
}
.scroller-status .infinite-scroll-request,
.scroller-status .infinite-scroll-error {
  display: none;
}
/* Grille en maçonnerie : positions calculées par /scripts/site.js (comme Isotope sur l'ancien site) */
.blog-masonry-grid.maconnerie {
  position: relative;
}
.blog-masonry-grid.maconnerie > article {
  position: absolute;
  margin: 0;
}

/* Bouton « retour en haut » */
#scroll-top.visible {
  display: block;
  opacity: 1;
  transition: opacity 0.3s;
}

/* Menu mobile ouvert */
#mobile-dropdown.ouvert {
  display: block;
}
#mobile-dropdown ul li.active > ul {
  display: block;
}

/* Visionneuse d'images (reprend l'allure de celle d'OceanWP) */
.visionneuse {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(11, 11, 11, 0.8);
  padding: 40px 50px;
}
.visionneuse[hidden] {
  display: none;
}
.visionneuse figure {
  position: relative;
  margin: 0;
  max-width: 100%;
  max-height: 100%;
}
.visionneuse img {
  display: block;
  max-width: 100%;
  max-height: calc(100vh - 80px);
  width: auto;
  height: auto;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.visionneuse button {
  position: absolute;
  background: transparent;
  border: 0;
  color: #fff;
  cursor: pointer;
  padding: 0;
  opacity: 0.65;
  min-width: 44px;
  min-height: 44px;
}
.visionneuse button:hover,
.visionneuse button:focus-visible {
  opacity: 1;
  background: transparent;
}
.visionneuse .fermer {
  top: -44px;
  right: -6px;
  font-size: 28px;
  line-height: 44px;
}
.visionneuse .precedent,
.visionneuse .suivant {
  top: 50%;
  transform: translateY(-50%);
  font-size: 40px;
}
.visionneuse .precedent {
  left: -50px;
}
.visionneuse .suivant {
  right: -50px;
}
.visionneuse .compteur {
  position: absolute;
  right: 0;
  bottom: -26px;
  color: #ccc;
  font-size: 12px;
}

/* Page de recherche */
.resultats-recherche {
  max-width: 900px;
  margin: 50px auto;
  padding: 0 20px;
}
.resultats-recherche li {
  margin-bottom: 14px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}

/* Vignettes carrées des résultats de recherche (WordPress produisait des recadrages 150 × 150) */
.search-results .thumbnail img.vignette-recherche {
  width: 150px;
  height: 150px;
  object-fit: cover;
}

/* --- Techniques modernes ----------------------------------------------------------------------- */

/* Retours à la ligne équilibrés : titres sans mot seul sur la dernière ligne, paragraphes plus harmonieux */
h1, h2, h3, h4, .elementor-heading-title, .elementor-image-box-title, .blog-entry-title {
  text-wrap: balance;
}
p, li, .elementor-image-box-description {
  text-wrap: pretty;
}

/* Transition douce entre les pages (navigateurs récents; ignorée ailleurs) */
@view-transition {
  navigation: auto;
}
@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
}

/* Contour visible pour la navigation au clavier */
a:focus-visible, button:focus-visible, input:focus-visible, [role='button']:focus-visible {
  outline: 2px solid #13aff0;
  outline-offset: 2px;
}

/* Zones de clic d'au moins 24 px de haut sur les liens des titres (doigt sur téléphone), sans rien déplacer */
.blog-entry-title a, .elementor-image-box-title a, .search-entry-title a {
  display: inline-block;
  /* le thème donne une hauteur de ligne très serrée à ces liens : 8 px de chaque côté */
  padding-block: 8px;
  margin-block: -8px;
}
.custom-logo-link {
  display: inline-block;
}
.elementor-heading-title a {
  display: inline-block;
  padding-block: 5px;
  margin-block: -5px;
}

/* --- Corrections demandées par David (2026-10-18) ------------------------------------------------ */

/* Pied de page lisible (le gris foncé sur gris foncé avait un contraste de 1,8:1) */
#footer-widgets .footer-box .textwidget,
#footer-widgets .footer-box .textwidget p {
  color: #c4c4c4;
}
/* Pied de page en deux colonnes depuis le retrait du portfolio : l'image Flickr garde sa taille d'avant */
#footer-widgets .footer-box.col-1 img {
  max-width: min(100%, 340px);
}

/* Textes gris d'Elementor (légendes des œuvres) un peu plus foncés : contraste 6,4:1 au lieu de 4,3:1 */
.elementor-kit-2010 {
  --e-global-color-text: #5f5f5f;
}
.elementor-image-box-description {
  color: #5f5f5f;
}

/* Légendes de la page Explorations, présentées comme celles des autres séries */
.legende-oeuvre {
  font-family: Roboto, sans-serif;
  font-size: var(--t-14);
  line-height: 1.5;
  color: #5f5f5f;
  text-align: center;
}
.legende-oeuvre .legende-titre {
  display: inline-block;
  font-size: var(--t-17);
  font-weight: 600;
  color: rgb(84, 89, 95);
  margin-bottom: 2px;
}

/* Accueil : le titre « Séries sur papier » s'aligne sur les cartes au lieu d'être collé au bord gauche */
.elementor-2092 .elementor-element.elementor-element-05240ce > .elementor-widget-container {
  max-width: 1140px;
  margin-inline: auto;
}
