/* 🎯 Style du titre "Thibault Manuel" */
.site-title {
  position: fixed;
  top: 15px;
  left: 20px;
  font-size: 14px;
  font-weight: 700; /* BOLD */
  font-family: 'Forma DJR Display Bold', sans-serif; /* Police */
  text-transform: uppercase; /* MAJUSCULE */
  letter-spacing: 1.2px;
  color: #000000 !important; /* Noir */
  z-index: 9999;
}

/* 🔥 Empêche le titre de disparaître au scroll */
.site-title {
  position: fixed !important;
}

/* 🏷️ Version mobile du titre */
@media (max-width: 768px) {
  .site-title {
    top: 10px;
    left: 10px;
    font-size: 16px;
  }
}

/* 🎯 Position et style des icônes sociales */
.social-links {
  position: fixed;
  top: 15px;
  right: 15px;
  display: flex;
  gap: 12px; /* Espacement entre les icônes */
  z-index: 9999;
}

/* 🔗 Style des liens d'icônes */
.social-links a {
  display: block;
  width: 17px; /* Taille réduite */
  height: 17px;
  opacity: 0.8;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

/* 🎨 Icônes carrées et monochromes sans contour + suppression du dégradé Instagram */
.social-links a img {
  width: 100%;
  height: auto;
  filter: grayscale(100%) !important; /* Forcer le noir & blanc */
  background-color: transparent;
  padding: 0;
  box-sizing: border-box;
}

/* ✅ L’icône Instagram est bien en noir & blanc, sans dégradé */
.social-links a[aria-label="Instagram"] img {
  filter: grayscale(100%) !important;
}

/* 🔎 Effet au survol */
.social-links a:hover {
  transform: scale(1.1);
  opacity: 1;
  filter: grayscale(0%);
}

/* 📱 Version mobile : icônes plus petites et à côté du titre */
@media (max-width: 768px) {
  .social-links {
    position: absolute;
    right: 80px; /* Ajuste l'espacement entre le titre et les icônes */
    top: 10px;
  }

  .social-links img {
    width: 16px !important; /* Réduction de la taille des icônes */
    height: 16px !important;
    margin-left: 6px; /* Espacement ajusté */
  }
}

/* 🔗 Lien email avec la bonne adresse */
.social-links a[href^="mailto:"] {
  content: "✉️";
}

.social-links a[href^="mailto:"]::after {
  content: "thibault.manuel@wanadoo.fr";
  display: none;
}

/* 🔽 **Réduction minimale de l’espace sous le header** */
.header {
  margin-bottom: 10px !important;  /* ✅ Réduction de l’espace */
  padding-bottom: 5px !important;  /* ✅ Ajustement léger */
}

/* 🔽 **Ajustement précis pour éviter que les images du slideshow soient coupées** */
.page-content, .content-wrapper, .slideshow, .gallery {
  margin-top: 65px !important;  /* ✅ Ajustement minimal pour ne pas empiéter sur le header */
  padding-top: 10px !important;
}

/* 🔽 Supprime l'espace inutile sur <main> */
main {
  margin-top: 0px !important;
  padding-top: 0px !important;
}

/* 🔽 Réduction de l’espace sous le header */
header.header {
  padding-top: 55px !important; /* ✅ Ajusté pour éviter que le slideshow soit caché */
}

/* ✅ Supprime tout espace supplémentaire sous le header */
.header {
    margin-bottom: 10px !important;
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}

/* ✅ Ajuste les marges de la page pour éviter l’espace sous le header */
body, .page-content, .content-wrapper, .slideshow, .gallery, main {
    margin-top: 10px !important;
    padding-top: 10px !important;
}

/* ✅ S'assure qu'aucun élément ne crée un espace au début de la page */
.page-content > *:first-child, 
.content-wrapper > *:first-child, 
.gallery > *:first-child {
    margin-top: 0px !important;
    padding-top: 0px !important;
}
