/* Reset + base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h-mobile) + 8px); }
@media (min-width: 768px){ html { scroll-padding-top: calc(var(--header-h) + 8px); } }
html, body { margin: 0; padding: 0; }
body{
  background: var(--bg);
  color: var(--text);
  font-family: var(--ff-body);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;   /* PIEGE PROD #11 : clip et pas hidden, pas de scroller body */
}
img, video, iframe { max-width: 100%; display: block; }

/* PIEGE PROD #5 : reset figure */
figure { margin: 0; }

/* PIEGE PROD #8 : [hidden] force */
[hidden] { display: none !important; }

h1, h2, h3, h4, h5, h6 { font-family: var(--ff-display); color: var(--text); margin: 0 0 .6em; line-height: 1.12; letter-spacing: -.01em; font-weight: 600; }
p { margin: 0 0 1em; max-width: 64ch; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--accent-2); }
ul, ol { margin: 0 0 1em; padding-left: 1.2em; }
li { margin-bottom: .35em; }

button { font-family: inherit; cursor: pointer; }

/* Micro-details signes (anti-IA) */
::selection { background: var(--accent); color: #fff; }
::-moz-selection { background: var(--accent); color: #fff; }
* { scrollbar-width: thin; scrollbar-color: var(--accent) var(--bg-alt); }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: var(--bg-alt); }
*::-webkit-scrollbar-thumb { background: var(--accent); border-radius: 4px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: var(--r-sm); }
::placeholder { color: var(--text-mute); opacity: 1; }

.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px){ .container { padding: 0 32px; } }

.eyebrow{
  display:inline-flex; align-items:center; gap:.7em;
  font-size:.78rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.18em; color: var(--accent); margin-bottom: 14px;
}
.eyebrow::before{ content:""; width:28px; height:1.5px; background: var(--accent); }

.section-head { max-width: 720px; margin-bottom: clamp(28px, 4vw, 48px); }
.section-head h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.section-head p { color: var(--text-2); font-size: clamp(1rem, 1.4vw, 1.1rem); }

em.accent { font-style: italic; color: var(--accent); position: relative; display: inline-block; }
em.accent::after{
  content:""; position:absolute; left:-2px; right:-2px; bottom:.06em; height:.32em;
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  transform: skewX(-6deg);
  z-index:-1; border-radius:2px;
}