/* ══ LE PIED DE PAGE DU SITE — refait le 17/09 d'après la maquette bleu nuit.
   Balisage : ls_site_foot() (inc/layout.php). Chargée en mode site, APRÈS
   vitrine.css, dont les règles `body.mode-site .site-foot …` sont écrasées
   ici par `.site-foot.pied` (une classe de plus). */
body.mode-site .site-foot.pied{position:relative;overflow:hidden;isolation:isolate;border:0;padding:64px 0 0;
  color:#c3cde6;font-family:Inter,system-ui,sans-serif;
  background:radial-gradient(90% 70% at 100% 0%,#12307a 0%,transparent 55%),
             linear-gradient(180deg,#060d27 0%,#081537 55%,#0a1b4a 100%)}
.pied-vague{position:absolute;z-index:-1;pointer-events:none;border-radius:50%}
.pied-vague-g{left:-14%;bottom:-150px;width:42%;height:330px;
  background:radial-gradient(closest-side,#2f6fe0 0%,#1d4eb4 55%,transparent 100%);opacity:.55;filter:blur(2px)}
.pied-vague-d{right:-12%;bottom:-40px;width:48%;height:360px;
  background:radial-gradient(closest-side,#1b3f9a 0%,#12307a 60%,transparent 100%);opacity:.6}
body.mode-site .site-foot.pied .wrap.pied-grille{max-width:1400px;width:calc(100% - 70px);margin:0 auto;display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,.78fr) minmax(0,.95fr) minmax(0,.85fr) minmax(0,1.5fr);
  gap:36px;align-items:start}

/* ── La marque ─────────────────────────────────────────────────────────── */
body.mode-site .site-foot.pied .brand{display:inline-flex;align-items:center;gap:12px;margin:0 0 18px;padding:0;
  font-size:34px;text-decoration:none}
body.mode-site .site-foot.pied .brand svg,body.mode-site .site-foot.pied .brand img{width:44px;height:44px}
body.mode-site .site-foot.pied .brand .brand-name{color:#fff;font:800 34px/1 Inter,sans-serif;letter-spacing:-.02em}
body.mode-site .site-foot.pied .brand .brand-name span{color:#2d8bff}
body.mode-site .site-foot.pied .brand:hover{text-decoration:none}
.pied-promesse{margin:0 0 14px;color:#fff;font:700 clamp(17px,1.25vw,20px)/1.3 Inter,sans-serif;max-width:19em}
.pied-texte{margin:0;font-size:14.5px;line-height:1.65;color:#b7c2de;max-width:27em}
.pied-reseaux{display:flex;gap:12px;margin:22px 0 0}
body.mode-site .site-foot.pied .pied-reseaux a{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;
  background:#111e45;border:1px solid #1d2c5c;color:#fff;transition:background .15s,border-color .15s}
body.mode-site .site-foot.pied .pied-reseaux a:hover{background:#1a3a8a;border-color:#2d8bff;text-decoration:none}
.pied-reseaux svg{width:19px;height:19px}

/* ── Les notes manuscrites (Caveat, repli cursive) ──────────────────────── */
.pied-note{margin:0;font:600 20px/1.12 'Caveat','Segoe Print','Bradley Hand',cursive;color:#3b93ff;pointer-events:none}
.pied-note-suivez{position:relative;margin:26px 0 0 64px;transform:rotate(-9deg);width:max-content}
.pied-note-suivez svg{position:absolute;left:-62px;top:-12px;width:52px;height:36px}
.pied-note-visibilite{position:absolute;right:calc(max(35px, (100% - 1400px) / 2) + 20px);bottom:86px;transform:rotate(-4deg);
  font-size:21px;text-align:left;padding-right:24px;white-space:nowrap}
/* Bord droit = bord droit de l'encart : marge du .wrap (35 px ou centrage
   sur 1 400 px) + son rembourrage intérieur de 20 px. */
.pied-note-visibilite br{display:none}
.pied-coche{position:absolute;right:-2px;top:0;width:20px;height:20px}
.pied-souligne{display:block;width:150px;height:12px;margin:0 0 0 auto}

/* ── Les colonnes ──────────────────────────────────────────────────────── */
body.mode-site .site-foot.pied .pied-col h4{position:relative;margin:0 0 30px;padding:0 0 14px;color:#fff;
  font:700 15px/1.2 Inter,sans-serif;letter-spacing:.02em;text-transform:uppercase}
body.mode-site .site-foot.pied .pied-col h4::after{content:"";position:absolute;left:0;bottom:0;width:26px;height:3px;
  border-radius:3px;background:#2d8bff}
body.mode-site .site-foot.pied .pied-col a{display:block;width:max-content;max-width:100%;padding:0;margin:0 0 16px;
  color:#c3cde6;font-size:15px;line-height:1.35;text-decoration:none}
body.mode-site .site-foot.pied .pied-col a:hover{color:#fff;text-decoration:underline}
/* L'ALIGNEMENT (17/09, 2e passe) : les trois colonnes ont la même hauteur
   (un lien par ligne, dernier lien sans marge), et l'encart s'étire sur
   cette hauteur — son haut est celui des titres, son bas celui de
   « Contact ». « Coût d'un prospect par métier » passait sur deux lignes et
   rallongeait sa colonne de 21 px. */
body.mode-site .site-foot.pied .pied-col a{white-space:nowrap}
body.mode-site .site-foot.pied .pied-col a:last-child{margin-bottom:0}

/* ── L'encart « Restez informé » ────────────────────────────────────────── */
.pied-lettre{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 14px;padding:16px 18px 14px;border-radius:16px;
  align-self:stretch;align-content:space-between;
  background:linear-gradient(160deg,#16275a 0%,#101d47 100%);border:1px solid #243871;box-shadow:0 18px 40px #02071a66}
.pied-avion svg{width:32px;height:32px;margin-top:2px}
.pied-sur{display:block;margin:0 0 5px;color:#3b93ff;font:700 11px/1.2 Inter,sans-serif;letter-spacing:.04em;text-transform:uppercase}
body.mode-site .site-foot.pied h4.pied-titre{margin:0 0 7px;padding:0;color:#fff;font:700 clamp(16px,1.2vw,18px)/1.22 Inter,sans-serif;
  text-transform:none;letter-spacing:-.01em}
body.mode-site .site-foot.pied h4.pied-titre::after{content:none}
.pied-lettre p{margin:0;font-size:13px;line-height:1.45;color:#c3cde6}
.pied-form{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:14px 0 0}
.pied-form input[type=email]{min-width:0;height:42px;padding:0 13px;border-radius:10px;border:1px solid #2c3f78;
  background:#0c1638;color:#fff;font:400 14px Inter,sans-serif}
.pied-form input[type=email]::placeholder{color:#8e9bbf}
.pied-form input[type=email]:focus{outline:2px solid #2d8bff;outline-offset:1px;border-color:#2d8bff}
.pied-form button{display:inline-flex;align-items:center;gap:7px;height:42px;padding:0 16px;border:0;border-radius:10px;cursor:pointer;
  background:linear-gradient(180deg,#2493ff,#0f74ec);color:#fff;font:600 14.5px Inter,sans-serif;white-space:nowrap;
  box-shadow:0 10px 24px #1478ff40;transition:filter .15s}
.pied-form button:hover{filter:brightness(1.08)}
.pied-form button svg{width:15px;height:15px}
.pied-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pied-lettre .pied-mention,.pied-lettre .pied-retour{grid-column:1 / -1;margin:9px 0 0;font-size:12px;color:#9aa7c9}
.pied-lettre .pied-retour-ok{color:#5ee0a0;font-weight:600}
.pied-lettre .pied-retour-err{color:#ff8b8b;font-weight:600}

/* ── La barre du bas ───────────────────────────────────────────────────── */
body.mode-site .site-foot.pied .wrap.pied-bas{max-width:1400px;width:calc(100% - 70px);margin:72px auto 0;padding:22px 0 24px;
  border-top:1px solid #1f3068;display:flex;align-items:center;gap:14px 26px;flex-wrap:wrap;font-size:13.5px}
.pied-langue{display:inline-flex;align-items:center;gap:12px;color:#fff}
.pied-langue svg{width:22px;height:22px}
.pied-sep{width:1px;height:26px;background:#2a3b72}
.pied-legal{display:flex;gap:10px 28px;flex-wrap:wrap}
body.mode-site .site-foot.pied .pied-legal a{display:inline;padding:0;color:#dfe5f5;text-decoration:none}
body.mode-site .site-foot.pied .pied-legal a:hover{color:#fff;text-decoration:underline}
.pied-copie{margin-left:auto;color:#aeb9d6}
.pied-coeur{display:inline-flex;align-items:center;gap:10px;color:#dfe5f5}
.pied-coeur svg{width:19px;height:19px}

/* ── Écrans moyens ─────────────────────────────────────────────────────── */
@media (max-width:1280px){
  body.mode-site .site-foot.pied .wrap.pied-grille{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}
  /* Rangée 1 : marque (2 colonnes) + encart ; rangée 2 : les trois colonnes.
     (L'encart sur deux rangées étirait le pied à 1 093 px — mesuré.) */
  .pied-marque{grid-column:1 / 3;grid-row:1}
  .pied-lettre{grid-column:3;grid-row:1;align-self:start}
  /* Sur deux rangées, la barre du bas passe sur plusieurs lignes : la note
     quitte l'absolu et se pose dans le flux, calée à droite. */
  .pied-note-visibilite{position:static;margin:34px 55px 0 auto;width:max-content}
  body.mode-site .site-foot.pied .wrap.pied-bas{margin-top:18px}
}
@media (max-width:980px){
  body.mode-site .site-foot.pied .wrap.pied-grille{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pied-marque,.pied-lettre{grid-column:1 / -1;grid-row:auto}
  .pied-note-visibilite{margin:34px auto 0}
  .pied-copie{margin-left:0}
}
@media (max-width:640px){
  body.mode-site .site-foot.pied{padding-top:44px}
  body.mode-site .site-foot.pied .wrap.pied-grille,body.mode-site .site-foot.pied .wrap.pied-bas{width:calc(100% - 32px)}
  body.mode-site .site-foot.pied .wrap.pied-grille{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 20px}
  .pied-col:last-of-type{grid-column:auto}
  .pied-lettre{padding:22px 18px 18px}
  .pied-form{grid-template-columns:1fr}
  .pied-form button{justify-content:center}
  .pied-note-suivez{margin-left:60px}
  .pied-sep{display:none}
  .pied-legal{gap:10px 22px}
}