/* verlisienne.online — feuille de style unique, auto-hebergee.
   Aucune police distante, aucune ressource tierce, aucun appel reseau externe. */

:root{
  --bg:#1a1a2e;
  --soft:#16213e;
  --ink:#e6e6ef;
  --muted:#a6a6ba;
  --line:#2a2a4a;
  --brand:#e94560;
  --brand-dark:#c5314a;
  --blue:#4ea1d3;
  --green:#35c07f;
  --amber:#f2b134;
  --violet:#b58cf0;
  --maxw:1180px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font);
  font-size:17px;
  line-height:1.7;
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--blue)}
a:hover,a:focus{color:#7cc0e8}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}

/* ---------- bandeau de transparence, tout en haut ---------- */
.bandeau-pub{
  background:var(--brand);
  color:#fff;
  font-size:.86rem;
  font-weight:600;
  line-height:1.45;
  text-align:center;
  padding:9px 16px;
}
.bandeau-pub a{color:#fff;text-decoration:underline}

/* ---------- en-tete ---------- */
.site-head{
  border-bottom:1px solid var(--line);
  background:var(--soft);
}
.site-head .inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:14px 20px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 22px;
}
.brand{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--ink);text-decoration:none;
  font-size:1.2rem;font-weight:700;letter-spacing:.2px;
}
.brand img{width:30px;height:30px}
.brand span{color:var(--brand)}
.nav-principale{margin-left:auto}
.nav-principale ul{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0}
.nav-principale a{color:var(--muted);text-decoration:none;font-size:.94rem;font-weight:600}
.nav-principale a:hover,.nav-principale a[aria-current="page"]{color:var(--brand)}

/* ---------- gabarit ---------- */
.wrap{
  flex:1 0 auto;
  width:100%;
  max-width:var(--maxw);
  margin:0 auto;
  padding:28px 20px 56px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 296px;
  gap:36px;
  align-items:start;
}
.wrap.pleine-largeur{grid-template-columns:minmax(0,1fr)}
main{grid-column:1;min-width:0}
.rail{grid-column:2}
@media (max-width:900px){
  .wrap{grid-template-columns:minmax(0,1fr)}
  main,.rail{grid-column:1}
  .rail{margin-top:8px}
}

/* ---------- typographie ---------- */
h1{font-size:clamp(1.7rem,1.2rem + 2vw,2.5rem);line-height:1.2;margin:.1em 0 .35em}
h2{font-size:clamp(1.3rem,1.05rem + 1vw,1.7rem);line-height:1.3;margin:2em 0 .5em;padding-bottom:.25em;border-bottom:1px solid var(--line)}
h3{font-size:1.12rem;margin:1.6em 0 .4em;color:var(--amber)}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.15em;padding-left:1.35em}
li{margin-bottom:.45em}
strong{color:#fff}
.chapeau{font-size:1.1rem;color:var(--muted)}
.signature{
  font-size:.9rem;color:var(--muted);
  border-left:3px solid var(--brand);
  padding:2px 0 2px 14px;margin:0 0 1.4em;
}
.signature strong{color:var(--ink)}

/* ---------- encadre de divulgation ---------- */
.divulgation{
  background:var(--soft);
  border:1px solid var(--brand);
  border-left-width:5px;
  border-radius:10px;
  padding:16px 18px;
  margin:0 0 1.8em;
  font-size:.95rem;
}
.divulgation p{margin:0 0 .6em}
.divulgation p:last-child{margin-bottom:0}
.divulgation .titre{
  display:block;font-weight:700;color:var(--brand);
  text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;margin-bottom:.5em;
}

/* ---------- encadres ---------- */
.encadre{
  background:var(--soft);border:1px solid var(--line);border-radius:10px;
  padding:16px 18px;margin:1.6em 0;
}
.encadre h3{margin-top:0}
.correction{border-left:4px solid var(--amber)}
.sources ol{margin-bottom:0}
.sources li{font-size:.92rem;word-break:break-word}

/* ---------- boutons et liens partenaires ---------- */
.bloc-cta{
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px;
  margin:2em 0;
  text-align:center;
}
.bloc-cta.compact{padding:16px;margin:1.2em 0;text-align:left}
.bouton-partenaire{
  display:block;
  background:var(--brand);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:1.05rem;
  border-radius:9px;
  padding:14px 20px 10px;
  border:1px solid var(--brand-dark);
}
.bouton-partenaire:hover,.bouton-partenaire:focus{background:var(--brand-dark);color:#fff}
.bouton-partenaire .etiquette{
  display:block;
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.09em;
  opacity:.95;
  margin-top:6px;
}
.note-commission{
  margin:.7em 0 0;
  font-size:.83rem;
  color:var(--muted);
  line-height:1.5;
}

/* ---------- colonne laterale ---------- */
.rail .bloc{
  background:var(--soft);border:1px solid var(--line);border-radius:12px;
  padding:16px 18px;margin-bottom:20px;
}
.rail h2{font-size:1rem;margin:0 0 .7em;border:0;padding:0;color:var(--ink);text-transform:uppercase;letter-spacing:.06em}
.rail ul{padding-left:1.1em;font-size:.93rem}
.rail p{font-size:.93rem}
.rail .bouton-partenaire{font-size:.95rem;padding:12px 14px 9px}

/* ---------- figures ---------- */
figure{margin:1.9em 0;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:14px}
figure img{width:100%;border-radius:8px}
figcaption{margin-top:10px;font-size:.88rem;color:var(--muted);line-height:1.55}

/* ---------- tableaux ---------- */
table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.94rem}
th,td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
th{background:var(--soft);color:var(--ink)}
caption{caption-side:bottom;margin-top:8px;font-size:.85rem;color:var(--muted);text-align:left}

/* ---------- cartes de la page d'accueil ---------- */
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:1.6em 0 2em;padding:0;list-style:none}
.cartes li{margin:0}
.carte{
  display:block;height:100%;
  background:var(--soft);border:1px solid var(--line);border-radius:12px;
  padding:18px;text-decoration:none;color:var(--ink);
}
.carte:hover,.carte:focus{border-color:var(--brand);color:var(--ink)}
.carte h2{margin:0 0 .4em;border:0;padding:0;font-size:1.12rem;color:var(--brand)}
.carte p{margin:0;font-size:.93rem;color:var(--muted)}

/* ---------- pied de page ---------- */
.site-foot{
  flex-shrink:0;
  background:var(--soft);
  border-top:1px solid var(--line);
  font-size:.9rem;
  color:var(--muted);
}
.site-foot .inner{max-width:var(--maxw);margin:0 auto;padding:30px 20px 36px}
.site-foot h2{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;border:0;padding:0;margin:0 0 .7em;color:var(--ink)}
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin-bottom:.4em}
.site-foot a{color:var(--muted);text-decoration:none}
.site-foot a:hover,.site-foot a:focus{color:var(--brand);text-decoration:underline}
.foot-legal{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:.83rem;line-height:1.65}
.foot-legal p{margin:0 0 .5em}

.lien-retour{display:inline-block;margin-top:1.2em;font-weight:600}
.liste-simple{list-style:none;padding:0}
.liste-simple li{margin-bottom:.6em}

/* mention en attente de complement par l'editeur */
.a-completer{display:block;margin-top:.4em;color:var(--amber);font-size:.92em;font-style:italic}
kbd{background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:1px 6px;font-size:.88em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
code{background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:1px 5px;font-size:.9em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-word}
