/* Café Delyssa · navigation et pied de page, identiques sur toutes les pages */

/* ===== Navigation ===== */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--hauteur-nav);
  display: flex; align-items: center;
  transition: background .35s, border-color .35s;
  border-bottom: 1px solid transparent;
}
.nav.solide, .nav.toujours-solide {
  background: rgba(11, 9, 6, .88);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-bottom-color: var(--ligne);
}
.nav .conteneur { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.marque { display: flex; align-items: center; gap: 12px; color: var(--creme); }
.marque img { width: 40px; height: 40px; object-fit: contain; }
.marque span { font: 600 13px/1 var(--police-titre); letter-spacing: .24em; }
.nav-liens { display: flex; align-items: center; gap: 30px; list-style: none; margin: 0; padding: 0; }
.nav-liens a { font: 500 12px/1 var(--police-texte); letter-spacing: .14em; text-transform: uppercase; color: var(--creme); padding: 6px 0; border-bottom: 1px solid transparent; }
.nav-liens a:hover { color: var(--or-clair); }
.nav-liens a[aria-current="page"] { color: var(--or); border-bottom-color: var(--or); }
.nav-liens .bouton { min-height: 40px; padding: 0 20px; color: var(--noir); border-bottom: 0; }
.nav-liens .bouton:hover { color: var(--noir); }
.burger { display: none; background: none; border: 0; color: var(--creme); width: 44px; height: 44px; cursor: pointer; padding: 10px; }
.burger span { display: block; height: 1px; background: currentColor; margin: 6px 0; transition: transform .3s, opacity .3s; }
.nav.ouvert .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav.ouvert .burger span:nth-child(2) { opacity: 0; }
.nav.ouvert .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 900px) {
  .burger { display: block; }
  .nav-liens {
    position: fixed; inset: var(--hauteur-nav) 0 0 0; background: var(--noir);
    flex-direction: column; justify-content: center; gap: 28px;
    opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s;
  }
  .nav.ouvert { background: var(--noir); }
  /* Un backdrop-filter crée un repère pour les éléments fixes : l'overlay du menu se calerait sur la barre (72 px) */
  .nav.solide, .nav.toujours-solide { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .nav.ouvert .nav-liens { opacity: 1; visibility: visible; }
  .nav-liens a { font-size: 15px; padding: 12px 0; }
}

/* ===== Pied de page ===== */
.pied { border-top: 1px solid var(--ligne); padding: 56px 0 40px; font-size: 13px; color: var(--texte-doux); }
.pied .conteneur { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 32px; }
.pied h2 { font: 500 11px/1 var(--police-texte); letter-spacing: .24em; text-transform: uppercase; color: var(--or); margin-bottom: 16px; }
.pied ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.pied a { color: var(--or-pale); }
.pied a:hover { color: var(--or-clair); }
.pied .adresse-pied { margin-top: 18px; }
.pied .bas { grid-column: 1 / -1; border-top: 1px solid var(--ligne); padding-top: 24px; margin-top: 16px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
@media (max-width: 760px) {
  .pied .conteneur { grid-template-columns: 1fr 1fr; row-gap: 36px; }
  .pied .conteneur > :first-child { grid-column: 1 / -1; }
}
/* Écrans tactiles : chaque lien du pied de page offre une cible d'au moins 44 px */
@media (pointer: coarse) {
  .pied ul { gap: 0; }
  .pied ul a { display: inline-block; padding-block: 12px; }
}