/* ===========================
   POLICE PRINCIPALE
=========================== */
@font-face {
  font-family: 'Dancing Script';
  src: url('/A/V2/A_assets/police_caractere/Dancing_Script/DancingScript-VariableFont_wght.ttf') format('truetype');
  font-display: swap;
}

/* ===========================
   BASE DU DOCUMENT
=========================== */
body {
  font-family: 'Dancing Script', sans-serif;
  background-color: #2E1B17;
  color: #FFF;
  margin: 0;
  padding: 0;
}

/* Contenu centré et lisible */
main {
  max-width: 800px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #FFF;
  color: #000;
  border-radius: 10px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.2);
}

/* Titres */
h1 {
  text-align: center;
  margin-bottom: 2rem;
}
h2 {
  margin-top: 2rem;
}

/* Paragraphes */
p {
  margin-bottom: 1rem;
  line-height: 1.5;
}

/* Liens */
a {
  color: #0056b3;
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;
}

/* Boutons : Accueil / Retour */
.btn-accueil {
  display: inline-block;
  margin: 0.5rem 1rem;
  padding: 0.5rem 1.2rem;
  background: #eee;
  border-radius: 5px;
  color: #222;
  text-decoration: none;
  transition: background 0.3s;
}
.btn-accueil:hover {
  background: #ddd;
}

/* Bloc Facebook */
.contact-social {
  margin-top: 2rem;
  text-align: center;
}

.facebook-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
  text-decoration: none;
}

.facebook-logo {
  width: 15vw; /* largeur proportionnelle à l'écran */
  max-width: 180px; /* limite desktop */
  min-width: 80px;  /* limite mobile */
  height: auto;
}

.facebook-link span {
  font-size: 1rem;
  color: #0056b3;
}

/* Responsive ajustement */
@media (max-width: 600px) {
  .facebook-logo {
    width: 40vw;     /* correction : éviter le débordement 120vw */
    max-width: 140px;
  }
}

.ionos-logo {
  width: 20%;        /* largeur du logo = 20% du conteneur parent */
  height: auto;      /* conserve les proportions */
  vertical-align: middle;  /* aligne avec le texte */
  margin-left: 0%;   /* petit espace après le texte */
}

/* Responsive pour petits écrans */
@media (max-width: 600px) {
  .ionos-logo {
    width: 15%;   /* un peu plus grand si l’écran est petit */
  }
}

/* Footer */
footer {
  text-align: center;
  margin-top: 3rem;
  margin-bottom: 2rem;
  font-size: 0.9rem;
  color: #fff; /* meilleur contraste sur fond sombre */
}

footer p {
  margin: 0.25rem 0;
}

/* Sceau poétique dans le footer */
.legal-poetic {
  max-width: 800px;
  margin: 0.5rem auto 0;
  padding: 0 1rem;
  color: #e6e6e6;
  font-style: italic;
  letter-spacing: 0.2px;
}

.legal-poetic::before {
  content: "";
  display: block;
  width: 90px;
  height: 1px;
  margin: 0.75rem auto 0.75rem;
  background: linear-gradient(to right, transparent, #e6e6e6, transparent);
}

/* last-update.css ou directement dans ton CSS principal */
.last-update {
    display: inline-block;      /* s'adapte à la longueur du texte */
    color: #ffffff;             /* texte blanc */
    font-size: 0.8em;           /* petite écriture */
    font-weight: bold;           /* rigide / gras */
    text-align: center;          /* centré si tu veux */
    border-top: 2px solid #ffffff;   /* trait au-dessus */
    border-bottom: 2px solid #ffffff;/* trait en dessous */
    padding: 2px 4px;            /* espace autour du texte */
    margin: 8px 0;               /* espace vertical par rapport aux autres éléments */
    line-height: 1.2;            /* hauteur de ligne compacte */
}