/* HumanOrigin — site public. Le système visuel est celui du Creator Shell, transposé à
   une page : même papier, même marine, même serif de titre, beaucoup d'air, aucun
   vocabulaire de tableau de bord. Les jetons viennent du Brand Master V1. */
:root{
  --papier:#FBFAF7; --carte:#FFFFFF; --marine:#012454; --encre:#1A1E24;
  --atone:#565E69; --ligne:#E6E2D8;
  --bleu-fond:#E7EFF8; --bleu-encre:#2C5C8F;
  --vert-fond:#E2F0E8; --vert-encre:#3E8E5A;
  --ambre-fond:#FBF0DB; --ambre-encre:#A9762B;
  --serif:ui-serif, Georgia, "Times New Roman", serif;
  --sans:-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --colonne:760px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papier);color:var(--encre);
  font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
.enveloppe{max-width:var(--colonne);margin:0 auto;padding:0 24px}

/* ---------------------------------------------------------------- marque
   Deux calques du MÊME raster : le mot privé de son O, puis le O seul, découpés aux
   bornes mesurées sur le master (x 446 → 576 de 850). Le composite vaut le raster
   intact ; rien n'est redessiné, rien n'est recomposé avec une police. */
.marque{position:relative;display:inline-block;vertical-align:top;line-height:0}
.marque img{display:block;height:var(--h,24px);width:auto}
.marque .o{position:absolute;left:0;top:0}
.marque .mot{
  -webkit-mask-image:linear-gradient(to right,#000 0 52.470588%,transparent 52.470588% 67.764706%,#000 67.764706% 100%);
  mask-image:linear-gradient(to right,#000 0 52.470588%,transparent 52.470588% 67.764706%,#000 67.764706% 100%)}
.marque .o{
  -webkit-mask-image:linear-gradient(to right,transparent 0 52.470588%,#000 52.470588% 67.764706%,transparent 67.764706% 100%);
  mask-image:linear-gradient(to right,transparent 0 52.470588%,#000 52.470588% 67.764706%,transparent 67.764706% 100%)}

header{position:sticky;top:0;z-index:5;background:rgba(251,250,247,.9);
  backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--ligne)}
header .enveloppe{display:flex;align-items:center;justify-content:space-between;
  padding-top:15px;padding-bottom:15px;gap:16px}
header nav{display:flex;gap:22px;font-size:14.5px}
header nav a{color:var(--atone);text-decoration:none}
header nav a:hover{color:var(--marine)}
@media (max-width:640px){header nav{display:none}}

.pilule{display:inline-block;font:600 11.5px/1 var(--sans);letter-spacing:.09em;
  text-transform:uppercase;color:var(--bleu-encre);background:var(--bleu-fond);
  border-radius:999px;padding:7px 12px}

h1{font:400 clamp(32px,6vw,52px)/1.14 var(--serif);color:var(--marine);
  letter-spacing:-.015em;margin:22px 0 18px}
h2{font:400 clamp(24px,4vw,32px)/1.25 var(--serif);color:var(--marine);
  letter-spacing:-.012em;margin:0 0 16px}
h3{font:600 16px/1.4 var(--sans);color:var(--encre);margin:0 0 6px}
p{margin:0 0 18px;color:var(--atone)}
p.fort{color:var(--encre);font-size:19px;line-height:1.6}
section{padding:72px 0;border-top:1px solid var(--ligne)}
section:first-of-type{border-top:0}
.hero{padding:76px 0 64px}

.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:28px 0 14px}
.cta{display:inline-flex;align-items:center;gap:10px;font:600 16px/1 var(--sans);
  padding:15px 22px;border-radius:10px;text-decoration:none;border:1px solid var(--marine)}
.cta.plein{background:var(--marine);color:#FAFAFB}
.cta.vide{background:var(--carte);color:var(--marine)}
.cta:hover{opacity:.92}
.exigences{font-size:14px;color:var(--atone);margin:0}
.exigences b{color:var(--encre);font-weight:600}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:8px 0 0}
@media (max-width:720px){.duo{grid-template-columns:1fr}}
.bloc{background:var(--carte);border:1px solid var(--ligne);border-radius:12px;padding:22px}
.bloc h3{display:flex;align-items:center;gap:9px}
.bloc ul{margin:0;padding-left:20px;color:var(--atone);font-size:15.5px;line-height:1.6}
.bloc li{margin:0 0 8px}
.bloc.peut{border-left:3px solid var(--vert-encre)}
.bloc.pas{border-left:3px solid var(--ambre-encre)}

.etapes{counter-reset:e;margin:0;padding:0;list-style:none}
.etapes li{counter-increment:e;position:relative;padding-left:52px;margin:0 0 26px}
.etapes li::before{content:counter(e);position:absolute;left:0;top:-2px;width:34px;height:34px;
  border-radius:50%;background:var(--bleu-fond);color:var(--bleu-encre);
  font:600 15px/34px var(--sans);text-align:center}
.etapes p{margin:0}

details{border-top:1px solid var(--ligne);padding:18px 0}
details:last-of-type{border-bottom:1px solid var(--ligne)}
summary{cursor:pointer;font:600 16.5px/1.45 var(--sans);color:var(--encre);list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--atone);font-weight:400}
details[open] summary::after{content:"–"}
details p{margin:12px 0 0;font-size:16px}

footer{border-top:1px solid var(--ligne);padding:40px 0 64px;font-size:14px;color:var(--atone)}
footer a{color:var(--marine)}
.mention{font-size:13.5px;color:var(--atone);margin:14px 0 0}