/* ═══════════════════════════════════════════════════════════════════════
   REPÈRE — bannière de consentement

   Une barre calme en bas de page, dans le langage de la V2 : papier,
   filet, rayon de contrôle, boutons de la même famille. Les deux actions
   ont exactement le même poids visuel — c'est ce que nos guides
   demandent, et il n'y a pas de raison de faire autrement chez nous.

   Aucun jeton nouveau. Les deux sites ayant des feuilles différentes, les
   valeurs sont écrites en clair ici plutôt qu'héritées d'une variable qui
   n'existerait que d'un côté.
   ═══════════════════════════════════════════════════════════════════════ */

/* Réserve sous le contenu tant que la barre est là : elle ne doit jamais
   recouvrir un bouton, et surtout pas celui du scanner. La hauteur réelle
   est posée par le script ; le repli couvre le cas où elle manquerait. */
.mesure-banniere-ouverte body {
  padding-bottom: var(--mesure-hauteur, 240px);
}

.mesure-banniere {
  position: fixed;
  z-index: 60;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 1px solid rgba(16, 37, 28, 0.16);
  background: #fdfefc;
  box-shadow: 0 -14px 34px -26px rgba(16, 37, 28, 0.5);
  font-family: "Public Sans", "Helvetica Neue", Arial, sans-serif;
}

.mesure-shell {
  display: flex;
  width: min(100% - 64px, 1280px);
  align-items: center;
  margin-inline: auto;
  padding: 18px 0;
  gap: clamp(24px, 4vw, 56px);
}

.mesure-titre {
  margin: 0 0 3px;
  color: #10251c;
  font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  font-stretch: 106%;
  font-weight: 700;
  letter-spacing: -0.022em;
}

.mesure-texte {
  max-width: 82ch;
  margin: 0;
  color: #556259;
  font-size: 0.88rem;
  line-height: 1.55;
}

.mesure-lien {
  color: #1f6a4e;
  font-weight: 650;
  text-underline-offset: 4px;
}

.mesure-actions {
  display: flex;
  flex: none;
  gap: 12px;
}

/* Même forme, même taille, même graisse : accepter et refuser se valent. */
.mesure-bouton {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border: 1px solid #1f6a4e;
  border-radius: 10px;
  background: transparent;
  color: #1f6a4e;
  cursor: pointer;
  font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
  transition: background-color 160ms ease, color 160ms ease;
}

.mesure-bouton:active {
  transform: scale(0.98);
}

.mesure-banniere :focus-visible {
  border-radius: 4px;
  outline: 2px solid #1f6a4e;
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .mesure-bouton:hover {
    background: #1f6a4e;
    color: #fdfefc;
  }
}

@media (max-width: 960px) {
  .mesure-shell {
    width: min(100% - 48px, 1280px);
  }
}

/* Sur téléphone la barre s'empile et reste compacte : elle ne doit jamais
   recouvrir l'appel à l'action de la page, encore moins le formulaire du
   scanner. Les deux boutons partagent la largeur à parts égales. */
@media (max-width: 720px) {
  .mesure-shell {
    width: min(100% - 32px, 1280px);
    flex-direction: column;
    align-items: stretch;
    padding: 16px 0 18px;
    gap: 14px;
  }

  .mesure-texte {
    font-size: 0.84rem;
  }

  .mesure-actions > .mesure-bouton {
    flex: 1;
    padding-inline: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mesure-bouton {
    transition-duration: 0.01ms;
  }
}

@media (prefers-contrast: more) {
  .mesure-banniere {
    border-top-color: #10251c;
  }
}