:root {
  --rouge: #C62828;
  --rouge-vif: #E63946;
  --anthracite: #1A1A1A;
  --ivoire: #FAF7F5;
}

html { scroll-behavior: smooth; }
body { font-family: "Inter", sans-serif; background: var(--ivoire); color: var(--anthracite); overflow-x: hidden; }
h1, h2, h3, .font-titre { font-family: "Archivo", sans-serif; }

.hazard { background: repeating-linear-gradient(-45deg, #C62828 0px, #C62828 22px, #1A1A1A 22px, #1A1A1A 44px); }
.hero-bg { background: linear-gradient(160deg, rgba(26,26,26,.96) 0%, rgba(26,26,26,.88) 55%, rgba(198,40,40,.35) 100%), var(--anthracite); }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }
.trait-rouge { width: 56px; height: 4px; background: var(--rouge-vif); flex: 0 0 auto; }
.filet { border-color: rgba(26,26,26,.12); }

/* Confort et lisibilité sur téléphones */
@media (max-width: 640px) {
  .max-w-6xl.mx-auto.px-6 { padding-left: 1rem; padding-right: 1rem; }
  header .navbar { gap: .5rem; padding-top: .75rem; padding-bottom: .75rem; }
  header .navbar-start { min-width: 0; flex: 1 1 auto; }
  header .navbar-start > a { gap: .5rem; min-width: 0; }
  header .navbar-start > a > div:first-child { width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; }
  header .navbar-start .leading-tight { min-width: 0; }
  header .navbar-start .leading-tight > div:first-child { font-size: .9rem; white-space: nowrap; }
  header .navbar-start .leading-tight > div:last-child { display: none; }
  header .navbar-end { padding-left: .25rem; }
  header .navbar-end a { font-size: .7rem; line-height: 1.1; padding: .55rem .65rem; }
  #accueil > div { padding-top: 4.5rem; padding-bottom: 4.5rem; }
  #accueil h1 { font-size: 2.25rem; }
  #accueil .text-lg { font-size: 1rem; }
  #accueil .grid { margin-top: 2.5rem; }
  section { scroll-margin-top: 4.5rem; }
  section h2 { line-height: 1.1; }
  form.p-8 { padding: 1.25rem; }
  .card-body.p-8 { padding: 1.25rem; }
}

@media (min-width: 641px) and (max-width: 1023px) {
  header .navbar-center { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { transition: none; }
}