/* ==========================================================================
   ASSIST'ENTREPRISES - pages légales
   --------------------------------------------------------------------------
   Les blocs de tokens ci-dessous sont une COPIE de ceux d'index.html.
   Si vous changez la palette dans index.html, reportez-la ici, sinon les
   pages légales dériveront visuellement du reste du site.
   ========================================================================== */

:root{
  --bg:#F0F0EC;
  --surface:#FAFAF8;
  --surface-2:#E8E8E2;
  --ink:#14161A;
  --ink-2:#414751;
  /* #5C636E est le gris le plus clair qui tienne 4.5:1 sur les trois surfaces
     claires de la page. Mesuré sur la plus sombre, #E8E8E2 : 4,92:1. */
  --ink-3:#5C636E;
  --line:#DEDED6;
  --line-strong:#C8C8BE;

  /* --accent : indigo profond, porte le petit texte accentué, les traits et
     le fond des panneaux (13,8:1 sur porcelaine).
     --accent-mid : indigo électrique, 5,1:1 sur le fond de page. Il tient le
     petit texte, mais il reste réservé aux icônes pour que l'encre demeure
     la seule couleur de lecture. */
  --accent:#1B1E4B;
  --accent-mid:#4B4FE8;
  --accent-soft:#E4E4F5;

  /* Vert haute visibilité : aplats uniquement. Sur fond clair il ne mesure
     que 1,13:1, il ne peut donc JAMAIS servir de couleur de texte sur la
     page. En aplat avec l'encre par-dessus, il monte à 14,0:1. */
  --volt:#C6F24E;
  --btn-bg:#C6F24E;
  --btn-fg:#14161A;
  --btn-bg-hover:#D4F76E;

  /* la pastille se pose sur --accent, qui s'inverse d'un thème à l'autre :
     vert sur indigo profond en clair, encre sur périwinkle en sombre. */
  --pill-fg:#C6F24E;

  --logo-chip:transparent;

  --r-lg:16px;
  --r-md:10px;

  --shadow-sm:0 1px 2px rgba(20,22,26,.05), 0 2px 8px rgba(20,22,26,.04);
  --shadow-md:0 2px 4px rgba(20,22,26,.05), 0 12px 32px rgba(20,22,26,.07);
  --shadow-lg:0 4px 8px rgba(20,22,26,.06), 0 24px 60px rgba(20,22,26,.10);

  --wrap:1240px;
  --nav-h:88px;
  --ease:cubic-bezier(.16,1,.3,1);
}

@media (prefers-color-scheme:dark){
  :root{
    --bg:#0C0D12;
    --surface:#14161D;
    --surface-2:#1B1E27;
    --ink:#F0F1EE;
    --ink-2:#B6BAC4;
    --ink-3:#8E94A1;
    --line:#262A35;
    --line-strong:#363B49;

    /* l'indigo profond disparaîtrait sur ce fond : en sombre l'accent devient
       le périwinkle clair, et l'indigo électrique s'éclaircit d'autant. */
    --accent:#A8ABFF;
    --accent-mid:#8D91FF;
    --accent-soft:#191C3D;

    --volt:#C6F24E;
    --btn-bg:#C6F24E;
    --btn-fg:#14161A;
    --btn-bg-hover:#D4F76E;
    --pill-fg:#14161A;

    --logo-chip:#F4F6F5;

    --shadow-sm:0 1px 2px rgba(0,0,0,.3), 0 2px 8px rgba(0,0,0,.2);
    --shadow-md:0 2px 4px rgba(0,0,0,.3), 0 12px 32px rgba(0,0,0,.28);
    --shadow-lg:0 4px 8px rgba(0,0,0,.34), 0 24px 60px rgba(0,0,0,.4);
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.wrap{width:100%;max-width:760px;margin-inline:auto;padding-inline:24px}
@media (max-width:640px){.wrap{padding-inline:18px}}

.topbar{border-bottom:1px solid var(--line);background:var(--surface)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:88px}
.topbar img{height:62px;width:auto;border-radius:6px;background:var(--logo-chip);padding:var(--logo-pad,0)}
@media (prefers-color-scheme:dark){.topbar img{--logo-pad:3px}}
.retour{
  text-decoration:none;font-size:.9rem;font-weight:560;color:var(--ink-2);
  border-bottom:1px solid var(--line-strong);transition:color .2s,border-color .2s;
}
.retour:hover{color:var(--accent);border-color:var(--accent)}
@media (max-width:600px){.topbar .wrap{height:74px}.topbar img{height:52px}}

main{padding-block:64px 88px}
h1{font-size:clamp(1.9rem,4.4vw,2.6rem);line-height:1.1;letter-spacing:-.028em;margin:0 0 10px}
.maj{color:var(--ink-3);font-size:.875rem;margin:0 0 44px}
h2{
  font-size:1.22rem;letter-spacing:-.018em;margin:44px 0 14px;
  padding-top:18px;border-top:2px solid var(--accent);
}
h3{font-size:1rem;margin:26px 0 8px;color:var(--ink)}
p{margin:0 0 14px;color:var(--ink-2)}
a{color:var(--accent-mid)}
a:hover{color:var(--accent)}
ul{margin:0 0 16px;padding-left:22px;color:var(--ink-2)}
li{margin-bottom:7px}

/* liste de définitions : chaque mention légale obligatoire sur une ligne */
dl{margin:0 0 18px;display:grid;grid-template-columns:minmax(150px,.4fr) 1fr;gap:0}
dt{
  padding:11px 0;border-top:1px solid var(--line);
  font-size:.845rem;font-weight:620;text-transform:uppercase;
  letter-spacing:.06em;color:var(--ink-3);
}
dd{padding:11px 0;border-top:1px solid var(--line);margin:0;color:var(--ink)}
@media (max-width:600px){
  dl{grid-template-columns:1fr}
  dt{padding-bottom:0;border-top:1px solid var(--line)}
  dd{padding-top:3px;border-top:none}
}

/* Champ à compléter. Volontairement criard : il ne doit pas être possible de
   mettre le site en ligne sans l'avoir vu. */
.tbd{
  display:inline-block;background:#B4362F;color:#FFFFFF;
  padding:.12em .5em;border-radius:4px;
  font-size:.86em;font-weight:680;letter-spacing:.02em;
}
@media (prefers-color-scheme:dark){.tbd{background:#FF8F86;color:#14161A}}

.note{
  margin:18px 0;padding:16px 18px;border-radius:var(--r-md);
  background:var(--accent-soft);border:1px solid var(--line);
  font-size:.92rem;color:var(--ink-2);
}
.note strong{color:var(--ink)}

footer{border-top:1px solid var(--line);padding-block:30px;font-size:.875rem;color:var(--ink-3)}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:space-between}
footer a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--line-strong)}
footer a:hover{color:var(--accent);border-color:var(--accent)}
