/* Formulaire « besoin » et présentation des deux offres (octobre 2026).
   Ajouts minimaux : le design existant des formulaires et des sections est conservé. */
[data-form-version="aurel-offres-besoin-20261002"] .need-branch {display:contents;}
[data-form-version="aurel-offres-besoin-20261002"] .need-branch[hidden],
[data-form-version="aurel-offres-besoin-20261002"] .copy-acknowledgement span[hidden] {display:none !important;}
[data-form-version="aurel-offres-besoin-20261002"] .copy-acknowledgement {
 display:flex; align-items:flex-start; gap:12px; cursor:pointer;
}
[data-form-version="aurel-offres-besoin-20261002"] .copy-acknowledgement input {
 width:20px; height:20px; min-width:20px; margin-block-start:4px; accent-color:var(--ae-orange, #ff6b0b);
}
[data-form-version="aurel-offres-besoin-20261002"] .copy-acknowledgement span {min-width:0;}

/* Les deux offres publiques, dans la liste numérotée existante (.ae-rows). */
.ae-rows .ae-offer {display:flex; flex-direction:column; gap:10px; min-width:0;}
.ae-rows .ae-offer-desc {font-size:clamp(15px,1.1vw,16px); font-weight:400; line-height:1.6; letter-spacing:0; color:#3D4045; text-wrap:pretty;}

/* Description du hero en points (landings d’offres). Puces carrées orange, comme le surtitre. */
.ae-hero .ae-lead-list {list-style:none; padding:0; display:grid; gap:10px;}
.ae-hero .ae-lead-list li {position:relative; padding-inline-start:22px;}
.ae-hero .ae-lead-list li::before {content:""; position:absolute; inset-inline-start:0; top:.62em; width:8px; height:8px; background:var(--orange, #ff6b0b);}

/* Section candidature : titre court « 3 étapes à suivre », première question juste sous le hero. */
.ae-apply.need-apply {padding-top:clamp(28px,3.5vw,48px);}
.ae-apply.need-apply .ae-apply-grid {row-gap:16px;}
.ae-apply.need-apply .copy-form-heading h2 {margin:0; font-size:clamp(24px,2.4vw,34px); line-height:1.15; letter-spacing:-.02em;}
.ae-apply.need-apply .copy-stepper {margin-bottom:16px;}
/* L’intitulé d’étape répète le bandeau : masqué à l’écran, conservé pour les lecteurs d’écran et le focus. */
.ae-apply.need-apply .copy-step-panel > legend {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}

/* ===== Landings d’offres (body.need-page) : fond blanc, texte noir, hero centré — essai d’octobre 2026 ===== */
.need-page {background:#fff; color:var(--ink);}
/* En-tête clair (le menu mobile ouvert garde son fond sombre d’origine). */
.need-page .ae-header.is-solid:not(.is-open) {background:#fff;}
.need-page .ae-header:not(.is-open) .ae-header-inner {border-bottom-color:var(--line-l);}
.need-page .ae-header:not(.is-open) .ae-logo,
.need-page .ae-header:not(.is-open) .ae-nav a,
.need-page .ae-header:not(.is-open) .ae-portal {color:var(--ink);}
.need-page .ae-header:not(.is-open) .ae-lang {color:#5B5F64;}
.need-page .ae-header:not(.is-open) .ae-cta-sm {background:var(--ink); color:#fff;}
.need-page .ae-header:not(.is-open) .ae-cta-sm:hover {background:var(--orange); color:var(--ink);}
.need-page .ae-header:not(.is-open) .ae-burger {border-color:rgba(16,17,18,.35);}
.need-page .ae-header:not(.is-open) .ae-burger span {background:var(--ink);}
/* Hero centré et aéré. */
.need-page .ae-hero {background:#fff; color:var(--ink);}
.need-page .ae-hero-inner {justify-content:center; align-items:center; text-align:center; min-height:min(72vh,720px);}
.need-page .ae-hero [data-rv-group] {display:flex; flex-direction:column; align-items:center; max-width:820px;}
.need-page .ae-hero .ae-eyebrow {justify-content:center;}
.need-page .ae-hero h1 {margin-inline:auto;}
.need-page .ae-hero .ae-lead-list {justify-items:center; margin-inline:auto; color:#3D4045;}
/* Section candidature : une colonne centrée. */
.need-page .ae-apply {background:#fff; color:var(--ink); border-top-color:var(--line-l);}
.need-page .ae-apply-grid {grid-template-columns:minmax(0,1fr); max-width:760px; margin-inline:auto;}
.need-page .ae-apply .copy-form-heading {grid-column:1; grid-row:auto; position:static; text-align:center;}
.need-page .ae-apply .copy-form,
.need-page .ae-apply .copy-receipt {grid-column:1; grid-row:auto;}
/* Formulaire lisible sur fond blanc. */
.need-page .copy-stepper li {color:#6B6F74;}
.need-page .copy-stepper li span {border-color:rgba(16,17,18,.3);}
.need-page .copy-stepper li[aria-current],
.need-page .copy-stepper li.copy-step-done {color:var(--ink);}
.need-page .copy-stepper progress,
.need-page .copy-stepper progress::-webkit-progress-bar {background:#E4E4DF;}
.need-page .copy-step-status,
.need-page .copy-coordinates > legend {color:#6B6F74;}
.need-page .copy-field input,
.need-page .copy-field select,
.need-page .copy-field textarea {background-color:#fff; color:var(--ink); border-color:#C9C9C3;}
.need-page .copy-field select {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23101112' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");}
.need-page .copy-field input:hover,
.need-page .copy-field select:hover,
.need-page .copy-field textarea:hover {border-color:#8E9196;}
.need-page .copy-field small,
.need-page .copy-selected-answer,
.need-page .copy-submit small {color:#5B5F64;}
.need-page .copy-wilaya ul {background:#fff;}
.need-page .copy-coordinates {border-bottom-color:var(--line-l);}
.need-page .copy-submit {border-top-color:var(--line-l);}
.need-page .copy-submit small a {color:var(--ink);}
.need-page .copy-error {color:#B42318;}
.need-page .copy-form .copy-back {color:var(--ink); border-color:rgba(16,17,18,.35);}
.need-page .copy-form .copy-back:hover {color:var(--ink); border-color:var(--ink);}
.need-page .copy-form .copy-button:hover,
.need-page .copy-receipt .copy-button:hover {background:var(--ink); border-color:var(--ink); color:#fff;}
.need-page .copy-receipt p {color:#3D4045;}
.need-page .copy-receipt strong {color:var(--ink);}
/* Mobile : hauteur du hero selon son contenu, la première question arrive juste après. */
@media (max-width:899px){
 .need-page .ae-hero-inner {min-height:0; padding-bottom:24px;}
}
/* Points alignés : la liste reste centrée dans la page, ses lignes partent du même bord. */
.need-page .ae-hero .ae-lead-list {justify-items:start; width:fit-content; max-width:100%; margin-inline:auto; text-align:start;}
/* Landings du formulaire : contenu immobile. Pas d’apparition qui glisse au chargement ni au défilement
 (editorial.js pose opacity/transform en style inline ; on les neutralise ici, la mise en page ne change pas). */
.need-page [data-rv] {opacity:1 !important; transform:none !important; transition:none !important;}
/* Landing Dossier : formulaire seul (pas de héros ni de bloc offres). Le formulaire démarre sous l’en-tête fixe. */
.need-form-only .ae-apply.need-apply {padding-top:calc(var(--hh) + clamp(20px, 3vw, 40px));}

/* Landing Dossier : en-tête réduit au logo, centré (pas de menu ni de pied de page). */
.need-form-only .ae-header-inner {grid-template-columns:minmax(0,1fr); justify-items:center;}
.need-form-only .ae-logo {justify-self:center;}
/* Les 4 étapes du formulaire sur une seule ligne ; sur mobile, numéro au-dessus d’un libellé court, centré. */
.need-page .copy-stepper ol {grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px;}
@media (max-width:899px){
 .need-page .copy-stepper li {flex-direction:column; align-items:center; gap:6px; text-align:center; font-size:12px; line-height:1.2;}
 .need-page .copy-stepper li span {width:28px; height:28px; font-size:13px;}
}
/* iPhone : la page ne doit jamais glisser sur le côté pendant le défilement. iOS ignore « overflow-x » posé
   sur body seul : on le pose aussi sur html, et le doigt ne fait défiler que verticalement (zoom conservé). */
html {overflow-x:clip;}
@supports not (overflow:clip) { html, body {overflow-x:hidden;} }
body.need-page {touch-action:pan-y pinch-zoom;}
/* Lien « Cookies » sous le formulaire (rouvre le bandeau de consentement). */
.copy-consent-link {background:none; border:0; padding:0; font:inherit; color:inherit; text-decoration:underline; text-underline-offset:3px; cursor:pointer;}
/* Page « merci » de la landing Dossier : confirmation centrée, sous l'en-tête. */
.need-thanks-section .copy-receipt {display:block; max-width:640px; margin-inline:auto; text-align:center;}
.need-thanks-section .copy-receipt h1 {margin:0 0 16px; font-size:clamp(28px,3vw,44px); font-weight:500; line-height:1.1; letter-spacing:-.03em;}
.need-thanks-section .copy-form-note {margin-top:24px;}