/* Feuille de style commune aux pages annexes (légales, remerciement) */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --ink: #101014;
  --ink-soft: #1b1b22;
  --paper: #f7f6f3;
  --paper-2: #ebe8e2;
  --mint: #e8930e;
  --mint-deep: #9c6203;
  --line: rgba(16, 16, 20, .14);
  --line-light: rgba(247, 246, 243, .18);
  --radius: 3px;
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Outfit", "Segoe UI", system-ui, sans-serif;
}

html { background: var(--ink); -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.65;
  display: flex; flex-direction: column; min-height: 100svh;
}
img { display: block; max-width: 100%; }
a { color: var(--mint-deep); }
:focus-visible { outline: 3px solid var(--mint); outline-offset: 3px; }

.wrap { width: min(760px, 100% - 2.5rem); margin-inline: auto; }

.legal-header { background: var(--ink); padding: 1.1rem 0; }
.legal-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.legal-header .logo { display: flex; align-items: center; gap: .7rem; text-decoration: none; }
.legal-header img { width: 56px; height: 48px; object-fit: contain; }
.legal-header .logo span {
  font-family: var(--font-display); font-size: 1.35rem; font-weight: 600;
  color: var(--paper); letter-spacing: .04em; text-transform: uppercase;
}
.legal-header .logo em { font-style: normal; color: var(--mint); }
.legal-header .back {
  color: rgba(247,246,243,.7); text-decoration: none; font-size: .88rem; font-weight: 500;
  display: inline-flex; align-items: center; gap: .45rem;
}
.legal-header .back:hover { color: var(--mint); }
.legal-header .back svg { width: 15px; height: 15px; }

main { flex: 1; padding: clamp(2.5rem, 7vw, 4.5rem) 0; }

h1 { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.9rem, 5vw, 2.6rem); line-height: 1.1; }
.lede { margin-top: .6rem; color: rgba(16,16,20,.6); font-size: .95rem; }

h2 {
  font-family: var(--font-display); font-weight: 500; font-size: 1.25rem;
  margin: 2.2rem 0 .5rem; padding-top: 1.4rem; border-top: 1px solid var(--line);
}
p { margin-bottom: .7rem; }
ul { margin: 0 0 .7rem 1.1rem; }
li { margin-bottom: .3rem; }
strong { font-weight: 600; }

.todo {
  display: inline-block; background: rgba(232,147,14,.16); color: var(--mint-deep);
  border: 1px dashed var(--mint-deep); border-radius: var(--radius);
  padding: 0 .4rem; font-size: .88rem; font-weight: 600;
}

.site-footer {
  background: var(--ink); color: rgba(247,246,243,.45);
  padding: 1.6rem 0 calc(1.6rem + env(safe-area-inset-bottom));
  font-size: .78rem;
}
.site-footer .wrap { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; justify-content: space-between; }
.site-footer a { color: rgba(247,246,243,.6); text-decoration: none; }
.site-footer a:hover { color: var(--mint); }

/* Page de remerciement */
.thanks { text-align: center; }
.thanks .check {
  width: 76px; height: 76px; margin: 0 auto 1.6rem; border-radius: 50%;
  display: grid; place-items: center; background: var(--mint); color: var(--ink);
}
.thanks .check svg { width: 36px; height: 36px; }
.thanks .actions { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; margin-top: 2rem; }
.thanks .btn {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .9rem 1.6rem; font: 600 .95rem var(--font-body); text-decoration: none;
  border-radius: var(--radius); transition: transform .25s ease, background .25s ease, color .25s ease;
}
.thanks .btn svg { width: 17px; height: 17px; }
.thanks .btn-solid { background: var(--mint); color: var(--ink); }
.thanks .btn-line { color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
.thanks .btn:hover { transform: translateY(-2px); }
.thanks .btn-line:hover { background: var(--ink); color: var(--paper); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}