/* ============================================================
   PAGE IA POUR CABINET D'ARCHITECTE — styles additionnels (design v3)
   Réutilise au maximum les patterns de he-agence-ia-toulouse-v3.css
   (hero, trust-strip, section-light/sombre/noire, sec-head, go-next,
    mir-card, qw-band, data-card, method-steps/mstep, map-cta, nope,
    about-cta…).
   N'ajoute ici que ce qui est propre à la page :
     - héros sectoriel un peu plus court
     - "le quotidien" : 4 cartes claires avec icône
     - "vos outils" : grille de logiciels (cartes sombres)
     - "ce que l'IA apporte" : 6 cartes claires, 2 accentuées
     - "l'avantage" : 3 cartes sombres à puces
     - "notre méthode" : mstep sur fond clair + map-cta clair
   Mêmes variables, mêmes codes visuels que la homepage.
   ============================================================ */

/* onglet de nav correspondant à la page courante */
.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}

/* --- FIL D'ARIANE (sous la nav, au-dessus du héros) --- */
.he-breadcrumb{position:relative;z-index:2;padding:90px 0 0}
.he-breadcrumb .bc-list{display:flex;gap:.5rem;align-items:center;list-style:none;padding:0;margin:0;
  font-family:var(--font-mono);font-size:.78rem}
.he-breadcrumb a{color:var(--blue-300);transition:color .2s}
.he-breadcrumb a:hover{color:var(--accent)}
.he-breadcrumb .bc-sep{color:var(--text-mute)}
.he-breadcrumb .bc-current{color:var(--text-dim)}
@media(max-width:1080px){.he-breadcrumb{padding-top:84px}}

/* --- HÉRO sectoriel : court (le fil d'Ariane occupe déjà l'espace sous la nav) --- */
.hero-sector{min-height:auto;padding:34px 0 96px}
.hero-in-sector{align-items:center}
.hero-sector h1{font-size:clamp(2.3rem,5.4vw,4.2rem)}
.hero-sector p.lede{margin-top:26px}
.hero-sector .hero-eyebrow i{color:var(--accent)}

/* ============================================================
   LE QUOTIDIEN — section claire (4 cartes miroir + icône)
   ============================================================ */
.arch-quotidien-grid{grid-template-columns:repeat(4,1fr)}
.arch-q-ico{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;font-size:1.3rem;margin-bottom:16px;
  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)}
.arch-quotidien .mir-card h3{margin-top:0}
@media(max-width:980px){.arch-quotidien-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.arch-quotidien-grid{grid-template-columns:1fr}}

/* ============================================================
   VOS OUTILS — section sombre (grille de logiciels)
   ============================================================ */
.arch-outils{background:radial-gradient(64% 60% at 50% 0%,rgba(37,99,235,.09),transparent 60%)}
.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tool-card{position:relative;border-radius:var(--radius);padding:28px 26px;overflow:hidden;
  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}
.tool-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)}
.tool-card:hover{transform:translateY(-6px);border-color:var(--line-strong);box-shadow:0 36px 64px -34px rgba(0,0,0,.7)}
.tool-card:hover::before{transform:scaleX(1)}
.tool-card .tool-ico{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;font-size:1.3rem;margin-bottom:18px;
  background:var(--grad-soft);border:1px solid var(--line-strong);color:var(--blue-300)}
.tool-card :is(h3,h4),.tool-card h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;letter-spacing:-.01em;margin-bottom:8px;color:var(--text)}
.tool-card p{color:var(--text-dim);font-size:.9rem}
@media(max-width:980px){.tools-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.tools-grid{grid-template-columns:1fr}}

/* ============================================================
   CE QUE L'IA APPORTE — section claire (6 cartes, 2 accentuées)
   ============================================================ */
.apport-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.apport-card{position:relative;border-radius:var(--radius);padding:32px 30px;overflow:hidden;display:flex;flex-direction:column;
  background:var(--light-surface);border:1px solid var(--light-line);box-shadow:0 18px 40px -30px rgba(15,27,45,.4);
  transition:transform .5s var(--ease),border-color .5s,box-shadow .5s}
.apport-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)}
.apport-card:hover{transform:translateY(-6px);border-color:var(--light-line-strong);box-shadow:0 36px 64px -34px rgba(15,27,45,.26)}
.apport-card:hover::before{transform:scaleX(1)}
.apport-card .apport-ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.4rem;margin-bottom:20px;
  background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(29,78,216,.08));border:1px solid var(--light-line-strong);color:var(--blue-600)}
.apport-card h3{font-size:1.18rem;margin-bottom:12px;color:var(--light-text)}
.apport-card p{color:var(--light-dim);font-size:.95rem;flex:1}
.apport-card .apport-phase{display:inline-block;margin-top:18px;font-size:.74rem;color:var(--light-mute);letter-spacing:.02em}
/* deux cartes accentuées (touche orange v3, parcimonieuse) : analyse réglementaire & estimation */
.apport-card.apport-accent::before{background:linear-gradient(90deg,var(--accent-warm),rgba(245,158,11,.2))}
.apport-card.apport-accent .apport-ico{background:linear-gradient(135deg,rgba(245,158,11,.14),rgba(217,119,6,.08));border-color:rgba(245,158,11,.28);color:#b45309}
.apport-card.apport-accent .apport-phase{color:#b45309}
.apport-note{text-align:center;margin-top:36px;font-family:var(--font-mono);font-size:.84rem;color:var(--light-mute)}
.apport-note i{color:var(--blue);margin-right:6px}
.apport-note b{color:var(--light-dim);font-weight:500}
@media(max-width:920px){.apport-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.apport-grid{grid-template-columns:1fr}}

/* ============================================================
   L'AVANTAGE — section sombre (3 cartes data à puces)
   ============================================================ */
.arch-avantage{background:radial-gradient(60% 70% at 18% 0%,rgba(29,78,216,.08),transparent 60%)}
.arch-av-list{list-style:none;margin-top:18px;display:grid;gap:12px}
.arch-av-list li{display:flex;gap:11px;align-items:flex-start;font-size:.93rem;color:var(--text-dim)}
.arch-av-list li i{color:var(--accent);margin-top:4px;font-size:.85rem;flex:none}

/* ============================================================
   NOTRE MÉTHODE — section claire (mstep + map-cta clair)
   ============================================================ */
.arch-methode .method-steps{margin-top:8px}
/* variante claire du bandeau exemple (map-cta) — texte lisible sur fond clair */
.map-cta-light{background:linear-gradient(135deg,rgba(37,99,235,.07),rgba(29,78,216,.04));border-color:var(--light-line-strong)}
.map-cta-light::before{background:radial-gradient(50% 100% at 0% 50%,rgba(56,189,248,.08),transparent 55%)}
.map-cta-light .play-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:.76rem;color:var(--blue-600);
  letter-spacing:.03em;border:1px solid rgba(37,99,235,.25);border-radius:999px;padding:6px 14px;margin-bottom:14px}
.map-cta-light .map-cta-copy h3{color:var(--light-text)}
.map-cta-light .map-cta-copy p{color:var(--light-dim)}
.map-cta-light .map-cta-copy p b{color:var(--light-text)}
.map-cta-light .map-cta-copy p em{color:var(--blue-600);font-style:normal;font-weight:600}

/* ============================================================
   ACCENT MÉTIER — bleu de plan / blueprint cyan (pilote Hanz)
   Couleur distinctive du bleu générique, lisible sur fond sombre.
   ============================================================ */
:root{ --accent:#22D3EE; }
.hero-sector .hero-eyebrow{ color:#67E8F9; }
.hero-sector .hero-eyebrow i{ color:#22D3EE; }
.hero-sector .grad-text{ background:linear-gradient(120deg,#67E8F9,#0EA5E9); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-sector .btn-primary{ background:linear-gradient(120deg,#22D3EE,#0EA5E9); box-shadow:0 10px 34px -10px rgba(34,211,238,.5); }

/* ============================================================
   SCHÉMA DE FLUX — héros cabinet d'architecte (pilote Hanz)
   Vos signaux métier -> l'IA prépare -> du temps de conception.
   ============================================================ */
.flux-cabinet-architecte{ width:100%; height:auto; }
.flux-cabinet-architecte text{ text-anchor:middle; font-family:Inter,system-ui,sans-serif; }
.flux-cabinet-architecte .flux-line{ stroke:rgba(103,232,249,.28); stroke-width:1.4; }
.flux-cabinet-architecte .flux-line.out{ stroke:rgba(14,165,233,.42); stroke-width:1.7; }
.flux-cabinet-architecte .p{ fill:#A5F3FC; filter:drop-shadow(0 0 3px rgba(165,243,252,.85)); }
.flux-cabinet-architecte .p.out{ fill:#22D3EE; }
.flux-cabinet-architecte .fnode circle{ fill:rgba(103,232,249,.12); stroke:rgba(103,232,249,.6); stroke-width:1.4; }
/* QA fix — labels de nœuds : 11→13px, légèrement épaissi */
.flux-cabinet-architecte .fnode text{ fill:#cffafe; font-size:13px; font-weight:700; }
.flux-cabinet-architecte .ia-core{ fill:#22D3EE; animation:caIaPulse 2.8s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
/* QA fix — label IA : bien visible, inchangé en taille */
.flux-cabinet-architecte .ia-label{ fill:#06283a; font-size:17px; font-weight:800; }
/* QA fix — sous-label IA : 9.5→11px */
.flux-cabinet-architecte .ia-sub{ fill:#a5f3fc; font-size:11px; letter-spacing:.04em; text-transform:uppercase; }
.flux-cabinet-architecte .vous{ fill:rgba(14,165,233,.18); stroke:#0EA5E9; stroke-width:1.7; }
/* QA fix — label Vous : 12→14px */
.flux-cabinet-architecte .vous-label{ fill:#fff; font-size:14px; font-weight:700; }
/* QA fix — sous-texte Vous : 10→11px */
.flux-cabinet-architecte .vous-sub{ fill:#a5f3fc; font-size:11px; }
/* QA fix — ticker .ev : 11.5→13px ; .ev-cap : 8.5→10px */
.flux-cabinet-architecte .ev{ fill:#A5F3FC; font-size:13px; font-weight:700; opacity:0; letter-spacing:.01em; }
.flux-cabinet-architecte .ev-cap{ fill:#0e7490; font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
@keyframes caIaPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.08); } }

/* ============================================================
   MINI-SCHÉMA MID-PAGE — section "l'IA en plus" (#ia-en-plus)
   Le circuit : demande -> l'IA prépare un brouillon -> vous validez/signez.
   Sobre, lisible sur fond clair (section-light).
   ============================================================ */
.ca-circuit{ margin:30px auto 0; max-width:680px; padding:0 12px; }
.ca-circuit-svg{ width:100%; height:auto; }
.ca-circuit-svg text{ text-anchor:middle; font-family:Inter,system-ui,sans-serif; }
.ca-circuit .ca-c-line{ stroke:rgba(8,145,178,.35); stroke-width:1.6; stroke-dasharray:4 4; }
.ca-circuit .ca-c-p{ fill:#0891b2; filter:drop-shadow(0 0 3px rgba(34,211,238,.7)); }
.ca-circuit .ca-c-p.out{ fill:#0EA5E9; }
.ca-circuit .ca-c-node circle{ fill:#ecfeff; stroke:rgba(8,145,178,.45); stroke-width:1.6; }
.ca-circuit .ca-c-node .ca-c-iacore{ fill:#22D3EE; stroke:none; animation:caCircuitPulse 2.8s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.ca-circuit .ca-c-glyph{ stroke:#0e7490; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.ca-circuit .ca-c-glyph rect{ stroke:#0e7490; }
.ca-circuit .ca-c-check{ stroke:#0891b2; stroke-width:2.4; }
/* QA fix — label IA circuit mid-page : 15→16px */
.ca-circuit .ca-c-ia{ fill:#06283a; font-size:16px; font-weight:800; }
/* QA fix — labels nœuds mid-page : 11.5→13px */
.ca-circuit .ca-c-lbl{ fill:#0f1b2d; font-size:13px; font-weight:700; }
/* QA fix — sous-textes mid-page : 9→11px */
.ca-circuit .ca-c-sub{ fill:#0e7490; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
@keyframes caCircuitPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.07); } }
@media(max-width:560px){ .ca-circuit{ max-width:420px; } .ca-circuit .ca-c-sub{ display:none; } }

/* prefers-reduced-motion : on coupe l'animation des cœurs IA */
@media (prefers-reduced-motion:reduce){
  .flux-cabinet-architecte .ia-core{ animation:none; }
  .ca-circuit .ca-c-iacore{ animation:none; }
}