/* Base commune à toutes les pages : couleurs, typo, reset. Style "miniature" : contours noirs, ombres dures, terracotta. */
:root {
  --ink: #16283B;
  --ink-deep: #0F1D2C;
  --ink-raise: #1C3249;
  --line: #2A4560;
  --terra: #E8623D;
  --terra-soft: #F07D5C;
  --sand: #F4EDE4;
  --sand-dim: #B4BFCB;
  --outline: #0A1119;
  --ok: #6ACB92;
  --wip: #F2B84B;
  --f-display: "Bricolage Grotesque", "Arial Narrow", Impact, sans-serif;
  --f-body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --bounce: cubic-bezier(.34, 1.56, .64, 1);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { background: var(--ink); }
body {
  background: var(--ink); color: var(--sand);
  font-family: var(--f-body); margin: 0; padding-inline: 16px;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--terra-soft); text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--terra); outline-offset: 3px; }
img { max-width: 100%; }
[hidden] { display: none !important; }

.display {
  font-family: var(--f-display); font-weight: 800; font-stretch: 75%;
  font-variation-settings: "wdth" 75; text-transform: uppercase; letter-spacing: .005em;
}
.brand { color: var(--sand); text-decoration: none; line-height: 1; }
.brand span { color: var(--terra); }

@keyframes rise { from { transform: translateY(30px); opacity: .2; } }
@keyframes slam { from { transform: translateY(-60px) rotate(-12deg) scale(1.15); opacity: .3; } }

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