/* ============================================================
   Corrections d'integration Oxygen -> retablir le rendu du prototype.
   (specificite zero via :where() pour NE PAS ecraser les classes .sl-*)
   ============================================================ */

/* 1. Oxygen met tous les conteneurs/textes en display:flex par defaut,
      ce qui casse le flux en bloc et les marges du prototype. On repasse
      en block ; les classes .sl-* qui veulent du flex/grid gardent la main. */
:where(.oxy-container) { display: block; }
:where(.oxy-rich-text, .oxy-text) { display: block; }
/* Le RichText enveloppe le vrai titre/paragraphe : pas de marge propre en trop. */
:where(.oxy-rich-text) > :first-child { margin-top: 0; }
:where(.oxy-rich-text) > :last-child { margin-bottom: 0; }

/* 2. Header sticky : le wrapper HtmlCode du header ne fait que la hauteur
      du header -> le sticky n'a pas de course. display:contents le retire
      du flux pour que .sl-header colle a la page (equiv. #sl-header du proto). */
.oxy-html-code:has(> .sl-header) { display: contents; }

/* 3. Fonds de sections qui etaient en style inline dans le prototype. */
.sl-section:has(.sl-parcours__grid) { background: var(--sl-bg-mist); }
.sl-section:has(.sl-faq__resources) { background: var(--sl-bg-mist); }

/* 4. Header reduit au scroll (classe posee par custom.js), comme le prototype. */
.sl-header { transition: box-shadow .25s ease, padding .25s ease; }
.sl-header--scrolled { box-shadow: 0 6px 24px rgba(22, 48, 47, 0.10); }

/* 5. Eviter le DOUBLE padding entre sections (le prototype met padding-top:0 en inline
      sur les bandes CTA et la section secteurs -> trop de blanc sinon). */
/* Classe explicite posee au build sur les sections qui doivent coller a la
   precedente (= ce que le prototype faisait en inline padding-top:0).
   On ne met PAS de regle globale sur les CTA : c'est du cas par cas. */
.sl-flush-top { padding-top: 0; }
/* La section secteurs (agence) suit l'intro-card sans fond -> flush comme le prototype. */
.sl-section:has(.sl-secteur) { padding-top: 0; }

/* ---- Page Mentions legales (contenu legal lisible, charte StaffLink) ---- */
.sl-legal { max-width: 820px; margin: 0 auto; }
.sl-legal h2 { font-size: 1.25rem; font-weight: 700; color: #2f6365; margin: 2.2rem 0 .6rem; }
.sl-legal h2:first-child { margin-top: 0; }
.sl-legal p { color: #3a3a3a; line-height: 1.7; margin: 0 0 1rem; }
.sl-legal a { color: #2fac66; font-weight: 600; }
.sl-legal .sl-legal__todo { background: #fff7ed; border: 1px dashed #e0a458; color: #8a5a1a; padding: 2px 8px; border-radius: 6px; font-weight: 600; }

/* Home : la section "Nos offres" (.sl-offres-cta, fond bg-soft) suit directement la bande
   secteurs (.sl-sectors-section, meme fond, sans padding-bas). Le padding-haut plein de
   .sl-section (~6rem) creait un grand vide de meme couleur -> on le reduit dans ce cas precis. */
.sl-sectors-section + .sl-offres-cta { padding-top: clamp(1.5rem, 3.5vw, 2.5rem); }
