/* ==========================================================================
   Lucius AI — Page R&D IA : simulateur, flux d'apprentissage, boucle
   ========================================================================== */
.sim,.ingest{--text:#fff;--muted:#A5A5C0;--muted-2:#7D7D9C;--line:rgba(255,255,255,.10);--line-strong:rgba(255,255,255,.18);--cyan:#22D3EE;--cyan-300:#7BE7F7;--hover:rgba(255,255,255,.08)}
.rd-hero{position:relative;overflow:hidden}
.rd-hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 0,rgba(34,211,238,.08) 50%,transparent 100%);
  background-size:100% 220px;background-repeat:no-repeat;animation:rd-scan 6s linear infinite;opacity:.8}
@keyframes rd-scan{from{background-position:0 -220px}to{background-position:0 calc(100% + 220px)}}
.rd-hero .wrap{position:relative;z-index:1}
.rd-hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.rd-stats{margin-top:42px}
.rd-stats .stat__num{font-variant-numeric:tabular-nums;white-space:nowrap}
.rd-stats .stat__num--sm{font-size:clamp(1.7rem,3.4vw,2.2rem)}
.rd-stats .stat{position:relative;overflow:hidden}
.rd-stats .stat::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--grad);opacity:.8}

/* ---------- Simulateur ---------- */
.sim{border:1px solid var(--line-strong);border-radius:var(--r-lg);background:#07070f;box-shadow:var(--glow);overflow:hidden}
.sim__bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.03);font:600 .8rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--muted)}
.sim__dot{width:11px;height:11px;border-radius:50%;background:#3a3a55;display:inline-block}
.sim__dot:nth-child(1){background:#F43F5E}.sim__dot:nth-child(2){background:#FACC15}.sim__dot:nth-child(3){background:#34D399}
.sim__title{margin-left:8px;letter-spacing:.04em}
.sim__badge{margin-left:auto;padding:4px 10px;border-radius:999px;border:1px solid rgba(34,211,238,.4);color:var(--cyan-300);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.sim__grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.sim__stage{position:relative;background:#05050B;border-right:1px solid var(--line)}
.sim__svg{display:block;width:100%;height:auto}
.sim__console{display:flex;flex-direction:column;min-height:260px;background:#06060d}
.sim__console-head{padding:10px 14px;border-bottom:1px solid var(--line);font:600 .72rem/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted-2);text-transform:uppercase;letter-spacing:.1em}
.sim__console-body{flex:1;padding:14px;font:.78rem/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#9fe9c9;overflow:hidden;max-height:420px}
.sim__console-body div{white-space:pre-wrap;word-break:break-word;animation:rd-line .25s ease-out}
.sim__console-body .c-dim{color:var(--muted-2)}
.sim__console-body .c-eq{color:var(--cyan-300)}
.sim__console-body .c-dm{color:#fdba74}
.sim__console-body .c-an{color:#d8b4fe}
.sim__console-body .c-ok{color:#86efac}
.sim__console-body .caret::after{content:"▍";animation:rd-blink 1s steps(1) infinite;margin-left:2px}
@keyframes rd-line{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@keyframes rd-blink{50%{opacity:0}}
.sim__controls{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;padding:16px;border-top:1px solid var(--line);background:rgba(255,255,255,.02)}
.sim__steps{display:flex;flex-wrap:wrap;gap:8px}
.sim__btn{appearance:none;border:1px solid var(--line-strong);background:transparent;color:#fff;border-radius:999px;padding:9px 15px;font:600 .86rem/1 var(--font-body,inherit);cursor:pointer;transition:background .2s,border-color .2s}
.sim__btn:hover{background:rgba(255,255,255,.08)}
.sim__btn[aria-pressed="true"],.sim__btn.is-on{background:var(--violet);border-color:var(--violet);box-shadow:var(--glow)}
.sim__btn b{color:var(--cyan-300);margin-right:6px;font-variant-numeric:tabular-nums}
.sim__btn[aria-pressed="true"] b{color:#fff}
.sim__play{min-width:112px}
.sim__thr{display:flex;align-items:center;gap:12px;margin-left:auto;color:var(--muted);font-size:.88rem}
.sim__thr input{accent-color:var(--cyan);width:170px}
.sim__thr output{font:700 .9rem ui-monospace,Menlo,monospace;color:var(--cyan-300);min-width:38px;text-align:right}
.sim__hint{padding:0 16px 16px;margin:0;color:var(--muted-2);font-size:.86rem}

/* éléments SVG du simulateur */
.sim__svg .det-box{fill:none;stroke-width:2.2;transition:opacity .45s ease}
.sim__svg .det-lab{transition:opacity .45s ease}
.sim__svg .dmg{transition:opacity .45s ease}
.sim__svg .layer{transition:opacity .6s ease}
.sim__svg .iso{fill:none;stroke:#22D3EE;stroke-width:3;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;filter:drop-shadow(0 0 6px rgba(34,211,238,.9));transition:stroke-dashoffset 1.5s ease,opacity .4s}
.sim__svg[data-stage="2"] .iso,.sim__svg[data-stage="3"] .iso,.sim__svg[data-stage="4"] .iso,.sim__svg[data-stage="5"] .iso,.sim__svg[data-stage="6"] .iso{stroke-dashoffset:0;opacity:.9}
.sim__svg[data-stage="4"] .iso,.sim__svg[data-stage="5"] .iso,.sim__svg[data-stage="6"] .iso{opacity:.35}
.sim__svg #bgscene{transition:filter .9s ease,opacity .9s ease}
.sim__svg:not([data-stage="1"]) #bgscene{filter:grayscale(1) brightness(.45);opacity:.55}
.sim__svg .hud{opacity:0;transition:opacity .4s}
.sim__svg[data-stage="1"] .hud{opacity:1}
.sim__svg .scanline{opacity:0;transition:opacity .4s}
.sim__svg[data-stage="1"] .scanline,.sim__svg[data-stage="2"] .scanline,.sim__svg[data-stage="3"] .scanline{opacity:1}
.sim__svg .scanline{mix-blend-mode:screen}
.sim__svg .scanline rect{opacity:.6;animation:rd-sweep 3.4s linear infinite}
@keyframes rd-sweep{from{transform:translateX(-20px)}to{transform:translateX(820px)}}
.sim__svg .rec{animation:rd-blink 1.1s steps(1) infinite}
.sim__svg .ano{opacity:0;transition:opacity .6s}
.sim__svg[data-stage="5"] .ano,.sim__svg[data-stage="6"] .ano{opacity:1}
.sim__svg .ano-pulse{transform-box:fill-box;transform-origin:center;animation:rd-pulse 1.8s ease-in-out infinite}
@keyframes rd-pulse{0%,100%{transform:scale(.85);opacity:.75}50%{transform:scale(1.2);opacity:1}}
.sim__svg .report{opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s}
.sim__svg[data-stage="6"] .report{opacity:1;transform:none}
.sim__svg .isolab{opacity:0;transition:opacity .5s .6s}
.sim__svg[data-stage="2"] .isolab,.sim__svg[data-stage="3"] .isolab{opacity:1}

/* ---------- Flux d'ingestion ---------- */
.ingest{position:relative;border:1px solid var(--line-strong);border-radius:var(--r-lg);overflow:hidden;background:radial-gradient(120% 120% at 60% 50%,#14122b 0,#07070f 70%)}
.ingest canvas{display:block;width:100%;height:340px}
.ingest__cap{position:absolute;left:0;bottom:0;max-width:min(470px,66%);padding:26px 46px 18px 22px;background:linear-gradient(90deg,rgba(7,7,15,.94) 55%,rgba(7,7,15,0));pointer-events:none}
.ingest__cap strong{display:block;font-family:var(--font-head);font-size:clamp(1.15rem,2.4vw,1.6rem);line-height:1.15;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ingest__cap span{display:block;margin-top:6px;color:var(--muted);font-size:.88rem}
.ingest__tag{position:absolute;left:16px;top:14px;padding:5px 11px;border:1px solid rgba(34,211,238,.4);border-radius:999px;color:var(--cyan-300);font:600 .72rem ui-monospace,Menlo,monospace;text-transform:uppercase;letter-spacing:.08em;pointer-events:none}

/* ---------- Boucle d'apprentissage ---------- */
.loop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}
.loop__svg{width:100%;height:auto;max-width:460px;margin-inline:auto;display:block}
.loop__node{cursor:pointer}
.loop__node circle.n{fill:var(--surface);stroke:var(--line-strong);stroke-width:2;transition:fill .3s,stroke .3s}
.loop__node.is-on circle.n{fill:var(--violet);stroke:var(--cyan);filter:drop-shadow(0 0 10px rgba(34,211,238,.8))}
.loop__node text{fill:var(--text);font:700 14px var(--font-head,sans-serif);text-anchor:middle;dominant-baseline:central;pointer-events:none}
.loop__lab{fill:var(--muted);font:600 12px var(--font-body,sans-serif)}
.loop__node.is-on text{fill:#fff}
.loop__node.is-on + .loop__lab{fill:var(--text)}
.loop__ring{fill:none;stroke:var(--line-strong);stroke-width:2;stroke-dasharray:4 7}
.loop__sub{fill:var(--muted);font-size:12px;text-anchor:middle}
.loop__panel{min-height:210px}
.loop__panel h3{font-size:1.5rem;margin-bottom:.4em}
.loop__panel .tag{margin-bottom:12px}
.loop__cycle{font:700 1.1rem ui-monospace,Menlo,monospace;fill:var(--cyan-300);text-anchor:middle}

/* ---------- Capacités ---------- */
.skill{position:relative;padding-top:26px}
.skill .tag{position:absolute;top:18px;right:18px}
.skill svg{width:46px;height:46px;margin-bottom:14px}
.skill h3{padding-right:90px}
.tag--cyan{color:var(--cyan-300);background:rgba(34,211,238,.12);border-color:rgba(34,211,238,.4)}

/* ---------- Défis ---------- */
.chal{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.chal__n{font:700 2.2rem/1 var(--font-head);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Frise ---------- */
.tl{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:18px}
.tl::before{content:"";position:absolute;left:19px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--cyan),var(--violet),transparent)}
.tl li{position:relative;padding-left:58px}
.tl li::before{content:attr(data-n);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:2px solid var(--violet);font:700 .95rem var(--font-head);color:var(--text)}
.tl h3{margin:0 0 .25em;font-size:1.15rem}
.tl p{margin:0;color:var(--muted)}

@media (max-width:900px){
  .sim__grid{grid-template-columns:1fr}
  .sim__stage{border-right:0;border-bottom:1px solid var(--line)}
  .sim__console{min-height:0}
  .sim__console-body{max-height:200px}
  .sim__thr{margin-left:0;width:100%}
  .sim__thr input{flex:1;width:auto}
  .loop{grid-template-columns:1fr}
  .ingest__cap{max-width:70%}
  .ingest canvas{height:300px}
}
@media (prefers-reduced-motion:reduce){
  .rd-hero::after,.sim__svg .scanline rect,.sim__svg .rec,.sim__svg .ano-pulse{animation:none}
}