/* ============================================================
   PAGE CAS D'USAGE IA EN ENTREPRISE — styles additionnels (design v3)
   Réutilise au maximum les patterns de he-agence-ia-toulouse-v3.css
   (hero, trust-strip, section-light / sombre / section-black,
   map-cta, sec-head, go-next, about-cta…).
   N'ajoute ici que ce qui est propre à la page :
     - héros un peu plus court
     - sommaire des six familles (cas-toc)
     - cartes "cas d'usage" (uc-card) en variante sombre ET claire
     - section "on part de l'existant" (noire) + section "par secteur"
   Mêmes variables, mêmes codes visuels que la homepage.
   ============================================================ */

/* onglet de nav correspondant à la page courante (sans ouvrir le panneau) */
.mega-here > .mega-trigger{color:var(--text)}
.mega-here > .mega-trigger::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;border-radius:2px;
  background:var(--accent);opacity:.75}
.mega-here{position:relative}

/* --- HÉRO cas d'usage : un peu plus court --- */
.hero-cas{min-height:auto;padding:150px 0 96px}
.hero-in-cas{align-items:center}
.hero-cas h1{font-size:clamp(2.3rem,5.4vw,4.2rem)}
.hero-cas p.lede{margin-top:26px}

/* ============================================================
   INTRODUCTION — section claire
   ============================================================ */
.intro-head{max-width:820px;margin-left:auto;margin-right:auto;text-align:center;margin-bottom:42px}
.intro-head .eyebrow{justify-content:center}
.intro-head p{margin-left:auto;margin-right:auto}

/* sommaire des six familles */
.cas-toc{position:relative;border-radius:24px;overflow:hidden;margin:0 auto;max-width:980px;
  background:linear-gradient(135deg,rgba(37,99,235,.07),rgba(29,78,216,.04));
  border:1px solid var(--light-line-strong);padding:clamp(26px,4vw,38px)}
.cas-toc::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 90% at 8% 0%,rgba(56,189,248,.08),transparent 55%)}
.cas-toc-label{position:relative;display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-mono);font-size:.78rem;color:var(--blue-600);letter-spacing:.03em;margin-bottom:20px}
.cas-toc-label i{color:var(--blue)}
.cas-toc-grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cas-toc-link{display:flex;align-items:center;gap:12px;padding:15px 18px;border-radius:14px;
  background:var(--light-surface);border:1px solid var(--light-line-strong);
  font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--light-text);letter-spacing:-.01em;
  transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.cas-toc-link > i:first-child{color:var(--blue-600);font-size:1.15rem;flex:none}
.cas-toc-link span{flex:1}
.cas-toc-link .arr{color:var(--blue);font-size:.9rem;opacity:.5;transition:transform .3s var(--ease),opacity .3s}
.cas-toc-link:hover{transform:translateY(-3px);border-color:rgba(37,99,235,.4);box-shadow:0 22px 44px -28px rgba(15,27,45,.4)}
.cas-toc-link:hover .arr{transform:translateX(4px);opacity:1}
@media(max-width:820px){.cas-toc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.cas-toc-grid{grid-template-columns:1fr}}

/* léger resserrement du map-cta réutilisé dans l'intro claire */
.cas-map-cta{margin-top:36px}
.section-light .cas-map-cta{background:linear-gradient(135deg,rgba(37,99,235,.07),rgba(29,78,216,.04));border-color:var(--light-line-strong)}
.section-light .cas-map-cta h3{color:var(--light-text)}
.section-light .cas-map-cta p{color:var(--light-dim)}
.section-light .cas-map-cta p b{color:var(--light-text)}
.section-light .cas-map-cta p em{color:var(--blue-600)}
.section-light .cas-map-cta .play-tag{color:var(--blue-600);border-color:rgba(37,99,235,.25)}

/* play-tag : version réutilisable hors .method (la homepage le définit dans .method) */
.play-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:.76rem;color:var(--accent);
  letter-spacing:.03em;border:1px solid var(--line-strong);border-radius:999px;padding:6px 14px}

/* ============================================================
   FAMILLES D'USAGES — sections alternées (sombre / claire)
   ============================================================ */
.uf-head{max-width:680px;margin-left:auto;margin-right:auto;text-align:center;margin-bottom:48px}
.uf-head .eyebrow{justify-content:center}
.uf-head .eyebrow::before{content:""}        /* l'eyebrow porte déjà "// ..." dans le texte */
.uf-head p{margin-left:auto;margin-right:auto}

/* grille de cartes cas d'usage : 3 colonnes (2 pour la dernière famille) */
.uc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.uc-grid-2{grid-template-columns:repeat(2,1fr);max-width:760px;margin-inline:auto}

/* carte — variante SOMBRE (par défaut) : modelée sur .qw-card / .data-card */
.uc-card{position:relative;border-radius:var(--radius);padding:30px 28px;overflow:hidden;display:flex;flex-direction:column;
  background:linear-gradient(180deg,var(--surface),var(--ink-700));border:1px solid var(--line);
  transition:transform .45s var(--ease),border-color .45s,box-shadow .45s}
.uc-card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--grad-bright);
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
.uc-card:hover{transform:translateY(-6px);border-color:var(--line-strong);box-shadow:0 36px 64px -34px rgba(0,0,0,.7)}
.uc-card:hover::before{transform:scaleX(1)}
.uc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.uc-ico{width:48px;height:48px;border-radius:13px;flex:none;display:grid;place-items:center;font-size:1.3rem;
  background:var(--grad-soft);border:1px solid var(--line-strong);color:var(--blue-300)}
.uc-num{font-family:var(--font-mono);font-size:.82rem;color:var(--text-mute)}
.uc-card h3{font-size:1.14rem;margin-bottom:10px;line-height:1.25}
.uc-desc{color:var(--text-dim);font-size:.94rem;flex:1}
.uc-ex{margin-top:18px;border-radius:14px;padding:15px 16px;
  background:rgba(8,16,31,.5);border:1px solid var(--line-strong)}
.uc-ex-tag{font-family:var(--font-mono);font-size:.72rem;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;
  margin-bottom:.5rem;display:flex;align-items:center;gap:7px}
.uc-ex-text{color:var(--text-dim);font-size:.9rem;margin:0;line-height:1.5}

/* carte — variante CLAIRE : modelée sur .metier-card / .svc */
.uc-grid-light .uc-card{background:var(--light-surface);border:1px solid var(--light-line);
  box-shadow:0 18px 40px -30px rgba(15,27,45,.4)}
.uc-grid-light .uc-card:hover{border-color:var(--light-line-strong);box-shadow:0 36px 64px -34px rgba(15,27,45,.26)}
.uc-grid-light .uc-ico{background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(29,78,216,.07));
  border:1px solid var(--light-line-strong);color:var(--blue-600)}
.uc-grid-light .uc-num{color:var(--light-mute)}
.uc-grid-light .uc-card h3{color:var(--light-text)}
.uc-grid-light .uc-desc{color:var(--light-dim)}
.uc-grid-light .uc-ex{background:var(--light-bg);border:1px solid var(--light-line)}
.uc-grid-light .uc-ex-tag{color:var(--blue-600)}
.uc-grid-light .uc-ex-text{color:var(--light-dim)}

@media(max-width:980px){.uc-grid{grid-template-columns:1fr 1fr}.uc-grid-2{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.uc-grid,.uc-grid-2{grid-template-columns:1fr}}

/* ============================================================
   ON PART DE L'EXISTANT — section noire (effet fort, court)
   ============================================================ */
.cas-outils .sec-head{max-width:760px;margin-bottom:0}
.cas-outils .sec-head p{max-width:700px}
.cas-outils-foot{margin:38px auto 0;max-width:820px;text-align:center;
  font-family:var(--font-display);font-size:clamp(1.1rem,2.1vw,1.45rem);font-weight:500;line-height:1.42;color:var(--text-dim)}
.cas-outils-foot b{color:var(--text);font-weight:600}

/* ============================================================
   PAR SECTEUR — section claire : trois portes d'entrée
   ============================================================ */
.cas-secteur .sec-head{max-width:780px;margin-bottom:46px}
.cas-sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cas-sector{position:relative;border-radius:var(--radius);padding:30px 28px;text-align:center;overflow:hidden;
  background:var(--light-surface);border:1px solid var(--light-line);box-shadow:0 18px 40px -30px rgba(15,27,45,.4);
  transition:transform .45s var(--ease),border-color .45s,box-shadow .45s}
.cas-sector::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--grad-bright);
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
.cas-sector:hover{transform:translateY(-6px);border-color:var(--light-line-strong);box-shadow:0 36px 64px -34px rgba(15,27,45,.26)}
.cas-sector:hover::before{transform:scaleX(1)}
.cas-sector-ico{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin:0 auto 18px;font-size:1.5rem;
  background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(56,189,248,.08));border:1px solid var(--light-line-strong);color:var(--blue-600)}
.cas-sector :is(h3,h4),.cas-sector h3{font-family:var(--font-display);font-size:1.16rem;font-weight:600;margin-bottom:8px;color:var(--light-text);letter-spacing:-.01em}
.cas-sector p{color:var(--light-dim);font-size:.92rem}
@media(max-width:820px){.cas-sectors{grid-template-columns:1fr}}

/* ============================================================
   ACCENT PROPRE À LA PAGE — constellation de cas d'usage (#22D3EE)
   (pilote Hanz) — overrides d'accent + visuels animés
   ============================================================ */
:root{ --accent:#22D3EE; }
.hero-cas #neural-canvas{ filter:hue-rotate(28deg) saturate(1.1); }
.hero-cas .hero-eyebrow{ color:#67E8F9; }
.hero-cas .grad-text{ background:linear-gradient(120deg,#67E8F9,#0891B2); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-cas .btn-primary{ background:linear-gradient(120deg,#22D3EE,#0891B2); box-shadow:0 10px 34px -10px rgba(34,211,238,.5); }

/* ------------------------------------------------------------
   VISUEL HÉRO — constellation de cas d'usage autour de l'entreprise
   ------------------------------------------------------------ */
.viz-cas-usage-ia-entreprise{ width:100%; height:auto; }
.viz-cas-usage-ia-entreprise text{ text-anchor:middle; font-family:Inter,system-ui,sans-serif; }

.viz-cas-usage-ia-entreprise .cas-link{ stroke:rgba(34,211,238,.26); stroke-width:1.4; }
.viz-cas-usage-ia-entreprise .cas-p{ fill:#A5F3FC; filter:drop-shadow(0 0 3px rgba(165,243,252,.85)); }

.viz-cas-usage-ia-entreprise .cas-node circle{ fill:rgba(34,211,238,.10); stroke:rgba(34,211,238,.55); stroke-width:1.4; }
.viz-cas-usage-ia-entreprise .cas-node text{ fill:#A5F3FC; font-size:13px; font-weight:600; letter-spacing:.01em; }
.viz-cas-usage-ia-entreprise .cas-node-ico{ font-family:"bootstrap-icons"; fill:#67E8F9; font-size:16px; }

.viz-cas-usage-ia-entreprise .cas-core{ fill:rgba(8,145,178,.22); }
.viz-cas-usage-ia-entreprise .cas-core-ring{ fill:none; stroke:#22D3EE; stroke-width:1.8;
  transform-box:fill-box; transform-origin:center; animation:cas-usage-ia-entreprise-pulse 3s ease-in-out infinite; }
.viz-cas-usage-ia-entreprise .cas-core-label{ fill:#fff; font-size:14px; font-weight:800; }
.viz-cas-usage-ia-entreprise .cas-core-sub{ fill:#67E8F9; font-size:11px; letter-spacing:.04em; text-transform:uppercase; }

@keyframes cas-usage-ia-entreprise-pulse{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.16); opacity:.55; } }

/* ------------------------------------------------------------
   VISUEL MILIEU DE PAGE — mini-cartographie : un usage posé sur votre réalité
   ------------------------------------------------------------ */
.cas-mini-map{ flex:none; width:200px; max-width:100%; margin:6px auto 0; }
.cas-usage-ia-entreprise-mini{ width:100%; height:auto; }
.cas-usage-ia-entreprise-mini text{ text-anchor:middle; font-family:Inter,system-ui,sans-serif; }
.cas-usage-ia-entreprise-mini .cas-mini-link{ stroke:rgba(34,211,238,.4); stroke-width:1.3; }
.cas-usage-ia-entreprise-mini .cas-mini-p{ fill:#22D3EE; filter:drop-shadow(0 0 2px rgba(34,211,238,.8)); }
.cas-usage-ia-entreprise-mini .cas-mini-src rect{ fill:rgba(34,211,238,.08); stroke:rgba(34,211,238,.5); stroke-width:1.2; }
.cas-usage-ia-entreprise-mini .cas-mini-src text{ fill:#0891B2; font-size:13px; font-weight:600; }
.cas-usage-ia-entreprise-mini .cas-mini-net line{ stroke:rgba(34,211,238,.32); stroke-width:1.2; }
.cas-usage-ia-entreprise-mini .cas-mini-net circle{ fill:rgba(34,211,238,.12); stroke:rgba(34,211,238,.5); stroke-width:1.2; }
.cas-usage-ia-entreprise-mini .cas-mini-core{ fill:rgba(34,211,238,.18); stroke:#22D3EE; stroke-width:1.6;
  transform-box:fill-box; transform-origin:center; animation:cas-usage-ia-entreprise-pulse 3s ease-in-out infinite; }
.cas-usage-ia-entreprise-mini .cas-mini-cap{ fill:#0891B2; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }

@media(max-width:760px){ .cas-mini-map{ width:170px; } }

@media (prefers-reduced-motion:reduce){
  .viz-cas-usage-ia-entreprise .cas-core-ring,
  .cas-usage-ia-entreprise-mini .cas-mini-core{ animation:none; }
}