/* ==========================================================================
   base.css — socle commun aux deux versions (reset, utilitaires, animations,
   bouton de bascule). Les palettes et la mise en page vivent dans a.css / b.css.
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip; }
body { margin: 0; min-height: 100vh; overflow-x: clip; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
address { font-style: normal; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 1rem; top: -4rem; padding: .5rem 1rem; background: #fff; color: #000; z-index: 1000; border-radius: 6px; }
.skip-link:focus { top: 1rem; }

/* --- Animations d'apparition (IntersectionObserver dans main.js) --- */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal[data-delay="1"] { transition-delay: .1s; }
.reveal[data-delay="2"] { transition-delay: .2s; }
.reveal[data-delay="3"] { transition-delay: .3s; }
.reveal[data-delay="4"] { transition-delay: .4s; }
.reveal[data-delay="5"] { transition-delay: .5s; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* --- Bouton de bascule entre les versions (temporaire, injecté par switch.js) --- */
.version-switch {
  position: fixed; left: 16px; bottom: 16px; z-index: 9999;
  display: flex; align-items: center; gap: 4px; padding: 4px;
  background: rgba(20, 24, 22, .92); color: #fff; border-radius: 999px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25); backdrop-filter: blur(8px);
  font: 600 12px/1 system-ui, -apple-system, "Segoe UI", sans-serif; letter-spacing: .04em;
}
.version-switch__label { padding: 0 8px 0 12px; opacity: .6; text-transform: uppercase; font-size: 10px; }
.version-switch a, .version-switch span.is-active {
  display: inline-block; padding: 9px 14px; border-radius: 999px; color: #fff; opacity: .7; transition: opacity .2s, background .2s;
}
.version-switch a:hover { opacity: 1; background: rgba(255,255,255,.12); }
.version-switch span.is-active { opacity: 1; background: #fff; color: #141816; }
@media (max-width: 640px) { .version-switch__label { display: none; } }