/* MASTO, site public : feuille commune */

:root{
  --encre:#16151F;
  --texte:#3E3C47;      /* texte courant */
  --doux:#64626D;       /* texte secondaire : 5,6:1 sur le papier */
  --papier:#FAF9F6;
  --blanc:#FFFFFF;
  --surface:#F2F0EB;    /* emplacements, fonds neutres */
  --filet:#E3E0D9;
  --filet-fort:#CFCBC2;
  --accent:#4B3BFF;
  --accent-fonce:#3A2BE0;
  --pastel:#EEEAFF;
  --ok:#1D6B45;
  --erreur:#B3261E;
  --police:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter",system-ui,"Segoe UI",Roboto,sans-serif;
  /* trois tailles */
  --t-titre:clamp(34px,3.6vw,50px);
  --t-section:clamp(26px,2.6vw,34px);
  --t-texte:17px;
  --t-petit:14px;
  --large:1200px;
  --marge:clamp(20px,4vw,48px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:88px}
body{font-family:var(--police);font-size:var(--t-texte);line-height:1.55;color:var(--texte);background:var(--papier);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
a{color:var(--accent);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--accent-fonce)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
h1,h2,h3{color:var(--encre);font-weight:600;letter-spacing:-.022em;line-height:1.1}
h1{font-size:var(--t-titre);letter-spacing:-.032em;line-height:1.04}
h2{font-size:var(--t-section);line-height:1.15}
h3{font-size:var(--t-texte);letter-spacing:-.01em;line-height:1.35}
p{max-width:62ch}
.petit{font-size:var(--t-petit);line-height:1.5}
.doux{color:var(--doux)}
.cadre{max-width:var(--large);margin:0 auto;padding:0 var(--marge)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.aller{position:absolute;left:12px;top:-60px;background:var(--encre);color:#fff;padding:10px 14px;border-radius:6px;z-index:20}
.aller:focus{top:12px}

/* ---------- barre ---------- */
.barre{position:sticky;top:0;z-index:10;background:rgba(250,249,246,.97);border-bottom:1px solid transparent;transition:border-color .2s}
.barre.defile{border-bottom-color:var(--filet)}
.barre .cadre{display:flex;align-items:center;gap:32px;height:72px}
.marque{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre);font-weight:700;font-size:17px;letter-spacing:.06em}
.marque img{width:32px;height:32px;border-radius:8px}
.barre nav{margin-left:auto}
.nav{display:flex;gap:28px;list-style:none}
.nav a{color:var(--texte);text-decoration:none;font-size:15px;padding:6px 0;border-bottom:1px solid transparent}
.nav a:hover{color:var(--encre);border-bottom-color:var(--filet-fort)}
.nav a[aria-current=page]{color:var(--encre);border-bottom-color:var(--encre)}
.menu{display:none}
@media(max-width:860px){
  .nav{display:none}
  .barre nav{display:none}
  .barre .cadre{gap:12px;height:64px}
  .menu{display:block;margin-left:auto;position:relative}
  .menu summary{list-style:none;cursor:pointer;height:40px;padding:0 14px;border:1px solid var(--filet-fort);border-radius:6px;display:flex;align-items:center;font-size:15px;color:var(--encre)}
  .menu summary::-webkit-details-marker{display:none}
  .menu ul{position:absolute;right:0;top:48px;list-style:none;background:var(--blanc);border:1px solid var(--filet);border-radius:8px;min-width:200px;padding:6px 0;box-shadow:0 12px 32px -12px rgba(22,21,31,.18)}
  .menu a{display:block;padding:11px 18px;color:var(--encre);text-decoration:none;font-size:16px}
  .menu a:hover{background:var(--surface)}
}

/* ---------- boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:6px;border:1px solid transparent;font:inherit;font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s;white-space:nowrap}
.btn-plein{background:var(--accent);color:#fff}
.btn-plein:hover{background:var(--accent-fonce);color:#fff}
.btn-trait{background:transparent;color:var(--encre);border-color:var(--filet-fort)}
.btn-trait:hover{border-color:var(--encre);color:var(--encre)}
.btn-petit{height:40px;padding:0 16px;font-size:15px}
@media(max-width:860px){.barre .btn-petit{padding:0 14px}}

/* ---------- sections ---------- */
.section{padding:clamp(64px,8vw,112px) 0;border-top:1px solid var(--filet)}
.entete{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:16px clamp(32px,6vw,96px);align-items:end;margin-bottom:clamp(36px,4vw,56px)}
.entete p{color:var(--doux)}
@media(max-width:860px){.entete{grid-template-columns:1fr}}

/* ---------- héros ---------- */
.heros{padding:clamp(40px,6vw,88px) 0 clamp(56px,7vw,104px)}
.heros .cadre{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
.heros .situe{font-size:15px;color:var(--doux);margin-bottom:22px}
.heros .chapeau{font-size:19px;line-height:1.55;color:var(--texte);margin-top:24px;max-width:34em}
@media(max-width:960px){.heros .cadre{grid-template-columns:1fr}}

/* ---------- formulaire de commande ---------- */
.commande{margin-top:36px;background:var(--blanc);border:1px solid var(--filet);border-radius:10px;padding:24px;max-width:520px}
.champ{margin-top:0}
.champ label{display:block;font-size:var(--t-petit);font-weight:600;color:var(--encre);margin-bottom:6px}
.ligne{display:flex;gap:10px}
.ligne input{flex:1;min-width:0}
input[type=email],input[type=text],input[type=tel],select{height:48px;border:1px solid var(--filet-fort);border-radius:6px;background:var(--blanc);padding:0 14px;font:inherit;font-size:16px;color:var(--encre);width:100%}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
input[aria-invalid=true]{border-color:var(--erreur)}
.err{display:none;margin-top:8px;font-size:var(--t-petit);color:var(--erreur);font-weight:500}
.err.vu{display:block}
.aide{margin-top:8px;font-size:var(--t-petit);color:var(--doux)}
.lien-bouton{background:none;border:0;font:inherit;color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;cursor:pointer;padding:0}
.envoye-msg{display:none}
.commande.envoye .saisie{display:none}
.commande.envoye .envoye-msg{display:block}
.envoye-msg .coche{width:40px;height:40px;border-radius:50%;background:#E6F2EA;color:var(--ok);display:grid;place-items:center;margin-bottom:16px}
.envoye-msg h3{font-size:20px}
.envoye-msg p{margin-top:8px;color:var(--texte)}
.envoye-msg b{color:var(--encre);font-weight:600;overflow-wrap:anywhere}
.envoye-msg .lien-bouton{margin-top:16px;font-size:15px}
@media(max-width:560px){
  .commande{padding:18px}
  .ligne{flex-direction:column}
  .ligne input{flex:none}
  .heros .chapeau{font-size:17px}
  .ligne .btn{width:100%}
}

/* ---------- le document (rapport) ---------- */
.feuille{background:var(--blanc);border:1px solid var(--filet);border-radius:3px;box-shadow:0 1px 2px rgba(22,21,31,.04),0 18px 40px -24px rgba(22,21,31,.22);padding:clamp(20px,3vw,36px);font-size:13.5px;line-height:1.45;color:var(--texte)}
.feuille .tete{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;border-bottom:1.5px solid var(--encre)}
.feuille .tete .m{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:.06em;color:var(--encre);font-size:12px}
.feuille .tete .m img{width:20px;height:20px;border-radius:5px}
.feuille .tete .ref{text-align:right;font-size:12px;color:var(--doux);font-variant-numeric:tabular-nums}
.feuille .titre-doc{margin-top:18px;font-size:20px;font-weight:600;color:var(--encre);letter-spacing:-.015em}
.feuille .adresse{color:var(--texte);margin-top:2px}
.feuille dl.infos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px;margin-top:16px;padding:12px 0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.feuille dl.infos dt{font-size:11.5px;color:var(--doux)}
.feuille dl.infos dd{color:var(--encre);font-weight:500}
.feuille .piece{display:flex;justify-content:space-between;align-items:baseline;margin-top:20px;padding-bottom:6px}
.feuille .piece b{font-size:15px;color:var(--encre);font-weight:600}
.feuille .piece span{font-size:12px;color:var(--doux)}
.feuille table{width:100%;border-collapse:collapse}
.feuille th{text-align:left;font-weight:500;font-size:11.5px;color:var(--doux);padding:6px 8px 6px 0;border-bottom:1px solid var(--filet-fort)}
.feuille td{padding:9px 8px 9px 0;border-bottom:1px solid var(--filet);vertical-align:top}
.feuille td:first-child{color:var(--encre);font-weight:500;width:22%}
.feuille td:last-child{white-space:nowrap;width:1%;padding-right:0}
.etat{display:inline-block;font-size:12px;font-weight:500;color:var(--encre);border:1px solid var(--filet-fort);border-radius:3px;padding:1px 6px}
.etat.use{border-color:#D8B9A6;background:#FFF5EF}
.feuille .photos{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.feuille .photos span{aspect-ratio:4/3;background:var(--surface);border:1px solid var(--filet);display:flex;align-items:flex-end;padding:4px 6px;font-size:10.5px;color:var(--doux);font-variant-numeric:tabular-nums}
.feuille .signes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px;padding-top:14px;border-top:1px solid var(--filet)}
.feuille .signes div{font-size:12px;color:var(--doux)}
.feuille .signes svg{display:block;height:34px;width:auto;color:var(--encre);margin:4px 0 2px}
.feuille .signes b{color:var(--encre);font-weight:500}
.feuille .pied-doc{display:flex;justify-content:space-between;margin-top:14px;font-size:11px;color:var(--doux)}
.legende{margin-top:12px;font-size:13px;color:var(--doux)}
@media(max-width:560px){
  .feuille{font-size:13px}
  .feuille dl.infos{grid-template-columns:1fr 1fr}
  .feuille td:first-child{width:auto}
  .masque-tel{display:none}
}

/* ---------- chiffres ---------- */
.chiffres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--encre)}
.chiffres div{padding:20px 24px 4px 0}
.chiffres div+div{padding-left:24px;border-left:1px solid var(--filet)}
.chiffres b{display:block;font-size:var(--t-section);font-weight:600;color:var(--encre);letter-spacing:-.025em;line-height:1.1;font-variant-numeric:tabular-nums}
.chiffres span{display:block;margin-top:6px;font-size:15px;color:var(--doux);max-width:24ch}
@media(max-width:860px){
  .chiffres{grid-template-columns:1fr 1fr}
  .chiffres div{padding:18px 16px 18px 0}
  .chiffres div+div{padding-left:0;border-left:0}
  .chiffres div:nth-child(even){padding-left:16px;border-left:1px solid var(--filet)}
  .chiffres div:nth-child(n+3){border-top:1px solid var(--filet)}
}

/* ---------- contenu du rapport, annoté ---------- */
.anatomie{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.points{list-style:none;border-top:1px solid var(--filet)}
.points li{padding:18px 0;border-bottom:1px solid var(--filet);display:grid;grid-template-columns:32px 1fr;gap:4px 12px}
.points .n{font-size:var(--t-petit);color:var(--doux);font-variant-numeric:tabular-nums;padding-top:2px}
.points p{grid-column:2;color:var(--doux);font-size:16px}
.repere{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#fff;font-size:11px;font-weight:600;font-style:normal;vertical-align:middle;margin-right:6px;flex:none}
.points .n .repere{margin:0}
@media(max-width:960px){.anatomie{grid-template-columns:1fr}}

/* ---------- déroulé ---------- */
.deroule{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--encre)}
.deroule li{padding:20px 24px 0 0;position:relative}
.deroule li+li{padding-left:24px;border-left:1px solid var(--filet)}
.deroule time{display:block;font-size:var(--t-petit);color:var(--doux);font-variant-numeric:tabular-nums}
.deroule h3{margin-top:10px}
.deroule p{margin-top:6px;font-size:16px;color:var(--doux)}
@media(max-width:860px){
  .deroule{grid-template-columns:1fr;border-top:0;border-left:1px solid var(--encre);margin-left:6px}
  .deroule li,.deroule li+li{padding:0 0 28px 24px;border-left:0}
  .deroule li::before{content:"";position:absolute;left:-5px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--papier);border:1.5px solid var(--encre)}
  .deroule li:last-child{padding-bottom:0}
}

/* ---------- listes à lignes (pour qui, conditions) ---------- */
.lignes{border-top:1px solid var(--filet)}
.lignes>div{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px clamp(32px,6vw,96px);padding:22px 0;border-bottom:1px solid var(--filet)}
.lignes h3{font-size:19px}
.deux-col .lignes>div{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:8px 32px}
.lignes p{color:var(--doux)}
@media(max-width:700px){.lignes>div,.deux-col .lignes>div{grid-template-columns:1fr;padding:18px 0}}

/* ---------- questions ---------- */
.faq{border-top:1px solid var(--filet)}
.faq details{border-bottom:1px solid var(--filet)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;padding:20px 0;font-size:18px;font-weight:500;color:var(--encre)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;background:linear-gradient(var(--encre),var(--encre)) center/12px 1.5px no-repeat,linear-gradient(var(--encre),var(--encre)) center/1.5px 12px no-repeat;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--accent)}
.faq details p{padding:0 0 22px;color:var(--texte)}
.deux-col{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,6vw,96px)}
@media(max-width:860px){.deux-col{grid-template-columns:1fr}}

/* ---------- appel final ---------- */
.final{background:var(--pastel);border-radius:10px;padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 64px;align-items:center}
.final p{margin-top:12px;color:var(--texte)}
.final .commande{margin-top:0;border-color:transparent}
@media(max-width:860px){.final{grid-template-columns:1fr}}

/* ---------- contact ---------- */
.contact{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px clamp(32px,6vw,96px)}
.contact dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-top:1px solid var(--filet);padding-top:20px}
.contact dt{font-size:var(--t-petit);color:var(--doux)}
.contact dd{margin-top:4px;color:var(--encre);font-size:18px}
.contact dd a{color:var(--encre)}
@media(max-width:860px){.contact{grid-template-columns:1fr}.contact dl{grid-template-columns:1fr;gap:16px}}

/* ---------- pied ---------- */
.pied{border-top:1px solid var(--filet);padding:56px 0 40px;font-size:15px;background:var(--papier)}
.pied .grille{display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2fr));gap:32px}
.pied p{color:var(--doux);margin-top:14px;max-width:34ch}
.pied h2{font-size:var(--t-petit);font-weight:600;color:var(--encre);letter-spacing:0;margin-bottom:12px}
.pied ul{list-style:none;display:grid;gap:8px}
.pied a{color:var(--texte);text-decoration:none}
.pied a:hover{color:var(--encre);text-decoration:underline}
.pied .bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:48px;padding-top:20px;border-top:1px solid var(--filet);font-size:var(--t-petit);color:var(--doux)}
.pied .bas ul{display:flex;flex-wrap:wrap;gap:20px}
.pied .bas a{color:var(--doux)}
@media(max-width:860px){.pied .grille{grid-template-columns:1fr 1fr}.pied .grille>div:first-child{grid-column:1/-1}}

/* ---------- experts ---------- */
.missions{background:var(--blanc);border:1px solid var(--filet);border-radius:8px;overflow:hidden}
.missions .haut{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:18px 20px;border-bottom:1px solid var(--filet)}
.missions .haut b{color:var(--encre);font-weight:600}
.missions .haut span{font-size:13px;color:var(--doux)}
.mission{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:4px 16px;padding:16px 20px;border-bottom:1px solid var(--filet);align-items:start;font-size:15px}
.mission:last-child{border-bottom:0}
.mission time{color:var(--encre);font-weight:500;font-variant-numeric:tabular-nums;font-size:14px;line-height:1.35}
.mission time small{display:block;color:var(--doux);font-weight:400}
.mission .quoi b{display:block;color:var(--encre);font-weight:600}
.mission .quoi span{color:var(--doux);font-size:14px}
.mission .statut{font-size:13px;font-weight:500;color:var(--encre);border:1px solid var(--filet-fort);border-radius:3px;padding:1px 7px;white-space:nowrap;align-self:center}
.mission .statut.fait{color:var(--ok);border-color:#B7D6C3;background:#F4FAF6}
.mission.nouvelle{background:#FBFAFF;box-shadow:inset 3px 0 0 var(--accent)}
@media(max-width:560px){
  .mission{grid-template-columns:60px minmax(0,1fr) auto;padding:14px 16px;gap:4px 12px}
  .missions .haut{padding:14px 16px;flex-direction:column;gap:2px}
}
.store{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 18px;border:1px solid var(--filet-fort);border-radius:6px;color:var(--doux);font-size:15px}
.store svg{color:var(--encre)}

@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.pied .marque{color:var(--encre)}

.btn:disabled{opacity:.7;cursor:progress}
.final .commande{max-width:none}
.dossier-actions .btn{width:100%}
.dossier-actions .aide a{color:var(--doux)}
.final a:not(.btn){color:var(--accent-fonce)}
.feuille.signatures .signes{margin-top:28px;padding-top:0;border-top:0}
.feuille.signatures .pied-doc{margin-top:28px;padding-top:12px;border-top:1px solid var(--filet)}
.pied .bas a[aria-current=page]{color:var(--encre)}

/* mentions légales */
.legal{max-width:760px;display:grid;gap:48px}
.legal h2{font-size:22px;margin-bottom:16px}
.legal dl{border-top:1px solid var(--filet)}
.legal dl>div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4px 24px;padding:14px 0;border-bottom:1px solid var(--filet)}
.legal dt{color:var(--doux);font-size:15px}
.legal dd{color:var(--encre)}
@media(max-width:560px){.legal dl>div{grid-template-columns:1fr}}
.chiffres b{font-size:clamp(20px,1.9vw,26px)}