/* Polices servies par NOTRE serveur (0.29.0) : plus aucun appel à Google Fonts. Mêmes graisses qu'avant (Manrope 500-800 ; IBM Plex Sans 400 et 500). Licences : /fonts/LICENCES.txt. */
@font-face{ font-family:'Manrope'; font-style:normal; font-weight:500 800; font-display:swap;
  src:url('/fonts/manrope-latin-wght-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'IBM Plex Sans'; font-style:normal; font-weight:400; font-display:swap;
  src:url('/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'IBM Plex Sans'; font-style:normal; font-weight:500; font-display:swap;
  src:url('/fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root{
  --cream:      #F5F2E9;
  --cream-2:    #EFEBDD;
  --forest:     #0E3D2E;
  --forest-2:   #123F31;
  --forest-deep:#0A2D22;
  --ink:        #16241C;
  --ink-soft:   #566356;
  --mint-bg:    #DFF0E4;
  --mint-icon:  #16593F;
  --green:      #146C4A;
  --green-dark: #0E5238;
  --orange:     #E7A23A;
  --line:       #E3DFCF;
  --white:      #FFFFFF;
  --radius:     18px;
  --max: 1180px;
  --sans: 'Manrope', 'IBM Plex Sans', sans-serif;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:88px; }      /* l'en-tête collant ne doit pas cacher le titre d'une section ouverte par un onglet */
body{
  margin:0; background: var(--cream); color: var(--ink);
  font-family: var(--sans); font-size:16px; line-height:1.6;
}
img{ max-width:100%; display:block; }
.wrap{ max-width: var(--max); margin:0 auto; padding: 0 28px; }

h1,h2,h3,h4{ font-family: var(--sans); font-weight:800; line-height:1.14; margin:0 0 .5em; letter-spacing:-0.01em; color: var(--ink); }
h1{ font-size: clamp(2.3rem, 4.2vw, 3.3rem); }
h2{ font-size: clamp(1.7rem, 2.6vw, 2.3rem); }
h3{ font-size: 1.2rem; font-weight:700; }
p{ margin:0 0 1em; color: var(--ink-soft); max-width: 60ch; }
a{ color: var(--green-dark); text-decoration:none; }

/* ---------- header ---------- */
.site-header{ position: sticky; top:0; z-index:30; background: var(--cream); border-bottom: 1px solid var(--line); }
.site-header .wrap{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:1.1rem; color:var(--ink); }
.brand .logo-img{ width:34px; height:34px; border-radius:10px; display:block; }
.brand .logo{
  width:34px; height:34px; border-radius:10px; background: var(--forest);
  display:flex; align-items:center; justify-content:center; color:var(--white); font-size:1.05rem;
}
nav.main-nav{ display:flex; gap:30px; }
nav.main-nav a{ color: var(--ink-soft); font-size:.95rem; font-weight:500; }
nav.main-nav a:hover{ color: var(--ink); }
.header-actions{ display:flex; align-items:center; gap:18px; }
.header-actions .login{ color: var(--ink-soft); font-weight:600; font-size:.92rem; }

/* ---------- Menu déroulant ☰ (téléphones et tablettes, moins de 900 px) ----------
   Un élément natif <details> : il s'ouvre et se ferme même sans JavaScript ; le script ne fait que le refermer (choix d'une section, appui à côté, Échap). */
.menu{ display:none; }
.menu-btn{ list-style:none; cursor:pointer; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:10px; background:var(--white); -webkit-tap-highlight-color:transparent; }
.menu-btn::-webkit-details-marker{ display:none; }
.menu-btn:focus-visible{ outline:2px solid var(--green); outline-offset:2px; }
.menu-icon, .menu-icon::before, .menu-icon::after{ display:block; width:18px; height:2px; background:var(--ink); border-radius:2px; transition:transform .15s ease, top .15s ease, background .15s ease; }
.menu-icon{ position:relative; }
.menu-icon::before, .menu-icon::after{ content:''; position:absolute; left:0; }
.menu-icon::before{ top:-6px; }
.menu-icon::after{ top:6px; }
.menu[open] .menu-icon{ background:transparent; }
.menu[open] .menu-icon::before{ top:0; transform:rotate(45deg); }
.menu[open] .menu-icon::after{ top:0; transform:rotate(-45deg); }
.menu-panel{ position:absolute; left:0; right:0; top:100%; z-index:40; max-height:calc(100vh - 70px); overflow-y:auto; background:var(--cream); border-bottom:1px solid var(--line); box-shadow:0 14px 28px rgba(14,61,46,.14); padding:6px 16px 12px; }
.menu-panel a{ display:block; padding:14px 8px; font-size:1.02rem; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line); }
.menu-panel a:last-child{ border-bottom:0; }
.menu-panel a.is-active{ background:var(--mint-bg); color:var(--green-dark); border-radius:8px; border-bottom-color:transparent; }
.menu-panel .menu-login{ display:none; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.95rem;
  padding:13px 24px; border-radius:100px; border:1px solid transparent; cursor:pointer;
  background: var(--forest); color:var(--white); transition: transform .15s ease, box-shadow .15s ease;
}
.btn:hover{ background: var(--forest-deep); text-decoration:none; }
.btn.outline{ background: transparent; border-color: var(--line); color: var(--ink); }
.btn.outline:hover{ border-color: var(--ink); background: var(--white); }
.btn.on-dark{ background: var(--white); color: var(--forest); }
.btn.on-dark:hover{ background: var(--cream); }
.btn.block{ width:100%; justify-content:center; }

/* ---------- hero ---------- */
.hero{ background: linear-gradient(160deg, var(--forest) 0%, var(--forest-2) 60%, var(--forest-deep) 100%); color: var(--white); padding: 64px 0 0; }
.hero-badge{
  display:inline-block; font-size:.78rem; font-weight:700; letter-spacing:.02em;
  border:1px solid rgba(255,255,255,.35); border-radius:100px; padding:6px 16px; margin-bottom:24px;
  color: #CDE7D8;
}
.hero-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items:center; }
.hero h1{ color:var(--white); }
.hero p.lead{ color:#CFE3D6; font-size:1.08rem; max-width:52ch; }
.hero .actions{ display:flex; gap:14px; margin: 28px 0 40px; flex-wrap:wrap; }
/* 0.45.0 : quatre pastilles en grille 2×2 (la quatrième restait seule sur une ligne) */
.hero-stats{ display:grid; grid-template-columns:repeat(2, minmax(0, max-content)); gap:20px 44px; padding-bottom:34px; border-top:1px solid rgba(255,255,255,.15); padding-top:26px; }
.hero-stats .stat b{ display:block; font-size:1rem; color:var(--white); }
.hero-stats .stat span{ font-size:.86rem; color:#B9D4C4; }
/* Photo d'accueil : <picture> AVIF + JPEG hébergés chez nous (jamais sur un site tiers). Même disposition qu'avant : cadre arrondi 4/5, photo centrée qui remplit le cadre (object-fit) — aucun voile ni ombre.
   0.29.4 : tant que la photo arrive, le cadre montre un APERÇU FLOU de cette même photo (32×40 px, 0,6 Ko, intégré ici ; régénéré avec les captures, tests/ui/demo_hero.py) au lieu d'un fond vert uni ; la photo nette le remplace en fondu (site-nav.js). */
.hero-image{ border-radius: 20px; overflow:hidden; aspect-ratio: 4/5; background: #0c3527 url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDABQODxIPDRQSEBIXFRQYHjIhHhwcHj0sLiQySUBMS0dARkVQWnNiUFVtVkVGZIhlbXd7gYKBTmCNl4x9lnN+gXz/2wBDARUXFx4aHjshITt8U0ZTfHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHz/wAARCAAoACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCtHPDC4ElipZc/d6H6g1bW+RDvt7eAcBeJR0/Knm4iN7IrxDAYjIBztxWddJJA+y1EwWVd4jIznk4/x9a5Grs6ky419MVYs8MeefmBb+VaQuUtoUuHAZ9oES9ATjBY+grm7Iul0qagJijjaikbDnI5+nWt+dtzPOtr9p2naMsFCgdhWsI8upjOV0XLPTIZIA8hdjIAxJcjqB2rK8QWq2t1EYQ2GAOM5y2a6OxDJZxDusQGQCRWbqtj9q1GCd24jTlemeaqSSWwoybe5z09zDJOZXZnChV8xRnBHt6ZzVuMSyESRSGN93XPDDqQV78etZptZk1GG1LHypJn3KRxtB6/ka0x5CXQjaFVAyEOedwHB+tLrcevRbHR27QwQJEGxsQLzkk1G0on+cIyYGMMOtFFaMzRj31tOL+C5iAZUUo4PXBIqveFU1CSIRZ+ckt6c0UVLWgm2f/Z") center/cover; align-self:end; }
.hero-image picture{ display:block; width:100%; height:100%; }
.hero-image img{ display:block; width:100%; height:100%; object-fit:cover; object-position:50% 50%; }

/* ---------- sections ---------- */
section{ padding: 84px 0; }
.section-head{ max-width: 640px; margin-bottom: 44px; }
.section-head p{ font-size:1.02rem; }

/* feature / edition / security cards */
.grid-3{ display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.grid-2{ display:grid; grid-template-columns: repeat(2,1fr); gap: 22px; }
.hero-group{ margin: 4px 0 26px; color:#D5E6DC; font-size:.95rem; }
.hero-group a{ color:#fff; text-decoration:underline; font-weight:600; }
.grid-6{ display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.card{
  background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 30px 26px; box-shadow: 0 1px 2px rgba(20,30,20,.03);
}
.icon-badge{
  width:48px; height:48px; border-radius:14px; background: var(--mint-bg);
  display:flex; align-items:center; justify-content:center; color: var(--mint-icon); margin-bottom:18px;
}
.icon-badge svg{ width:22px; height:22px; }
.card h3{ margin-bottom:8px; }
.card p{ font-size:.94rem; margin:0; }

/* pill status row on top of a card */
.card-top{ display:flex; justify-content:space-between; align-items:flex-start; }
.pill{ font-size:.74rem; font-weight:700; border-radius:100px; padding:5px 12px; }
.pill.on{ background: var(--mint-bg); color: var(--mint-icon); }
.pill.building{ background:#F3E8CF; color:#8A6318; }
.pill.study{ background:#EDEAE0; color: var(--ink-soft); }
.pill.featured{ background: var(--orange); color:#4A3103; }

.check-list{ list-style:none; margin: 18px 0 0; padding:0; }
.check-list li{ display:flex; gap:10px; align-items:flex-start; font-size:.92rem; color: var(--ink-soft); padding:6px 0; }
.check-list li::before{
  content:"✓"; flex:0 0 auto; width:18px; height:18px; border-radius:50%;
  background: var(--mint-bg); color: var(--mint-icon); font-size:.68rem; font-weight:800;
  display:flex; align-items:center; justify-content:center; margin-top:2px;
}

/* sectors chips */
.chip-row{ display:flex; flex-wrap:wrap; gap:12px; }
.chip{ background: var(--white); border:1px solid var(--line); border-radius:100px; padding:11px 20px; font-weight:600; font-size:.92rem; }

/* pricing */
.price-card{ background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px 26px 30px; position:relative; }
.price-card.featured{ border-color: var(--green); box-shadow: 0 18px 40px -22px rgba(20,108,74,.4); }
.price-card .plan-name{ font-size:1.15rem; font-weight:800; margin: 14px 0 2px; }
.price-card .plan-sub{ font-size:.9rem; color: var(--ink-soft); margin-bottom:16px; }
.price-card .btn{ margin-top:22px; }

/* alt section bg */
section.alt{ background: var(--cream-2); }

/* FAQ */
.faq-item{ border-bottom: 1px solid var(--line); }
.faq-item summary{ cursor:pointer; list-style:none; padding: 20px 0; font-weight:700; display:flex; justify-content:space-between; gap:16px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; color: var(--green-dark); font-size:1.3rem; font-weight:400; }
.faq-item[open] summary::after{ content:"–"; }
.faq-item p{ padding-bottom:20px; max-width:70ch; }

/* CTA / contact */
.contact-panel{ background: var(--forest); color: var(--white); border-radius: 24px; padding: 52px; }
.contact-panel h2{ color:var(--white); }
.contact-panel p{ color:#CFE3D6; }
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items:start; }
.form-row{ display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-bottom:14px; }
.form-row.full{ grid-template-columns: 1fr; }
label{ display:block; font-size:.82rem; color:#BFDACB; margin-bottom:6px; }
input, select, textarea{
  width:100%; padding:12px 13px; border-radius:10px; border:1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08); color: var(--white); font-family: var(--sans); font-size:.94rem;
}
input::placeholder, textarea::placeholder{ color:#9DBFAB; }
/* La liste déroulante s'ouvre sur un fond clair (Windows) : sans couleur propre, le texte blanc des options y était invisible. */
select option{ color:#1B2B22; background:#FFFFFF; }
textarea{ min-height:96px; resize:vertical; }

/* footer */
footer{ padding: 40px 0 30px; }
footer .wrap{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; border-top:1px solid var(--line); padding-top:26px; }
footer .brand{ margin-bottom: 4px; }
footer .fine{ font-size:.85rem; color: var(--ink-soft); }

/* Petits écrans : l'en-tête (nom, « Connexion », « Demander une démo ») ne tenait pas sur une ligne — le lien collait au nom et le bouton, à
   la ligne forcée, s'étirait sur toute la hauteur de l'en-tête. On compacte, sans rien retirer. 0.29.3 : le nom passait encore sous « Connexion » entre 364 et 408 px
   (la plupart des téléphones) ; « Connexion » rejoint donc le menu ☰ sous 420 px (avec de la marge : 412 et 414 px sont des largeurs courantes), et le nom du logo ne disparaît que sous 330 px (seul le logo reste). */
@media (max-width: 600px){
  .site-header .wrap{ height:64px; gap:8px; padding:0 16px; }
  .brand{ font-size:1rem; gap:8px; }
  .brand .logo-img{ width:30px; height:30px; }
  .header-actions{ gap:12px; flex-shrink:0; }
  .header-actions .login{ font-size:.85rem; white-space:nowrap; }
  .header-actions .btn{ padding:8px 12px; font-size:.78rem; white-space:nowrap; line-height:1.2; }
}
@media (max-width: 330px){
  .brand{ font-size:0; }
  .brand .logo-img{ width:32px; height:32px; }
}
@media (max-width: 380px){
  .header-actions{ gap:10px; }
  .header-actions .btn{ padding:8px 10px; }
}
/* Sous 420 px, « Connexion » ne tient plus à côté du nom et du bouton ☰ : il passe en tête de la liste du menu. */
@media (max-width: 420px){
  .header-actions .login{ display:none; }
  .menu-panel .menu-login{ display:block; }
}

@media (max-width: 900px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-image{ order:-1; aspect-ratio:16/9; }
  .grid-2, .grid-3, .grid-6{ grid-template-columns: 1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  nav.main-nav{ display:none; }
  .menu{ display:block; }                /* le menu déroulant ☰ remplace les onglets sous 900 px */
  footer .wrap{ flex-direction:column; align-items:flex-start; }
}

/* ---------- Pages plate-forme (connexion / activation) — formulaire sur fond clair ---------- */
.light-form label{ color: var(--ink-soft); }
.light-form input, .light-form select, .light-form textarea{
  background: var(--white); color: var(--ink); border: 1px solid var(--line);
  border-radius: 10px;
}
.light-form .btn{ margin-top: 6px; }
.notice{ padding: 14px 16px; border-radius: 10px; font-size: .92rem; margin-bottom: 18px; }
.notice.error{ background: #FBE7E4; color: #8A2A1E; }
.notice.success{ background: var(--mint-bg); color: var(--mint-icon); }

/* --- Coordonnées publiques (réglées depuis le panneau super-admin) --- */
.contact-channels{margin-top:14px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.contact-channels:empty{display:none}
.contact-line{font-size:.88rem;margin:0;color:#DDEBE2}
.contact-line a{color:#fff;text-decoration:underline}
.pilot-terms{margin-top:18px;padding:12px 14px;border:1px solid rgba(255,255,255,.22);border-radius:10px;font-size:.8rem;color:#BFDACB}
.pilot-terms strong{display:block;margin-bottom:4px;color:#fff;font-size:.82rem}
.pilot-terms p{margin:0;white-space:pre-line}

/* 0.44.0 : onglets du panneau de contact, case à cocher, champ piège anti-robots */
.contact-tabs{display:flex;gap:4px;padding:4px;margin-bottom:16px;background:rgba(255,255,255,.1);border-radius:12px}
.contact-tabs button{flex:1;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:#D5E6DC;font:inherit;font-weight:600;cursor:pointer}
.contact-tabs button[aria-selected="true"]{background:var(--white);color:var(--forest)}
.contact-tabs button:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
input[type="checkbox"]{width:auto;padding:0;accent-color:var(--orange)}
label.check{display:flex;gap:10px;align-items:center;font-size:.9rem;color:var(--white);margin-bottom:0;cursor:pointer}
.contact-fine{font-size:.78rem;color:#BFDACB;margin:6px 0 0}
[hidden]{display:none!important}

/* 0.45.0 : « L'application en images » (captures réelles d'une boutique de démonstration), bande « Pensé pour grandir », agrandissement */
.shots-theme{margin-top:44px}
.shots-theme h3{margin:0 0 4px;font-size:1.3rem}
.shots-theme > p{margin:0 0 18px;color:var(--ink-soft)}
.shot-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.shot-row.phones{grid-template-columns:repeat(2,minmax(0,290px));justify-content:center;gap:34px}
.shot{margin:0}
.shot-open{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden;cursor:zoom-in;box-shadow:0 6px 22px rgba(15,40,30,.08)}
.shot-open:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{margin-top:10px;font-size:.93rem;line-height:1.45;color:var(--ink-soft)}
.shot figcaption b{color:var(--ink)}
.grow{margin-top:58px}
.grow h3{margin:0;font-size:1.3rem}
.grow-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:18px 0 0;counter-reset:g}
.grow-steps li{padding:18px 16px;background:#fff;border:1px solid var(--line);border-radius:14px;counter-increment:g;font-size:.93rem;line-height:1.45;color:var(--ink-soft)}
.grow-steps li::before{content:counter(g);display:grid;place-items:center;width:28px;height:28px;margin-bottom:10px;border-radius:50%;background:var(--forest);color:#fff;font-weight:700;font-size:.85rem}
.grow-steps b{display:block;margin-bottom:4px;color:var(--ink);font-size:1rem}
.shots-note{margin:22px 0 0;text-align:center;font-size:.88rem;color:var(--ink-soft)}
#shot-dialog{border:0;border-radius:16px;padding:0;max-width:min(96vw,1100px);max-height:94vh;background:#fff;overflow:auto}
#shot-dialog::backdrop{background:rgba(10,30,22,.72)}
#shot-dialog img{display:block;max-width:100%;max-height:92vh;margin:0 auto}
#shot-close{position:absolute;top:8px;right:8px;z-index:1;width:38px;height:38px;border:0;border-radius:50%;background:rgba(15,40,30,.82);color:#fff;font-size:1.05rem;cursor:pointer}
#shot-close:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
@media (max-width:760px){.shot-row,.shot-row.phones{grid-template-columns:1fr}.shot-row.phones .shot{max-width:300px;margin:0 auto}.grow-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:430px){.grow-steps{grid-template-columns:1fr}}
@media print{#application,#shot-dialog{display:none}}

/* 0.46.0 : textes légaux (pages /mentions-legales, /confidentialite, /conditions) et liens du pied de page */
.legal-links a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.legal-head{border-bottom:1px solid rgba(0,0,0,.08);background:var(--white)}
.legal-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.legal-retour{font-size:.92rem;color:var(--ink)}
.legal{max-width:780px;padding-top:36px;padding-bottom:56px}
.legal h1{font-size:clamp(1.6rem,4vw,2.2rem);margin:0 0 6px}
.legal h2{font-size:1.18rem;margin:30px 0 8px}
.legal p,.legal li{line-height:1.65}
.legal ul{padding-left:1.2rem}
.legal-maj{color:#5b6a60;font-size:.9rem;margin:0 0 22px}
.legal-table{width:100%;border-collapse:collapse;margin:12px 0;font-size:.93rem}
.legal-table th,.legal-table td{border:1px solid rgba(0,0,0,.12);padding:9px 10px;text-align:left;vertical-align:top}
.legal-table thead th{background:rgba(0,0,0,.04)}
.legal-projet{background:#FFF3C4;border:1px solid #E6C34A;border-radius:10px;padding:12px 14px;margin-bottom:22px;font-size:.92rem;line-height:1.5}
mark.manque{background:#FFE08A;color:#5a3b00;border-radius:4px;padding:0 4px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.88em}
@media (max-width:600px){.legal-table,.legal-table tbody,.legal-table tr,.legal-table th,.legal-table td{display:block;width:100%}.legal-table thead{display:none}.legal-table tr{margin-bottom:12px;border:1px solid rgba(0,0,0,.12);border-radius:8px}.legal-table th,.legal-table td{border:0;border-bottom:1px solid rgba(0,0,0,.08)}}

/* 0.51.0 : lien de la politique visible sur fond vert, case de lecture au-dessus du bouton « Demander une démo », bouton grisé */
.contact-fine a,.pilot-terms a{color:#E8F5EC;text-decoration:underline;text-underline-offset:2px}
.pilot-link{margin:8px 0 0}
.consent-box{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:12px 14px;margin:6px 0 10px}
.consent-box a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.consent-check{display:flex;gap:10px;align-items:flex-start;color:#fff;font-size:.9rem;line-height:1.45;margin:0;cursor:pointer}
.consent-check input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--orange)}
.consent-hint{font-size:.82rem;color:#FFE0A6;margin:0 0 8px}
.btn[disabled]{opacity:.5;cursor:not-allowed}