/* Démo « IA dans votre SaaS » (landing.hero.demo type: saas) : écran d'un logiciel B2B + console de l'éditeur. */
.lp-demo-saas{padding-top:40px;padding-bottom:36px}
.lp-saas{position:relative;z-index:1;min-width:0;font-family:Inter,Arial,sans-serif;color:#20201f}
.lp-saas *,.lp-saas *::before,.lp-saas *::after{box-sizing:border-box}
.lp-saas svg{display:block}
.lp-saas-off{opacity:0!important}

/* Fenêtre de l'application */
.lp-saas-app{position:relative;z-index:1;min-width:0;background:#fff;border:1px solid #e4def2;border-radius:16px;box-shadow:0 30px 70px -22px rgba(42,20,110,.28),0 10px 24px -12px rgba(42,20,110,.16);overflow:hidden}
.lp-saas-bar{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 14px;border-bottom:1px solid #f0edf6;background:#fcfbfe}
.lp-saas-dots{display:flex;gap:5px;flex:none}.lp-saas-dots i{width:8px;height:8px;border-radius:50%;background:#e5e1ec}
.lp-saas-brand{display:inline-flex;align-items:center;gap:7px;flex:none;font:700 13px/1 'Inter Tight',Inter,sans-serif;letter-spacing:-.01em}
.lp-saas-brand b{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:linear-gradient(135deg,#2f6bff,#1d4ed8);color:#fff;font-size:11px}
.lp-saas-crumb{min-width:0;padding-left:10px;border-left:1px solid #e7e3ef;font-size:12px;font-weight:500;color:#62616b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-tenant{display:inline-flex;align-items:center;gap:6px;flex:none;margin-left:auto;padding:3px 9px 3px 3px;border:1px solid #ebe7f2;border-radius:999px;background:#fff;font-size:11.5px;font-weight:600;color:#3a3842}
.lp-saas-tenant i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fde7ef;color:#c0124f;font:700 9.5px/1 Inter,sans-serif;font-style:normal}
.lp-saas-body{padding:14px 14px 34px;min-width:0}

/* Recherche en langage naturel */
.lp-saas-search{display:flex;align-items:flex-start;gap:9px;padding:9px 10px 9px 11px;border:1.5px solid #d9cdfb;border-radius:12px;background:#fbfaff;box-shadow:0 0 0 4px rgba(96,36,245,.07);transition:border-color .3s,box-shadow .3s}
.lp-saas-search.is-sent{border-color:#6024f5;box-shadow:0 0 0 4px rgba(96,36,245,.16)}
.lp-saas-search-ico{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:linear-gradient(135deg,#7b4bff,#6024f5);color:#fff}
.lp-saas-search-ico svg{width:13px;height:13px}
.lp-saas-q{position:relative;flex:1;min-width:0;padding-top:2px;font-size:13px;line-height:18px;font-weight:500}
.lp-saas-q-ghost{visibility:hidden}
.lp-saas-q-ph,.lp-saas-q-typed{position:absolute;left:0;right:0;top:2px;transition:opacity .25s}
.lp-saas-q-ph{color:#a19bb0;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-q-typed{color:#20201f}
.lp-saas-caret{display:inline-block;width:1.5px;height:15px;margin-left:1px;vertical-align:-3px;background:#6024f5;opacity:0}
.lp-saas-search.is-typing .lp-saas-caret{opacity:1;animation:lpSaasBlink 1s steps(1) infinite}
@keyframes lpSaasBlink{50%{opacity:0}}
.lp-saas-kbd{flex:none;display:grid;place-items:center;min-width:24px;height:22px;padding:0 6px;border:1px solid #e3ddf3;border-bottom-width:2px;border-radius:6px;background:#fff;font:600 11px/1 Inter,sans-serif;color:#8a8496;transition:background .2s,color .2s,transform .2s}
.lp-saas-search.is-sent .lp-saas-kbd{background:#6024f5;border-color:#4b16d0;color:#fff;transform:translateY(1px)}

/* Filtres structurés */
.lp-saas-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 12px;min-height:24px}
.lp-saas-chips>*{transition:opacity .35s ease,transform .35s ease}
.lp-saas-chips-label{font-size:11px;font-weight:600;color:#8a8496;margin-right:1px}
.lp-saas-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 7px 4px 9px;border-radius:8px;background:#efe9ff;border:1px solid #ddd1fd;font-size:11.5px;font-weight:600;color:#4b16d0;white-space:nowrap}
.lp-saas-chip i{font-style:normal;font-size:12px;line-height:1;color:#9d88e6}
.lp-saas-count{margin-left:auto;font-size:11.5px;font-weight:600;color:#62616b;white-space:nowrap}
.lp-saas-chips>.lp-saas-off{transform:translateY(4px) scale(.96)}

/* Tableau */
.lp-saas-table{border:1px solid #f0edf6;border-radius:11px;overflow:hidden}
.lp-saas-tr{display:grid;grid-template-columns:minmax(0,1fr) 90px 74px;align-items:center;gap:10px;min-height:42px;padding:5px 12px;border-top:1px solid #f3f0f8;font-size:12px}
.lp-saas-tr>*{min-width:0}
.lp-saas-th{min-height:28px;border-top:0;background:#f8f7fb;font-size:10.5px;font-weight:600;letter-spacing:.02em;color:#8a8496}
.lp-saas-th span:last-child,.lp-saas-amt{text-align:right}
.lp-saas-rows{display:grid}
.lp-saas-set{grid-area:1/1;transition:opacity .35s ease}
.lp-saas-set>.lp-saas-tr:first-child{border-top:0}
.lp-saas-set .lp-saas-tr{transition:opacity .35s ease,transform .35s ease,background .4s}
.lp-saas-set .lp-saas-tr.lp-saas-off{transform:translateY(5px)}
.lp-saas-cli{display:flex;flex-direction:column;gap:1px}
.lp-saas-cli b{font-weight:600;color:#20201f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-cli small{font-size:10.5px;color:#8a8496;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-amt{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.lp-saas-pill{display:inline-block;max-width:100%;padding:3px 8px;border-radius:999px;font-size:10.5px;font-weight:600;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-pill-ok{background:#e8f7ee;color:#15803d}
.lp-saas-pill-warn{background:#fff4dd;color:#a15c07}
.lp-saas-pill-late{background:#fde7ef;color:#c0124f}
.lp-saas-total{background:#faf8fe;font-weight:600;color:#4b16d0}
.lp-saas-total .lp-saas-amt{color:#4b16d0}

/* Résumé IA */
.lp-saas-sum{margin-top:12px;border:1px solid #e7e0fa;border-radius:12px;background:linear-gradient(180deg,#faf8ff,#fff);overflow:hidden}
.lp-saas-sum-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 8px 8px 12px;border-bottom:1px solid #f0ebfb}
.lp-saas-sum-label{min-width:0;font-size:11.5px;font-weight:600;color:#62616b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-btn{display:inline-flex;align-items:center;gap:6px;flex:none;padding:6px 11px;border-radius:8px;background:#6024f5;color:#fff;font-size:11.5px;font-weight:600;box-shadow:0 6px 14px -6px rgba(96,36,245,.55);transition:transform .15s,background .2s,box-shadow .2s}
.lp-saas-btn svg{width:12px;height:12px}
.lp-saas-btn.is-press{transform:scale(.94);background:#4b16d0;box-shadow:0 0 0 4px rgba(96,36,245,.18)}
.lp-saas-sum-body{display:grid;padding:10px 12px 11px}
.lp-saas-sum-body>*{grid-area:1/1;min-width:0;transition:opacity .35s ease}
.lp-saas-hint{margin:0;align-self:start;font-size:12px;line-height:1.5;color:#8a8496}
.lp-saas-skel{display:grid;gap:8px;align-content:start;padding-top:4px}
.lp-saas-skel i{height:9px;border-radius:5px;background:linear-gradient(90deg,#efe9ff 0%,#ddd1fd 40%,#efe9ff 80%);background-size:200% 100%;animation:lpSaasShim 1.1s linear infinite}
.lp-saas-skel i:nth-child(2){width:86%}.lp-saas-skel i:nth-child(3){width:58%}
@keyframes lpSaasShim{from{background-position:100% 0}to{background-position:-100% 0}}
.lp-saas-sum-text p{margin:0;font-size:12.5px;line-height:1.55;color:#2c2a33}
.lp-saas-sum-text strong{font-weight:700;color:#20201f}
.lp-saas-src{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:8px;transition:opacity .35s ease}
.lp-saas-src span{font-size:10.5px;font-weight:600;color:#8a8496;margin-right:2px}
.lp-saas-src em{padding:2px 7px;border-radius:6px;background:#fff;border:1px solid #e4def2;font-size:10.5px;font-weight:600;font-style:normal;color:#5b5470}

/* Console de l'éditeur (coulisses), superposée */
.lp-saas-console{position:relative;z-index:2;margin:-24px -6px 0 30px;padding:11px 12px 10px;border-radius:14px;background:#1d1b26;color:#ece9f5;box-shadow:0 24px 50px -18px rgba(20,10,60,.55),0 8px 18px -10px rgba(20,10,60,.35);transition:opacity .4s ease,transform .4s ease}
.lp-saas-console.lp-saas-off{transform:translateY(10px)}
.lp-saas-con-head{display:flex;align-items:center;gap:8px;min-width:0;margin-bottom:9px}
.lp-saas-con-title{display:inline-flex;align-items:center;gap:6px;flex:none;font:600 12px/1 'Inter Tight',Inter,sans-serif}
.lp-saas-con-title svg{width:14px;height:14px;color:#b9a4ff}
.lp-saas-con-tag{flex:none;padding:2px 7px;border-radius:999px;background:rgba(244,32,110,.16);color:#ff8db5;font-size:10px;font-weight:600}
.lp-saas-con-client{min-width:0;margin-left:auto;font-size:10.5px;color:#a7a2b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-con-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.lp-saas-cell{display:flex;flex-direction:column;gap:3px;min-width:0;padding:8px 9px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);transition:background .4s,border-color .4s}
.lp-saas-cell.is-hit{background:rgba(123,75,255,.22);border-color:rgba(185,164,255,.45)}
.lp-saas-cell-label{font-size:10px;color:#a7a2b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-cell strong{display:flex;align-items:center;gap:5px;font:600 14px/1.15 'Inter Tight',Inter,sans-serif;letter-spacing:-.01em;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.lp-saas-cell strong svg{width:13px;height:13px;flex:none;color:#4ade80}
.lp-saas-cell small{font-size:10px;color:#a7a2b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-saas-gauge{display:block;height:4px;margin:2px 0 1px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.lp-saas-gauge i{display:block;width:var(--p,70%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#7b4bff,#f4206e)}
.lp-saas-log{display:flex;align-items:center;gap:7px;min-width:0;margin-top:8px;font:500 10.5px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;color:#c9c4d8}
.lp-saas-log i{flex:none;width:6px;height:6px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.18)}
.lp-saas-log span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .25s}
.lp-saas-log.is-idle i{background:#6b6780;box-shadow:none}

@media (max-width:760px){
  .lp-demo-saas{padding-top:34px;padding-bottom:30px}
  .lp-saas-crumb{display:none}
  .lp-saas-body{padding:12px 12px 32px}
  .lp-saas-tr{grid-template-columns:minmax(0,1fr) 82px 62px;gap:8px;padding:5px 10px}
  .lp-saas-console{margin:-22px 0 0 10px}
}
@media (max-width:480px){
  .lp-saas-tenant span{display:none}
  .lp-saas-tenant{padding-right:3px}
  .lp-saas-con-client{display:none}
  .lp-saas-con-tag{margin-left:auto}
  .lp-saas-con-grid{grid-template-columns:minmax(0,1fr)}
  .lp-saas-cell{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l v" "d v";column-gap:10px;row-gap:1px;padding:6px 9px}
  .lp-saas-cell-label{grid-area:l}
  .lp-saas-cell strong{grid-area:v;align-self:center;font-size:13.5px}
  .lp-saas-cell small{grid-area:d}
  .lp-saas-gauge{display:none}
  .lp-saas-cell[data-saas="cell-use"] small::before{content:"";display:inline-block;width:40px;height:4px;margin-right:6px;vertical-align:1px;border-radius:3px;background:linear-gradient(90deg,#7b4bff var(--p,70%),rgba(255,255,255,.14) var(--p,70%))}
}
@media (prefers-reduced-motion:reduce){.lp-saas *{animation:none!important;transition:none!important}}
