:root{
  --fond:#08080B;
  --surface:#131318;
  --surface-haut:#1A1A22;
  --trait:#26262F;
  --encre:#ECECF1;
  --encre-douce:#92929E;
  --accent:#6E56F8;
  --accent-clair:#9B87FF;
  --rayon:16px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--fond);
  color:var(--encre);
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.enveloppe{max-width:920px;margin:0 auto;padding:48px 20px 96px}
.titre{font-size:clamp(28px,5vw,40px);line-height:1.1;font-weight:800;letter-spacing:-.02em;margin:0 0 12px}
.chapo{max-width:56ch;color:var(--encre-douce);margin:0 0 32px}

/* Formulaire */
.recherche{
  background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);
  padding:16px;display:grid;gap:12px;grid-template-columns:1fr 1fr 150px auto;align-items:end;
}
@media (max-width:760px){.recherche{grid-template-columns:1fr}}
.champ{display:flex;flex-direction:column;gap:6px;position:relative;min-width:0}
label{font-size:13px;font-weight:500;color:var(--encre-douce)}
input,select,textarea{
  width:100%;background:var(--fond);border:1px solid var(--trait);border-radius:10px;
  color:var(--encre);font:inherit;font-size:15px;padding:11px 13px;
}
input::placeholder,textarea::placeholder{color:#6B6580}
input:focus-visible,select:focus-visible,button:focus-visible,textarea:focus-visible,a:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
}
.bouton{
  background:linear-gradient(135deg,var(--accent),var(--accent-clair));
  color:#fff;border:0;border-radius:12px;font:inherit;
  font-weight:700;font-size:15px;padding:13px 24px;cursor:pointer;
  box-shadow:0 8px 24px rgba(110,86,248,.30);
}
.bouton:hover{filter:brightness(1.08)}
.bouton[disabled]{opacity:.55;cursor:progress}
.bouton-sobre{
  background:none;border:1px solid var(--trait);border-radius:10px;color:var(--encre);
  font:inherit;font-weight:500;font-size:15px;padding:12px 22px;cursor:pointer;
}
.bouton-sobre:hover{border-color:var(--accent)}

/* Autocomplétion */
.suggestions{
  position:absolute;top:100%;left:0;right:0;z-index:20;margin-top:6px;padding:4px;
  background:var(--surface-haut);border:1px solid var(--trait);border-radius:10px;
  box-shadow:0 18px 40px rgba(0,0,0,.45);max-height:260px;overflow:auto;
}
.suggestions[hidden]{display:none}
.suggestions button{
  display:block;width:100%;text-align:left;background:none;border:0;color:var(--encre);
  font:inherit;font-size:14px;padding:9px 11px;border-radius:7px;cursor:pointer;
}
.suggestions button:hover,.suggestions button[aria-selected="true"]{background:var(--accent);color:#fff}
.suggestions small{color:var(--encre-douce);font-size:12px}
.suggestions button:hover small{color:#EDE9FE}

/* Liste d'offres */
.etat{margin:28px 0 0;color:var(--encre-douce);font-size:14px}
.liste{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:10px}
.offre{
  background:var(--surface);border:1px solid var(--trait);border-left:3px solid transparent;
  border-radius:var(--rayon);padding:0;
}
.offre:hover,.offre:focus-within{border-left-color:var(--accent)}
.offre>button{
  display:block;width:100%;text-align:left;background:none;border:0;color:inherit;
  font:inherit;padding:18px 20px;cursor:pointer;border-radius:var(--rayon);
}
.offre h2{font-size:18px;font-weight:700;letter-spacing:-.01em;margin:0 0 4px}
.meta{color:var(--encre-douce);font-size:14px;margin:0 0 10px}
.extrait{font-size:14.5px;color:#C4BFD2;margin:0;max-width:70ch}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.tag{font-size:12.5px;color:var(--encre-douce);border:1px solid var(--trait);border-radius:99px;padding:3px 10px}
.plus{display:flex;justify-content:center;margin-top:24px}
.plus[hidden]{display:none}
.source{margin-top:48px;font-size:13px;color:var(--encre-douce)}

/* Annonce complète */
.retour{
  background:none;border:0;color:var(--encre-douce);font:inherit;font-size:14.5px;
  padding:0 0 20px;cursor:pointer;
}
.retour:hover{color:var(--encre)}
.retour::before{content:"← "}
.annonce h1{font-size:clamp(24px,4vw,32px);line-height:1.15;font-weight:800;letter-spacing:-.02em;margin:0 0 6px}
.annonce .texte{
  white-space:pre-line;font-size:15.5px;color:#C9C4D6;max-width:68ch;
  border-top:1px solid var(--trait);padding-top:20px;margin-top:8px;
}
.lien-officiel{margin:24px 0 0;font-size:14.5px}
.lien-officiel a{color:var(--encre-douce)}
.lien-officiel a:hover{color:var(--encre)}
.barre-action{
  position:sticky;bottom:16px;margin-top:32px;
  background:var(--surface-haut);border:1px solid var(--trait);border-radius:var(--rayon);
  padding:16px 20px;display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  box-shadow:0 16px 40px rgba(0,0,0,.5);
}
.barre-action strong{display:block;font-size:15px}
.barre-action span{display:block;font-size:13.5px;color:var(--encre-douce);max-width:46ch}

/* Parcours candidature */
.rappel{
  background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);
  padding:16px 20px;margin:0 0 28px;
}
.rappel p{margin:0;font-size:14px;color:var(--encre-douce)}
.rappel strong{display:block;font-size:17px;color:var(--encre);font-weight:700;margin-bottom:2px}
.choix{display:grid;gap:12px;grid-template-columns:1fr 1fr;margin:0 0 28px}
@media (max-width:700px){.choix{grid-template-columns:1fr}}
.voie{
  background:var(--surface);border:1px solid var(--trait);border-radius:var(--rayon);
  padding:22px;text-align:left;color:inherit;font:inherit;cursor:pointer;
}
.voie:hover{border-color:var(--accent)}
.voie strong{display:block;font-size:17px;font-weight:700;margin-bottom:6px}
.voie p{margin:0 0 14px;font-size:14.5px;color:var(--encre-douce)}
.voie .prix{font-size:14px;font-weight:700;color:var(--accent)}
.depot{
  border:1px dashed var(--trait);border-radius:var(--rayon);padding:28px 20px;text-align:center;
  background:var(--surface);
}
.depot p{color:var(--encre-douce);font-size:14.5px;margin:8px 0 0}
.apercu{
  position:relative;background:var(--surface);border:1px solid var(--trait);
  border-radius:var(--rayon);padding:28px;margin:24px 0;overflow:hidden;
}
.apercu .lettre{white-space:pre-line;font-size:15px;line-height:1.7;color:#D8D4E2;max-width:66ch}
.apercu::after{
  content:"CV FOCUS · APERÇU";
  position:absolute;inset:0;display:grid;place-content:center;
  font-size:clamp(28px,6vw,52px);font-weight:800;letter-spacing:.04em;
  color:rgba(110,86,248,.15);transform:rotate(-22deg);pointer-events:none;
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}