/* Voile d'avant-ouverture : flou posé par la classe `voile` écrite en dur sur <html> (voir voile.js). */
@import url("polices.css");

html.voile, html.voile body { overflow: hidden !important; }
html.voile body > *:not(.voile-panneau) {
  filter: blur(14px) saturate(.85);
  pointer-events: none !important;
  user-select: none;
}

.voile-panneau { display: none; }
html.voile .voile-panneau {
  display: grid; place-items: center; position: fixed; inset: 0; z-index: 2147483000; padding: 16px;
  background: rgba(246, 242, 236, .55); font: 400 16px/1.5 "IBM Plex Sans", system-ui, sans-serif; color: #1E1E1E;
}
.voile-carte {
  width: 100%; max-width: 500px; background: #fff; border-radius: 28px; padding: clamp(24px, 6vw, 40px);
  box-shadow: 0 30px 80px rgba(30, 30, 30, .18); display: flex; flex-direction: column; gap: 16px;
}
.voile-marque { display: inline-flex; align-items: flex-end; gap: 1px; --h: 42px; }
.voile-marque img { height: var(--h); width: auto; display: block; }
.voile-marque span { position: relative; top: 3px; margin-left: 3px; padding-bottom: calc(var(--h) * .015);
  font: italic 500 calc(var(--h) * .346)/1 Georgia, "Times New Roman", serif; color: #8A6447; }
.voile-carte h2 { margin: 4px 0 0; font: 700 clamp(28px, 6vw, 36px)/1.05 "Bricolage Grotesque", system-ui, sans-serif; letter-spacing: -.02em; }
.voile-carte p { margin: 0; color: #4A4A4A; }
.voile-formulaire { display: flex; flex-direction: column; gap: 10px; }
.voile-ligne { display: flex; gap: 8px; flex-wrap: wrap; }
.voile-ligne input { flex: 1 1 220px; min-width: 0; border: 1px solid #DDD6CE; border-radius: 999px; padding: 14px 18px; font: inherit; outline: none; }
.voile-ligne input:focus { border-color: #AE8768; }
.voile-bouton { border: none; cursor: pointer; border-radius: 999px; padding: 14px 24px; background: #AE8768; color: #1E1E1E; font: 600 16px "IBM Plex Sans", system-ui, sans-serif; }
.voile-bouton:disabled { opacity: .6; cursor: progress; }
.voile-turnstile:empty { display: none; }
.voile-note { min-height: 1.2em; font-size: 14px; color: #8C2F1F !important; }
.voile-note:empty { display: none; }
.voile-succes { padding: 14px 16px; border-radius: 16px; background: #E4EDE2; color: #2F5A2A !important; }
.voile-petit { font-size: 13px; color: #6A635C !important; }
.voile-petit a { color: #8A6447; }