/* ============================================================
   StructOrga Solutions — gabarit commun des pages statiques
   Charte graphique v1, août 2026.
   Reproduit le bandeau, le conteneur et le pied de page
   des pages de l'application.
   ============================================================ */
:root{
  --marine:#142242; --marine-h:#1E2F58; --bleu:#3E6E9E; --ciel:#75A6D0;
  --brume:#D9E6F2; --papier:#FBFAF7; --orange:#E2701A;
  --orange-txt:#B25815; --encre:#4A5468; --trait:#E3E0D9;
  --serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--papier); color:var(--encre);
  font-family:var(--sans); font-size:16px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.conteneur{max-width:1280px;margin:0 auto;padding-left:32px;padding-right:32px}
@media(max-width:640px){.conteneur{padding-left:16px;padding-right:16px}}

/* ---------- bandeau ---------- */
header{background:var(--marine)}
.hbar{display:flex;align-items:center;justify-content:space-between;gap:24px;height:80px}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none}
.plaque{width:44px;height:44px;border-radius:9px;background:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.plaque img{width:34px;height:34px;object-fit:contain}
.marque span{color:var(--papier);font-size:19px;font-weight:700;letter-spacing:-.01em}
.hnav{display:flex;align-items:center;gap:26px}
.hnav a{font-size:14px;font-weight:500;color:var(--papier);text-decoration:none;padding:6px 0;opacity:.88}
.hnav a:hover{opacity:1}
.hnav a.actif{opacity:1;border-bottom:2px solid var(--orange)}
.hcta{
  background:var(--papier);color:var(--marine);
  font-size:14px;font-weight:600;padding:8px 16px;border-radius:4px;
  text-decoration:none;white-space:nowrap;
}
.hcta:hover{background:var(--brume)}
@media(max-width:1080px){.hnav{display:none}}

/* ---------- titres ---------- */
main{padding:80px 0 96px}
@media(max-width:900px){main{padding:56px 0 72px}}
.kicker{
  display:flex;align-items:center;gap:.6em;
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--orange-txt);margin:0 0 14px;
}
.kicker::before{content:"";width:16px;height:2px;background:var(--orange);flex:0 0 auto}
h1{font-family:var(--serif);font-weight:400;font-size:44px;line-height:1.12;color:var(--marine);margin:0}
h1 em{font-style:italic;color:var(--bleu)}
@media(max-width:900px){h1{font-size:32px}}
h2{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.2;color:var(--marine);margin:0 0 6px}
h3{font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.25;color:var(--marine);margin:0 0 6px}
.filet{width:52px;height:3px;background:var(--orange);margin:16px 0 24px}
.lede{font-size:18px;color:var(--encre);margin:0 0 48px;max-width:62ch}
p{max-width:68ch}

/* ---------- boutons ---------- */
.btn{
  display:inline-block;text-align:center;
  background:var(--marine);color:var(--papier);
  border:0;border-radius:4px;padding:13px 22px;
  font-size:15px;font-weight:600;font-family:inherit;
  cursor:pointer;text-decoration:none;
}
.btn:hover{background:var(--marine-h)}
.btn-ligne{
  display:inline-block;color:var(--marine);font-size:15px;font-weight:600;
  text-decoration:none;border-bottom:2px solid var(--orange);padding-bottom:2px;margin-left:18px;
}

/* ---------- pied de page ---------- */
footer{background:var(--marine);color:var(--papier)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding:48px 0 32px}
@media(max-width:1024px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.fgrid{grid-template-columns:1fr}}
.fmarque{font-size:18px;font-weight:700;color:var(--papier);margin:0 0 10px}
.fbaseline{font-size:14px;color:#B9C9E0;margin:0;max-width:34ch}
.ftitre{
  display:flex;align-items:center;gap:.6em;
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--orange);margin:0 0 14px;
}
.ftitre::before{content:"";width:16px;height:2px;background:var(--orange);flex:0 0 auto}
.fliste{list-style:none;margin:0;padding:0}
.fliste li{margin:0 0 9px}
.fliste a{font-size:14px;color:#D5E0EF;text-decoration:none}
.fliste a:hover{color:var(--papier);text-decoration:underline}
.fbas{
  border-top:1px solid rgba(251,250,247,.2);
  padding:22px 0 40px;
  display:flex;flex-wrap:wrap;align-items:baseline;row-gap:4px;
}
.fbas p{font-size:12px;color:rgba(251,250,247,.6);margin:0;max-width:none}
.fbas p:nth-of-type(2)::before{content:"·";margin:0 .55em;opacity:.45}
.fbas p:nth-of-type(3){margin-left:auto}
@media(max-width:820px){
  .fbas{display:block}
  .fbas p{margin-bottom:4px}
  .fbas p:nth-of-type(2)::before{content:none}
}
