/* En-tête et pied de page de l'accueil, pour les autres pages publiques.
   COPIE GÉNÉRÉE de public/landing.html par scripts/vitrine-pages.mts :
   ne pas modifier ici, changer l'accueil puis régénérer. */
:root{
    --paper:#FFFFFF; --canvas:#F4FAF7; --ink:#0F2019; --muted:#5C6E66; --line:#E2ECE7;
    --accent:#0E9D6E; --accent-deep:#0A7350; --accent-soft:#35D399; --tint:#E7F6EF; --mint:#EAF7F0;
    --grotesk:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --serif:'Lora',Georgia,"Iowan Old Style","Times New Roman",serif;
    --mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
    --tl:3px; --tr:16px;
  }
/* ===== TOPBAR (claire, menu + ancres) ===== */
  .topbar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px clamp(18px,3.4vw,44px);transition:background .35s,box-shadow .35s,backdrop-filter .35s}
  body[data-scrolled="1"] .topbar{background:rgba(255,255,255,.82);box-shadow:0 1px 0 rgba(10,40,28,.07);backdrop-filter:blur(12px)}
  .wordmark{font:700 27px/1 'Playfair Display',Georgia,'Times New Roman',serif;letter-spacing:.01em;color:#1F2937;flex-shrink:0}
  .menu{display:flex;align-items:center;gap:4px;margin-left:auto}
  .menu a{font:600 13.5px/1 var(--grotesk);color:var(--ink);text-decoration:none;padding:9px 13px;border-radius:9px;opacity:.82;transition:.18s}
  .menu a:hover{opacity:1;background:var(--tint);color:var(--accent-deep)}
  .nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
  .lang{display:flex;gap:2px;padding:3px;border-radius:999px;background:#EEF4F1;border:1px solid var(--line)}
  .lang button{font:600 11.5px/1 var(--grotesk);color:var(--muted);background:none;border:0;border-radius:999px;padding:7px 12px;cursor:pointer;transition:.2s}
  .lang button[aria-pressed="true"]{background:var(--ink);color:#fff}
  .signin{font:600 12.5px/1 var(--grotesk);text-decoration:none;color:var(--ink);padding:10px 8px;opacity:.82;transition:.2s}
  .signin:hover{opacity:1;color:var(--accent-deep)}
  /* L'essai est le bouton plein de l'en-tête, comme sur le blogue. */
  .essai{font:600 12.5px/1 var(--grotesk);text-decoration:none;color:#04140d;background:var(--accent);padding:10px 17px;border-radius:999px;white-space:nowrap;transition:.2s}
  .essai:hover{background:var(--accent-deep)}
  .menu-btn{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
  .menu .menu-extra{display:none}
  /* Menu Produit : les pages de fonction (details, sans JavaScript ; vitrine-menu.js le referme). */
  .sous-menu{position:relative}
  .sous-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;font:600 13.5px/1 var(--grotesk);color:var(--ink);padding:9px 13px;border-radius:9px;opacity:.82;transition:.18s}
  .sous-menu summary::-webkit-details-marker{display:none}
  .sous-menu summary::after{content:"";width:6px;height:6px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
  .sous-menu[open] summary::after{transform:translateY(1px) rotate(225deg)}
  .sous-menu summary:hover,.sous-menu[open] summary{opacity:1;background:var(--tint);color:var(--accent-deep)}
  .sous-menu summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
  .sous-liste{position:absolute;top:calc(100% + 8px);left:0;min-width:230px;display:flex;flex-direction:column;gap:2px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 22px 48px -20px rgba(8,50,34,.3)}
  .sous-liste a{opacity:1}
  .lang button:focus-visible,.rail button:focus-visible,.btn:focus-visible,.signin:focus-visible,.essai:focus-visible,.menu-btn:focus-visible,.menu a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
  /* Téléphone et tablette : Ledger, l'essai et le bouton Menu ; le reste
     (sections, FAQ, blogue, connexion, langue) dans le panneau. */
  @media (max-width:1080px){
    .menu{display:none}
    .nav-right .lang,.nav-right .signin{display:none}
    .menu-btn{display:inline-flex}
    .topbar.ouvert{background:#fff;box-shadow:0 1px 0 rgba(10,40,28,.07)}
    .topbar.ouvert .menu{display:flex;flex-direction:column;align-items:stretch;gap:2px;position:absolute;top:100%;left:0;right:0;margin:0;padding:8px clamp(18px,3.4vw,44px) 18px;background:#fff;border-top:1px solid var(--line);box-shadow:0 14px 28px rgba(10,40,28,.10);max-height:calc(100svh - 70px);overflow-y:auto}
    .topbar.ouvert .menu a{font-size:15px;padding:13px 10px;opacity:1}
    .topbar.ouvert .menu .menu-extra{display:block}
    .topbar.ouvert .menu .lang{display:flex;align-self:flex-start;margin:10px 0 0 6px}
    .topbar.ouvert .sous-menu summary{font-size:15px;padding:13px 10px;opacity:1}
    .topbar.ouvert .sous-liste{position:static;min-width:0;padding:0 0 4px 14px;border:0;box-shadow:none;background:none}
  }
.footer{min-height:auto;padding:56px 24px 62px;background:linear-gradient(160deg,#0C2A20,#08201A);color:rgba(230,244,236,.72);z-index:2;position:relative;text-align:center}
.footer .col{gap:9px;align-items:center;margin:0 auto} .footer .fmark{font:700 26px/1 'Playfair Display',Georgia,'Times New Roman',serif;letter-spacing:.01em;color:#EAF4EE}
.footer small{font-size:12px;color:rgba(230,244,236,.5)}
.footer .flinks{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:6px}.footer .flinks a{color:rgba(230,244,236,.7);text-decoration:none;font-size:12.5px}.footer .flinks a:hover{color:#fff}
.footer .fedit{margin-top:10px;line-height:1.6}.footer .fedit a{color:rgba(230,244,236,.7)}.footer .fedit a:hover{color:#fff}
/* Ajouts des autres pages : la barre reste blanche et dans le flux (pas
   de héros dessous), le logo est un lien, FR / EN sont des liens. */
.topbar{position:sticky;background:rgba(255,255,255,.88);box-shadow:0 1px 0 rgba(10,40,28,.07);backdrop-filter:blur(12px)}
a.wordmark{text-decoration:none}
.lang a{font:600 11.5px/1 var(--grotesk);color:var(--muted);text-decoration:none;border-radius:999px;padding:7px 12px}
.lang a[aria-current]{background:var(--ink);color:#fff}
.lang a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.menu a[aria-current="page"]{opacity:1;color:var(--accent-deep)}
.footer .col{width:min(980px,100%);display:flex;flex-direction:column;align-items:center}