/* ══════════════════════════════════════════════════════════════════════════
   visulogistique.com — feuille partagée (refonte 1er août 2026).
   Jetons : JETONS.md. Registre clair et sobre, aligné sur le logiciel OSMOSE.
   Aucun framework, aucune police distante, aucune image décorative.
   ══════════════════════════════════════════════════════════════════════════ */

@font-face { font-family:'Sora'; font-weight:600; font-display:swap; src:url('fonts/sora-600.woff2') format('woff2'); }
@font-face { font-family:'Sora'; font-weight:700; font-display:swap; src:url('fonts/sora-700.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-weight:400; font-display:swap; src:url('fonts/archivo-400.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-weight:500; font-display:swap; src:url('fonts/archivo-500.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-weight:600; font-display:swap; src:url('fonts/archivo-600.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-weight:700; font-display:swap; src:url('fonts/archivo-700.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:400; font-display:swap; src:url('fonts/plexmono-400.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:500; font-display:swap; src:url('fonts/plexmono-500.woff2') format('woff2'); }

:root{
  --encre:#0E1726; --encre-2:#24314B; --texte:#4A5468; --muet:#5B6478; --muet-2:#8A93A6; --desactive:#A6AEBD;
  --trait:#E8ECF2; --trait-carte:#E4E9F0; --trait-fin:#EEF1F6; --trait-fort:#D5DBE5; --bord-bouton:#C0C8D6;
  --fond:#F7F8FA; --surface:#FFFFFF; --surface-douce:#FAFBFD; --puce:#F1F4F8; --chassis:#0E1726; --navy:#101B33; --bulle:#0B1424;
  --ops:#1C65C8; --ops-clair:#5A9BF0; --ops-sombre:#123F86; --ops-fond:#EAF1FB;
  --consult:#C46D00; --consult-clair:#F0A03A; --consult-sombre:#8A4D00; --consult-fond:#FDF3E3;
  --field:#007E79; --field-clair:#3FB5AE; --field-sombre:#005A57; --field-fond:#E2F4F2;
  --team:#7A4ABA; --team-clair:#A47FD6; --labo:#B53C7F; --labo-clair:#D97AAC;
  --dore:#E08A2B; --dore-texte:#C46D00; --dore-fond:#FDF6EA; --dore-bord:#EBD5B4;
  --observe:#146044; --observe-bord:#BFE0CF; --observe-fond:#E7F4EE;
  --infere:#8A5A10; --infere-bord:#E8D5AA; --infere-fond:#FDF3E3;
  --declare:#5B6478; --declare-bord:#D5DBE5; --declare-fond:#EEF1F5;
  --conteste:#A02020; --conteste-bord:#E8C0C0; --conteste-fond:#FCEDED;
  --titre:'Sora',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --corps:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --mono:'IBM Plex Mono','SF Mono','DejaVu Sans Mono',Consolas,monospace;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--corps);font-size:16px;line-height:1.6;color:var(--texte);background:var(--surface);-webkit-font-smoothing:antialiased;}
a{color:var(--ops);text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;}
h1,h2,h3,h4{font-family:var(--titre);color:var(--encre);margin:0;font-weight:700;}
p{margin:0 0 14px;text-wrap:pretty;}
.cadre{max-width:1180px;margin:0 auto;padding:0 28px;}
.mono{font-family:var(--mono);}
.chapeau{font-family:var(--corps);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--corps);font-weight:600;font-size:14px;
  border-radius:5px;padding:14px 22px;cursor:pointer;border:1px solid transparent;transition:filter .15s,background .15s,border-color .15s;white-space:nowrap;}
.btn:hover{text-decoration:none;}
.btn.primaire{background:var(--ops);color:#fff;}
.btn.primaire:hover{filter:brightness(1.07);}
.btn.sombre{background:var(--chassis);color:#fff;}
.btn.sombre:hover{filter:brightness(1.25);}
.btn.blanc{background:#fff;color:var(--encre);border-color:var(--trait-fort);}
.btn.secondaire{background:#fff;color:var(--encre-2);border:1px solid var(--bord-bouton);}
.btn.secondaire:hover{border-color:var(--muet-2);}
.btn.petit{padding:11px 17px;font-size:13.5px;}

/* Provenance (JETONS §3) */
.prov{display:inline-block;border:1px solid;border-radius:2px;padding:2px 5px;font-family:var(--corps);font-weight:700;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;line-height:1;}
.prov.obs{color:var(--observe);border-color:var(--observe-bord);background:var(--observe-fond);}
.prov.inf{color:var(--infere);border-color:var(--infere-bord);background:var(--infere-fond);}
.prov.dec{color:var(--declare);border-color:var(--declare-bord);background:var(--declare-fond);}
.prov.con{color:var(--conteste);border-color:var(--conteste-bord);background:var(--conteste-fond);}

/* Anneau de marque (JETONS §6) — couronne conique masquée + trois satellites. */
.anneau{position:relative;width:76px;height:76px;flex:none;}
.anneau .cour{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 0deg,var(--sombre) 0deg,var(--sombre) 26deg,rgba(0,0,0,0) 29deg,rgba(0,0,0,0) 92deg,var(--clair) 95deg,var(--base) 165deg,var(--sombre) 250deg,var(--sombre) 330deg);
  -webkit-mask-image:radial-gradient(circle closest-side,transparent 0,transparent 62%,#000 65%,#000 100%);
  mask-image:radial-gradient(circle closest-side,transparent 0,transparent 62%,#000 65%,#000 100%);}
.anneau .s1{position:absolute;top:6px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--base);}
.anneau .s2{position:absolute;top:17px;right:0;width:5.5px;height:5.5px;border-radius:50%;background:var(--clair);}
.anneau .s3{position:absolute;top:26px;right:10px;width:4px;height:4px;border-radius:50%;background:var(--clair);}
.anneau.ops{--base:var(--ops);--clair:var(--ops-clair);--sombre:var(--ops-sombre);}
.anneau.osmose{--base:#1C65C8;--clair:#5A9BF0;--sombre:#123F86;}

/* Marque OSMO — la VRAIE : anneaux orbitaux 3D + satellites + cœur pulsé (portée de OsmoMark.dc.html).
   Le filtre (teinte) et la vitesse d'orbite (--spd) portent les 5 états. Transition douce de teinte. */
.om{transition:filter .4s ease;}
@keyframes om-spin{from{transform:rotateZ(0)}to{transform:rotateZ(360deg)}}
@keyframes om-counter{from{transform:rotateZ(0)}to{transform:rotateZ(-360deg)}}
@keyframes om-spin-rev{from{transform:rotateZ(0)}to{transform:rotateZ(-360deg)}}
@keyframes om-core{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes om-pulse{0%,100%{opacity:.9;transform:scale(1);filter:brightness(1) saturate(1)}22%{opacity:1;transform:scale(1.05);filter:brightness(1.35) saturate(.85)}40%{opacity:.94;transform:scale(1.01);filter:brightness(1.05) saturate(1)}64%{opacity:1;transform:scale(1.09);filter:brightness(1.6) saturate(.7)}82%{opacity:.95;transform:scale(1.02);filter:brightness(1.12) saturate(.95)}}
@keyframes om-flare{0%,100%{opacity:.18;transform:scale(.86)}20%{opacity:.85;transform:scale(1.18)}36%{opacity:.24;transform:scale(.95)}62%{opacity:1;transform:scale(1.38)}78%{opacity:.3;transform:scale(1)}}
@keyframes om-halo{0%,100%{opacity:.3;transform:scale(.94)}20%{opacity:.72;transform:scale(1.06)}36%{opacity:.36;transform:scale(.98)}62%{opacity:.95;transform:scale(1.16)}78%{opacity:.4;transform:scale(1)}}

/* ── Bandeau ────────────────────────────────────────────────────────────── */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--trait);}
header.site .cadre{display:flex;align-items:center;gap:34px;height:96px;}
.logo{display:inline-flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none;width:max-content;}
.logo img{display:block;height:44px;width:auto;}
.logo .baseline{font:600 9.5px/1 var(--corps);letter-spacing:.3em;text-transform:uppercase;color:var(--muet);text-align:right;white-space:nowrap;}
nav.princ{display:flex;gap:0;margin-left:6px;}
nav.princ a{position:relative;padding:37px 14px;font-weight:500;font-size:14px;color:var(--encre-2);white-space:nowrap;}
nav.princ a:hover{text-decoration:none;color:var(--encre);}
nav.princ a.actif::after{content:'';position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--ops);}
header.site .droite{margin-left:auto;display:flex;align-items:center;gap:14px;}
.burger{display:none;background:none;border:0;cursor:pointer;font-size:22px;color:var(--encre);}

/* ── Pied de page ───────────────────────────────────────────────────────── */
footer.site{background:#fff;border-top:1px solid var(--trait);padding:48px 0 38px;margin-top:10px;}
footer.site .grille{display:grid;grid-template-columns:1.4fr .9fr .9fr 1.1fr;gap:36px;}
footer.site .logo img{height:40px;}
footer.site h4{font-family:var(--corps);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muet-2);margin:0 0 12px;}
footer.site ul{list-style:none;margin:0;padding:0;}
footer.site li{margin:0 0 8px;}
footer.site a{color:var(--texte);font-size:14px;}
footer.site .coord{font-family:var(--mono);font-size:13px;color:var(--texte);}
footer.site .bas{border-top:1px solid var(--trait-fin);margin-top:32px;padding-top:20px;color:var(--desactive);font-size:12.5px;}

/* ── Sections génériques ────────────────────────────────────────────────── */
section{padding:0;}
.pastille{display:inline-block;font-family:var(--corps);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dore-texte);border:1px solid var(--dore-bord);background:var(--dore-fond);padding:7px 12px;border-radius:999px;}
.carte{background:var(--surface);border:1px solid var(--trait-carte);border-radius:14px;}
h2.section{font-size:32px;line-height:1.22;letter-spacing:-.016em;}
.encart-sombre{background:var(--chassis);border-radius:14px;color:#fff;}

/* Bulle OSMO (JETONS §9) */
.osmo-bulle-zone{position:fixed;right:26px;bottom:26px;z-index:60;display:flex;align-items:center;gap:12px;}
.osmo-etiquette{background:#fff;border:1px solid var(--trait-carte);border-radius:999px;padding:10px 17px;font-weight:500;font-size:13px;color:var(--encre-2);white-space:nowrap;box-shadow:0 8px 22px rgba(14,23,38,.14);cursor:pointer;}
.osmo-pastille{width:62px;height:62px;border-radius:50%;background:var(--bulle);display:flex;align-items:center;justify-content:center;cursor:pointer;border:0;box-shadow:0 10px 26px rgba(14,23,38,.32);flex:none;}
.osmo-accueil{position:fixed;right:26px;bottom:104px;z-index:61;width:382px;max-width:calc(100vw - 40px);background:var(--navy);color:#fff;border-radius:14px 14px 4px 14px;padding:18px 18px 16px;box-shadow:0 18px 48px rgba(14,23,38,.4);}
.osmo-accueil[hidden]{display:none;}
.osmo-accueil .fermer{position:absolute;top:10px;right:12px;background:rgba(255,255,255,.1);border:0;color:#fff;width:26px;height:26px;border-radius:7px;cursor:pointer;}
.osmo-panneau{position:fixed;right:26px;bottom:104px;z-index:61;width:372px;max-width:calc(100vw - 40px);background:var(--navy);color:#fff;border-radius:14px;box-shadow:0 20px 52px rgba(14,23,38,.4);overflow:hidden;display:flex;flex-direction:column;max-height:min(640px,calc(100vh - 140px));}
.osmo-panneau[hidden]{display:none;}
.osmo-panneau .tete{display:flex;align-items:center;gap:11px;padding:15px 16px;border-bottom:1px solid rgba(255,255,255,.08);}
.osmo-panneau .tete .nom{font-family:var(--titre);font-weight:700;font-size:14px;}
.osmo-panneau .tete .sous{font-size:11.5px;color:rgba(255,255,255,.55);}
.osmo-panneau .tete .fermer{margin-left:auto;background:rgba(255,255,255,.1);border:0;color:#fff;width:30px;height:28px;border-radius:8px;cursor:pointer;}
.osmo-corps{padding:16px;overflow-y:auto;}
.osmo-corps .msg{background:rgba(255,255,255,.07);border-radius:12px 12px 12px 3px;padding:11px 13px;font-size:13px;line-height:1.5;margin-bottom:12px;}
.osmo-choix{display:flex;flex-direction:column;gap:8px;}
.osmo-choix button,.osmo-choix a{text-align:left;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#fff;border-radius:9px;padding:11px 13px;font-family:var(--corps);font-size:13.5px;cursor:pointer;}
.osmo-choix button:hover,.osmo-choix a:hover{background:rgba(255,255,255,.12);text-decoration:none;}
.osmo-choix .primaire{background:#fff;color:var(--encre);font-weight:600;}
.osmo-saisie{display:flex;gap:6px;padding:12px 16px;border-top:1px solid rgba(255,255,255,.08);}
.osmo-saisie input{flex:1;background:rgba(255,255,255,.07);border:0;border-radius:8px;padding:10px 13px;color:#fff;font-family:var(--corps);font-size:13.5px;}
.osmo-saisie input::placeholder{color:rgba(255,255,255,.4);}
.osmo-saisie button{background:var(--ops);border:0;color:#fff;border-radius:8px;padding:0 14px;cursor:pointer;}
.osmo-retour{background:none;border:0;color:rgba(255,255,255,.6);font-family:var(--corps);font-size:12.5px;cursor:pointer;padding:0 0 10px;}
.osmo-eq{display:inline-flex;gap:3px;align-items:flex-end;height:16px;margin-left:auto;}
.osmo-eq span{width:3px;height:100%;background:rgba(255,255,255,.6);border-radius:2px;transform-origin:bottom;animation:eq 1.1s ease-in-out infinite;}
.osmo-eq span:nth-child(2){animation-delay:-.35s;} .osmo-eq span:nth-child(3){animation-delay:-.7s;}
@keyframes eq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes clign{0%,100%{opacity:1}50%{opacity:.3}}

/* ── Responsive (SITE.md §10) ───────────────────────────────────────────── */
@media(max-width:1240px){ .cadre{max-width:100%;} }
@media(max-width:980px){
  .grille-2,.grille-2b,footer.site .grille{grid-template-columns:1fr !important;}
}
@media(max-width:820px){
  nav.princ{display:none;}
  .burger{display:block;}
  header.site .cadre{height:72px;gap:14px;}
  nav.princ.ouvert{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:#fff;border-bottom:1px solid var(--trait);padding:8px 20px 16px;}
  nav.princ.ouvert a{padding:12px 4px;}
  h1.hero{font-size:32px !important;}
  h2.section{font-size:26px;}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none !important;}
}