/* =========================================================
   Mon Chai, pied de page partagé
   Utilisé par index.html et par les 8 pages « Le logiciel ».

   ⚠️ Aucune frame Figma n'en comporte. Écrit pour que les mentions légales,
   la politique de confidentialité et les CGUV, obligatoires et accessibles
   depuis chaque page, le soient réellement, et en vrai texte : l'ancien pied
   de page d'index.html était une image SVG surmontée de zones cliquables,
   donc illisible pour les moteurs de recherche et les lecteurs d'écran.
   Les textes reprennent ceux préparés dans TEXTES_MANQUANTS.md.
   Sobre volontairement : à remplacer par la version dessinée.

   Variables préfixées --pd- : index.html et pages.css définissent chacun leur
   propre --creme et --encre, avec des valeurs différentes.
   ========================================================= */

:root{
  --pd-fond:   #471318;
  --pd-creme:  #FFF9F4;
  --pd-blanc:  #FFFDFC;
  --pd-cuivre: #C99159;
  --pd-serif:  "Playfair Display", Georgia, serif;
  --pd-titre:  "Poppins", "Inter", system-ui, sans-serif;
  --pd-sans:   "Inter", system-ui, -apple-system, sans-serif;
}

.pied{
  position:relative;
  width:100%;
  background:var(--pd-fond); color:var(--pd-creme);
  font-family:var(--pd-sans);
  padding:78px 138px 0;
  box-sizing:border-box;
}
.pied *{ box-sizing:border-box; }

.pied__haut{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:56px;
}

.pied__nom{
  font-family:var(--pd-serif); font-weight:500; font-size:40px; line-height:1.1;
  color:var(--pd-blanc);
}
.pied__sous{
  font-family:var(--pd-titre); font-weight:500; font-size:15px; line-height:1;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--pd-cuivre); margin-top:8px;
}
.pied__phrase{
  font-size:18px; line-height:1.55; margin-top:22px;
  color:rgba(255,249,244,.78); max-width:34ch;
}
.pied__fr{
  font-size:15px; line-height:1.5; margin-top:20px;
  color:rgba(255,249,244,.6);
}

/* Réseaux sociaux : Instagram et LinkedIn, seuls comptes ouverts.
   URL et icônes reprises de l'ancienne landing (landing_mail). */
.pied__suivre{ margin-top:26px; }
.pied__suivre-titre{
  font-family:var(--pd-titre); font-weight:600; font-size:14px; line-height:1;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--pd-cuivre); margin:0;
}
.pied__reseaux{ display:flex; gap:12px; margin-top:14px; }
.pied__reseaux a{
  display:grid; place-items:center;
  width:42px; height:42px;
  border:1px solid rgba(255,249,244,.34); border-radius:12px;
  color:var(--pd-creme);
  transition:color .15s ease, background-color .15s ease, border-color .15s ease;
}
.pied__reseaux a:hover,
.pied__reseaux a:focus-visible{
  color:var(--pd-fond); background:var(--pd-creme); border-color:var(--pd-creme);
}
.pied__reseaux svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; }
.pied__reseaux svg path,
.pied__reseaux .pied__reseau-point{ fill:currentColor; stroke:none; }

.pied__col h2{
  font-family:var(--pd-titre); font-weight:600; font-size:14px; line-height:1;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--pd-cuivre); margin-bottom:22px;
}
.pied__col ul{ list-style:none; margin:0; padding:0; }
.pied__col li + li{ margin-top:12px; }
.pied__col a,
.pied__col button{
  font-family:inherit; font-size:17px; line-height:1.45; text-align:left;
  color:rgba(255,249,244,.82); text-decoration:none;
  background:none; border:0; padding:0; cursor:pointer;
  transition:color .15s ease;
}
.pied__col a:hover,
.pied__col button:hover{ color:var(--pd-blanc); text-decoration:underline; text-underline-offset:4px; }
.pied__col a[aria-current="page"]{ color:var(--pd-cuivre); font-weight:600; }

.pied__bas{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  margin-top:64px; padding:26px 0 36px;
  border-top:1px solid rgba(255,249,244,.16);
  font-size:15px; color:rgba(255,249,244,.6);
}
.pied__bas p{ margin:0; }


@media (max-width:1199px){
  .pied{ padding:clamp(46px,9vw,72px) clamp(20px,5.5vw,52px) 0; }
  .pied__haut{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:clamp(30px,5vw,48px);
  }
  .pied__marque{ grid-column:1 / -1; }
  .pied__nom{ font-size:clamp(28px,6vw,38px); }
  .pied__phrase{ font-size:clamp(15px,3.4vw,18px); margin-top:16px; }
  .pied__fr{ font-size:14px; margin-top:14px; }
  .pied__col h2{ font-size:13px; margin-bottom:16px; }
  .pied__col a,
  .pied__col button{ font-size:clamp(15px,3.2vw,17px); }
  .pied__bas{
    flex-direction:column; align-items:flex-start; gap:8px;
    margin-top:clamp(36px,7vw,56px); padding:22px 0 30px;
    font-size:14px;
  }
}

@media (prefers-reduced-motion:reduce){
  .pied__col a, .pied__col button, .pied__reseaux a{ transition:none; }
}