/* ============================================================
   PAGE SOUVERAINETÉ & VOIE LOCALE — styles additionnels (design v3)
   Réutilise au maximum les patterns de he-agence-ia-toulouse-v3.css
   (hero, section-light/sombre, data-grid, map-cta, about-cta…).
   Propre à la page :
     - accent violet #A78BFA (la voie locale, la maîtrise sereine)
     - visuel animé du héros : le périmètre + le coffre de données
       (l'IA vient consulter sur place — zéro-copie)
     - bloc "preuve" en 3 jalons numérotés
   ============================================================ */

/* ============================================================
   ACCENT PROPRE À LA PAGE — #A78BFA
   le violet : la donnée gardée, la maîtrise calme.
   ============================================================ */
:root{ --accent:#A78BFA; }

.hero-souv .hero-eyebrow{ color:#C4B5FD; }

.hero-souv .grad-text,
.souv-data .grad-text,
.souv-proof .grad-text,
.souv-calm .grad-text,
.souv-cta .grad-text{
  background:linear-gradient(120deg,#C4B5FD,#7C3AED);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.hero-souv .btn-primary,
.souv-cta .btn-primary{
  background:linear-gradient(120deg,#A78BFA,#7C3AED);
  box-shadow:0 10px 34px -10px rgba(167,139,250,.55);
}

/* onglet de nav courant (au cas où la page est rattachée au menu plus tard) */
.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; }

/* teinte des icônes de cartes pour cette page (accent violet) */
.souv-data .data-ico,
.souv-calm .data-ico{ color:#C4B5FD; }
.souv-data .map-cta .play-tag,
.souv-data .map-cta-btn{ color:#C4B5FD; }

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

/* ============================================================
   VISUEL DU HÉROS — le périmètre protégé + le coffre de données
   #A78BFA : l'IA vient à vos données, rien ne sort.
   ============================================================ */
.souv-art{ position:relative; }
.viz-souv{ width:100%; height:auto; overflow:visible;
  filter:drop-shadow(0 30px 60px rgba(124,58,237,.20)); }
.viz-souv text{ font-family:var(--font-mono),monospace; }

.souv-perim-label{ fill:#C4B5FD; font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.souv-vault-label{ fill:#ddd6fe; font-size:12px; font-weight:600; letter-spacing:.02em; }

/* le périmètre : un trait pointillé qui respire doucement */
.souv-perimeter{ animation:souvBreathe 6s ease-in-out infinite;
  transform-box:fill-box; transform-origin:center; }

/* le cœur du coffre : pulsation calme */
.souv-core{ animation:souvPulse 2.8s ease-in-out infinite;
  transform-box:fill-box; transform-origin:center;
  filter:drop-shadow(0 0 14px rgba(167,139,250,.6)); }

/* nœuds IA, à l'intérieur du mur, qui apparaissent en cadence */
.souv-ai circle{ animation:souvNode 4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.souv-ai circle:nth-of-type(2){ animation-delay:.5s; }
.souv-ai circle:nth-of-type(3){ animation-delay:1s; }
.souv-ai circle:nth-of-type(4){ animation-delay:1.5s; }

/* les rayons : l'IA pointe vers le coffre (zéro-copie) */
.souv-ray{ stroke:rgba(167,139,250,.34); stroke-width:1.6; stroke-dasharray:4 6; stroke-linecap:round; }

/* les particules circulent du nœud IA VERS le coffre — jamais l'inverse :
   la requête entre, la donnée ne sort pas. */
.souv-p{ filter:drop-shadow(0 0 5px rgba(196,181,253,.9)); }
.souv-p1{ animation:souvIn1 3.4s ease-in-out infinite; }
.souv-p2{ animation:souvIn2 3.4s ease-in-out infinite .85s; }
.souv-p3{ animation:souvIn3 3.4s ease-in-out infinite 1.7s; }
.souv-p4{ animation:souvIn4 3.4s ease-in-out infinite 2.55s; }

@keyframes souvPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.18); } }
@keyframes souvBreathe{ 0%,100%{ opacity:.55; } 50%{ opacity:1; } }
@keyframes souvNode{ 0%,70%,100%{ transform:scale(1); opacity:.7; } 82%{ transform:scale(1.25); opacity:1; } }

/* trajectoires des particules : du nœud (coin) vers le bord du coffre */
@keyframes souvIn1{ 0%{ transform:translate(44px,150px); opacity:0; } 12%{ opacity:1; }
  88%{ opacity:1; } 100%{ transform:translate(120px,194px); opacity:0; } }
@keyframes souvIn2{ 0%{ transform:translate(316px,150px); opacity:0; } 12%{ opacity:1; }
  88%{ opacity:1; } 100%{ transform:translate(240px,194px); opacity:0; } }
@keyframes souvIn3{ 0%{ transform:translate(44px,290px); opacity:0; } 12%{ opacity:1; }
  88%{ opacity:1; } 100%{ transform:translate(120px,244px); opacity:0; } }
@keyframes souvIn4{ 0%{ transform:translate(316px,290px); opacity:0; } 12%{ opacity:1; }
  88%{ opacity:1; } 100%{ transform:translate(240px,244px); opacity:0; } }

@media(max-width:880px){
  .souv-art{ max-width:420px; margin:0 auto; }
}

/* ============================================================
   LA PREUVE — section claire : 3 jalons numérotés
   (variante de .method-steps avec un grand numéro accent)
   ============================================================ */
.souv-proof .proof-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:8px; }
.proof-step{ position:relative; border-radius:var(--radius);
  padding:30px 28px 28px; overflow:hidden;
  background:var(--light-surface); border:1px solid var(--light-line-strong);
  box-shadow:0 18px 44px -34px rgba(15,27,45,.4);
  transition:transform .45s var(--ease),box-shadow .45s,border-color .45s; }
.proof-step::before{ content:"";position:absolute;left:0;top:0;height:3px;width:100%;
  background:linear-gradient(120deg,#A78BFA,#7C3AED);
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease); }
.proof-step:hover{ transform:translateY(-6px); border-color:rgba(167,139,250,.35);
  box-shadow:0 34px 60px -36px rgba(124,58,237,.45); }
.proof-step:hover::before{ transform:scaleX(1); }
.proof-step .psn{ font-family:var(--font-mono),monospace; font-size:.92rem; font-weight:700;
  color:#7C3AED; letter-spacing:.02em; }
.proof-step .psico{ width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  font-size:1.25rem;margin:12px 0 16px;
  background:linear-gradient(135deg,rgba(167,139,250,.16),rgba(124,58,237,.08));
  border:1px solid rgba(167,139,250,.3); color:#7C3AED; }
.proof-step :is(h3,h4),.proof-step h3{ font-family:var(--font-display); font-size:1.12rem; margin:0 0 10px;
  line-height:1.25; color:var(--light-text); }
.proof-step p{ color:var(--light-dim); font-size:.96rem; margin:0; }
@media(max-width:880px){ .souv-proof .proof-steps{ grid-template-columns:1fr; } }

/* note honnête (rien n'est figé) */
.souv-note{ display:flex; gap:12px; align-items:flex-start; max-width:820px; margin:38px auto 0;
  padding:18px 22px; border-radius:16px;
  background:linear-gradient(135deg,rgba(167,139,250,.08),rgba(124,58,237,.04));
  border:1px solid rgba(167,139,250,.28); color:var(--light-dim); font-size:.98rem; }
.souv-note i{ color:#7C3AED; font-size:1.1rem; margin-top:2px; flex:none; }
.souv-note b{ color:var(--light-text); font-weight:600; }

/* ============================================================
   SECTIONS SOMBRES PROPRES — léger halo violet
   ============================================================ */
.souv-data{ background:radial-gradient(64% 60% at 22% 0%, rgba(124,58,237,.10),transparent 60%); }
.souv-calm{ background:radial-gradient(60% 70% at 78% 0%, rgba(167,139,250,.09),transparent 60%); }

/* ============================================================
   prefers-reduced-motion : on coupe toute pulsation / déplacement
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  .souv-perimeter,
  .souv-core,
  .souv-ai circle{ animation:none; }
  .souv-p{ visibility:hidden; }
  .souv-perimeter{ opacity:.8; }
}