/* ============================================================
   oupi.com — Pages intérieures v3 (T1-F1-v2, 14/10/2026)
   Symptôme : les pages refaites le 14/10 (multimodel, rag, deep-search) étaient
   sur oupi-site.css, le gabarit de la refonte, et non sur le standard de l'accueil
   (verre liquide, paysage, icônes au trait, scènes animées).
   Mesure : les pages intérieures chargent la même feuille que l'accueil
   (home-v3.css, tout sous .h3) puis celle-ci, qui n'ajoute que leurs composants
   propres. Même palette, même verre, mêmes apparitions au défilé.
   ============================================================ */

/* ---------- Héros de page, sur le paysage ---------- */
.h3 .phero{padding:150px 0 40px;text-align:center}
.h3 .phero .wrap{display:flex;flex-direction:column;align-items:center}
.h3 .crumb{display:inline-flex;align-items:center;gap:10px;margin-bottom:26px;padding:7px 16px 7px 8px;border-radius:999px;font-size:13px;color:var(--cream-2);background:rgba(27,32,11,.38);border:1px solid var(--edge);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-decoration:none}
.h3 .crumb b{font-weight:600;color:var(--olive);background:var(--lime);border-radius:999px;padding:3px 10px;font-size:11.5px;letter-spacing:.04em}
.h3 .crumb a{color:var(--cream-2);text-decoration:none}
.h3 .crumb a:hover{color:#fff}
.h3 .phero h1{font-size:clamp(44px,6.4vw,94px);line-height:.98;letter-spacing:-.03em;text-shadow:0 2px 24px rgba(20,24,8,.45);max-width:1050px}
.h3 .phero .tagline{font-family:var(--serif);font-size:clamp(19px,1.8vw,24px);color:var(--cream);margin:20px auto 8px;text-shadow:0 2px 18px rgba(20,24,8,.5)}
.h3 .phero .lead{margin:0 auto 28px;max-width:700px;text-shadow:0 1px 14px rgba(20,24,8,.6)}
.h3 .phero .ask{width:100%}
.h3 .phero .trust{margin-top:16px}
.h3 .scape .models{padding:56px 0 30px}

/* ---------- Icônes du sprite (partials._icons) dans les listes ---------- */
.h3 .plist .pi svg{color:var(--lime)}
.h3 .lt .plist .pi svg,.h3 .lv .plist .pi svg{color:#5f7a2e;stroke:#5f7a2e}
.h3 .lt .plist .pi,.h3 .lv .plist .pi{border-top-color:rgba(27,32,11,.1)}
.h3 .lv .plist .pi b{color:#2a3018}
.h3 .lv .plist .pi small{color:#6b7160}
.h3 .ico svg{width:19px;height:19px;color:var(--lime)}
.h3 .lt .ico svg{color:#5f7a2e}

/* ---------- Section qui suit le héros (encore sur le paysage) ---------- */
.h3 .pnext{padding:110px 0 200px}

/* ---------- Lecteur de scène : les éléments [data-t] reçoivent .on ---------- */
.h3 [data-play] [data-t]{transition:opacity .45s,transform .5s var(--ease),max-height .5s var(--ease),background .4s,border-color .4s,color .4s}
.h3 .qa.solo .thr{position:absolute;left:28px;right:28px;top:62px;bottom:66px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}
.h3 .rtr.scan .c{animation:scan 1.1s infinite}
.h3 .rtr.sel .c{animation:none;opacity:.35}
.h3 .rtr.sel .c[data-pick]{opacity:1;background:#5f7a2e;border-color:#5f7a2e;color:#fff}
.h3 .rtr.sel .why{opacity:1}
.h3 .ans .img4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.h3 .ans .img4 i{height:58px;border-radius:8px;display:block}

/* ---------- Catalogue : cartes illustrées (fond clair) ---------- */
.h3 .lv .lgrid.wide{max-width:1160px}
.h3 .lc .mlist{list-style:none;margin:14px 0 0;padding:0}
.h3 .lc .mlist li{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #eef0ea;font-size:13.5px;color:#2a3018;line-height:1.3}
.h3 .lc .mlist li:first-child{border-top:0}
.h3 .lc .mlist img,.h3 .lc .mlist .mo{flex:none;width:20px;height:20px;object-fit:contain}
.h3 .lc .mlist .mo{display:grid;place-items:center;border-radius:6px;background:#1f2410;color:#c5d69a;font:600 10.5px var(--sans)}
.h3 .lc .mlist span{display:flex;flex-direction:column}
.h3 .lc .mlist small{font-size:11.5px;color:#8b917a}
.h3 .lc .mlist em{margin-left:auto;font-style:normal;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;color:#5f7a2e;background:#f1f6e6;border-radius:6px;padding:3px 7px;white-space:nowrap}
.h3 .lc.tall .tx{padding-bottom:16px}

/* illustration « texte » : des bulles qui s'écrivent */
.h3 .t-chat{position:absolute;left:calc(50% - 104px);top:20px;width:208px;display:flex;flex-direction:column;gap:7px}
.h3 .t-chat i{display:block;height:22px;border-radius:11px;background:#fff;border:1px solid #d5dac9;box-shadow:0 4px 10px rgba(27,32,11,.05);transform-origin:0 50%;animation:write 6s infinite}
.h3 .t-chat i:nth-child(1){width:62%;align-self:flex-end;background:#dfe5d1;border-color:#dfe5d1;transform-origin:100% 50%}
.h3 .t-chat i:nth-child(2){width:92%;animation-delay:.8s}
.h3 .t-chat i:nth-child(3){width:78%;animation-delay:1.3s}
.h3 .t-chat i:nth-child(4){width:54%;align-self:flex-end;background:#dfe5d1;border-color:#dfe5d1;transform-origin:100% 50%;animation-delay:2.4s}
.h3 .t-chat i:nth-child(5){width:86%;animation-delay:3.1s}
.h3 .t-chat b{position:absolute;right:-6px;top:30px;font:600 9.5px var(--sans);color:#fff;background:#5f7a2e;border-radius:999px;padding:3px 8px;animation:pop 6s .6s infinite}

/* illustration « image » : des vignettes qui apparaissent */
.h3 .i-grid{position:absolute;left:calc(50% - 100px);top:22px;width:200px;display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.h3 .i-grid i{height:60px;border-radius:8px;display:block;animation:pop 6s infinite}
.h3 .i-grid i:nth-child(1){background:linear-gradient(160deg,#2b2f52,#c9a4d8)}
.h3 .i-grid i:nth-child(2){background:linear-gradient(160deg,#5f7a2e,#e8d3a0);animation-delay:.4s}
.h3 .i-grid i:nth-child(3){background:linear-gradient(160deg,#1d2340,#7a5e72);animation-delay:.8s}
.h3 .i-grid i:nth-child(4){background:linear-gradient(160deg,#c9a4d8,#f4ecd0);animation-delay:1.2s}
.h3 .i-grid i:nth-child(5){background:linear-gradient(160deg,#a9c07a,#1f2410);animation-delay:1.6s}
.h3 .i-grid i:nth-child(6){background:linear-gradient(160deg,#e8c98a,#7a5e72);animation-delay:2s}

/* illustration « vidéo, voix, code » : un montage et une onde */
.h3 .v-wv{position:absolute;left:calc(50% - 104px);top:150px;width:208px;height:20px;display:flex;align-items:center;gap:2px}
.h3 .v-wv i{flex:1;background:#a9c07a;border-radius:2px;height:30%;animation:wv .7s ease-in-out infinite alternate}
.h3 .v-wv i:nth-child(3n){animation-delay:.2s}
.h3 .v-wv i:nth-child(4n){animation-delay:.35s}
.h3 .v-wv i:nth-child(5n+1){animation-delay:.1s}
.h3 .lc .il.t196{height:196px}

/* ---------- Section sombre à flux de particules (comme « Sous le capot ») ---------- */
.h3 .fluxsec{position:relative;overflow:hidden;background:#12160a;padding:150px 0}
.h3 .fluxsec .flux{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.h3 .fluxsec .wrap{position:relative;z-index:1}
.h3 .fluxsec .glass{background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.03) 42%,rgba(255,255,255,.05));backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%)}
.h3 .fluxsec .rv:first-child{text-shadow:0 2px 30px rgba(18,22,10,.9)}
.h3 .card .ico{margin-bottom:4px}

/* jauges : sans sélection / avec sélection */
.h3 .gz{display:grid;gap:14px;margin-top:8px}
.h3 .gz div{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center;font-size:13px;color:var(--cream-2)}
.h3 .gz i{display:block;height:8px;border-radius:5px;background:rgba(255,255,255,.1);position:relative;overflow:hidden}
.h3 .gz i::after{content:"";position:absolute;inset:0;transform-origin:0 0;transform:scaleX(0);transition:transform 1.4s var(--ease) .3s;background:#e8b07a}
.h3 .gz .ok i::after{background:var(--lime)}
.h3 .rv.in .gz i::after{transform:scaleX(var(--w,1))}
.h3 .rt3{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}

/* ---------- Cartes à icône (glass) en grille ---------- */
.h3 .tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:44px}
.h3 .tiles.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.h3 .tile{padding:24px;display:flex;flex-direction:column;gap:10px;min-height:210px}
.h3 .tile h3{font-size:23px;line-height:1.15}
.h3 .tile p{margin:0;font-size:14.5px;color:var(--muted);flex:1}
.h3 .tile .go{font-size:13.5px;font-weight:600;color:var(--lime);text-decoration:none}
.h3 .lt .tile .go{color:#5f7a2e}
.h3 .tile .go:hover{color:#fff}
.h3 .lt .tile .go:hover{color:#1b200b}
.h3 .snip{margin-top:4px;border-radius:12px;background:#13170d;color:#cfe3b4;font:11.5px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;padding:12px 14px;white-space:pre;overflow:hidden}
.h3 .snip .k{color:#c5d69a}
.h3 .snip .s{color:#f0b9a0}
.h3 .snip .d{color:#7d8a6a}
.h3 .mini-logos{display:flex;gap:6px;flex-wrap:wrap}
.h3 .mini-logos span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#FAFAF7}

/* ---------- Liens vers les autres pages (fond clair) ---------- */
.h3 .links3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:40px}
.h3 .links3 a{display:flex;align-items:center;gap:14px;padding:16px 18px;text-decoration:none;color:var(--cream)}
.h3 .links3 a b{display:block;font-weight:600;font-size:15px}
.h3 .links3 a small{display:block;font-size:13px;color:var(--muted)}
.h3 .links3 a .ar{margin-left:auto;color:#5f7a2e;transition:transform .3s var(--ease)}
.h3 .links3 a:hover .ar{transform:translateX(4px)}
.h3 .nextp{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;margin-top:22px;padding:26px 28px;text-decoration:none;color:var(--cream)}
.h3 .nextp .k{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:#5f7a2e;text-transform:uppercase}
.h3 .nextp h3{font-size:30px;margin:4px 0 4px}
.h3 .nextp p{margin:0;color:var(--muted);font-size:15px}
.h3 .nextp .bt{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#1b200b;color:#c5d69a;transition:transform .3s var(--ease)}
.h3 .nextp:hover .bt{transform:translateX(4px)}
.h3 .nextp .bt svg,.h3 .links3 svg{width:20px;height:20px}

/* ---------- Mobile ---------- */
@media (max-width:1060px){
.h3 .tiles,.h3 .tiles.c3,.h3 .links3{grid-template-columns:1fr 1fr}
.h3 .pnext{padding:90px 0 160px}
}
@media (max-width:620px){
.h3 .phero{padding:120px 0 30px}
.h3 .tiles,.h3 .tiles.c3,.h3 .links3{grid-template-columns:1fr}
.h3 .gz div{grid-template-columns:1fr}
.h3 .nextp{grid-template-columns:1fr;gap:12px}
.h3 .nextp .ico{display:none}
.h3 .fluxsec{padding:100px 0}
}
@media (prefers-reduced-motion:reduce){
.h3 .t-chat i,.h3 .i-grid i,.h3 .v-wv i,.h3 .t-chat b{animation:none!important}
}
.h3 .mq-mo{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#1f2410;color:#c5d69a;font:600 11px var(--sans)}
.h3 .card.diag .row{margin:8px 0}
.h3 .card.diag .q{color:var(--cream)}
.h3 .final h2{line-height:1.04}
@media (max-width:620px){
.h3 .card.diag .row{flex-wrap:wrap;gap:6px}
.h3 .card.diag .line{display:none}
.h3 .phero .lead{color:var(--cream-2)}
}

/* ---------- Bande de logos (sprite integrations.svg) sous le héros ---------- */
.h3 .lstrip{padding:50px 0 24px;overflow:hidden}
.h3 .lstrip .t{text-align:center;font-size:13px;color:var(--muted);letter-spacing:.06em;margin-bottom:16px}
.h3 .lstrip .ig-wall{max-width:1100px;margin:0 auto}
.h3 .lstrip .ig-track{animation-duration:40s}
.h3 .lg.static{animation:none}

/* ---------- Scène RAG : documents → passages → réponse citée ---------- */
.h3 .rg{position:absolute;left:0;right:0;top:50px;bottom:0}
.h3 .rg-docs{position:absolute;left:22px;top:18px;width:236px;display:flex;flex-direction:column;gap:10px}
.h3 .rd{position:relative;background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:10px 12px 12px;overflow:hidden;transition:border-color .4s,box-shadow .4s}
.h3 .rd .nm{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:#2a3018;margin-bottom:8px}
.h3 .rd .nm svg{width:14px;height:14px;color:#5f7a2e}
.h3 .rd .nm small{margin-left:auto;font:10px ui-monospace,Menlo,monospace;color:#9aa19c;font-weight:400}
.h3 .rd i{display:block;height:5px;border-radius:3px;background:#e4e7dd;margin-top:6px}
.h3 .rd i.w8{width:82%}.h3 .rd i.w6{width:64%}.h3 .rd i.w9{width:93%}
.h3 .rd u{display:block;height:14px;border-radius:4px;background:#eef0ea;margin-top:6px;transition:background .5s,box-shadow .5s}
.h3 .rd u.on{background:#d9e7b4;box-shadow:inset 3px 0 0 #5f7a2e}
.h3 .rd .sw{position:absolute;left:0;right:0;top:-30px;height:26px;background:linear-gradient(180deg,transparent,rgba(169,192,122,.28),transparent);opacity:0}
.h3 .rd .sw.on{animation:rgsweep 1.6s var(--ease) 1}
@keyframes rgsweep{0%{top:-30px;opacity:1}100%{top:110%;opacity:1}}
.h3 .rd.hit{border-color:#a9c07a;box-shadow:0 0 0 3px rgba(169,192,122,.18)}
.h3 .rg-thr{position:absolute;left:278px;right:22px;top:18px;bottom:66px;display:flex;flex-direction:column;gap:10px}
.h3 .rg-thr .qq p{max-width:300px}
.h3 .rg-st{display:flex;align-items:center;gap:8px;font:10.5px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:#5f7a2e}
.h3 .rg-st b{width:8px;height:8px;border-radius:50%;background:#5f7a2e;animation:pulse 1.4s infinite}
.h3 .ans .cite.n{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;margin:0 2px;border-radius:5px;font-size:10px;font-weight:600;vertical-align:1px;opacity:0;transform:scale(.6);transition:all .35s var(--ease)}
.h3 .ans .cite.n.on{opacity:1;transform:none}
.h3 .ans .srcs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.h3 .ans .srcs .cite{margin:0;opacity:0;transform:translateY(4px);transition:all .4s var(--ease)}
.h3 .ans .srcs .cite.on{opacity:1;transform:none}
.h3 .rg .comp{left:278px}

/* ---------- Comparatif (deux colonnes, sans total) ---------- */
.h3 .cmp.plain li span:last-child{color:var(--lime)}
.h3 .cmp.plain .no li span:last-child{color:#e8b07a}
.h3 .lt .cmp.plain li span:last-child{color:#5f7a2e}
.h3 .lt .cmp.plain .no li span:last-child{color:#b5683a}
.h3 .cmp.plain li{gap:14px}

/* ---------- Cartes à liste (b2 du bento) ---------- */
.h3 .card ul.ck{list-style:none;margin:4px 0 0;padding:0;font-size:14px;color:var(--cream-2)}
.h3 .card ul.ck li{position:relative;padding:5px 0 5px 22px}
.h3 .card ul.ck li::before{content:"";position:absolute;left:2px;top:12px;width:9px;height:5px;border-left:1.6px solid var(--lime);border-bottom:1.6px solid var(--lime);transform:rotate(-45deg)}

/* illustration « marque » : nuancier et typographie */
.h3 .b-kit{position:absolute;left:calc(50% - 104px);top:24px;width:208px;height:126px;background:#fff;border:1px solid #e2e5da;border-radius:8px;padding:14px}
.h3 .b-kit .sw4{display:flex;gap:6px}
.h3 .b-kit .sw4 i{width:30px;height:30px;border-radius:50%;animation:pop 6s infinite}
.h3 .b-kit .sw4 i:nth-child(2){animation-delay:.3s}.h3 .b-kit .sw4 i:nth-child(3){animation-delay:.6s}.h3 .b-kit .sw4 i:nth-child(4){animation-delay:.9s}
.h3 .b-kit b{display:block;margin-top:14px;font:400 26px/1 var(--serif);color:#2a3018;animation:pop 6s 1.2s infinite}
.h3 .b-kit small{display:block;margin-top:6px;font:10px ui-monospace,Menlo,monospace;color:#8b917a;letter-spacing:.08em;animation:pop 6s 1.5s infinite}

/* ---------- Scène Deep Search : huit familles de sources convergent vers le rapport ---------- */
.h3 .ds{position:relative;width:620px;height:460px;font-family:var(--sans)}
.h3 .ds svg.net{position:absolute;inset:0;overflow:visible}
.h3 .ds .ring{fill:none;stroke:rgba(197,214,154,.14);stroke-dasharray:2 7;transform-origin:310px 215px;animation:spin 50s linear infinite}
.h3 .ds .dl{stroke:rgba(197,214,154,.22);stroke-width:1}
.h3 .ds .pk{fill:#eaf3cf;filter:drop-shadow(0 0 4px #c5d69a)}
.h3 .dn{position:absolute;transform:translate(-50%,-50%);min-width:112px;padding:8px 12px;border-radius:12px;text-align:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#e8ead9;transition:all .45s var(--ease)}
.h3 .dn b{display:block;font-size:12.5px;font-weight:600}
.h3 .dn small{display:block;font:10px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:var(--dim);margin-top:2px;transition:color .4s}
.h3 .dn.on{background:#c5d69a;border-color:#c5d69a;color:#1b200b;box-shadow:0 0 0 6px rgba(197,214,154,.12),0 0 30px rgba(197,214,154,.3)}
.h3 .dn.on small{color:#3f4632}
.h3 .dcore{position:absolute;left:310px;top:215px;width:112px;height:112px;margin:-56px;border-radius:50%;background:var(--olive);border:2px solid var(--lime);display:grid;place-items:center;text-align:center;box-shadow:0 0 0 14px rgba(197,214,154,.07),0 0 70px rgba(197,214,154,.3);animation:core 3s ease-in-out infinite}
.h3 .dcore b{display:block;font:400 22px var(--serif);color:var(--cream)}
.h3 .dcore small{display:block;font:9.5px ui-monospace,Menlo,monospace;letter-spacing:.14em;color:var(--lime);transition:opacity .25s}
.h3 .drep{position:absolute;left:310px;top:215px;width:300px;transform:translate(-50%,-50%) scale(.85);opacity:0;background:#fff;color:#1b200b;border-radius:16px;padding:16px 18px;box-shadow:0 30px 70px rgba(0,0,0,.45);transition:opacity .5s,transform .6s var(--ease);pointer-events:none}
.h3 .drep.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.h3 .drep .h{display:flex;align-items:center;gap:8px;font:600 13px var(--sans);margin-bottom:10px}
.h3 .drep .h svg{width:15px;height:15px;color:#5f7a2e}
.h3 .drep .h small{margin-left:auto;font:10px ui-monospace,Menlo,monospace;color:#8b917a;font-weight:400}
.h3 .drep i{display:block;height:5px;border-radius:3px;background:#e4e7dd;margin-top:7px}
.h3 .drep .cs{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.h3 .drep .cs span{font-size:10.5px;background:#f1f6e6;border:1px solid #cfe0b8;border-radius:6px;padding:2px 7px;color:#4a5f22}
.h3 .dsc{position:absolute;right:14px;top:10px;font:10.5px ui-monospace,Menlo,monospace;color:var(--dim);text-align:right;line-height:1.6}
.h3 .dsc b{color:var(--cream-2);font-weight:500;transition:opacity .2s}

/* ---------- Bande de sources (pastilles texte) ---------- */
.h3 .lg .dt{width:8px;height:8px;border-radius:50%;background:#5f7a2e;flex:none}

/* ---------- Grille des familles de sources ---------- */
.h3 .srcgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:44px}
.h3 .srcgrid .glass{padding:22px;display:flex;flex-direction:column;gap:10px}
.h3 .srcgrid .hd{display:flex;align-items:center;gap:10px}
.h3 .srcgrid .hd .ico{width:34px;height:34px;border-radius:10px}
.h3 .srcgrid h3{font-size:21px}
.h3 .srcgrid .n{margin-left:auto;font:11px ui-monospace,Menlo,monospace;color:var(--lime);border:1px solid rgba(197,214,154,.4);border-radius:999px;padding:3px 9px}
.h3 .srcgrid .sl{display:flex;flex-wrap:wrap;gap:6px}
.h3 .srcgrid .sl span{font-size:12.5px;color:var(--cream-2);background:rgba(255,255,255,.06);border:1px solid var(--edge);border-radius:8px;padding:4px 9px}
.h3 .srcgrid .sl span.k{border-style:dashed;color:var(--muted)}
.h3 .srcgrid .sl span.k::after{content:" · votre clé";color:#e8c98a;font-size:11px}
.h3 .keynote{display:flex;align-items:center;gap:10px;margin-top:18px;font-size:13.5px;color:var(--muted)}
.h3 .keynote span{border:1px dashed var(--edge-2);border-radius:8px;padding:3px 9px;color:#e8c98a;font-size:12px}

/* illustration « Live » : résultats qui tombent */
.h3 .l-res{position:absolute;left:calc(50% - 104px);top:20px;width:208px;display:flex;flex-direction:column;gap:7px}
.h3 .l-res .sb{height:24px;border-radius:12px;background:#fff;border:1px solid #d5dac9;display:flex;align-items:center;padding:0 10px;gap:6px}
.h3 .l-res .sb i{width:60%;height:5px;border-radius:3px;background:#c1c6b6;transform-origin:0 0;animation:write 5s infinite}
.h3 .l-res .sb b{margin-left:auto;width:8px;height:8px;border-radius:50%;background:#5f7a2e;animation:pulse 1.4s infinite}
.h3 .l-res u{display:flex;gap:6px;align-items:center;height:22px;border-radius:7px;background:#fff;border:1px solid #e2e5da;padding:0 8px;animation:pop 5s infinite}
.h3 .l-res u::before{content:"";width:6px;height:6px;border-radius:50%;background:#a9c07a}
.h3 .l-res u::after{content:"";height:4px;border-radius:2px;background:#dfe2d8;flex:1}
.h3 .l-res u:nth-of-type(2){animation-delay:.4s}.h3 .l-res u:nth-of-type(3){animation-delay:.8s}.h3 .l-res u:nth-of-type(4){animation-delay:1.2s}

@media (max-width:1060px){.h3 .srcgrid{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.h3 .srcgrid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.h3 .l-res *{animation:none!important}}

/* ============================================================
   T1-F2 (14/10/2026) — workflow, agent, skills
   ============================================================ */
.h3 .lgrid.c2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1000px}
.h3 .lc .steps{list-style:none;margin:14px 0 0;padding:0;counter-reset:st}
.h3 .lc .steps li{position:relative;display:flex;gap:10px;padding:7px 0;border-top:1px solid #eef0ea;font-size:13.5px;color:#2a3018;line-height:1.4;counter-increment:st}
.h3 .lc .steps li:first-child{border-top:0}
.h3 .lc .steps li::before{content:counter(st);flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:#f1f6e6;color:#5f7a2e;font:600 10.5px var(--sans)}
.h3 .lc .steps b{font-weight:600;color:#5f7a2e}
.h3 .lc .when{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font:11px ui-monospace,Menlo,monospace;letter-spacing:.04em;color:#4a5f22;background:#f1f6e6;border:1px solid #cfe0b8;border-radius:7px;padding:4px 9px}

/* illustration « courrier » */
.h3 .m-env{position:absolute;left:calc(50% - 100px);top:26px;width:200px;height:118px;background:#fff;border:1px solid #e2e5da;border-radius:8px;padding:12px 14px}
.h3 .m-env .hd{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.h3 .m-env .hd b{width:20px;height:20px;border-radius:50%;background:#1f2410}
.h3 .m-env .hd i{height:5px;width:80px;border-radius:3px;background:#a6ab9c}
.h3 .m-env u{display:block;height:5px;border-radius:3px;background:#dfe2d8;margin-top:7px;transform-origin:0 0;animation:write 6s infinite}
.h3 .m-env u:nth-of-type(2){width:86%;animation-delay:.4s}.h3 .m-env u:nth-of-type(3){width:92%;animation-delay:.7s}.h3 .m-env u:nth-of-type(4){width:60%;animation-delay:1s}
.h3 .m-env .snd{position:absolute;right:10px;bottom:10px;font:600 9.5px var(--sans);color:#fff;background:#5f7a2e;border-radius:999px;padding:3px 9px;animation:pop 6s 1.6s infinite}

/* ---------- Scène « conception d'un workflow » ---------- */
.h3 .wf{position:absolute;left:0;right:0;top:50px;bottom:0;padding:18px 24px}
.h3 .wf .qq{margin-bottom:12px}
.h3 .wf .qq p{max-width:470px}
.h3 .wfc{background:#fff;border:1px solid #e4e6e1;border-radius:16px;overflow:hidden}
.h3 .wfc .hd{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #eef0ea;font-size:13.5px;font-weight:600}
.h3 .wfc .hd svg{width:16px;height:16px;color:#5f7a2e}
.h3 .wfc .hd .st{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace;font-weight:400;color:#8a917a;border:1px solid #e4e6e1;border-radius:7px;padding:3px 8px;transition:all .4s}
.h3 .wfc .hd .st.live{color:#fff;background:#5f7a2e;border-color:#5f7a2e}
.h3 .wfr{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;padding:10px 16px;border-top:1px solid #f1f2ed;font-size:12.5px;line-height:1.45;color:#2c3226}
.h3 .wfr:first-of-type{border-top:0}
.h3 .wfr>span:first-child{font:10px ui-monospace,Menlo,monospace;letter-spacing:.1em;color:#5f7a2e;text-transform:uppercase}
.h3 .wfr .tl3{display:flex;flex-wrap:wrap;gap:5px}
.h3 .wfr .tl3 em{font-style:normal;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;border:1px solid #dfe2d6;background:#f6f7f2;border-radius:7px;padding:2px 8px}
.h3 .wfr .ok{display:inline-flex;align-items:center;gap:6px;color:#4a5f22;font-weight:600}
.h3 .wfr .ok::before{content:"";width:8px;height:8px;border-radius:50%;background:#5f7a2e}
.h3 .wf .it.on{max-height:120px}
.h3 .wf .tg2{display:flex;align-items:center;gap:10px;margin-top:12px;justify-content:flex-end;font-size:12.5px;color:#5c635e}
.h3 .wf .tg2 .tog{background:#d5dac9;transition:background .4s}
.h3 .wf .tg2 .tog::after{right:auto;left:3px;transition:left .4s var(--ease)}
.h3 .wf .tg2.on .tog{background:#5f7a2e}
.h3 .wf .tg2.on .tog::after{left:21px;background:#fff}

/* ---------- Journal des exécutions (carte claire sur fond sombre) ---------- */
.h3 .mail .li .rs{margin-left:auto;flex:none;font-size:11.5px;font-weight:600;border-radius:999px;padding:2px 9px;background:#f1f6e6;color:#4a5f22}
.h3 .mail .li .rs.w{background:#fbf1e3;color:#8a5a1c}
.h3 .mail .li{align-items:center}
.h3 .mail .li b{width:118px}

/* ---------- Scène « mission » (agent) ---------- */
.h3 .ag{position:absolute;left:0;right:0;top:50px;bottom:0;padding:18px 24px;display:flex;flex-direction:column;gap:10px}
.h3 .ag .mt{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}
.h3 .ag .mt small{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace;font-weight:400;color:#8a917a}
.h3 .agp{background:#fff;border:1px solid #e4e6e1;border-radius:14px;padding:6px 14px}
.h3 .agp .r{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #f1f2ed;font-size:12.5px;color:#9aa19c;transition:color .4s}
.h3 .agp .r:first-child{border-top:0}
.h3 .agp .r i{flex:none;width:10px;height:10px;border-radius:50%;border:1.5px solid #c9cfbd;transition:all .4s}
.h3 .agp .r small{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace;color:#b2b8a6}
.h3 .agp .r.on{color:#2c3226}
.h3 .agp .r.on i{border-color:#e8b07a;background:#e8b07a;animation:pulse 1.4s infinite}
.h3 .agp .r.fin{color:#2c3226}
.h3 .agp .r.fin i{border-color:#5f7a2e;background:#5f7a2e;animation:none}
.h3 .agp .r.fin small{color:#5f7a2e}
.h3 .agl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.h3 .agl div{background:#fff;border:1px solid #e9ebe4;border-radius:11px;padding:8px 10px;font-size:11.5px;font-weight:600;color:#2a3018}
.h3 .agl small{display:block;font-size:10px;font-weight:500;color:#9aa19c;margin-bottom:6px}
.h3 .agl u{display:block;height:4px;border-radius:3px;background:#eef0ea;position:relative;overflow:hidden}
.h3 .agl u::after{content:"";position:absolute;inset:0;background:#5f7a2e;transform-origin:0 0;transform:scaleX(0);transition:transform 2.2s var(--ease)}
.h3 .agl u.on::after{transform:scaleX(1)}
.h3 .ag .ask2{display:flex;align-items:center;gap:10px;background:#1b200b;color:#f5f0e8;border-radius:12px;padding:10px 14px;font-size:12.5px}
.h3 .ag .ask2 span{margin-left:auto;display:flex;gap:6px}
.h3 .ag .ask2 em{font-style:normal;font-size:11.5px;font-weight:600;border-radius:8px;padding:4px 10px;background:#c5d69a;color:#1b200b}
.h3 .ag .ask2 em+em{background:transparent;color:#f5f0e8;border:1px solid rgba(255,255,255,.25)}
.h3 .ag .it.on{max-height:200px}

/* ---------- Terminal OupiBox (sombre) ---------- */
.h3 .term{border-radius:18px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1)}
.h3 .term .ub{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#232a12}
.h3 .term .ub i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.h3 .term .ub span{margin-left:10px;font:11px ui-monospace,Menlo,monospace;color:var(--dim)}
.h3 .term .ed{border-radius:0;min-height:300px;padding:16px 0}
.h3 .term .ed .ok{color:#a9c07a}

/* ---------- Scène « skill » ---------- */
.h3 .sk{position:absolute;left:0;right:0;top:50px;bottom:0;padding:16px 22px;display:grid;grid-template-columns:268px 1fr;gap:16px}
.h3 .sk .ed{padding:12px 0;font-size:11px}
.h3 .sk .ed .h{color:#c5d69a;font-weight:700}
.h3 .sk .ed .m{color:#7d8a6a}
.h3 .ska{display:flex;flex-direction:column;gap:8px}
.h3 .ska .t{font:10px ui-monospace,Menlo,monospace;letter-spacing:.12em;color:#5f7a2e;margin-bottom:2px}
.h3 .ska .r{background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:10px 12px;font-size:12px;color:#5c635e;transition:all .4s var(--ease)}
.h3 .ska .r b{display:block;font-size:12.5px;color:#2a3018;font-weight:600;margin-bottom:5px}
.h3 .ska .r span{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#9aa19c;border:1px dashed #d5dac9;border-radius:7px;padding:2px 8px;transition:all .4s}
.h3 .ska .r.on{border-color:#a9c07a;box-shadow:0 0 0 3px rgba(169,192,122,.18)}
.h3 .ska .r.on span{color:#fff;background:#5f7a2e;border:1px solid #5f7a2e}

/* illustration « code » (claire) */
.h3 .c-ed{position:absolute;left:calc(50% - 104px);top:22px;width:208px;height:126px;background:#1e2310;border-radius:8px;padding:12px 12px;display:flex;flex-direction:column;gap:7px}
.h3 .c-ed i{display:block;height:5px;border-radius:3px;background:#3e4a24;transform-origin:0 0;animation:write 6s infinite}
.h3 .c-ed i:nth-child(1){width:46%;background:#c5d69a}.h3 .c-ed i:nth-child(2){width:78%;margin-left:12px;animation-delay:.3s}
.h3 .c-ed i:nth-child(3){width:64%;margin-left:12px;animation-delay:.6s;background:#e8c98a}.h3 .c-ed i:nth-child(4){width:70%;margin-left:24px;animation-delay:.9s}
.h3 .c-ed i:nth-child(5){width:40%;margin-left:12px;animation-delay:1.2s}.h3 .c-ed i:nth-child(6){width:30%;animation-delay:1.5s;background:#c5d69a}
.h3 .c-ed b{position:absolute;right:10px;bottom:10px;font:600 9.5px var(--sans);color:#1b200b;background:#c5d69a;border-radius:999px;padding:3px 9px;animation:pop 6s 1.8s infinite}

@media (max-width:1060px){.h3 .lgrid.c2{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.h3 .lgrid.c2{grid-template-columns:1fr}.h3 .mail .li{flex-wrap:wrap}.h3 .mail .li .rs{margin-left:0}}
@media (prefers-reduced-motion:reduce){.h3 .m-env *,.h3 .c-ed *{animation:none!important}}
.h3 .wf .wfc.it.on{max-height:420px}
.h3 .sk .ed .ln2{white-space:normal;padding-left:34px;text-indent:-20px}
.h3 .rts .rt{flex-wrap:nowrap}

/* ============================================================
   T1-F3 (14/10/2026) — famille Création
   ============================================================ */
/* scène générique : zone sous la barre de la maquette */
.h3 .scn{position:absolute;left:0;right:0;top:50px;bottom:0;padding:16px 22px;display:flex;flex-direction:column;gap:10px}
.h3 .scn .it.on{max-height:320px}
.h3 .scn .qq p{max-width:470px}

/* livrables (Studio) */
.h3 .fls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.h3 .fl{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:10px 12px;font-size:12.5px;font-weight:600;color:#2a3018}
.h3 .fl small{display:block;font-size:10.5px;font-weight:500;color:#9aa19c}
.h3 .fl .ft{flex:none;width:30px;height:36px;border-radius:6px;display:grid;place-items:center;font:700 9px var(--sans);color:#fff}
.h3 .fl .ft.w{background:#2f5ea8}.h3 .fl .ft.p{background:#c4512c}.h3 .fl .ft.x{background:#2f7d4d}.h3 .fl .ft.d{background:#b13d3d}.h3 .fl .ft.i{background:#7a5e9e}

/* Creative Suite : brief → affiche */
.h3 .csb{display:grid;grid-template-columns:230px 1fr;gap:14px;flex:1;min-height:0}
.h3 .csb .side{display:flex;flex-direction:column;gap:8px}
.h3 .csb .chq{background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:9px 11px;font-size:11px;color:#6b7266}
.h3 .csb .chq b{display:block;font-size:11.5px;color:#2a3018;margin-bottom:6px}
.h3 .csb .chq span{display:inline-block;font-size:10.5px;border:1px solid #dfe2d6;border-radius:7px;padding:2px 7px;margin:0 3px 3px 0;transition:all .3s}
.h3 .csb .chq span.on{background:#5f7a2e;border-color:#5f7a2e;color:#fff}
.h3 .cvs{position:relative;border-radius:14px;background:#eceee7;background-image:radial-gradient(#d5d9cc 1px,transparent 1px);background-size:14px 14px;display:grid;place-items:center;overflow:hidden}
.h3 .pst{position:relative;width:210px;height:290px;border-radius:6px;background:#f3ece0;box-shadow:0 14px 30px rgba(27,32,11,.18);overflow:hidden;opacity:0;transform:scale(.94);transition:opacity .5s,transform .6s var(--ease)}
.h3 .pst.on{opacity:1;transform:none}
.h3 .pst .pz{position:absolute;left:14px;right:14px;top:14px;height:150px;border-radius:4px;background:#ddd5c4;overflow:hidden}
.h3 .pst .pz::after{content:"";position:absolute;inset:0;background:radial-gradient(40px 40px at 70% 35%,#f4e6c0,transparent 70%),linear-gradient(170deg,#c7a77a,#7a5a3a 70%,#3f2e1e);opacity:0;transition:opacity .8s}
.h3 .pst .pz.on::after{opacity:1}
.h3 .pst .pz.sel{outline:2px dashed #5f7a2e;outline-offset:3px}
.h3 .pst .t1{position:absolute;left:14px;top:176px;font:400 26px/1 var(--serif);color:#2a1f12;opacity:0;transition:opacity .5s}
.h3 .pst .t2{position:absolute;left:14px;top:210px;width:150px;height:5px;border-radius:3px;background:#b5a68e;opacity:0;transition:opacity .5s}
.h3 .pst .t3{position:absolute;left:14px;top:222px;width:110px;height:5px;border-radius:3px;background:#cfc3ae;opacity:0;transition:opacity .5s}
.h3 .pst .cta{position:absolute;left:14px;bottom:16px;padding:5px 12px;border-radius:999px;background:#5f7a2e;color:#fff;font:600 10px var(--sans);opacity:0;transition:opacity .5s}
.h3 .pst .lg2{position:absolute;right:14px;bottom:16px;width:22px;height:22px;border-radius:50%;background:#1b200b;opacity:0;transition:opacity .5s}
.h3 .pst .t1.on,.h3 .pst .t2.on,.h3 .pst .t3.on,.h3 .pst .cta.on,.h3 .pst .lg2.on{opacity:1}
.h3 .cvs .tb{position:absolute;top:10px;right:10px;display:flex;gap:6px}
.h3 .cvs .tb span{font:600 10.5px var(--sans);background:#fff;border:1px solid #dfe2d6;border-radius:8px;padding:4px 9px;color:#2a3018;opacity:0;transform:translateY(-4px);transition:all .35s}
.h3 .cvs .tb span.on{opacity:1;transform:none}
.h3 .cvs .tb span.hot{background:#1b200b;color:#f5f0e8;border-color:#1b200b}
.h3 .exp{display:flex;gap:6px;justify-content:flex-end}
.h3 .exp span{font:600 10.5px ui-monospace,Menlo,monospace;border-radius:7px;padding:4px 9px;background:#f1f6e6;color:#4a5f22;border:1px solid #cfe0b8}

/* Image : versions */
.h3 .imv{display:grid;grid-template-columns:1fr 150px;gap:14px;flex:1;min-height:0}
.h3 .imv .big{position:relative;border-radius:14px;overflow:hidden;background:linear-gradient(165deg,#9fb0c4,#5a6a7e 60%,#2d3646)}
.h3 .imv .big::before{content:"";position:absolute;left:28%;top:30%;width:44%;height:52%;border-radius:12px 12px 6px 6px;background:linear-gradient(170deg,#e9dcc5,#b49b77);box-shadow:0 18px 30px rgba(0,0,0,.25)}
.h3 .imv .big::after{content:"";position:absolute;inset:0;background:radial-gradient(120px 90px at 72% 22%,rgba(255,240,205,.85),transparent 70%),linear-gradient(170deg,#efe5d2,#cbb994 65%,#9c8762);opacity:0;transition:opacity 1s}
.h3 .imv .big.on::after{opacity:1}
.h3 .imv .big .obj{position:absolute;left:12%;bottom:12%;width:16%;height:26%;border-radius:40% 40% 8px 8px;background:#3a3f2a;transition:opacity .8s;z-index:2}
.h3 .imv .big .obj.on{opacity:0}
.h3 .imv .big b{position:absolute;left:28%;top:30%;width:44%;height:52%;border-radius:12px 12px 6px 6px;background:linear-gradient(170deg,#f2e8d6,#c4ab84);z-index:1;box-shadow:0 18px 30px rgba(0,0,0,.2)}
.h3 .imv .big .vt{position:absolute;left:12px;bottom:12px;z-index:3;font:600 10.5px var(--sans);background:rgba(255,255,255,.9);border-radius:7px;padding:3px 8px;color:#2a3018}
.h3 .vtree{display:flex;flex-direction:column;gap:8px}
.h3 .vtree .v{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e4e6e1;border-radius:10px;padding:6px 8px;font-size:11px;color:#5c635e;opacity:0;transform:translateX(8px);transition:all .4s var(--ease)}
.h3 .vtree .v.on{opacity:1;transform:none}
.h3 .vtree .v i{flex:none;width:30px;height:30px;border-radius:6px}
.h3 .vtree .v.cur{border-color:#a9c07a;box-shadow:0 0 0 3px rgba(169,192,122,.18)}
.h3 .vtree .free{font:10px ui-monospace,Menlo,monospace;color:#5f7a2e;text-align:center}

/* Vidéo : plans, pistes, livrables */
.h3 .vdo{display:flex;flex-direction:column;gap:8px}
.h3 .shots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.h3 .shots i{height:64px;border-radius:8px;opacity:0;transform:scale(.9);transition:all .45s var(--ease);position:relative}
.h3 .shots i.on{opacity:1;transform:none}
.h3 .shots i::after{content:attr(data-n);position:absolute;left:6px;bottom:5px;font:600 9px ui-monospace,Menlo,monospace;color:rgba(255,255,255,.85)}
.h3 .trk{display:grid;grid-template-columns:70px 1fr;gap:8px;align-items:center;font-size:11px;font-weight:600;color:#2a3018}
.h3 .trk .bar{height:14px;border-radius:5px;background:#eef0ea;position:relative;overflow:hidden}
.h3 .trk .bar::after{content:"";position:absolute;inset:0;transform-origin:0 0;transform:scaleX(0);transition:transform 1.6s var(--ease);background:var(--c,#5f7a2e)}
.h3 .trk .bar.on::after{transform:scaleX(1)}
.h3 .dlv{display:flex;gap:8px;align-items:flex-end;justify-content:center;margin-top:4px}
.h3 .dlv span{display:grid;place-items:center;border-radius:6px;background:#1b200b;color:#c5d69a;font:600 9.5px var(--sans);opacity:0;transform:translateY(6px);transition:all .4s var(--ease)}
.h3 .dlv span.on{opacity:1;transform:none}
.h3 .dlv .r169{width:96px;height:54px}.h3 .dlv .r916{width:34px;height:60px}.h3 .dlv .r11{width:52px;height:52px}
.h3 .dlv .srt{width:auto;height:auto;padding:5px 9px;background:#f1f6e6;color:#4a5f22;border:1px solid #cfe0b8}

/* Réunions : transcription en direct */
.h3 .mt2{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600}
.h3 .mt2 .rec{width:8px;height:8px;border-radius:50%;background:#d04b3c;animation:pulse 1.4s infinite}
.h3 .mt2 small{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace;font-weight:400;color:#8a917a}
.h3 .tl2{display:flex;flex-direction:column;gap:6px}
.h3 .tl2 .l{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid #eceee8;border-radius:10px;padding:8px 10px;font-size:12px;line-height:1.45;color:#2c3226}
.h3 .tl2 .av{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:600 9px var(--sans);color:#fff}
.h3 .tl2 .l b{display:block;font-size:11px;color:#5f7a2e}
.h3 .scn .sumbox{margin:0}
.h3 .sumbox .ac{display:flex;gap:8px;font-size:12px;padding:3px 0;color:#2c3226}
.h3 .sumbox .ac em{font-style:normal;font-weight:600;color:#4a5f22;min-width:58px}

/* Réseaux sociaux : posts de la semaine */
.h3 .sps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.h3 .sp{background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:9px;font-size:11px;color:#5c635e;opacity:0;transform:translateY(8px);transition:all .45s var(--ease)}
.h3 .sp.on{opacity:1;transform:none}
.h3 .sp .h{display:flex;align-items:center;gap:6px;font-weight:600;color:#2a3018;margin-bottom:7px}
.h3 .sp .h .pd{width:16px;height:16px;border-radius:4px;display:grid;place-items:center;color:#fff;font:700 8px var(--sans)}
.h3 .sp .vis{height:62px;border-radius:7px;margin-bottom:7px}
.h3 .sp i{display:block;height:4px;border-radius:2px;background:#e4e7dd;margin-top:5px}
.h3 .sp .when{display:block;margin-top:7px;font:10px ui-monospace,Menlo,monospace;color:#5f7a2e}

/* Image de marque : avant / après */
.h3 .bmk{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;min-height:0}
.h3 .bmk .sl{position:relative;border-radius:10px;overflow:hidden;background:#fff;border:1px solid #e4e6e1;padding:16px;display:flex;flex-direction:column;gap:8px}
.h3 .bmk .sl small{font:10px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#9aa19c}
.h3 .bmk .sl b{font:600 17px/1.15 Arial,Helvetica,sans-serif;color:#222;transition:all .6s}
.h3 .bmk .sl i{display:block;height:5px;border-radius:3px;background:#dcdcdc;transition:background .6s}
.h3 .bmk .sl u{display:block;height:46px;border-radius:6px;background:#cfd6e4;margin-top:4px;transition:background .6s}
.h3 .bmk .sl .lgo{position:absolute;right:12px;top:12px;width:26px;height:26px;border-radius:50%;background:#1b200b;opacity:0;transform:scale(.6);transition:all .5s var(--ease)}
.h3 .bmk .sl.br{background:#f5f0e8}
.h3 .bmk .sl.br.on b{font-family:var(--serif);font-weight:400;font-size:20px;color:#1b200b}
.h3 .bmk .sl.br.on i{background:#c9cfb6}
.h3 .bmk .sl.br.on u{background:linear-gradient(135deg,#5f7a2e,#c5d69a)}
.h3 .bmk .sl.br.on .lgo{opacity:1;transform:none}
.h3 .bmk .sl.br .ap{position:absolute;left:12px;bottom:10px;font:600 10px var(--sans);color:#fff;background:#5f7a2e;border-radius:999px;padding:3px 9px;opacity:0;transition:opacity .4s}
.h3 .bmk .sl.br.on .ap{opacity:1}
.h3 .kit{display:flex;gap:6px;align-items:center;font-size:11px;color:#5c635e}
.h3 .kit i{width:18px;height:18px;border-radius:50%;display:block}

/* Brand Center */
.h3 .bc-logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:36px}
.h3 .bc-lc{display:block;border-radius:16px;overflow:hidden;text-decoration:none;color:#2a3018;background:#fff;border:1px solid rgba(27,32,11,.08);transition:transform .3s var(--ease),box-shadow .3s}
.h3 .bc-lc:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(27,32,11,.12)}
.h3 .bc-lc .bp{height:86px;display:grid;place-items:center}
.h3 .bc-lc .bp img{height:22px;width:auto}
.h3 .bc-lc .bi{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:12.5px;font-weight:600;border-top:1px solid rgba(27,32,11,.06)}
.h3 .bc-lc .bi small{display:block;font-size:10.5px;font-weight:500;color:#8b917a}
.h3 .bc-lc .bi svg{width:16px;height:16px;color:#5f7a2e}
.h3 .bc-rules{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.h3 .bc-rules .glass{padding:20px}
.h3 .bc-rules h3{font:600 14px var(--sans);margin-bottom:8px}
.h3 .bc-rules li{list-style:none;position:relative;padding:4px 0 4px 22px;font-size:14px;color:var(--cream-2)}
.h3 .bc-rules ul{margin:0;padding:0}
.h3 .bc-rules .ok li::before{content:"✓";position:absolute;left:0;color:#5f7a2e;font-weight:700}
.h3 .bc-rules .no li::before{content:"✕";position:absolute;left:0;color:#b5683a;font-weight:700}
.h3 .bc-sws{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:36px}
.h3 .bc-sw{border-radius:16px;overflow:hidden;cursor:pointer;background:rgba(255,255,255,.06);border:1px solid var(--edge);transition:transform .3s var(--ease)}
.h3 .bc-sw:hover{transform:translateY(-3px)}
.h3 .bc-sw .c{height:96px;position:relative;display:grid;place-items:center}
.h3 .bc-sw .c em{font-style:normal;font:600 11px var(--sans);padding:4px 10px;border-radius:6px;background:rgba(0,0,0,.35);color:#fff;opacity:0;transition:opacity .2s}
.h3 .bc-sw.cp .c em{opacity:1}
.h3 .bc-sw .n{padding:10px 12px;font-size:13px;font-weight:600}
.h3 .bc-sw .n small{display:block;font:11.5px ui-monospace,Menlo,monospace;color:var(--muted);font-weight:400}
.h3 .bc-fonts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:36px}
.h3 .bc-fonts .glass{padding:28px}
.h3 .bc-fonts .nm{font-size:40px;line-height:1.05}
.h3 .bc-fonts .fx{margin:14px 0 16px;font-size:18px;color:var(--cream-2)}
.h3 .bc-msgs{margin-top:36px;padding:10px 24px}
.h3 .bc-msg{display:flex;gap:18px;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.08);cursor:pointer}
.h3 .bc-msg:first-child{border-top:0}
.h3 .bc-msg span{flex:none;min-width:110px;font:600 10.5px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lime);opacity:.7}
.h3 .bc-msg q{flex:1;font:italic 400 19px/1.4 var(--serif);color:var(--cream);quotes:none}
.h3 .bc-msg em{flex:none;font-style:normal;font-size:11px;color:var(--lime);opacity:.4;min-width:52px;text-align:right}
.h3 .bc-msg.cp em{opacity:1}
.h3 .bc-dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:36px}
.h3 .bc-dl a{display:flex;flex-direction:column;gap:6px;padding:22px;text-decoration:none;color:var(--cream)}
.h3 .bc-dl a b{font:400 20px var(--serif)}
.h3 .bc-dl a small{font-size:13px;color:var(--muted)}
.h3 .bc-dl a span{margin-top:auto;font:11px ui-monospace,Menlo,monospace;color:#5f7a2e}
@media (max-width:1060px){.h3 .bc-sws{grid-template-columns:repeat(3,minmax(0,1fr))}.h3 .bc-dl{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.h3 .bc-sws{grid-template-columns:1fr 1fr}.h3 .bc-rules,.h3 .bc-fonts,.h3 .bc-dl{grid-template-columns:1fr}.h3 .bc-msg{flex-wrap:wrap;gap:6px}.h3 .bc-msg span{min-width:0}}
.h3 .scn .ask2{display:flex;align-items:center;gap:10px;background:#1b200b;color:#f5f0e8;border-radius:12px;padding:10px 14px;font-size:12.5px}
.h3 .scn .ask2 span{margin-left:auto;display:flex;gap:6px}
.h3 .scn .ask2 em{font-style:normal;font-size:11.5px;font-weight:600;border-radius:8px;padding:4px 10px;background:#c5d69a;color:#1b200b}
.h3 .scn .ask2 em+em{background:transparent;color:#f5f0e8;border:1px solid rgba(255,255,255,.25)}
.h3 .scn .lanes{padding-left:0}
.h3 .scn .ln small{white-space:normal}
.h3 .chips2{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:34px}
.h3 .chips2 span{font-size:13.5px;color:#2a3018;background:#fff;border:1px solid rgba(27,32,11,.08);border-radius:999px;padding:8px 15px;box-shadow:0 4px 12px rgba(27,32,11,.04)}
.h3 .lc .calg{inset:20px 34px}
.h3 .cvs .tb span.hot{opacity:1;transform:none}
.h3 .fluxsec+.sec.dk{padding-top:40px}
.h3 .sec.dk+.fluxsec{padding-top:70px}
/* Ids réservés : home-v3.css style #hero, #le-quotidien, #outils, #computer, #capot, #systeme (accueil).
   Une page intérieure ne doit jamais les réutiliser (T1-F3 : #outils donnait 340 vh à une section). */

/* ============================================================
   T1-F4 (14/10/2026) — famille Intégrations et dev : scènes propres.
   .tcx appels d'apps (mcp) · .dbq résultat de requête (integration) ·
   .cbx/.site constructeur de site (codebuilder) · .ibx boîte mail
   (communication-hub) · .fnx tableau de trésorerie (finance).
   Préfixes neufs : aucune classe de home-v3.css réutilisée.
   ============================================================ */
.h3 .tcx{background:#fff;border:1px solid #e4e6e1;border-radius:14px;padding:4px 14px}
.h3 .tcx .tcr{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid #f1f2ed;font-size:12.5px;color:#9aa19c;transition:color .4s}
.h3 .tcx .tcr:first-child{border-top:0}
.h3 .tcx .tcr svg{flex:none;width:20px;height:20px;opacity:.45;transition:opacity .4s}
.h3 .tcx .tcr b{font-weight:600;min-width:62px}
.h3 .tcx .tcr code{font:10.5px ui-monospace,Menlo,monospace;color:#9aa19c;background:#f6f7f2;border:1px solid #eceee8;border-radius:6px;padding:2px 7px;transition:all .4s}
.h3 .tcx .tcr small{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace;color:#b2b8a6}
.h3 .tcx .tcr small::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#d5dac9;vertical-align:0}
.h3 .tcx .tcr.on,.h3 .tcx .tcr.fin{color:#2c3226}
.h3 .tcx .tcr.on svg,.h3 .tcx .tcr.fin svg{opacity:1}
.h3 .tcx .tcr.on code{color:#8a5a1c;background:#fbf1e3;border-color:#f0dcc0}
.h3 .tcx .tcr.on small::before{background:#e8b07a;animation:pulse 1.4s infinite}
.h3 .tcx .tcr.fin code{color:#4a5f22;background:#f1f6e6;border-color:#cfe0b8}
.h3 .tcx .tcr.fin small{color:#5f7a2e}
.h3 .tcx .tcr.fin small::before{background:#5f7a2e;animation:none}

.h3 .dbq{background:#fff;border:1px solid #e4e6e1;border-radius:12px;overflow:hidden;font-size:11.5px}
.h3 .dbq .dbr{display:grid;grid-template-columns:1.5fr .7fr .9fr;gap:8px;padding:6px 12px;border-top:1px solid #f1f2ed;color:#2c3226}
.h3 .dbq .dbr span+span{text-align:right;font-variant-numeric:tabular-nums}
.h3 .dbq .dbr.dbh{border-top:0;background:#f6f7f2;font:10px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#5f7a2e;text-transform:uppercase}
.h3 .dbq .ft2{padding:7px 12px;border-top:1px solid #eef0ea;font-size:11px;color:#5f7a2e;font-weight:600}

.h3 .cbx{display:grid;grid-template-columns:232px 1fr;gap:14px;flex:1;min-height:0}
.h3 .cbx .lft{display:flex;flex-direction:column;gap:10px}
.h3 .cbx .qq{justify-content:flex-start}
.h3 .cbx .qq p{font-size:12.5px;max-width:none}
.h3 .site{background:#fff;border:1px solid #e4e6e1;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.h3 .site .ub{display:flex;align-items:center;gap:5px;height:32px;padding:0 10px;background:#f3f4ef;border-bottom:1px solid #e9ebe4}
.h3 .site .ub i{width:8px;height:8px;border-radius:50%;background:#d5dac9}
.h3 .site .url{margin-left:8px;flex:1;background:#fff;border:1px solid #e4e6e1;border-radius:7px;font:10.5px ui-monospace,Menlo,monospace;padding:3px 9px;color:#8a917a;transition:all .4s}
.h3 .site .url.on{color:#2a3018;border-color:#a9c07a;box-shadow:0 0 0 3px rgba(169,192,122,.18)}
.h3 .site .spg{padding:12px;display:flex;flex-direction:column;gap:9px;flex:1}
.h3 .site .bk{opacity:0;transform:translateY(8px);transition:opacity .45s,transform .5s var(--ease),box-shadow .4s}
.h3 .site .bk.on,.h3 .site .bk.sel,.h3 .site .bk.big{opacity:1;transform:none}
.h3 .site .bk.sel{box-shadow:0 0 0 2px #e8b07a}
.h3 .site .bk.bhd{position:relative;height:96px;border-radius:10px;background:linear-gradient(150deg,#c7a77a,#3f2e1e)}
.h3 .site .bk.bhd b{position:absolute;left:14px;bottom:30px;height:10px;width:44%;border-radius:4px;background:rgba(255,255,255,.75);transition:all .6s var(--ease)}
.h3 .site .bk.bhd i{position:absolute;left:14px;bottom:14px;height:6px;width:30%;border-radius:3px;background:rgba(255,255,255,.45)}
.h3 .site .bk.bhd.big b{height:16px;width:64%;background:#fff}
.h3 .site .bk.bcards{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.h3 .site .bk.bcards i{height:58px;border-radius:9px;background:#eef0ea}
.h3 .site .bk.bcards i:nth-child(2){background:#e7ecd9}
.h3 .site .bk.form{display:flex;gap:7px;align-items:center}
.h3 .site .bk.form u{flex:1;height:22px;border:1px solid #e4e6e1;border-radius:6px}
.h3 .site .bk.form b{width:78px;height:22px;border-radius:6px;background:#5f7a2e}
.h3 .site .cbpub{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid #eef0ea;font-size:11.5px;color:#9aa19c;transition:color .4s}
.h3 .site .cbpub .pdot{width:8px;height:8px;border-radius:50%;background:#d5dac9}
.h3 .site .cbpub small{margin-left:auto;font:10.5px ui-monospace,Menlo,monospace}
.h3 .site .cbpub.on{color:#2c3226}
.h3 .site .cbpub.on .pdot{background:#5f7a2e;animation:pulse 1.4s infinite}

.h3 .ibx{background:#fff;border:1px solid #e4e6e1;border-radius:14px;overflow:hidden}
.h3 .ibx .ihd{display:flex;align-items:center;gap:8px;padding:9px 14px;border-bottom:1px solid #eef0ea;font-size:12px;font-weight:600;color:#2a3018}
.h3 .ibx .ihd svg{width:15px;height:15px;color:#5f7a2e}
.h3 .ibx .ihd small{margin-left:auto;font:10px ui-monospace,Menlo,monospace;font-weight:400;color:#8a917a}
.h3 .ibx .m{display:flex;align-items:center;gap:10px;padding:0 14px;font-size:12px;color:#2c3226}
.h3 .ibx .m.on{padding:8px 14px;border-top:1px solid #f1f2ed}
.h3 .ibx .m .av{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:600 10px var(--sans);color:#fff}
.h3 .ibx .m span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h3 .ibx .m span b{font-weight:600;margin-right:6px}
.h3 .ibx .m .mtg{flex:none;font-size:10.5px;font-weight:600;border-radius:999px;padding:2px 8px;opacity:0;transform:scale(.9);transition:all .4s var(--ease)}
.h3 .ibx .mtg.on{opacity:1;transform:none}
.h3 .ibx .mtg.u{background:#fbe6e1;color:#a23b2d}.h3 .ibx .mtg.c{background:#f1f6e6;color:#4a5f22}.h3 .ibx .mtg.n{background:#eef0ea;color:#8a917a}

.h3 .fnx{background:#fff;border:1px solid #e4e6e1;border-radius:14px;padding:12px 14px}
.h3 .fnx .kp{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.h3 .fnx .kp div{background:#f6f7f2;border-radius:10px;padding:8px 10px;font-size:10.5px;color:#8a917a}
.h3 .fnx .kp b{display:block;font:500 18px var(--serif);color:#2a3018}
.h3 .fnx .fbs{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.h3 .fnx .fb{display:grid;grid-template-columns:104px 1fr 40px;gap:8px;align-items:center;font-size:11.5px;color:#2c3226}
.h3 .fnx .fb u{height:7px;border-radius:4px;background:#eef0ea;position:relative;overflow:hidden}
.h3 .fnx .fb u::after{content:"";position:absolute;inset:0;background:#5f7a2e;transform-origin:0 0;transform:scaleX(0);transition:transform 1.6s var(--ease)}
.h3 .fnx .fb.on u::after{transform:scaleX(var(--w,1))}
.h3 .fnx .fb.hot u::after{background:#d08a3c}
.h3 .fnx .fb small{text-align:right;font:10.5px ui-monospace,Menlo,monospace;color:#8a917a}
.h3 .fnx .alr{margin-top:10px;display:flex;align-items:center;gap:8px;background:#fbf1e3;color:#8a5a1c;border-radius:10px;padding:7px 11px;font-size:11.5px;font-weight:600}
@media (max-width:620px){.h3 .cbx{grid-template-columns:1fr}}

/* ============================================================
   T1-F5 (14/10/2026) — privacy-protection : scène message → jetons → réponse.
   ============================================================ */
.h3 .ppb{background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:13px 15px;font-size:14px;line-height:1.7;color:#2c3226}
.h3 .ppb small{display:block;font:10px ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:#8a917a;margin-bottom:4px}
.h3 .ppb.md{background:#f6f7f2;border-style:dashed;border-color:#cfd5c3}
.h3 .ppb.md small{color:#5f7a2e}
.h3 .ppb mark{background:#fbe6e1;color:#a23b2d;border-radius:4px;padding:0 4px}
.h3 .ppb mark.k{background:#e7efd2;color:#3f531a;font:11px ui-monospace,Menlo,monospace}
.h3 .ppb mark.u{background:#fbf1e3;color:#8a5a1c}
.h3 .ppb .rl{display:inline-flex;margin-left:6px;font:10px ui-monospace,Menlo,monospace;color:#8a5a1c;border:1px dashed #e8c98a;border-radius:6px;padding:0 6px}
.h3 .pparr{font:10.5px ui-monospace,Menlo,monospace;color:#5f7a2e;text-align:center;letter-spacing:.06em}

/* ============================================================
   T1-F6 (14/10/2026) — applications : téléphone (.phn), fenêtre de
   bureau (.dsk), navigateur avec panneau (.brw), boutons de
   téléchargement (.dlb). L'orbe garde la palette de NexusOrb
   (indigo #534AB7, émeraude #1D9E75, rouge #E24B4A à l'écoute).
   ============================================================ */
.h3 .phn{position:relative;width:290px;height:570px;margin:0 auto;border-radius:46px;background:#1b200b;border:1px solid rgba(255,255,255,.16);padding:11px;box-shadow:0 40px 90px rgba(0,0,0,.45)}
.h3 .phn .scr{position:relative;height:100%;border-radius:36px;background:#f5f0e8;overflow:hidden;display:flex;flex-direction:column}
.h3 .phn .ntch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:92px;height:25px;border-radius:14px;background:#1b200b;z-index:2}
.h3 .phn .top{display:flex;align-items:center;gap:8px;padding:46px 18px 10px;border-bottom:1px solid #e6e8e1}
.h3 .phn .top img{height:17px}
.h3 .phn .top small{margin-left:auto;font:10px ui-monospace,Menlo,monospace;color:#8a917a}
.h3 .phn .msgs{flex:1;padding:10px 14px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;overflow:hidden}
.h3 .phn .b{max-width:84%;border-radius:16px;padding:9px 12px;font-size:12.5px;line-height:1.45}
.h3 .phn .b.me{align-self:flex-end;background:#e2e6d8;color:#2a3018;border-bottom-right-radius:5px}
.h3 .phn .b.ai{background:#fff;border:1px solid #e4e6e1;color:#2c3226;border-bottom-left-radius:5px}
.h3 .phn .b.ai small{display:block;margin-top:6px;font:10px ui-monospace,Menlo,monospace;color:#5f7a2e}
.h3 .phn .rail{display:flex;justify-content:space-around;align-items:flex-start;padding:10px 18px 20px;border-top:1px solid #e4e6e1;background:#fff}
.h3 .phn .rail span{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:9.5px;color:#8a917a}
.h3 .phn .rail i{width:18px;height:18px;border-radius:6px;border:1.5px solid #c9cfbd}
.h3 .phn .orb{width:48px;height:48px;border-radius:50%;margin-top:-28px;background:radial-gradient(circle at 34% 30%,#8d85ea,#534AB7 55%,#1D9E75);box-shadow:0 10px 22px rgba(83,74,183,.35);transition:background .4s}
.h3 .phn .orb.lis{background:radial-gradient(circle at 34% 30%,#f39a99,#E24B4A);animation:pulse 1.2s infinite}

.h3 .dsk{display:grid;grid-template-columns:150px 1fr;gap:12px;flex:1;min-height:0}
.h3 .dsk .sb{background:#fff;border:1px solid #e4e6e1;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:#8a917a}
.h3 .dsk .sb b{color:#2a3018;font-weight:600;padding:6px 8px;border-radius:8px;background:#eef3e0}
.h3 .dsk .sb span{padding:6px 8px}
.h3 .dsk .sb em{margin-top:auto;font:normal 10px ui-monospace,Menlo,monospace;color:#9aa19c;padding:6px 8px}
.h3 .dsk .mn{display:flex;flex-direction:column;gap:10px;min-width:0}
.h3 .dsk .drop{border:2px dashed #cfd5c3;border-radius:12px;padding:14px;text-align:center;font-size:12px;color:#8a917a;transition:all .4s}
.h3 .dsk .drop.on{border-color:#5f7a2e;background:#f1f6e6;color:#4a5f22}
.h3 .kc{display:flex;gap:6px;justify-content:center;align-items:center;font-size:11.5px;color:#5c635e}
.h3 .kc kbd{font:600 12px var(--sans);background:#fff;border:1px solid #d5dac9;border-bottom-width:3px;border-radius:8px;padding:4px 10px;color:#2a3018}

.h3 .brw{display:grid;grid-template-columns:1fr 214px;grid-template-rows:30px 1fr;flex:1;min-height:0;background:#fff;border:1px solid #e4e6e1;border-radius:12px;overflow:hidden}
.h3 .brw .bub{grid-column:1/-1;display:flex;align-items:center;gap:5px;padding:0 10px;background:#f3f4ef;border-bottom:1px solid #e9ebe4}
.h3 .brw .bub i{width:8px;height:8px;border-radius:50%;background:#d5dac9}
.h3 .brw .bub span{margin-left:8px;flex:1;background:#fff;border:1px solid #e4e6e1;border-radius:7px;font:10.5px ui-monospace,Menlo,monospace;padding:3px 9px;color:#8a917a}
.h3 .brw .bub b{width:20px;height:20px;border-radius:6px;background:#1b200b;display:grid;place-items:center}
.h3 .brw .bub b img{width:12px}
.h3 .brw .pgc{padding:14px;display:flex;flex-direction:column;gap:7px;min-width:0}
.h3 .brw .pgc i{display:block;height:7px;border-radius:4px;background:#eef0ea}
.h3 .brw .pgc i.t{height:12px;width:62%;background:#dfe3d6;margin-bottom:4px}
.h3 .brw .fld{display:grid;grid-template-columns:62px 1fr;gap:8px;align-items:center;font-size:10.5px;color:#8a917a}
.h3 .brw .fld u{display:block;height:22px;border:1px solid #e4e6e1;border-radius:6px;font:11px/14px var(--sans);text-decoration:none;color:#2a3018;padding:3px 7px;transition:all .4s;white-space:nowrap;overflow:hidden}
.h3 .brw .fld u.on{border-color:#a9c07a;box-shadow:0 0 0 3px rgba(169,192,122,.18);background:#f7faef}
.h3 .brw .pnl{border-left:1px solid #e9ebe4;background:#fafaf7;padding:10px;display:flex;flex-direction:column;gap:8px;font-size:11.5px;min-width:0}
.h3 .brw .pnl .hd2{display:flex;align-items:center;gap:6px;font-weight:600;color:#2a3018;font-size:12px}
.h3 .brw .pnl .hd2 small{margin-left:auto;font:9.5px ui-monospace,Menlo,monospace;color:#5f7a2e}
.h3 .brw .pnl .qq p{font-size:11.5px;padding:7px 10px}
.h3 .brw .pnl .ans{font-size:11.5px;padding:8px 10px;line-height:1.5}

.h3 .dlb{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.h3 .dlb .btn.soon{opacity:.75;cursor:default}
.h3 .dlb .btn svg{width:16px;height:16px;vertical-align:-3px;margin-right:6px}

/* ============================================================
   T1-F7 (14/10/2026) — pages Usages : cartes de demandes en deux
   colonnes (.tiles.c2u, citation .dq) et liens-pastilles vers les
   autres usages (a.chip).
   ============================================================ */
.h3 .tiles.c2u{grid-template-columns:repeat(2,minmax(0,1fr))}
.h3 .tile .dq{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;line-height:1.25}
.h3 .tile .rt3 .chip{font-size:12px;padding:5px 11px}
.h3 a.chip{color:var(--cream-2);text-decoration:none;transition:border-color .3s,color .3s}
.h3 a.chip:hover{border-color:var(--lime);color:#fff}
.h3 .us-chips{margin-top:14px}
@media (max-width:820px){.h3 .tiles.c2u{grid-template-columns:1fr}}

/* ============================================================
   T1-F8 (14/10/2026) — entreprise : scène avant/après (.ent),
   six questions (.q6), listes dans les cartes (.tile .lst),
   chiffres et labels (.stt, .lgs).
   ============================================================ */
.h3 .ent{display:grid;grid-template-columns:1fr 1.15fr;gap:12px;flex:1;min-height:0}
.h3 .ent .zn{border:1.5px dashed #d5c3c0;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px;font-size:11.5px}
.h3 .ent .zn.ok{border:1.5px solid #a9c07a;background:#fff}
.h3 .ent .zt{font:10px ui-monospace,Menlo,monospace;letter-spacing:.1em;color:#a23b2d;text-transform:uppercase}
.h3 .ent .ok .zt{color:#5f7a2e}
.h3 .ent .px{align-self:flex-start;background:#fbe6e1;color:#a23b2d;border-radius:8px;padding:6px 10px;font:10.5px ui-monospace,Menlo,monospace}
.h3 .ent .px:nth-child(odd){align-self:flex-end}
.h3 .ent .ft2{margin-top:auto;font:10px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#a23b2d}
.h3 .ent .ok .ft2{color:#5f7a2e}
.h3 .ent .one{background:#eef3e0;border-radius:10px;padding:10px;text-align:center;font-weight:600;color:#2e3d14;font-size:12.5px}
.h3 .ent .one small{display:block;font:9.5px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#5f7a2e;font-weight:400;margin-top:3px}
.h3 .ent .tm{display:flex;justify-content:space-between;align-items:center;background:#f6f7f2;border-radius:8px;padding:7px 10px;color:#2c3226}
.h3 .ent .tm small{font:10px ui-monospace,Menlo,monospace;color:#5f7a2e}
.h3 .ent .jr{background:#fff;border:1px solid #e4e6e1;border-radius:8px;padding:7px 10px;color:#5c635e}
.h3 .ent .jr b{display:block;font:10px ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#5f7a2e;font-weight:400}
.h3 .ent .qs{display:flex;gap:5px;flex-wrap:wrap}
.h3 .ent .qs span{background:#eef3e0;color:#2e3d14;border-radius:999px;padding:3px 9px;font:10px ui-monospace,Menlo,monospace}

.h3 .q6{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:40px}
.h3 .q6 .c{background:#fff;border:1px solid #e4e6e1;border-radius:20px;padding:26px 28px;box-shadow:0 10px 30px rgba(27,32,11,.05)}
.h3 .q6 .c span{font:10.5px ui-monospace,Menlo,monospace;letter-spacing:.12em;color:#5f7a2e;text-transform:uppercase}
.h3 .q6 .c h3{font-family:var(--serif);font-weight:400;font-size:26px;color:#1b200b;margin:8px 0 10px}
.h3 .q6 .c p{margin:0 0 8px;font-size:15px;line-height:1.6;color:#4c5245}

.h3 .tile .lst{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.h3 .tile .lst li{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--muted)}
.h3 .tile .lst li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--lime);margin-top:7px}
.h3 .lt .tile .lst li{color:#4c5245}
.h3 .lt .tile .lst li::before{background:#5f7a2e}
.h3 .tile .who{font:11px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:var(--lime)}
.h3 .lt .tile .who{color:#5f7a2e}
.h3 .tile .big{font:400 40px/1.05 var(--serif);color:var(--cream)}
.h3 .tile.hl{border-color:var(--lime)}

.h3 .stt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:40px}
.h3 .stt div{text-align:center}
.h3 .stt b{display:block;font:400 52px/1 var(--serif);color:#1b200b}
.h3 .stt small{font-size:14px;color:#6b7160}
.h3 .lgs{display:flex;flex-wrap:wrap;gap:30px;align-items:center;justify-content:center;margin-top:40px}
.h3 .lgs img{height:34px;width:auto;opacity:.75}
@media (max-width:820px){.h3 .ent,.h3 .q6{grid-template-columns:1fr}.h3 .stt{grid-template-columns:1fr 1fr}}