/* Landing page (#lpMain) — composants additionnels (2026-09-19) : panneau statut,
   diagramme "où vont vos données", reskin des fonctionnalités en style console,
   section App Desktop. Reprend directement les couleurs réelles du site
   (--accent/--bg-*/--text-* de style.css) : plus de palette isolée, sur demande. */

/* ── Capture d'écran réelle de l'app (remplace l'ancien mockup dessiné) ──── */
#lpMain .lp-mockup-shot{ display:block;width:100%;height:auto; }

/* ── Panneau statut (terminal) ─────────────────────────────────────────── */
#lpMain .lp-term-panel{ width:100%;max-width:480px;background:#0C0D0F;border:1px solid var(--border);border-radius:14px;overflow:hidden; }
#lpMain .lp-term-bar{ display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--border); }
#lpMain .lp-term-bar span{ width:8px;height:8px;border-radius:50%;background:#3A3A3D;flex-shrink:0; }
#lpMain .lp-term-host{ width:auto!important;height:auto!important;border-radius:0!important;margin-left:8px;font-family:var(--font-code);font-size:11px;color:var(--text-muted);background:none; }
#lpMain .lp-term-body{ padding:16px 20px; }
#lpMain .lp-term-row{ display:flex;gap:16px;font-family:var(--font-code);font-size:12px;padding:8px 0;border-bottom:1px solid var(--border); }
#lpMain .lp-term-row:last-child{ border-bottom:none; }
#lpMain .lp-term-key{ color:var(--text-muted);width:160px;flex-shrink:0; }
#lpMain .lp-term-val{ color:var(--text-primary); }

/* ── Où vont vos données ───────────────────────────────────────────────── */
#lpMain .lp-datapath{ max-width:1000px;margin:0 auto;padding:56px 24px 8px;text-align:center; }
#lpMain .lp-flow-row{ display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin:0 auto 20px;max-width:800px; }
#lpMain .lp-flow-label{ font-family:var(--font-code);font-size:11px;letter-spacing:.08em;text-transform:uppercase;width:150px;flex-shrink:0;text-align:right; }
#lpMain .lp-flow-box{ border:1px solid var(--border-input);border-radius:10px;padding:10px 16px;font-family:var(--font-code);font-size:12.5px;color:var(--text-secondary);white-space:nowrap; }
#lpMain .lp-flow-box-accent{ border-color:var(--accent);color:var(--text-primary);background:var(--accent-soft); }
#lpMain .lp-flow-arrow{ color:var(--text-muted);font-size:16px; }
#lpMain .lp-flow-note{ font-size:12px;margin-left:4px; }

/* ── Fonctionnalités : reskin de la grille existante en style console ───── */
#lpMain .lp-features{ display:flex;flex-direction:column;max-width:820px;margin:0 auto;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:4px 26px; }
#lpMain .lp-feature-card{ background:none;border:none;border-radius:0;border-bottom:1px solid var(--border);padding:16px 0;display:flex;align-items:baseline;gap:16px;transform:none!important;box-shadow:none!important; }
#lpMain .lp-feature-card:last-child{ border-bottom:none; }
#lpMain .lp-feature-icon{ font-size:0;flex-shrink:0;width:14px;margin-bottom:0; }
#lpMain .lp-feature-icon::before{ content:'$';font-family:var(--font-code);font-size:15px;color:var(--accent);font-weight:700; }
#lpMain .lp-feature-title{ font-family:var(--font-code);font-size:13.5px;width:170px;flex-shrink:0;margin-bottom:0; }
#lpMain .lp-feature-desc{ margin:0; }

/* ── App Desktop ──────────────────────────────────────────────────────── */
#lpMain .lp-desktop-grid{ display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;max-width:1000px;margin:36px auto 0;padding:0 24px; }
#lpMain .lp-cmd-list{ display:flex;flex-direction:column; }
#lpMain .lp-cmd-row{ display:flex;align-items:baseline;gap:14px;padding:14px 0;border-bottom:1px solid var(--border); }
#lpMain .lp-cmd-row:last-child{ border-bottom:none; }
#lpMain .lp-cmd-row::before{ content:'$';font-family:var(--font-code);color:var(--accent);font-size:14px;flex-shrink:0; }
#lpMain .lp-cmd-label{ font-family:var(--font-code);font-size:13.5px;color:var(--text-primary);width:150px;flex-shrink:0; }
#lpMain .lp-cmd-desc{ font-size:13px;color:var(--text-secondary);line-height:1.55; }
#lpMain .lp-quickask-wrap{ position:relative;height:260px; }
#lpMain .lp-quickask-bg1{ position:absolute;top:10px;left:12%;width:72%;height:190px;background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;opacity:.5; }
#lpMain .lp-quickask-bg2{ position:absolute;top:28px;left:0;width:62%;height:170px;background:var(--bg-card);border:1px solid var(--border);border-radius:12px;opacity:.75; }
#lpMain .lp-quickask-pill{ position:absolute;left:20px;right:20px;top:64px;background:var(--bg-card);border:1px solid var(--border-input);border-radius:14px;padding:16px 20px;box-shadow:0 20px 50px rgba(0,0,0,.5); }
#lpMain .lp-quickask-pill-top{ display:flex;align-items:center;gap:12px;flex-wrap:wrap; }
#lpMain .lp-quickask-hint{ font-family:var(--font-code);font-size:11px;color:var(--text-muted);border:1px solid var(--border-input);border-radius:20px;padding:5px 10px;margin-left:auto;flex-shrink:0;white-space:nowrap; }
#lpMain .lp-quickask-suggest{ font-family:var(--font-code);font-size:11.5px;color:var(--text-muted);margin-top:12px; }

/* ── FAQ ──────────────────────────────────────────────────────────────── */
#lpMain .lp-faq-list{ max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:10px; }
#lpMain .lp-faq-item{ background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:4px 20px; }
#lpMain .lp-faq-item summary{ padding:16px 0;font-size:14.5px;font-weight:700;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px; }
#lpMain .lp-faq-item summary::-webkit-details-marker{ display:none; }
#lpMain .lp-faq-item summary::after{ content:'+';font-size:20px;font-weight:400;color:var(--text-muted);flex-shrink:0;transition:transform .2s; }
#lpMain .lp-faq-item[open] summary::after{ transform:rotate(45deg); }
#lpMain .lp-faq-item p{ font-size:13.5px;color:var(--text-secondary);line-height:1.65;margin:0 0 18px; }

@media(max-width:768px){
  #lpMain .lp-flow-label{ width:100%;text-align:center; }
  #lpMain .lp-flow-row{ justify-content:center; }
  #lpMain .lp-term-key{ width:120px; }
  #lpMain .lp-feature-card{ flex-wrap:wrap; }
  #lpMain .lp-feature-title{ width:auto; }
  #lpMain .lp-desktop-grid{ grid-template-columns:1fr; }
  #lpMain .lp-quickask-wrap{ height:220px;margin-top:24px; }
}

/* ── Fonctionnalités par familles (onglets), 2026-10-08 : même contenu, rangé en 4 familles ───────── */
#lpMain .lp-tabs{ display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:0 auto 22px; }
#lpMain .lp-tab{ display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--border-input);background:var(--bg-card);color:var(--text-primary);font:600 15px var(--font-ui);cursor:pointer;transition:transform .15s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease; }
#lpMain .lp-tab:hover{ transform:translateY(-2px);border-color:var(--fam); }
#lpMain .lp-tab:focus-visible{ outline:2px solid var(--fam);outline-offset:3px; }
#lpMain .lp-tab.active{ background:var(--fam);border-color:var(--fam);color:#090912;font-weight:800;box-shadow:0 10px 30px color-mix(in srgb,var(--fam) 40%,transparent); }
#lpMain .lp-tab-ic{ font-size:17px;line-height:1; }
#lpMain .lp-tabpanels{ max-width:1000px;margin:0 auto; }
#lpMain .lp-tabpanel{ max-width:none;background:none;border:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px;animation:lpPanelIn .45s cubic-bezier(.2,.7,.2,1) both; }
#lpMain .lp-tabpanel[hidden]{ display:none; }
#lpMain .lp-tabpanel .lp-feature-card{ display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:18px;padding:22px 22px 24px;border-bottom:1px solid var(--border);position:relative;overflow:hidden;transition:transform .25s ease,border-color .25s ease,background .25s ease!important;transform:none!important; }
#lpMain .lp-tabpanel .lp-feature-card::before{ content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--fam);opacity:.85; }
#lpMain .lp-tabpanel .lp-feature-card:last-child{ border-bottom:1px solid var(--border); }
#lpMain .lp-tabpanel .lp-feature-card:hover{ transform:translateY(-4px)!important;border-color:var(--fam);background:color-mix(in srgb,var(--fam) 6%,var(--bg-card)); }
#lpMain .lp-tabpanel .lp-feature-icon{ font-size:28px;width:auto;height:auto;display:flex;align-items:center;justify-content:center;margin:0 0 2px; }
#lpMain .lp-tabpanel .lp-feature-icon::before{ content:none; }
#lpMain .lp-tabpanel .lp-feature-title{ font-family:var(--font-ui);font-size:18px;font-weight:800;width:auto;margin:0;letter-spacing:-.01em; }
#lpMain .lp-tabpanel .lp-feature-desc{ font-size:14px;line-height:1.6;color:var(--text-secondary); }
#lpMain .lp-privacy-note{ max-width:1000px;margin:22px auto 0; }
#lpMain .lp-privacy-note .lp-feature-card{ display:flex;flex-direction:row;align-items:center;gap:16px;flex-wrap:wrap;border:1px dashed var(--border-input);border-radius:18px;padding:18px 22px;background:var(--accent-soft,rgba(91,138,245,.08)); }
#lpMain .lp-privacy-note .lp-feature-icon{ font-size:26px;width:auto; }
#lpMain .lp-privacy-note .lp-feature-icon::before{ content:none; }
#lpMain .lp-privacy-note .lp-feature-title{ font-family:var(--font-ui);font-size:16px;font-weight:800;width:auto; }
#lpMain .lp-privacy-note .lp-feature-desc{ flex:1 1 320px;font-size:14px;color:var(--text-secondary); }
@keyframes lpPanelIn{ from{ opacity:0;transform:translateY(14px); } to{ opacity:1;transform:none; } }
@media (max-width:600px){ #lpMain .lp-tab{ min-height:44px;padding:0 15px;font-size:14px; } #lpMain .lp-tabs{ gap:8px; } }
@media (prefers-reduced-motion:reduce){ #lpMain .lp-tabpanel{ animation:none; } #lpMain .lp-tab,#lpMain .lp-tabpanel .lp-feature-card{ transition:none!important; } }

/* ── Page d'accueil (croquis n° 3) : hero avec le lion, onglets, panneau par famille ───────────────── */
#lpMain .lp-hero3{ position:relative;max-width:1100px;margin:0 auto;padding:64px 24px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:32px; }
#lpMain .lp-hero3::before{ content:'';position:absolute;top:-120px;right:-60px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(168,85,247,.20),rgba(168,85,247,0) 65%);pointer-events:none;animation:lpGlow 6s ease-in-out infinite; }
#lpMain .lp-hero3-text{ position:relative;flex:1 1 480px;display:flex;flex-direction:column;gap:16px; }
#lpMain .lp-hero3 h1{ margin:0;font-size:clamp(40px,7vw,72px);line-height:.98;font-weight:800;letter-spacing:-.045em;animation:lpPanelIn .8s cubic-bezier(.2,.7,.2,1) both; }
#lpMain .lp-hero3 p{ margin:0;font-size:clamp(16px,2vw,20px);line-height:1.6;color:var(--text-secondary);max-width:30em;animation:lpPanelIn .8s cubic-bezier(.2,.7,.2,1) .1s both; }
#lpMain .lp-hero3-lion{ position:relative;width:150px;height:150px;border-radius:38px;object-fit:cover;box-shadow:0 30px 80px rgba(168,85,247,.35);animation:lpFloat 6.5s ease-in-out infinite; }
#lpMain #lp-features{ padding-top:24px; }
#lpMain .lp-tabpanel{ display:block;position:relative;overflow:hidden;background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:28px;padding:34px; }
#lpMain .lp-tabpanel[hidden]{ display:none; }
#lpMain .lp-tabpanel::before{ content:'';position:absolute;top:-170px;left:-170px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--fam) 20%,transparent),transparent 65%);pointer-events:none; }
#lpMain .lp-fam-head{ position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-bottom:26px; }
#lpMain .lp-fam-badge{ width:68px;height:68px;border-radius:21px;display:flex;align-items:center;justify-content:center;background:var(--fam);box-shadow:0 16px 44px color-mix(in srgb,var(--fam) 40%,transparent);flex-shrink:0; }
#lpMain .lp-fam-titles{ flex:1 1 300px; }
#lpMain .lp-fam-titles h2{ margin:0;font-size:clamp(28px,4vw,38px);font-weight:800;letter-spacing:-.03em; }
#lpMain .lp-fam-titles p{ margin:6px 0 0;font-size:16px;line-height:1.5;color:var(--text-secondary); }
#lpMain .lp-tabpanel .lp-features{ position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px;max-width:none;background:none;border:none;padding:0;border-radius:0;animation:none; }
#lpMain .lp-tabpanel .lp-features .lp-feature-card{ animation:lpPanelIn .5s cubic-bezier(.2,.7,.2,1) both; }
#lpMain .lp-tabpanel:not([hidden]) .lp-features .lp-feature-card:nth-child(2){ animation-delay:.05s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-features .lp-feature-card:nth-child(3){ animation-delay:.1s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-features .lp-feature-card:nth-child(4){ animation-delay:.15s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-features .lp-feature-card:nth-child(n+5){ animation-delay:.2s; }
#lpMain .lp-tabpanel .lp-feature-card{ background:rgba(9,9,18,.6); }
@keyframes lpFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }
@keyframes lpGlow{ 0%,100%{ opacity:.55; } 50%{ opacity:.95; } }
@media (max-width:600px){ #lpMain .lp-tabpanel{ padding:22px 16px; } #lpMain .lp-hero3{ padding-top:40px; } #lpMain .lp-hero3-lion{ width:110px;height:110px;border-radius:30px; } }
@media (prefers-reduced-motion:reduce){ #lpMain .lp-hero3::before,#lpMain .lp-hero3-lion,#lpMain .lp-hero3 h1,#lpMain .lp-hero3 p,#lpMain .lp-tabpanel .lp-features .lp-feature-card{ animation:none; } }


/* Croquis 3 fidèle : 6 familles, exemple + plan sous chaque outil, bandeau final */
#lpMain .lp-hl{ color:#c4a4ff; }
#lpMain .lp-tab-ic{ display:none; }
#lpMain .lp-tabs{ max-width:1100px;margin:0 auto 22px;justify-content:flex-start; }
#lpMain .lp-tab{ min-height:48px;padding:0 22px;font-size:16px; }
#lpMain .lp-tabpanels{ max-width:1100px; }
#lpMain .lp-tabpanel .lp-features{ grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px; }
#lpMain .lp-tabpanel .lp-feature-card{ gap:10px;border-radius:22px;padding:22px;background:rgba(7,7,16,.75);align-items:stretch; }
#lpMain .lp-tabpanel .lp-feature-card::before{ content:none; }
#lpMain .lp-tabpanel .lp-feature-title{ font-size:22px; }
#lpMain .lp-tabpanel .lp-feature-desc{ font-size:15px;line-height:1.55; }
#lpMain .lp-ex{ margin-top:auto;background:#070710;border:1px solid #1c1c32;border-radius:12px;padding:12px 14px;font-family:var(--font-code);font-size:13px;line-height:1.5;color:#c3d4ff;overflow-wrap:anywhere; }
#lpMain .lp-plan{ font-size:13px;color:var(--text-secondary); }
#lpMain .lp-dl{ display:flex;flex-wrap:wrap;gap:8px; }
#lpMain .lp-dl a{ padding:8px 14px;border-radius:10px;border:1px solid var(--border-input);color:var(--text-primary);text-decoration:none;font-size:13px;font-weight:600; }
#lpMain .lp-dl a:hover{ border-color:var(--fam); }
#lpMain .lp-cta3{ position:relative;max-width:1100px;margin:0 auto 80px;padding:40px;border:1px solid var(--border);border-radius:30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;background:radial-gradient(circle at 10% 50%,rgba(91,138,245,.18),rgba(7,7,16,0) 55%),rgba(255,255,255,.02); }
#lpMain .lp-cta3-text{ font-size:clamp(20px,3vw,28px);font-weight:800;letter-spacing:-.02em;flex:1 1 320px; }


/* Mobile : les deux boutons de la barre du haut tiennent en entier sur 360 px */
@media (max-width:480px){
  #lpMain .lp-nav{ padding:10px 12px;gap:8px; }
  #lpMain .lp-nav .brand{ font-size:0;gap:0!important; }
  #lpMain .lp-nav .brand img{ width:28px!important;height:28px!important; }
  #lpMain .lp-nav-btns{ display:flex;gap:6px;flex-shrink:0; }
  #lpMain .lp-nav-btns button{ padding:8px 9px!important;font-size:11px!important;white-space:nowrap; }
}

/* Améliorations : bouton dans le hero, ligne de confiance, exemples « tapés », image d'exemple, offres, onglets défilants */
#lpMain .lp-hero3-trust{ font-size:15px;color:#c3d4ff;font-weight:600;animation:lpPanelIn .8s cubic-bezier(.2,.7,.2,1) .15s both; }
#lpMain .lp-hero3-trust::before{ content:'✓';margin-right:8px;color:#34d399;font-weight:800; }
#lpMain .lp-hero3-actions{ display:flex;flex-wrap:wrap;gap:12px;margin-top:6px;animation:lpPanelIn .8s cubic-bezier(.2,.7,.2,1) .2s both; }
@keyframes lpType{ from{ clip-path:inset(0 100% 0 0); } to{ clip-path:inset(0 0 0 0); } }
@keyframes lpFade{ from{ opacity:0;transform:scale(.97); } to{ opacity:1;transform:none; } }
#lpMain .lp-tabpanel:not([hidden]) .lp-ex{ animation:lpType .9s steps(26,end) .25s both; }
#lpMain .lp-tabpanel:not([hidden]) .lp-feature-card:nth-child(2) .lp-ex{ animation-delay:.4s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-feature-card:nth-child(3) .lp-ex{ animation-delay:.55s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-feature-card:nth-child(n+4) .lp-ex{ animation-delay:.7s; }
#lpMain .lp-ex-fig{ margin:0;display:flex;flex-direction:column;gap:6px; }
#lpMain .lp-ex-fig img{ display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;border:1px solid #1c1c32;background:#0d0d1c; }
#lpMain .lp-ex-fig figcaption{ font-size:12px;color:var(--text-secondary); }
#lpMain .lp-tabpanel:not([hidden]) .lp-ex-fig img{ animation:lpFade .8s ease 1.1s both; }
#lpMain .lp-offers{ max-width:1100px;margin:0 auto 22px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px; }
#lpMain .lp-offer{ border:1px solid var(--border);border-radius:22px;padding:22px 24px;background:rgba(255,255,255,.02); }
#lpMain .lp-offer-pro{ border:2px solid transparent;background:linear-gradient(#0d0d1c,#0d0d1c) padding-box,linear-gradient(140deg,#5b8af5,#a855f7) border-box; }
#lpMain .lp-offer-head{ display:flex;justify-content:space-between;align-items:baseline;gap:12px; }
#lpMain .lp-offer-head span{ font-weight:700;font-size:17px; }
#lpMain .lp-offer-head strong{ font-weight:800;font-size:26px; }
#lpMain .lp-offer-head small{ font-size:14px;font-weight:600;color:var(--text-secondary); }
#lpMain .lp-offer ul{ margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.5;color:var(--text-secondary); }
#lpMain .lp-offer li::before{ content:'✓';margin-right:8px;color:#34d399;font-weight:800; }
@media (max-width:600px){
  #lpMain .lp-tabs{ flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 16px 12px;margin-left:-16px;margin-right:-16px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 28px),transparent 100%); }
  #lpMain .lp-tabs::-webkit-scrollbar{ display:none; }
  #lpMain .lp-tab{ flex-shrink:0; }
  #lpMain .lp-offers{ padding:0 4px; }
}
@media (prefers-reduced-motion:reduce){ #lpMain .lp-ex,#lpMain .lp-ex-fig img,#lpMain .lp-hero3-trust,#lpMain .lp-hero3-actions{ animation:none!important; } }
#lpMain .lp-offers,#lpMain .lp-cta3{ max-width:1052px;width:calc(100% - 32px);box-sizing:border-box;margin-left:auto;margin-right:auto; }
#lpMain .lp-cta3{ margin-bottom:80px; }

/* Captures réelles, démo de réponse, prix lisibles, lien direct */
#lpMain #lp-features{ scroll-margin-top:80px; }
#lpMain .lp-tabpanel .lp-features{ grid-auto-flow:row dense; }
@media (min-width:640px){ #lpMain .lp-tabpanel .lp-feature-card.lp-wide{ grid-column:span 2; } }
#lpMain .lp-ex-fig img[src*="landing-"]{ aspect-ratio:auto; height:auto; }
#lpMain .lp-demo{ display:flex;flex-direction:column;gap:7px;padding:14px 16px;border:1px solid #1c1c32;border-radius:14px;background:rgba(91,138,245,.06); }
#lpMain .lp-demo-head{ font-size:12px;font-weight:700;color:#9db8ff; }
#lpMain .lp-demo-line{ font-size:14px;line-height:1.5;color:var(--text-primary); }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line{ animation:lpType .7s steps(34,end) both; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(2){ animation-delay:1s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(3){ animation-delay:1.6s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(4){ animation-delay:2.3s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(5){ animation-delay:3s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(6){ animation-delay:3.7s; }
#lpMain .lp-tabpanel:not([hidden]) .lp-demo-line:nth-of-type(7){ animation-delay:4.4s; }
#lpMain .lp-offer-head strong{ font-family:var(--font-ui);font-weight:600;font-size:28px;letter-spacing:0; }
#lpMain .lp-cta3-text{ font-weight:600; }
@media (prefers-reduced-motion:reduce){ #lpMain .lp-demo-line{ animation:none!important; } }

/* Accessibilité : un seul titre principal (les fenêtres de connexion n'utilisent plus h1), contraste du pied de page, liens assez grands au doigt */
.login-logo .login-logo-title{ font-size:24px;font-weight:800;letter-spacing:-1px;line-height:1.25;background:var(--accent-grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
#lpMain .lp-footer{ color:var(--text-secondary);gap:6px 10px;align-items:center; }
#lpMain .lp-footer a{ display:inline-flex;align-items:center;min-height:32px;padding:0 6px;border-radius:8px; }
#lpMain .lp-footer a:focus-visible{ outline:2px solid var(--accent);outline-offset:2px; }
@media (max-width:600px){ #lpMain .lp-footer a{ min-height:40px; } }
@media (max-width:340px){ #lpMain .lp-nav{ padding:10px 8px; } #lpMain .lp-nav-btns button{ padding:8px 7px!important;font-size:10.5px!important; } }

/* Application mobile : corrections d'affichage de la passe de captures (2026-10-09) */
/* Grille d'outils de l'accueil : les mots ne se coupent plus au milieu (Grammair/e, Document/s) */
.outils-grid-accueil .outils-card{ padding:10px;gap:8px; }
.outils-grid-accueil .outils-card-icon{ width:34px;height:34px;font-size:17px;border-radius:9px; }
.outils-grid-accueil .outils-card-title{ font-size:12.5px;overflow-wrap:break-word; }
/* Sous-menu : une seule ligne par bouton, la barre garde la même hauteur d'un onglet à l'autre (elle défile déjà) */
.section-subnav .subnav-btn{ white-space:nowrap; }
/* Champ « Nom » des clés API : même fond que les autres champs (il restait blanc) */
#newKeyName{ background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border-input);border-radius:8px;padding:9px 12px;font:inherit;font-size:13px; }
#newKeyName::placeholder{ color:var(--text-muted); }
#newKeyName:focus-visible{ outline:2px solid var(--accent);outline-offset:1px; }
@media (max-width:600px){
  /* Mon compte : mot de passe et 2FA l'un sous l'autre */
  .sec-grid{ grid-template-columns:1fr!important; }
  /* Administration : valeurs de services moins grosses, tendances à la ligne au lieu d'être coupées */
  #hOllama,#hVllm,#hSd,#hComfy,#hChroma,#hPushStatus,#hUptime{ font-size:15px;line-height:1.25;white-space:nowrap;letter-spacing:-.01em; }
  #adminKpiRow .sub-stat{ padding:12px 8px; }
  #adminKpiRow .sub-stat-value{ font-size:22px;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:2px 6px; }
}

/* Chat : le bandeau cookies ne doit pas masquer la zone de saisie (bureau) ; les en-têtes de tableau ne se coupent plus en plein mot */
.app-body{padding-bottom:var(--cookie-banner-h,0px)}
.md-table th{white-space:nowrap;word-break:normal;overflow-wrap:normal;hyphens:none}

/* Outils : bouton des pages verrouillées centré ; actions plus faciles à toucher sur mobile */
.plan-gate .btn-action{display:inline-flex;justify-content:center}
.plan-gate p{color:var(--text-secondary)}
@media (max-width:600px){
  #codePage .tab-btn,#documentsPage .tab-btn,#codePage .btn-action,#documentsPage .btn-action,#translatePage .btn-action,#grammarPage .btn-action,#ttsPage .btn-action,#codePage .btn-secondary,#documentsPage .btn-secondary{min-height:36px}
}

/* Création / chat : l'estompage du bord n'existe que si la rangée défile ; zones tactiles ; boutons sous un message */
.fade-scroll:not([data-ov="1"]){-webkit-mask-image:none;mask-image:none}
#galleryPage button,#imagesPage .style-btn,#imgModeBar button,#chatMessages .msg-btn{min-height:30px}
[id^="gal-like-"]{min-height:32px}
@media (max-width:600px){
  #galleryPage button,#imagesPage .style-btn,#imgModeBar button,#chatMessages .msg-btn{min-height:36px}
  [id^="gal-like-"]{min-height:36px}
}

/* Administration : champs sombres, contraste du texte secondaire, services sur une ligne, zones tactiles */
#bannerText,#broadcastInput{ background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border-input);border-radius:8px;padding:9px 12px;font:inherit;font-size:13px; }
#bannerText::placeholder,#broadcastInput::placeholder{ color:var(--text-secondary); }
body:not(.light) #adminPage{ --text-muted:#8484a3; }
body.light #adminPage{ --text-muted:#62628a; }
#hOllama,#hVllm,#hSd,#hComfy,#hChroma,#hPushStatus{ font-size:18px;line-height:1.25;white-space:nowrap;letter-spacing:-.01em; }
#adminPage button{ min-height:30px; }
@media (max-width:600px){
  #adminPage button{ min-height:34px; }
  #adminKpiRow>:last-child:nth-child(3n+1){ grid-column:1/-1; }
}

/* Administration : 4 groupes (niveau 1) puis les onglets du groupe choisi (niveau 2) */
.admin-groups{ display:flex;gap:8px;margin-bottom:10px; }
.admin-group-btn{ position:relative;flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);font-family:var(--font-ui);font-size:13px;font-weight:700;cursor:pointer;transition:background .15s,color .15s,border-color .15s; }
.admin-group-btn:hover{ color:var(--text-primary);border-color:var(--border-input); }
.admin-group-btn.active{ background:var(--accent-grad);color:#fff;border-color:transparent; }
.admin-group-btn.ag-adv:not(.active){ border-color:rgba(240,84,84,.35); }
.admin-group-btn.has-badge::after{ content:attr(data-badge);position:absolute;top:-7px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center; }
.admin-subtabs{ display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:20px;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch; }
#adminSubTabs .admin-tab-btn{ display:none; }
#adminSubTabs[data-group="pilotage"] .admin-tab-btn[data-group="pilotage"],
#adminSubTabs[data-group="communaute"] .admin-tab-btn[data-group="communaute"],
#adminSubTabs[data-group="serveur"] .admin-tab-btn[data-group="serveur"],
#adminSubTabs[data-group="outils"] .admin-tab-btn[data-group="outils"]{ display:inline-flex;align-items:center;gap:4px; }
.admin-tab-btn.atab-risk:not(.active){ color:var(--danger); }
.admin-tab-btn.atab-risk.active{ color:var(--danger);border-bottom-color:var(--danger); }
@media (max-width:480px){
  .admin-group-btn{ flex-direction:column;gap:2px;padding:6px 4px;font-size:11px;min-height:48px; }
  .admin-group-btn .ag-ic{ font-size:16px;line-height:1; }
  #adminSubTabs .admin-tab-btn.active .atab-label{ display:inline; }
}
@media (max-width:480px){
  .admin-group-btn{ font-size:10px;letter-spacing:-.01em; }
  .admin-group-btn .ag-label{ max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
}
@media (max-width:360px){
  .admin-groups{ gap:4px; }
  .admin-group-btn{ font-size:9.5px;padding:6px 1px;letter-spacing:-.02em; }
}
@media (max-width:480px){ .admin-group-btn{ flex:1 1 auto; } }

/* Administration : thème clair (couleurs d'état plus foncées), mobile (tuiles du haut en bandeau défilant) */
body.light #adminPage{ --success:#166534;--warning:#92400e;--danger:#b91c1c; }
#adminPage [hidden], #adminKpiRow [hidden]{ display:none !important; }
@media (max-width:600px){
  #adminKpiRow{ display:flex !important;overflow-x:auto;gap:8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;padding-bottom:4px; }
  #adminKpiRow .sub-stat{ flex:0 0 118px;scroll-snap-align:start;padding:8px 6px; }
  #adminKpiRow .sub-stat-label{ font-size:9px;letter-spacing:.04em; }
  #adminKpiRow .sub-stat-value{ font-size:20px; }
}

/* ── Audit du 10/10 : contraste, accueil en thème clair, petits écrans, zones de clic ── */
/* Texte secondaire : 1,7-2,1:1 → ≥ 4,5:1 sur les fonds sombres ; thème clair 2,2-2,8:1 → ≥ 4,5:1 */
:root{ --text-muted:#8484a3; --text-secondary:#a6a6c4; }
body.light{ --text-muted:#62628a; }
/* L'accueil et la connexion sont des pages sombres : elles le restent même si l'application est en thème clair */
body.light #landingPage, body.light #loginPage{ --bg-primary:#090912;--bg-secondary:#111120;--bg-card:#161625;--bg-input:#1e1e30;--bg-hover:#242438;--border:#1e1e30;--border-input:#2a2a42;--text-primary:#e8e8f0;--text-secondary:#a6a6c4;--text-muted:#8484a3;--accent:#5b8af5;--accent-soft:rgba(91,138,245,.12);--shadow:0 8px 32px rgba(0,0,0,.4); color-scheme:dark; background:var(--bg-primary); color:var(--text-primary); }
.login-back{ text-align:center;margin-top:10px;font-size:12.5px; }
.login-back a{ color:var(--accent);text-decoration:none;cursor:pointer;padding:6px 4px;display:inline-block; }
/* 320 px : les cartes de présentation ne dépassent plus du cadre */
#lpMain .lp-tabpanel{ grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); }
#lpMain .lp-tabpanel .lp-features{ grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); }
#lpMain .lp-offers{ grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); }
/* Chat vide : le contenu centré ne se coupe plus quand l'écran est bas (320×640) — il défile */
.chat-welcome{ flex:0 0 auto; justify-content:flex-start; margin-block:auto; }
/* Boutons d'action sous les messages : zone de clic de 30 px sans agrandir la bulle */
#chatMessages .msg-btn{ margin-block:-6px; }
@media (max-width:600px){
  #chatMessages .msg-btn{ margin-block:-9px; }
  /* Mobile : boutons d'au moins 40 px de haut (Compte, Abonnement, Réglages, devis, aide…) */
  .btn-action,.btn-secondary,.btn-primary,.btn-danger{ min-height:40px; }
  #adminPage .btn-action,#adminPage .btn-secondary{ min-height:34px; }
}
/* Libellés de 10 px portés à 11 px */
.trans-box-label,.settings-section-title,.pro-tag,.hint,.conv-meta,.msg-timing,.stat-label,.mon-sub,.mon-footer,.info-item-label,.conv-meta{ font-size:11px; }

/* ── Audit du 10/10, 2e passe ── */
label small,.input-group small{ font-size:11px; }
/* Zones de clic (bureau) : au moins 30 px */
@media (min-width:601px){
  button[onclick*="toggleSelectMode"],button[onclick*="deleteAllConvs"],button[onclick*="createFolder"],#accountPage button,#codePage .btn-secondary,#codePage .btn-action,#documentsPage button,#adminPage select,#adminPage input[type="date"],#adminPage input[type="text"],#adminPage .help-btn{ min-height:30px; }
}
/* Thème clair : verts, ambres et rouges d'état plus foncés (comme l'application de bureau) */
body.light{ --success:#166534; --warning:#92400e; --danger:#b91c1c; }
body.light .guest-banner{ color:#92400e; background:rgba(245,158,11,.14); border-color:rgba(180,83,9,.35); }
body.light .plan-badge{ color:#2d4fb0; }
body.light{ --accent:#3a64d6; }

/* Pourquoi Milac reste privé + questions fréquentes (ajoutés le 2026-10-25) */
#lpMain .lp-why,#lpMain .lp-faq{max-width:820px;margin:56px auto 0;padding:0 20px}
#lpMain .lp-why h2,#lpMain .lp-faq h2{font-size:clamp(24px,4vw,32px);line-height:1.15;margin:0 0 20px;letter-spacing:-.01em}
#lpMain .lp-why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#lpMain .lp-why-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:18px 20px}
#lpMain .lp-why-card h3{margin:0 0 6px;font-size:16.5px}
#lpMain .lp-why-card p{margin:0;font-size:14.5px;line-height:1.55;color:var(--text-secondary)}
#lpMain .lp-why-link{margin:16px 2px 0;font-size:14.5px}
#lpMain .lp-why-link a,#lpMain .lp-faq a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
#lpMain .lp-faq details{border-bottom:1px solid var(--border)}
#lpMain .lp-faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:10px 2px;font-size:16px;font-weight:600}
#lpMain .lp-faq summary::-webkit-details-marker{display:none}
#lpMain .lp-faq summary::after{content:"+";flex:none;font-size:22px;line-height:1;color:var(--text-secondary);transition:transform .15s}
#lpMain .lp-faq details[open] summary::after{content:"–"}
#lpMain .lp-faq summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
#lpMain .lp-faq details p{margin:0 2px 16px;font-size:15px;line-height:1.6;color:var(--text-secondary);max-width:68ch}
#lpMain .lp-faq .lp-faq-contact{margin:20px 2px 0;font-size:15px}
@media (max-width:640px){#lpMain .lp-why-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){#lpMain .lp-faq summary::after{transition:none}}
#lpMain .lp-faq{margin-bottom:56px}
#lpMain .lp-soon{font-size:13px;color:var(--text-secondary);padding:8px 2px}