/* ==========================================================
   Réglages communs du kit (équivalent Elementor > Kit)
   Les couleurs et typographies de chaque proposition sont
   définies en tête de p1.css et p2.css.
   ========================================================== */
:root {
  /* Marges internes des containers de section (grand écran) */
  --sec-py: 80px;
  --sec-px: 32px;
  /* Largeur de contenu */
  --wrap: 1500px;
}

@media (max-width: 1366px) { :root { --sec-px: 50px; --wrap: 1000px; } }
@media (max-width: 1024px) { :root { --sec-py: 50px; --sec-px: 24px; --wrap: 100%; } }
@media (max-width: 767px)  { :root { --sec-px: 16px; } }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Container de section Elementor (marges du kit, identiques partout) */
.sec { padding: var(--sec-py) var(--sec-px); }
/* Container interne de largeur de contenu (marges internes à 0) */
.wrap { max-width: var(--wrap); margin: 0 auto; width: 100%; }

/* ==========================================================
   Bascule entre propositions (hors maquette)
   ========================================================== */
.bascule {
  display: grid; grid-template-columns: 1fr 1fr;
  background: #2b2b2b; position: relative; z-index: 60;
  font-family: system-ui, sans-serif;
}
.bascule a {
  display: block; text-align: center; text-decoration: none;
  padding: 18px 12px; font-weight: 700; font-size: 1.05rem;
  color: #bdbdbd; background: #2b2b2b;
}
.bascule a.actif { background: #ffd84d; color: #000; }
.bascule a:not(.actif):hover { color: #fff; }

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