/* Version une page : projets enchaînés sous la grille d'accueil */
.op-wrap { padding: 30px 0 40px; }
.op-intro { text-align: center; margin: 70px 15px 0; font: 300 13px Poppins, sans-serif; color: #6e6e76; }
.op-project { padding: 80px 24px 0; scroll-margin-top: 0; }
.op-head { text-align: center; margin: 0 0 30px; }
.op-title { font: 300 30px/1.3 Poppins, sans-serif; letter-spacing: .02em; color: #313139; margin: 0 0 6px; }
.op-cat { font: 500 11px Poppins, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #6e6e76; margin: 0; }
.op-hint { font: 300 13px Poppins, sans-serif; color: #6e6e76; margin: 12px 0 0; }
.op-project:first-child { padding-top: 10px; }
.op-gallery { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; max-width: 1700px; margin: 0 auto; }
.op-item { position: relative; margin: 0; height: min(60vh, 560px); flex: 0 0 auto; background: #f4f4f5; }
.op-item .ba img { object-fit: cover; }
.op-break { flex-basis: 100%; height: 0; margin-top: -16px; }   /* retour à la ligne forcé dans une galerie */

/* sous-titre « Retoucheur » sous le nom */
#logo .logo-sub { display: block; margin-top: 2px; padding-left: .42em; font: 300 13px/1 Poppins, sans-serif; letter-spacing: .42em; text-transform: uppercase; color: #6e6e76; text-align: center; }

/* flèches : section précédente / suivante ; bouton remonter au-dessus de la flèche droite */
.onepage .to-top { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
.pnav.is-hidden { opacity: 0; pointer-events: none; }

@media (max-width: 767px) {
  .op-intro { margin-top: 50px; }
  .op-project { padding: 56px 16px 0; }
  .op-title { font-size: 24px; }
  .op-gallery { gap: 12px; }
  .op-break { margin-top: -12px; }
  .op-item { height: auto; width: 100%; }
  .onepage .to-top { bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
  /* en-tête mobile (80 px de haut) : nom + « Retoucheur » empilés à gauche, centrés verticalement */
  .onepage #header #logo .logo-a { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
  .onepage #header #logo .logo-h1 { height: auto; line-height: 1.15; }
  #logo .logo-sub { margin-top: 5px; padding-left: 0; font-size: 10px; letter-spacing: .38em; text-align: left; }
}
