/* Mon Puzzle Intérieur — Footer partagé, encre de chine */

/* iOS/mobile : background-attachment:fixed rend le fond ZOOMÉ (fond dimensionné à
   l'écran entier). Beaucoup de pages membres forcent `... fixed !important` en inline.
   On force `scroll` avec une spécificité plus forte (html body > html, body) pour
   gagner sur mobile/tactile → le fond redevient à l'échelle normale. */
@media (hover: none) and (pointer: coarse), (max-width: 1024px) {
  html body { background-attachment: scroll !important; }
}


/* Footer collé en bas du viewport sur les pages courtes. Scopé aux pages
   qui chargent ce CSS (donc tout le site sauf l'admin). */
html, body { min-height: 100vh; }
body { display: flex; flex-direction: column; }
body > main { flex: 1 0 auto; }
body > .site-footer { margin-top: auto; flex-shrink: 0; }

.site-footer {
  background:  #1C0F02;
  border-top:  1px solid rgba(232, 215, 197, .10);
  padding:     20px 0;
  font-size:   13px;
  color:       #E8D7C3;
}
.site-footer .wrap {
  max-width: 1160px;
  margin:    0 auto;
  padding:   0 clamp(20px, 4vw, 40px);
}
.footer-inner {
  display:               grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:         28px;
  align-items: start;
}
.foot-brand { display: flex; flex-direction: column; gap: 8px; }
.foot-brand .wordmark { font-size: 16px !important; color: #E8D7C3 !important; }
.foot-brand .wordmark em { font-style: italic; color: #E8D7C3 !important; }
.foot-tag {
  font-family: 'Cardo', Georgia, serif;
  font-style:  italic;
  color:       rgba(232, 215, 197, .72);
  font-size:   13px;
  max-width:   280px;
  line-height: 1.5;
  margin:      0;
}
.foot-nav { display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; }
.foot-nav a { color: #E8D7C3; font-size: 13px; letter-spacing: .04em; text-decoration: none; transition: color .2s; }
.foot-nav a:hover { color: #A63828; }
.foot-legal { text-align: right; color: rgba(232, 215, 197, .55); font-size: 12px; line-height: 1.6; }
.foot-legal a { color: rgba(232, 215, 197, .55); text-decoration: none; transition: color .2s; }
.foot-legal a:hover { color: #A63828; }
.foot-base {
  margin-top:      24px;
  padding-top:     16px;
  border-top:      1px solid rgba(232, 215, 197, .08);
  display:         flex;
  justify-content: space-between;
  align-items:     center;
  gap:             20px;
  flex-wrap:       wrap;
  font-size:       11.5px;
  letter-spacing:  .04em;
  color:           rgba(232, 215, 197, .42);
}

/* Tablette / téléphone paysage (601–860px) : 2 colonnes — marque à gauche,
   liens + mentions légales à DROITE (au lieu d'une seule colonne à gauche). */
@media (max-width: 860px) and (min-width: 601px) {
  .footer-inner { grid-template-columns: minmax(0, 1fr) auto; column-gap: 32px; align-items: start; }
  .foot-brand   { grid-column: 1; grid-row: 1 / 3; }
  .foot-nav     { grid-column: 2; grid-row: 1; flex-direction: column; align-items: flex-end; gap: 8px; justify-content: flex-start; }
  .foot-legal   { grid-column: 2; grid-row: 2; text-align: right; margin-top: 14px; }
}
/* Téléphone portrait (≤600px) : tout empilé à gauche. */
@media (max-width: 600px) {
  .footer-inner { grid-template-columns: 1fr; gap: 24px; }
  .foot-nav     { justify-content: flex-start; }
  .foot-legal   { text-align: left; }
  .foot-base    { flex-direction: column; align-items: flex-start; gap: 6px; }
}
@media (max-width: 480px) {
  .site-footer .wrap { padding: 0 20px; }
}