/* ───────────────────────────────────────────────────────────────────────────────────────────────────────────────
   SubmitX — titan.css : la section « Titan 3.5, l'IA de la construction » (Fonctionnalités, Assistant, en/features) et la
   cascade des sources du volet IA de l'accueil. Gabarit : scripts/lib/titan-section.mjs ; injection : scripts/build-titan.mjs.
   Autonome : ses propres variables (--tn-*), mêmes couleurs que sections.css, thèmes clair et sombre (:root[data-theme]).
   Animations coupées par prefers-reduced-motion. Aucune ressource externe.
   ─────────────────────────────────────────────────────────────────────────────────────────────────────────────── */
:root{
  --tn-bg:#F7F7F5; --tn-surface:#FFFFFF; --tn-surface2:#F9FAFB; --tn-ink:#111827; --tn-ink2:#374151; --tn-ink3:#4B5563;
  --tn-line:#E5E7EB; --tn-line2:#D1D5DB; --tn-brand:#FF6B2C; --tn-brand-ink:#C2410C; --tn-soft:#FFF0E5; --tn-soft-ink:#9A3412;
  --tn-stripe:#111827; --tn-grid:rgba(17,24,39,.06); --tn-hard:#111827; --tn-cta:#C2410C;
  --tn-ok:#15803D; --tn-ok-soft:#DCFCE7; --tn-blue:#1D4ED8; --tn-blue-soft:#DBEAFE; --tn-amber:#92400E; --tn-amber-soft:#FEF3C7;
}
:root[data-theme="dark"]{
  --tn-bg:#121212; --tn-surface:#181818; --tn-surface2:#1E1E1E; --tn-ink:#F3F4F6; --tn-ink2:#D1D5DB; --tn-ink3:#A3A9B5;
  --tn-line:#2A2A2A; --tn-line2:#3A3A3A; --tn-brand:#FF6B2C; --tn-brand-ink:#FF8A4C; --tn-soft:rgba(255,107,44,.14); --tn-soft-ink:#FFB37A;
  --tn-stripe:#3A3A3A; --tn-grid:rgba(255,255,255,.05); --tn-hard:#C2410C; --tn-cta:#C2410C;
  --tn-ok:#4ADE80; --tn-ok-soft:rgba(74,222,128,.14); --tn-blue:#93C5FD; --tn-blue-soft:rgba(147,197,253,.14); --tn-amber:#FCD34D; --tn-amber-soft:rgba(252,211,77,.14);
}

.tn{box-sizing:border-box;position:relative;padding:0 0 88px;color:var(--tn-ink);font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;
  background-color:var(--tn-bg);background-image:linear-gradient(var(--tn-grid) 1px,transparent 1px),linear-gradient(90deg,var(--tn-grid) 1px,transparent 1px);background-size:28px 28px;border-top:1px solid var(--tn-line);border-bottom:1px solid var(--tn-line)}
.tn *,.tn *::before,.tn *::after{box-sizing:border-box}
.tn [hidden]{display:none!important}
.tn-hazard{display:block;height:8px;margin-bottom:76px;background:repeating-linear-gradient(-45deg,var(--tn-brand) 0 14px,var(--tn-stripe) 14px 28px)}
.tn-wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.tn p,.tn h2,.tn h3,.tn ol,.tn ul,.tn figure{margin:0}
.tn ol,.tn ul{list-style:none;padding:0}

.tn-head{max-width:820px}
.tn-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px!important;font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--tn-brand-ink)}
.tn-kicker::before{content:"";width:26px;height:4px;background:repeating-linear-gradient(-45deg,var(--tn-brand) 0 5px,var(--tn-stripe) 5px 10px)}
.tn h2.tn-h2{font-size:clamp(30px,4.4vw,48px);font-weight:850;letter-spacing:-.035em;line-height:1.06;color:var(--tn-ink)}
.tn h2.tn-h2 .or{color:var(--tn-brand-ink);background:linear-gradient(transparent 66%,var(--tn-soft) 66%);padding:0 .05em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.tn-lead{margin-top:16px!important;font-size:clamp(16px,1.6vw,18.5px);line-height:1.62;color:var(--tn-ink2)}
.tn h3.tn-h3{margin:56px 0 18px;font-size:clamp(20px,2.2vw,24px);font-weight:800;letter-spacing:-.02em;color:var(--tn-ink)}

.tn-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:start;margin-top:44px}

/* ── Cascade des sources ─────────────────────────────────────────────────────────────────────────────── */
.tn-cascade{position:relative;display:grid;gap:14px;counter-reset:tn}
.tn-cascade::before{content:"";position:absolute;left:27px;top:30px;bottom:30px;border-left:2px dashed var(--tn-line2)}
.tn-tier{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;align-items:start;padding:18px 20px 18px 0}
.tn-tier-ico{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:14px;background:var(--tn-surface);border:1px solid var(--tn-line2);color:var(--tn-ink3)}
.tn-tier-ico svg{width:26px;height:26px}
.tn-tier.t1 .tn-tier-ico{background:var(--tn-brand);border-color:var(--tn-brand);color:#1B0808;box-shadow:4px 4px 0 var(--tn-hard)}
.tn-tier-body{min-width:0;padding:16px 18px;background:var(--tn-surface);border:1px solid var(--tn-line);border-radius:6px}
.tn-tier.t1 .tn-tier-body{border:2px solid var(--tn-brand);background:linear-gradient(var(--tn-soft),var(--tn-soft)),var(--tn-surface)}
.tn-tier-h{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--tn-ink)}
.tn-tier-n{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:var(--tn-ink);color:var(--tn-surface);font-size:12.5px;font-weight:800}
.tn-tier.t1 .tn-tier-n{background:var(--tn-brand-ink);color:#fff}
.tn-tier-b{margin-top:6px!important;font-size:14.5px;line-height:1.55;color:var(--tn-ink2)}
.tn-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px!important;counter-reset:tnc}
.tn-chips li{counter-increment:tnc;display:inline-flex;align-items:baseline;gap:7px;padding:6px 11px;border-radius:999px;background:var(--tn-surface);border:1px solid var(--tn-line2);font-size:13.5px;font-weight:600;color:var(--tn-ink);line-height:1.35}
.tn-tier.t1 .tn-chips li::before{content:counter(tnc);font-size:11.5px;font-weight:800;color:var(--tn-brand-ink)}
.tn-tier.t2 .tn-chips{flex-direction:column;align-items:stretch}
.tn-tier.t2 .tn-chips li{border-radius:8px;font-weight:500}
.tn-tier-also{margin-top:12px!important;padding-top:12px;border-top:1px dashed var(--tn-line2);font-size:13.5px;line-height:1.55;color:var(--tn-ink2)}
.tn-tier.t3 .tn-tier-body{border-style:dashed}

/* compacte (accueil) */
.tn-cascade.compact{gap:10px}
.tn-cascade.compact::before{left:21px}
.tn-cascade.compact .tn-tier{grid-template-columns:44px minmax(0,1fr);gap:12px;padding:0}
.tn-cascade.compact .tn-tier-ico{width:44px;height:44px;border-radius:12px}
.tn-cascade.compact .tn-tier-ico svg{width:21px;height:21px}
.tn-cascade.compact .tn-tier-body{padding:12px 14px}
.tn-cascade.compact .tn-tier-h{font-size:15.5px}
.tn-cascade.compact .tn-tier-b{font-size:13.5px}
.tn-cascade.compact .tn-chips li{font-size:12.5px;padding:5px 10px}
.tn-mini{padding:22px;border-radius:16px;border:1px solid var(--tn-line);background-color:var(--tn-bg);background-image:linear-gradient(var(--tn-grid) 1px,transparent 1px),linear-gradient(90deg,var(--tn-grid) 1px,transparent 1px);background-size:24px 24px}
.tn-mini-h{display:flex;align-items:center;gap:10px;margin:0 0 16px!important;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tn-ink3)}
.tn-gem{display:inline-block;flex:none;width:14px;height:14px;transform:rotate(45deg);border-radius:3px;background:linear-gradient(135deg,#FFB37A,#FF6B2C 55%,#C2410C);box-shadow:0 0 0 3px var(--tn-soft)}
.tn-more{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:14.5px;font-weight:700;color:var(--tn-brand-ink);text-decoration:underline;text-underline-offset:3px}
.tn-more svg{width:16px;height:16px}

/* ── Exemple de lignes avec leur source ──────────────────────────────────────────────────────────────── */
.tn-ex{position:sticky;top:96px;background:var(--tn-surface);border:1px solid var(--tn-line);border-radius:6px;box-shadow:0 18px 40px -24px rgba(17,24,39,.35);overflow:hidden}
.tn-ex::before,.tn-ex::after{content:"";position:absolute;width:14px;height:14px;border:0 solid var(--tn-brand);pointer-events:none}
.tn-ex::before{top:-1px;left:-1px;border-top-width:3px;border-left-width:3px}
.tn-ex::after{bottom:-1px;right:-1px;border-bottom-width:3px;border-right-width:3px}
.tn-ex-bar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--tn-line);font-size:13.5px;font-weight:700;color:var(--tn-ink)}
.tn-ex-bar i{width:9px;height:9px;border-radius:50%;background:var(--tn-brand)}
.tn-ex-bar em{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tn-ink3);border:1px solid var(--tn-line2);border-radius:4px;padding:2px 6px}
.tn-ex-rows li{display:grid;grid-template-columns:minmax(0,1fr) 54px auto;gap:12px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--tn-line)}
.tn-ex-name{font-size:14.5px;font-weight:600;color:var(--tn-ink);min-width:0}
.tn-skel{display:block;height:8px;border-radius:4px;background:var(--tn-line)}
.tn-src{justify-self:end;white-space:nowrap;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700}
.tn-src.lib{background:var(--tn-soft);color:var(--tn-soft-ink)}
.tn-src.sup{background:var(--tn-blue-soft);color:var(--tn-blue)}
.tn-src.ccq{background:var(--tn-ok-soft);color:var(--tn-ok)}
.tn-src.tbc{background:var(--tn-amber-soft);color:var(--tn-amber);border:1px dashed currentColor}
.tn-ex figcaption{padding:12px 16px;font-size:13px;color:var(--tn-ink3)}

/* ── Règles ──────────────────────────────────────────────────────────────────────────────────────────── */
.tn-rules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.tn-rule{display:flex;flex-direction:column;gap:12px;padding:18px;background:var(--tn-surface);border:1px solid var(--tn-line);border-radius:6px}
.tn-rule-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--tn-soft);color:var(--tn-brand-ink)}
.tn-rule-ico svg{width:21px;height:21px}
.tn-rule b{display:block;font-size:15.5px;font-weight:800;color:var(--tn-ink);margin-bottom:6px}
.tn-rule span span{display:block;font-size:14px;line-height:1.55;color:var(--tn-ink2)}

/* ── Modes ───────────────────────────────────────────────────────────────────────────────────────────── */
.tn-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tn-mode{padding:20px;background:var(--tn-surface);border:1px solid var(--tn-line);border-radius:6px}
.tn-mode.m2{border:2px solid var(--tn-brand);box-shadow:5px 5px 0 var(--tn-hard)}
.tn-mode-tag{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--tn-ink3)}
.tn-mode.m2 .tn-mode-tag{color:var(--tn-brand-ink)}
.tn-mode-t{display:flex;align-items:center;gap:10px;margin-top:8px!important;font-size:21px;font-weight:850;letter-spacing:-.02em;color:var(--tn-ink)}
.tn-mode.m2 .tn-gem{box-shadow:0 0 0 3px var(--tn-soft),0 0 14px 2px rgba(255,107,44,.55)}
.tn-mode-b{margin-top:8px!important;font-size:14.5px;line-height:1.55;color:var(--tn-ink2)}

/* ── Appels à l'action ───────────────────────────────────────────────────────────────────────────────── */
.tn-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.tn-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px;border-radius:6px;background:var(--tn-cta);color:#fff!important;font-weight:800;font-size:15.5px;text-decoration:none;border:2px solid var(--tn-cta);box-shadow:4px 4px 0 var(--tn-hard);transition:transform .15s,box-shadow .15s}
.tn-btn svg{width:18px;height:18px}
.tn-btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--tn-hard)}
.tn-btn.ghost{background:var(--tn-surface);color:var(--tn-ink)!important;border-color:var(--tn-ink);box-shadow:none}
.tn-btn:focus-visible,.tn-more:focus-visible{outline:3px solid var(--tn-brand-ink);outline-offset:3px}
.tn-fine{margin-top:14px!important;font-size:13.5px;color:var(--tn-ink3)}

@media (max-width:1023px){
  .tn-grid{grid-template-columns:minmax(0,1fr)}
  .tn-ex{position:relative;top:auto}
  .tn-rules{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .tn{padding-bottom:64px}
  .tn-hazard{margin-bottom:52px}
  .tn-wrap{padding:0 16px}
  .tn-modes{grid-template-columns:minmax(0,1fr)}
  .tn-tier{grid-template-columns:44px minmax(0,1fr);gap:12px;padding-right:0}
  .tn-tier-ico{width:44px;height:44px;border-radius:12px}
  .tn-tier-ico svg{width:21px;height:21px}
  .tn-cascade::before{left:21px}
  .tn-tier-body{padding:14px}
  .tn-ex-rows li{grid-template-columns:minmax(0,1fr) auto}
  .tn-ex-rows .tn-skel{display:none}
  .tn h3.tn-h3{margin-top:44px}
}
@media (max-width:479px){
  .tn-rules{grid-template-columns:minmax(0,1fr)}
  .tn-btn{width:100%}
}
@media (prefers-reduced-motion:no-preference){
  .tn-tier.t1 .tn-tier-ico{animation:tn-pulse 3.2s ease-in-out infinite}
  @keyframes tn-pulse{0%,100%{box-shadow:4px 4px 0 var(--tn-hard)}50%{box-shadow:4px 4px 0 var(--tn-hard),0 0 0 7px rgba(255,107,44,.18)}}
}

/* volet IA de l'accueil : marque Titan, 5 démonstrations (liens vers /Titan#demo-…), deux boutons */
.tn-lock{display:flex;align-items:center;gap:12px;margin:0 0 16px!important}
.tn-lock-mark{flex:none;filter:drop-shadow(0 6px 16px rgba(255,107,44,.35));color:var(--tn-ink)}
.tn-lock>span{display:flex;flex-direction:column;gap:4px;line-height:1}
.tn-lock small{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--tn-brand-ink)}
.tn-lock .tb-word,.tp .tb-word{display:inline-flex;align-items:baseline;gap:.18em;font-family:'Barlow Condensed','Inter',sans-serif;font-weight:800;letter-spacing:.04em;line-height:1}
.tn-lock .tb-word{font-size:30px;color:var(--tn-ink)}
.tn-lock .tb-word b{color:#FF6B2C}
.tn-demos-h{margin:26px 0 10px!important;font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tn-ink3)}
ul.tn-demo-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tn-demo-chips a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:7px 13px;border:1px solid var(--tn-line2);border-radius:999px;background:var(--tn-surface);font-size:13.5px;font-weight:700;color:var(--tn-ink);text-decoration:none;transition:border-color .15s,transform .15s}
.tn-demo-chips a span{font-family:'Barlow Condensed','Inter',sans-serif;font-size:15px;font-weight:800;color:var(--tn-brand-ink)}
.tn-demo-chips a:hover{border-color:var(--tn-brand);transform:translateY(-1px)}
.tn-demo-chips a:focus-visible{outline:3px solid var(--tn-brand-ink);outline-offset:2px}
.tn-home-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.sxv-copy .tn-home-cta .sxs-btn{margin-top:0}
@media (max-width:479px){.tn-home-cta .sxs-btn{width:100%}}

/* badge « Titan 3.5 » des fiches de modules qui utilisent l'IA (assets/site/features.js, lien vers /Titan) */
.fx-badge.fx-titan{gap:6px;text-decoration:none;border-color:var(--tn-brand);background:var(--tn-soft);color:var(--tn-soft-ink);text-transform:none;letter-spacing:.01em}
.fx-badge.fx-titan svg{flex:none;color:var(--tn-ink)}
.fx-badge.fx-titan:hover{background:var(--tn-brand);color:#1B0808}
.fx-badge.fx-titan:focus-visible{outline:3px solid var(--tn-brand-ink);outline-offset:2px}

/* volet IA de l'accueil : la cascade vit hors de .tn (remises à zéro propres) */
.tn-mini,.tn-mini *,.tn-mini *::before,.tn-mini *::after{box-sizing:border-box}
.tn-mini p,.tn-mini ol{margin:0}
.tn-mini ol{list-style:none;padding:0}