@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@300;400;500;600;700&display=swap');
:root{
  --navy:#0A1628; --navy-2:#0F1F3D;
  --menu:"Barlow Semi Condensed",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --red:#E1233D; --red-dark:#c51230;
  --ink:#16181D; --muted:#5C6470; --muted-2:#8A909B;
  --line:#E7E9EE; --line-2:rgba(255,255,255,0.10);
  --bg:#ffffff;
  --head:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{ font-family:var(--body); color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased;
  background:#fff radial-gradient(1950px 880px at 100% 0%, rgba(184,196,225,0.9) 0%, rgba(233,186,201,0.42) 44%, rgba(255,255,255,0) 76%) no-repeat; }
a{ color:inherit; text-decoration:none; }
html{ overflow-x:clip; }
body{ overflow-x:clip; }
.container{ max-width:1240px; margin:0 auto; padding:0 48px; }
h1,h2,h3{ font-family:var(--head); font-weight:600; letter-spacing:-0.02em; line-height:1.05; }
.eyebrow{ font-family:var(--body); font-size:13px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--red); }
.eyebrow--dash::before{ content:""; display:inline-block; width:34px; height:2px; background:var(--red); vertical-align:middle; margin-right:16px; }
.hero .eyebrow{ color:var(--red); }
.hero .eyebrow--dash::before{ background:var(--red); }

/* ===== HEADER ===== */
.site-header{ background:transparent; color:var(--navy); border-bottom:0; position:sticky; top:0; z-index:200; }
/* Fond « bord de nuage » : blanc net en haut → flou → transparent en bas */
.site-header::before, .site-header::after{ content:""; position:absolute; left:0; right:0; top:0; bottom:-46px; pointer-events:none; }
.site-header::before{ z-index:-2; -webkit-backdrop-filter:blur(9px) saturate(1.3); backdrop-filter:blur(9px) saturate(1.3);
  -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 30%, rgba(0,0,0,0) 62%);
  mask-image:linear-gradient(to bottom, #000 0%, #000 30%, rgba(0,0,0,0) 62%); }
.site-header::after{ z-index:-1; background:linear-gradient(to bottom, #fff 0%, #fff 40%, rgba(255,255,255,0) 100%); }
.header-bar{ max-width:1360px; margin:0 auto; padding:13px 48px; display:flex; align-items:center; gap:24px; }
.logo{ display:flex; align-items:center; gap:14px; flex-shrink:0; text-decoration:none; }
.logo img{ height:46px; width:auto; display:block; aspect-ratio:280/256; object-fit:contain; flex:0 0 auto; }
.logo-word{ font-family:var(--head); font-weight:500; font-style:normal; font-size:25px; letter-spacing:-0.01em; color:#fff; line-height:1; }
.site-header .logo-word{ color:var(--navy); }
.main-nav{ margin-left:auto; display:flex; align-items:center; gap:28px; font-family:var(--menu); }
.main-nav a{ color:#16181D; font-size:17.5px; font-weight:400; letter-spacing:0; transition:opacity .2s, transform .2s; transform-origin:center; }
.main-nav a:not(.active){ opacity:0.82; }
.main-nav a:hover{ color:#16181D; opacity:1; transform:scale(1.08); }
.main-nav a.active{ color:#16181D; opacity:1; font-weight:700; }
.nav-cta{ background:transparent; color:#16181D !important; font-weight:400; padding:0; border-radius:0; }
.nav-cta:hover{ background:transparent; }
.main-nav .caret{ display:inline-block; font-size:9px; margin-left:7px; opacity:.65; vertical-align:middle; transition:transform .2s; }

/* ===== En-tête sombre : bascule en marine dès qu'on passe sur un fond marine ===== */
.site-header::after{ transition:background .3s ease; }
.site-header .logo-word,
.site-header .main-nav a,
.site-header .nav-cta,
.site-header .nav-toggle span{ transition:color .3s ease, background .3s ease; }
.site-header.is-dark::after{ background:linear-gradient(to bottom, #0A1628 0%, #0A1628 44%, rgba(10,22,40,0) 100%); }
.site-header.is-dark .logo-word{ color:#fff; }
.site-header.is-dark .main-nav a,
.site-header.is-dark .main-nav a:hover,
.site-header.is-dark .main-nav a.active,
.site-header.is-dark .nav-cta,
.site-header.is-dark .nav-cta:hover{ color:#fff !important; }
.site-header.is-dark .nav-toggle span{ background:#fff; }

/* Bouton burger (mobile uniquement) */
.nav-toggle{
  display:none; margin-left:auto; position:relative; z-index:120;
  width:44px; height:44px; padding:10px; border:0; border-radius:10px;
  background:transparent; cursor:pointer; flex-direction:column; justify-content:space-between;
}
.nav-toggle span{
  display:block; width:100%; height:2px; border-radius:2px; background:var(--navy);
  transition:transform .25s ease, opacity .2s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(11px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-11px) rotate(-45deg); }
.nav-backdrop{
  position:fixed; inset:0; z-index:90; background:rgba(10,22,40,.45);
  opacity:0; transition:opacity .25s ease;
}
.nav-backdrop.open{ opacity:1; }

/* ===== MÉGA-MENU "Nos services" ===== */
.nav-item{ align-self:stretch; display:flex; align-items:center; }
.nav-item.has-mega:hover .caret{ transform:rotate(180deg); }
.mega{
  position:absolute; left:0; right:0; top:100%;
  background:#fff; border-top:3px solid var(--red);
  box-shadow:0 34px 60px -24px rgba(20,30,60,0.28);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
  z-index:60;
}
.has-mega:hover .mega, .has-mega:focus-within .mega{ opacity:1; visibility:visible; transform:none; }
.mega-inner{ max-width:1360px; margin:0 auto; padding:30px 48px 32px; display:grid; grid-template-columns:repeat(5,1fr); gap:30px; }
.mega-col h4{ font-family:var(--head); font-size:17px; font-weight:600; color:var(--ink); margin-bottom:12px; transition:color .15s; }
.mega-col h4 a{ color:inherit; }
.mega-col h4 a:hover{ color:var(--red); }
.mega-col .cat-rule{ width:28px; height:2px; background:var(--red); margin-bottom:0; transition:width .18s ease; }
.mega-col:hover .cat-rule{ width:44px; }
.mega-col a{ display:block; color:var(--muted); font-size:14.5px; font-weight:400; padding:8px 0; line-height:1.35; transition:color .15s, padding-left .15s; }
.mega-col a:hover{ color:var(--red); padding-left:4px; }

/* ===== BUTTONS ===== */
/* Boutons : même langage que les actions finales — typo de titre, filet fin et
   pastille fléchée, plutôt qu'un aplat de couleur. Version en ligne ici ;
   .cta-actions en donne la version pleine largeur, plus grande. */
.btn{
  position:relative; cursor:pointer;
  display:inline-flex; align-items:center; gap:14px;
  padding:8px 0; background:none; border:0; border-bottom:1.5px solid var(--line); border-radius:0;
  font-family:var(--head); font-weight:600; font-size:18px; letter-spacing:-0.01em;
  color:var(--navy); transition:color .22s ease;
}
.btn::before{
  content:""; position:absolute; left:0; right:0; bottom:-1.5px; height:1.5px;
  background:var(--red); transform:scaleX(0); transform-origin:left;
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.btn::after{
  content:"→"; flex:0 0 auto;
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1.5px solid var(--line);
  font-family:var(--body); font-size:16px; font-weight:400; line-height:1;
  transition:transform .22s ease, background .22s ease, border-color .22s ease, color .22s ease;
}
.btn:hover{ color:var(--red); background:none; }
.btn:hover::before{ transform:scaleX(1); }
.btn:hover::after{ background:var(--red); border-color:var(--red); color:#fff; transform:translateX(4px); }
.btn:focus-visible{ outline:2px solid var(--red); outline-offset:4px; }
/* action principale : pastille déjà pleine au repos */
.btn-primary{ background:none; color:var(--navy); }
.btn-primary::after{ background:var(--red); border-color:var(--red); color:#fff; }
.btn-primary:hover{ background:none; color:var(--red); }
/* action secondaire : plus discrète */
.btn-soft{ background:none; border:0; border-bottom:1.5px solid var(--line); color:var(--muted); font-weight:500; }
.btn-soft:hover{ background:none; }
.btn-navy{ background:none; color:var(--navy); }
.btn-navy:hover{ background:none; }
.btn-ghost{ background:none; color:var(--ink); }
.btn-ghost:hover{ background:none; }
.btn-block{ width:100%; }

/* ===== HERO (accueil) ===== */
.hero{ position:relative; overflow:hidden; background:transparent; }
.hero .container{ padding-top:80px; padding-bottom:110px; }
.hero-link{ color:var(--navy); font-weight:600; font-size:16px; align-self:center; transition:opacity .2s;
  text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1.5px; }
.hero-link:hover{ opacity:.65; }

/* Accueil : le dégradé prend tout l'espace (rayonne du coin haut-droit), en-tête transparent */
body[data-page="home"]{
  background:#fff radial-gradient(1950px 880px at 100% 0%,
    rgba(184,196,225,0.9) 0%, rgba(233,186,201,0.42) 44%, rgba(255,255,255,0) 76%) no-repeat;
}
body[data-page="home"] .site-header{ background:transparent; }
.hero h1{ font-size:72px; font-weight:600; margin:22px 0 0; max-width:16ch; }
.hero h1 .red{ color:var(--red); display:block; }
.hero h1 .line-navy{ color:var(--navy); display:block; }
.hero p.lead{ font-size:20px; color:var(--muted); max-width:640px; margin:34px 0 0; line-height:1.55; }
.hero-ctas{ display:flex; gap:16px; margin-top:44px; flex-wrap:wrap; }

/* Hero : titre à gauche + colonne des secteurs à droite */
.hero-cols{ display:flex; gap:64px; align-items:center; }
.hero-main{ flex:1 1 auto; min-width:0; }
.hero-sectors{ flex:0 0 300px; display:flex; flex-direction:column; text-align:right; margin-right:8px; }
.hero-sector{ padding:15px 6px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:flex-end; gap:14px; text-decoration:none; color:inherit; }
.hero-sector:last-child{ border-bottom:1px solid var(--line); }
.hero-sector h3{ font-family:var(--head); font-size:19px; font-weight:600; color:var(--navy); margin:0; transition:color .2s; }
.hero-sector:hover h3{ color:var(--red); }
.hero-sector-ico{ display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; width:34px; height:34px; border-radius:10px; color:var(--red); background:rgba(225,35,61,0.09); transition:transform .25s ease, background .2s ease; }
.hero-sector:hover .hero-sector-ico{ transform:scale(1.08); background:rgba(225,35,61,0.16); }
.hero-sector-ico svg{ width:20px; height:20px; }
.hero-sectors-label{ display:block; font-family:var(--body); font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--red); margin-bottom:4px; }

/* Badge « cabinet français / souveraineté » */
.hero-badge{ display:inline-flex; align-items:center; margin-top:30px; padding:9px 16px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,0.6); font-size:14px; font-weight:500; color:var(--navy); }

/* ===== SECTION GALÉA (intro page d'accueil) + heaume au survol ===== */
/* overflow-x:clip : le halo du logo est plus large que la colonne, on l'empêche
   de créer un défilement horizontal sans bloquer le survol. */
.galea-intro{ padding:92px 0; overflow-x:clip; }
.galea-intro-grid{ display:flex; align-items:center; gap:64px; }
.galea-intro-text{ flex:1 1 auto; min-width:0; }
.galea-intro-text h2{ font-family:var(--head); font-size:40px; font-weight:600; color:var(--navy); margin:16px 0 16px; max-width:18ch; line-height:1.1; }
.galea-intro-text p{ font-size:18px; color:var(--muted); line-height:1.62; max-width:58ch; margin:0 0 22px; }
.galea-intro-text p strong{ color:var(--navy); }
.galea-orb{ flex:0 0 300px; position:relative; display:flex; align-items:center; justify-content:center; }
/* Halo large et diffus posé SOUS le logo. Un drop-shadow épouserait la silhouette
   du bouclier et en dessinerait le contour ; une ellipse floue s'y fond. */
.galea-orb::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  left:50%; bottom:-30%; width:220%; height:60%; transform:translateX(-50%);
  background:radial-gradient(closest-side ellipse at 50% 50%,
    rgba(46,196,182,0.38) 0%, rgba(46,196,182,0.22) 38%, rgba(46,196,182,0.08) 64%, rgba(46,196,182,0) 84%);
  filter:blur(16px);
  transition:width .4s ease, height .4s ease;
}
.galea-orb:hover::before{ width:225%; height:82%; }
.galea-orb-img{ position:relative; z-index:1; height:240px; width:auto; transition:transform .4s ease; }
.galea-orb:hover .galea-orb-img{ transform:scale(1.05); }
.galea-orb-reveal{
  position:absolute; left:50%; top:calc(100% + 16px); bottom:auto; transform:translate(-50%, 12px);
  width:320px; max-width:82vw; text-align:center;
  background:#0A1628; color:rgba(255,255,255,0.86); border:1px solid rgba(46,196,182,0.35);
  border-radius:16px; padding:18px 20px; font-size:14px; line-height:1.5;
  box-shadow:0 34px 64px -22px rgba(46,196,182,0.55);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .38s ease, transform .38s ease;
}
.galea-orb-reveal strong{ display:block; font-family:var(--head); font-size:17px; color:#2EC4B6; margin-bottom:6px; }
.galea-orb:hover .galea-orb-reveal{ opacity:1; visibility:visible; transform:translate(-50%, 0); }

/* ===== PAGE HERO (sous-pages) ===== */
.page-hero{ position:relative; background:transparent; }
.page-hero::after{ display:none; }
.page-hero .container{ padding-top:84px; padding-bottom:72px; }
.page-hero h1{ font-size:60px; margin:22px 0 0; max-width:20ch; }
.page-hero h1 .red{ color:var(--red); }
.page-hero p.lead{ font-size:20px; color:var(--muted); max-width:60ch; margin:26px 0 0; line-height:1.55; }
.page-hero .hero-ctas{ margin-top:38px; }

/* ===== PAGE SERVICES : sommaire + sections à la suite ===== */
.svc-index{ display:flex; flex-wrap:wrap; gap:12px 14px; margin-top:40px; }
.svc-index a{
  font-family:var(--menu); font-size:15px; letter-spacing:.01em; color:var(--navy);
  padding:9px 16px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,0.55);
  transition:background .2s, border-color .2s, transform .2s;
}
.svc-index a:hover{ background:#fff; border-color:var(--navy); transform:translateY(-1px); }
.svc-section{ scroll-margin-top:28px; }
.svc-section + .svc-section .container{ border-top:1px solid var(--line); padding-top:76px; }
.svc-section .section-lead{ font-size:19px; color:var(--muted); max-width:70ch; margin:16px 0 6px; line-height:1.55; }

/* ===== RÉFÉRENTIELS STRIP ===== */
.refs{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.refs .container{ display:flex; align-items:center; gap:32px; padding-top:30px; padding-bottom:30px; }
.refs .lbl{ flex:0 0 auto; font-size:13px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted-2); }
.refs .item{ font-family:var(--head); font-weight:500; font-size:17px; letter-spacing:0.01em; color:var(--ink); }
/* Bandeau défilant (droite vers gauche) */
.refs-marquee{ flex:1 1 auto; min-width:0; overflow:hidden;
  -webkit-mask:linear-gradient(90deg, transparent 0, #000 4%, #000 94%, transparent 100%);
          mask:linear-gradient(90deg, transparent 0, #000 4%, #000 94%, transparent 100%); }
/* marge portée par chaque élément (et non gap) : le décalage de -50% tombe juste */
.refs-track{ display:flex; align-items:center; width:max-content; animation:marquee-scroll 34s linear infinite; }
.refs-track .item{ flex:0 0 auto; margin-right:38px; white-space:nowrap; }
.refs-marquee:hover .refs-track{ animation-play-state:paused; }
@media (prefers-reduced-motion: reduce){ .refs-track{ animation:none; } }

/* ===== RÉFÉRENCES CLIENTS : bandeau défilant ===== */
.refs-clients{ padding:76px 0 80px; }
.refs-clients-head{ text-align:center; }
.refs-clients-head h2{ font-family:var(--head); font-size:34px; font-weight:600; color:var(--navy); margin:0; }
.refs-underline{ width:64px; height:2px; background:var(--navy); margin:18px auto 0; }
.marquee{ --logo-h:88px; --logo-gap:68px; --fade:5%;
  margin-top:52px; overflow:hidden; display:flex; align-items:center; height:var(--logo-h);
  -webkit-mask:linear-gradient(90deg, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);
          mask:linear-gradient(90deg, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%); }
/* piste : couche GPU dédiée (will-change/backface) → plus de scintillement ni de
   « cache blanc » ; flex:0 0 auto empêche toute compression. */
.marquee-track{ display:flex; align-items:center; width:max-content; flex:0 0 auto;
  animation:marquee-scroll 60s linear infinite; will-change:transform; backface-visibility:hidden; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.ref-logo{ height:var(--logo-h); width:auto; flex:0 0 auto; margin-right:var(--logo-gap); object-fit:contain;
  filter:grayscale(1); opacity:.9; transition:filter .3s ease, opacity .3s ease; }
.marquee:hover .ref-logo:hover{ filter:grayscale(0); opacity:1; }
/* Rattrapage : ces fichiers n'ont aucune marge interne, leur marque remplit toute
   l'image et paraît donc bien plus grosse. Proportions calées pour que la marque
   visible fasse ~58px sur 88, la médiane des autres logos — exprimées en fraction
   pour rester justes quand --logo-h change (téléphone). */
.ref-logo[src$="/abb.png"]{ height:calc(var(--logo-h) * 0.75); }
.ref-logo[src$="/mcr.png"]{ height:calc(var(--logo-h) * 0.773); }
.ref-logo[src$="/oco.png"]{ height:calc(var(--logo-h) * 0.727); }
.ref-logo[src$="/ace.png"]{ height:calc(var(--logo-h) * 0.705); }
.ref-logo[src$="/snees.png"]{ height:calc(var(--logo-h) * 0.659); }
/* Inverse : ces logos ont beaucoup de marge interne, la marque paraît minuscule.
   On les agrandit ; le débordement au-dessus/dessous de la bande (marge vide) est
   rogné par .marquee (hauteur fixe), la marque reste donc calée sur les autres. */
.ref-logo[src$="/3g.png"]{ height:calc(var(--logo-h) * 1.5); }
.ref-logo[src$="/octomiro.png"]{ height:calc(var(--logo-h) * 1.55); }
.ref-logo[src$="/rhonalu.png"]{ height:calc(var(--logo-h) * 1.3); }
/* Hors téléphone : un seul bandeau, qui contient les 26 logos. Le second bandeau
   n'apparaît qu'en dessous de 600px, où l'on retire de le premier les logos
   qu'il reprend (la liste étant doublée, les masquer garde la boucle juste). */
.marquee--second{ display:none; margin-top:22px; }
.marquee-track--rev{ animation-name:marquee-scroll-rev; animation-duration:52s; }
@keyframes marquee-scroll{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }
@keyframes marquee-scroll-rev{ from{ transform:translate3d(-50%,0,0); } to{ transform:translate3d(0,0,0); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

/* ===== PÔLE CTI : chiffres animés ===== */
.stats-band{ padding:88px 0; }
.stats-band--top{ padding-top:24px; }
.stats-title{ font-family:var(--head); font-size:32px; font-weight:600; color:var(--navy); text-align:center; margin:0; }
.stats-band .refs-underline{ margin-top:18px; }
.stats-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:56px; }
.stat{ text-align:center; }
.stat-num{ font-family:var(--head); font-size:66px; font-weight:700; color:var(--navy); line-height:1; letter-spacing:-1.5px; }
.stat-label{ margin-top:16px; font-size:14px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted-2); line-height:1.4; }

/* ===== HALO PÂLE sous les cartes de texte (toutes pages) ===== */
.svc-card, .sector-card, .article-card, .svc-ov-card, .split-card, .contact-card{
  box-shadow:0 22px 52px -30px rgba(56,104,196,0.40), 0 0 22px rgba(56,104,196,0.06);
}
.cabinet--framed{ box-shadow:0 30px 72px -44px rgba(46,96,178,0.42), 0 0 26px rgba(56,104,196,0.07); }

/* ===== PAGE(S) « NOS SERVICES » : thème bleu ===== */
body[data-page="services"]{
  --red:#2456A6; --red-dark:#1c4488;
}
body[data-page="services"] .page-hero::after{ display:none; }

/* Cartes de sous-services (pages de service) : modernes + animées */
.subsvc-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; counter-reset:sub; }
.subsvc-card{ position:relative; display:flex; flex-direction:column; background:linear-gradient(165deg,#fff 0%,#fbfcff 100%);
  border:1px solid rgba(36,86,166,0.14); border-radius:20px; padding:34px 36px 30px; overflow:hidden; color:inherit;
  box-shadow:0 26px 56px -34px rgba(36,86,166,0.40);
  transition:transform .38s cubic-bezier(.2,.7,.2,1), box-shadow .38s ease, border-color .3s ease; }
.subsvc-grid > .subsvc-card:nth-child(even){ margin-top:38px; }
/* barre d'accent haute (dégradé bleu → rouge) */
.subsvc-card::before{ content:""; position:absolute; left:0; top:0; height:4px; width:100%;
  background:linear-gradient(90deg, var(--red), #E1233D); transform:scaleX(0); transform-origin:left; transition:transform .45s ease; z-index:2; }
.subsvc-card:hover::before{ transform:scaleX(1); }
/* gros numéro en filigrane dégradé */
.subsvc-card::after{ counter-increment:sub; content:counter(sub,decimal-leading-zero);
  position:absolute; top:8px; right:22px; font-family:var(--head); font-size:64px; font-weight:700; line-height:1;
  background:linear-gradient(140deg, var(--red) 8%, #E1233D 92%); -webkit-background-clip:text; background-clip:text; color:transparent;
  opacity:.13; pointer-events:none; transition:opacity .38s ease, transform .38s ease; }
.subsvc-card:hover{ transform:translateY(-8px); border-color:rgba(36,86,166,0.32);
  box-shadow:0 46px 84px -36px rgba(36,86,166,0.52), 0 0 42px rgba(225,35,61,0.08); }
.subsvc-card:hover::after{ opacity:.22; transform:scale(1.08); }
.subsvc-card h3{ position:relative; z-index:1; font-family:var(--head); font-size:21px; font-weight:600; color:var(--navy); margin:0 62px 12px 0; }
.subsvc-card p{ position:relative; z-index:1; color:var(--muted); font-size:15.5px; line-height:1.62; margin:0; flex:1; }
.subsvc-link{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:7px; margin-top:20px; font-weight:600; font-size:14.5px;
  background:linear-gradient(90deg, var(--red), #E1233D); -webkit-background-clip:text; background-clip:text; color:transparent; transition:gap .25s ease; }
a.subsvc-card:hover .subsvc-link{ gap:14px; }

/* ============ Zig-zag éditorial (page Stratégie) ============ */
.strat-sec .block-title{ margin-bottom:8px; }
.zz{ max-width:940px; margin:44px auto 0; }
.zz-row{ padding:38px 0; border-top:1px solid rgba(36,86,166,0.16); }
.zz-row:first-child{ border-top:0; }
.zz-txt{ max-width:600px; }
.zz-alt .zz-txt{ margin-left:auto; text-align:right; }
.zz-mark{ display:block; width:52px; height:5px; border-radius:999px; margin-bottom:22px;
  background:linear-gradient(90deg, var(--red), #6E8FD6);
  transition:width .4s cubic-bezier(.2,.7,.2,1); }
.zz-alt .zz-mark{ margin-left:auto; background:linear-gradient(90deg, #6E8FD6, var(--red)); }
.zz-row:hover .zz-mark{ width:78px; }
.zz-txt h3{ font-family:var(--head); font-weight:600; font-size:27px; line-height:1.16;
  color:var(--navy); margin:0 0 14px; letter-spacing:-0.02em; }
.zz-txt p{ color:var(--muted); font-size:16px; line-height:1.68; margin:0; }
.zz-link{ display:inline-flex; align-items:center; gap:7px; margin-top:16px; font-weight:600; font-size:14.5px;
  background:linear-gradient(90deg, var(--red), #E1233D); -webkit-background-clip:text; background-clip:text; color:transparent; transition:gap .25s ease; }
.zz-alt .zz-link{ flex-direction:row-reverse; }
.zz-link:hover{ gap:13px; }
@media(max-width:720px){
  .zz-row{ padding:30px 0; }
  .zz-alt .zz-txt{ margin-left:0; text-align:left; }
  .zz-alt .zz-mark{ margin-left:0; }
  .zz-alt .zz-link{ flex-direction:row; }
}

/* ============ Bento mosaïque (page Audits) ============ */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:1fr; gap:18px; margin-top:44px; }
.bento-cell{ position:relative; overflow:hidden; grid-column:span 3;
  background:linear-gradient(162deg,#fff 0%,#f7f9fe 100%); border:1px solid rgba(36,86,166,0.14);
  border-radius:20px; padding:30px 32px; display:flex; flex-direction:column;
  box-shadow:0 26px 56px -34px rgba(36,86,166,0.40);
  transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .3s ease; }
.bento-cell:nth-child(4),.bento-cell:nth-child(5),.bento-cell:nth-child(6){ grid-column:span 2; }
.bento-feature{ grid-column:span 3; grid-row:span 2; justify-content:flex-end;
  background:linear-gradient(158deg,#0A1628 0%,#132443 60%,#1c3563 100%); border-color:transparent; color:#fff; }
.bento-feature::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(520px 340px at 88% 8%, rgba(36,86,166,0.55), transparent 62%),
             radial-gradient(360px 300px at 6% 100%, rgba(225,35,61,0.34), transparent 60%); }
.bento-feature > *{ position:relative; z-index:1; }
.bento-tag{ font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:600; letter-spacing:0.06em;
  color:var(--red); margin-bottom:auto; }
.bento-feature .bento-tag{ color:#7FB0FF; }
.bento-cell h3{ font-family:var(--head); font-weight:600; font-size:20px; color:var(--navy); margin:18px 0 10px; letter-spacing:-0.01em; }
.bento-feature h3{ font-size:32px; color:#fff; margin-top:22px; }
.bento-cell p{ color:var(--muted); font-size:15px; line-height:1.6; margin:0; }
.bento-feature p{ color:rgba(255,255,255,0.82); font-size:16px; line-height:1.62; }
.bento-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.bento-chips span{ font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:500; color:#cfe0ff;
  border:1px solid rgba(127,176,255,0.34); border-radius:999px; padding:5px 12px; }
.bento-accent{ background:linear-gradient(158deg,#E1233D 0%,#b81c31 100%); border-color:transparent; }
.bento-accent .bento-tag{ color:rgba(255,255,255,0.8); }
.bento-accent h3{ color:#fff; }
.bento-accent p{ color:rgba(255,255,255,0.88); }
.bento-cell:hover{ transform:translateY(-6px); box-shadow:0 44px 82px -38px rgba(36,86,166,0.52); }
.bento-cell:not(.bento-feature):not(.bento-accent):hover{ border-color:rgba(36,86,166,0.3); }
@media(max-width:820px){
  .bento{ grid-template-columns:1fr; grid-auto-rows:auto; }
  .bento-cell,.bento-feature,.bento-cell:nth-child(4),.bento-cell:nth-child(5),.bento-cell:nth-child(6){ grid-column:span 1; grid-row:auto; }
  /* Plus de hauteurs égalisées : le contenu suit son étiquette, sans grand vide */
  .bento-cell{ padding:24px 26px; }
  .bento-tag{ margin-bottom:12px; }
  .bento-feature{ justify-content:flex-start; }
  .bento-feature h3{ margin-top:14px; }
}

/* ============ Lignes-fonctionnalités à icône (page Accompagnement IA) ============ */
.frows{ max-width:960px; margin:44px auto 0; display:flex; flex-direction:column; gap:14px; }
.frow{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:26px; color:inherit;
  background:linear-gradient(120deg,#fff 0%,#f8faff 100%); border:1px solid rgba(36,86,166,0.12);
  border-radius:18px; padding:26px 32px; position:relative; overflow:hidden;
  box-shadow:0 20px 46px -34px rgba(36,86,166,0.36);
  transition:transform .38s cubic-bezier(.2,.7,.2,1), box-shadow .38s ease, border-color .3s ease; }
.frow:nth-child(even){ background:linear-gradient(120deg,#f4f7fe 0%,#eef3fc 100%); }
.frow-ico{ flex:0 0 auto; width:66px; height:66px; border-radius:18px; display:grid; place-items:center; color:#fff;
  background:linear-gradient(150deg,var(--red) 0%,#4a6fc0 100%); box-shadow:0 14px 28px -12px rgba(36,86,166,0.55);
  transition:transform .38s cubic-bezier(.2,.7,.2,1); }
.frow:nth-child(even) .frow-ico{ background:linear-gradient(150deg,#4a6fc0 0%,var(--red) 100%); }
.frow-ico svg{ width:32px; height:32px; }
.frow:hover{ transform:translateX(6px); border-color:rgba(36,86,166,0.28); box-shadow:0 32px 64px -36px rgba(36,86,166,0.5); }
.frow:hover .frow-ico{ transform:scale(1.06) rotate(-3deg); }
.frow-body h3{ font-family:var(--head); font-weight:600; font-size:20px; color:var(--navy); margin:0 0 7px; letter-spacing:-0.01em; }
.frow-body p{ color:var(--muted); font-size:15.5px; line-height:1.62; margin:0; }
.frow-link{ display:inline-flex; align-items:center; gap:7px; margin-top:13px; font-weight:600; font-size:14.5px;
  background:linear-gradient(90deg,var(--red),#4a6fc0); -webkit-background-clip:text; background-clip:text; color:transparent; transition:gap .25s ease; }
.frow-lead:hover .frow-link{ gap:13px; }
.frow-lead{ background:linear-gradient(120deg,#0A1628 0%,#152a4e 100%); border-color:transparent; }
.frow-lead .frow-body h3{ color:#fff; font-size:22px; }
.frow-lead .frow-body p{ color:rgba(255,255,255,0.82); }
.frow-lead .frow-ico{ background:linear-gradient(150deg,#E1233D 0%,#7FB0FF 100%); }
.frow-lead .frow-link{ background:linear-gradient(90deg,#ff8aa0,#7FB0FF); -webkit-background-clip:text; background-clip:text; color:transparent; }
@media(max-width:640px){
  .frow{ grid-template-columns:1fr; gap:16px; padding:24px; }
  .frow-ico{ width:56px; height:56px; }
}

/* Révélation au défilement */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ===== ENTRÉE DU HERO au chargement (cascade douce, tous formats) ===== */
@keyframes ph-enter{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
.page-hero .container > *,
.hero .hero-main > *,
.contact-intro > *{ animation:ph-enter .7s cubic-bezier(.2,.7,.2,1) both; }
.page-hero .container > *:nth-child(1),.hero .hero-main > *:nth-child(1),.contact-intro > *:nth-child(1){ animation-delay:.05s; }
.page-hero .container > *:nth-child(2),.hero .hero-main > *:nth-child(2),.contact-intro > *:nth-child(2){ animation-delay:.13s; }
.page-hero .container > *:nth-child(3),.hero .hero-main > *:nth-child(3),.contact-intro > *:nth-child(3){ animation-delay:.21s; }
.page-hero .container > *:nth-child(4),.hero .hero-main > *:nth-child(4),.contact-intro > *:nth-child(4){ animation-delay:.29s; }
.page-hero .container > *:nth-child(5),.hero .hero-main > *:nth-child(5),.contact-intro > *:nth-child(5){ animation-delay:.37s; }
.hero .hero-sectors{ animation:ph-enter .8s cubic-bezier(.2,.7,.2,1) both; animation-delay:.34s; }
@media (prefers-reduced-motion: reduce){
  .page-hero .container > *,.hero .hero-main > *,.contact-intro > *,.hero .hero-sectors{ animation:none; }
}

/* ===== SECTIONS VARIÉES (pages de service riches) ===== */
.block-title.center{ text-align:center; }
.center-lead{ text-align:center; max-width:780px; margin:16px auto 0; color:var(--muted); font-size:18px; line-height:1.62; }
.soft-band{ background:rgba(56,104,196,0.05); }

/* Définition en colonnes */
.def-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:30px; margin-top:48px; }
.def-ico{ display:inline-flex; color:var(--red); }
.def-ico svg{ width:26px; height:26px; }
.def h4{ font-family:var(--head); font-size:16px; font-weight:600; color:var(--navy); margin:14px 0 8px; }
.def p{ color:var(--muted); font-size:14.5px; line-height:1.55; margin:0; }

/* Section timeline : fond dégradé coloré (rose → lavande → bleu) */
.timeline-band{ position:relative; }

/* Pages services : taches floues de couleur (sans bordure) réparties sur la page */
body[data-page="services"]{
  background:
    radial-gradient(1900px 820px at 100% 0%, rgba(184,196,225,0.85) 0%, rgba(233,186,201,0.36) 44%, rgba(255,255,255,0) 74%),
    radial-gradient(760px 680px at 13% 47%, rgba(241,150,178,0.62), transparent 70%),
    radial-gradient(820px 720px at 90% 58%, rgba(150,185,236,0.72), transparent 70%),
    radial-gradient(700px 640px at 30% 71%, rgba(196,178,230,0.62), transparent 70%),
    radial-gradient(780px 700px at 84% 83%, rgba(241,150,178,0.55), transparent 70%),
    radial-gradient(720px 660px at 18% 93%, rgba(150,185,236,0.66), transparent 70%),
    #fff;
  background-repeat:no-repeat;
}
body[data-page="services"] .soft-band{ background:transparent; }
body[data-page="services"] .cta-final{ background:transparent; }
/* Titre : mot d'accent en dégradé bleu → rouge */
body[data-page="services"] .page-hero h1 .red{
  background:linear-gradient(120deg, var(--red) 0%, #E1233D 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.timeline-band .container{ position:relative; z-index:1; }

/* Timeline en zigzag + trait de progression animé au scroll */
.timeline{ position:relative; max-width:940px; margin:48px auto 0; }
.timeline::before{ content:""; position:absolute; left:50%; top:6px; bottom:6px; width:3px; background:rgba(10,22,40,0.12); transform:translateX(-50%); border-radius:3px; }
.timeline::after{ content:""; position:absolute; left:50%; top:6px; width:3px; height:var(--tl-progress,0px); transform:translateX(-50%);
  background:var(--red); border-radius:3px;
  box-shadow:0 0 12px rgba(36,86,166,0.4); z-index:0; transition:height .12s linear; }
.tl-item{ position:relative; width:50%; padding:16px 0; box-sizing:border-box; }
.tl-left{ left:0; padding-right:46px; }
.tl-right{ left:50%; padding-left:46px; }
.tl-item::after{ content:""; position:absolute; top:34px; width:15px; height:15px; border-radius:50%; background:#fff; border:3px solid #fff; box-shadow:0 0 0 1px rgba(10,22,40,0.18); z-index:1; transition:background .3s ease, box-shadow .3s ease; }
.tl-item.is-reached::after{ background:var(--red); box-shadow:0 0 0 1px var(--red), 0 0 12px rgba(36,86,166,0.45); }
.tl-left::after{ right:-8px; }
.tl-right::after{ left:-8px; }
.tl-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px 26px; box-shadow:0 22px 52px -32px rgba(56,104,196,0.30); transition:transform .28s ease, box-shadow .28s ease; }
.tl-card:hover{ transform:translateY(-4px); box-shadow:0 32px 64px -34px rgba(46,96,178,0.48); }
.tl-card h4{ font-family:var(--head); font-size:18px; font-weight:600; color:var(--navy); margin:0 0 10px; }
.tl-card p{ color:var(--muted); font-size:15px; line-height:1.55; margin:0 0 16px; }
.tl-card .btn{ font-size:16px; padding:6px 0; gap:11px; }
.tl-card .btn::after{ width:32px; height:32px; font-size:14px; }

/* Double colonne de texte */
.two-col-text{ display:grid; grid-template-columns:1fr 1fr; gap:48px; max-width:1000px; margin:40px auto 0; }
.two-col-text p{ color:var(--ink); font-size:16px; line-height:1.72; margin:0 0 18px; }
.two-col-text strong{ color:var(--navy); }

/* Flux d'attaque en icônes */
.flow{ display:flex; align-items:flex-start; justify-content:center; gap:6px; margin-top:48px; flex-wrap:wrap; }
.flow-step{ flex:1 1 0; min-width:148px; max-width:190px; text-align:center; }
.flow-ico{ display:inline-flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:15px; background:rgba(56,104,196,0.10); color:var(--navy); margin-bottom:14px; }
.flow-ico svg{ width:30px; height:30px; }
.flow-step p{ color:var(--muted); font-size:14px; line-height:1.5; margin:0; }
.flow-arrow{ color:var(--red); font-size:22px; font-weight:700; align-self:flex-start; margin-top:16px; flex:0 0 auto; }

/* Grille « pourquoi » numérotée + carte CTA colorée */
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px 44px; margin-top:48px; }
.why-num{ display:block; font-family:var(--head); font-size:40px; font-weight:700; color:var(--red); line-height:1; }
.why-item h4{ font-family:var(--head); font-size:18px; font-weight:600; color:var(--navy); margin:12px 0 10px; }
.why-item p{ color:var(--muted); font-size:15px; line-height:1.6; margin:0; }
.why-cta{ display:flex; flex-direction:column; justify-content:center; gap:20px; border-radius:20px; padding:34px; color:var(--navy);
  background:radial-gradient(130% 150% at 12% 62%, #f4a7bd 0%, #e3b4d2 34%, #bcbfe4 62%, #a9c1e9 100%);
  box-shadow:0 30px 60px -30px rgba(46,96,178,0.45); }
.why-cta p{ font-family:var(--head); font-size:20px; line-height:1.35; margin:0; color:var(--navy); }
.why-cta strong{ color:var(--navy); }
.why-cta .btn{ align-self:flex-start; background:none; color:var(--navy); border-bottom:1.5px solid rgba(10,22,40,0.3); }
.why-cta .btn::after{ border-color:rgba(10,22,40,0.35); color:var(--navy); }
.why-cta .btn:hover{ background:none; color:var(--navy); }
.why-cta .btn:hover::after{ background:#fff; border-color:#fff; color:var(--navy); }
.why-cta .btn:hover::before{ background:#fff; }

/* Aperçu des services : grandes cartes graphiques + lien vers la page dédiée */
.svc-overview{ display:grid; grid-template-columns:repeat(2,1fr); grid-auto-rows:1fr; gap:32px; counter-reset:ov; }
.svc-ov-card{ position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:linear-gradient(160deg,#fff 0%,#f9faff 100%);
  border:1px solid rgba(36,86,166,0.16); border-radius:24px;
  padding:42px 44px 38px; color:inherit;
  box-shadow:0 30px 64px -38px rgba(36,86,166,0.42);
  transition:transform .42s cubic-bezier(.2,.7,.2,1), box-shadow .42s ease, border-color .3s ease; }
.svc-overview > .svc-ov-card{ height:100%; }
/* gros numéro dégradé en filigrane */
.svc-ov-card::before{ counter-increment:ov; content:counter(ov,decimal-leading-zero);
  position:absolute; top:-18px; right:20px; font-family:var(--head); font-size:118px; font-weight:700; line-height:1;
  background:linear-gradient(150deg, var(--red) 10%, #E1233D 90%); -webkit-background-clip:text; background-clip:text; color:transparent;
  opacity:.11; pointer-events:none; transition:transform .42s ease, opacity .42s ease; }
/* halo de coin coloré */
.svc-ov-card::after{ content:""; position:absolute; right:-70px; bottom:-70px; width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, rgba(225,35,61,0.13), transparent 70%); pointer-events:none; transition:opacity .42s ease, transform .42s ease; }
.svc-ov-card:hover{ transform:translateY(-9px); border-color:rgba(36,86,166,0.34);
  box-shadow:0 54px 96px -38px rgba(36,86,166,0.52), 0 0 54px rgba(225,35,61,0.1); }
.svc-ov-card:hover::before{ transform:translateY(4px) scale(1.06); opacity:.16; }
.svc-ov-card:hover::after{ transform:scale(1.15); }
.svc-ov-card > *{ position:relative; z-index:1; }
.svc-ov-card h3{ font-family:var(--head); font-size:25px; font-weight:600; color:var(--navy); margin:0 70px 14px 0; }
.svc-ov-card p{ color:var(--muted); font-size:16px; line-height:1.62; margin:0 0 28px; flex:1; }
.svc-ov-btn{ align-self:flex-start; }

/* ===== PAGE EBIOS : graphique chiffres + stepper + échelles ===== */
.ebfig-card{ max-width:1000px; margin:0 auto; position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(160deg,#0f2140,#0a1628); border-radius:28px; padding:46px 50px;
  box-shadow:0 44px 100px -44px rgba(20,30,60,0.55); }
.ebfig-card-head{ text-align:center; margin-bottom:34px; }
.ebfig-kicker{ display:block; font-size:12px; font-weight:700; letter-spacing:1.7px; text-transform:uppercase; color:#7fb0ea; margin-bottom:8px; }
.ebfig-card-head h2{ font-family:var(--head); font-size:42px; font-weight:700; color:#fff; margin:0; letter-spacing:-0.02em; }
.ebfig-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.ebfig{ background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.09); border-radius:18px; padding:26px 20px; text-align:center; transition:transform .3s ease, border-color .3s ease; }
.ebfig:hover{ transform:translateY(-4px); border-color:var(--c); }
.ebfig-num{ display:block; font-family:var(--head); font-size:54px; font-weight:700; line-height:1; color:var(--c); }
.ebfig-lbl{ display:block; margin-top:10px; font-size:13.5px; color:rgba(255,255,255,0.62); }
.ebfig-points{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px 30px; margin-top:34px; }
.ebfig-points span{ font-size:14px; color:rgba(255,255,255,0.82); display:inline-flex; align-items:center; gap:8px; }
.ebfig-points i{ color:#2EC4B6; font-style:normal; font-weight:700; }

.eb-steps{ max-width:820px; margin:44px auto 0; }
.eb-step{ display:grid; grid-template-columns:auto 1fr; gap:30px; }
.eb-step-side{ display:flex; flex-direction:column; align-items:center; }
.eb-step-n{ flex:0 0 auto; width:60px; height:60px; border-radius:18px; display:flex; align-items:center; justify-content:center;
  font-family:var(--head); font-size:22px; font-weight:700; color:#fff; background:var(--c); box-shadow:0 16px 34px -12px var(--c); }
.eb-step-line{ flex:1; width:2px; min-height:30px; margin:8px 0; background:linear-gradient(180deg,var(--c),rgba(10,22,40,0.06)); }
.eb-step-body{ padding-bottom:36px; }
.eb-step-body h3{ font-family:var(--head); font-size:23px; font-weight:600; color:var(--navy); margin:8px 0 8px; }
.eb-step-body p{ color:var(--muted); font-size:16px; line-height:1.6; margin:0; }

.eb-scales{ display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:44px; }
.eb-scale{ background:linear-gradient(160deg,#12294a,#0a1628); border:1px solid rgba(255,255,255,0.08); border-radius:22px; padding:34px 36px; }
.eb-scale h3{ font-family:var(--head); font-size:20px; color:#fff; margin:0 0 18px; }
.eb-scale-item{ display:flex; align-items:center; gap:16px; padding:13px 0; border-top:1px solid rgba(255,255,255,0.08); }
.eb-scale-item:first-of-type{ border-top:0; }
.eb-badge{ flex:0 0 auto; width:46px; height:46px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-family:var(--head); font-weight:700; color:#fff; }
.eb-scale-item strong{ color:#fff; display:block; font-size:15px; }
.eb-scale-item p{ color:rgba(255,255,255,0.6); font-size:13.5px; margin:2px 0 0; }
@media(max-width:760px){
  .ebfig-grid{ grid-template-columns:repeat(2,1fr); } .eb-scales{ grid-template-columns:1fr; }
  .ebfig-card{ padding:34px 24px; } .eb-step{ gap:20px; }
}

/* Intro de section centrée */
.section-intro{ max-width:760px; margin:18px auto 0; text-align:center; color:var(--muted); font-size:17px; line-height:1.65; }
.section-intro strong{ color:var(--navy); }

/* Principes EBIOS (grille 4 icônes) */
.princ-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:48px; }
.princ{ background:linear-gradient(162deg,#fff 0%,#f7f9fe 100%); border:1px solid rgba(36,86,166,0.13);
  border-radius:18px; padding:26px 24px 24px; transition:transform .34s cubic-bezier(.2,.7,.2,1), box-shadow .34s ease, border-color .3s ease;
  box-shadow:0 20px 44px -34px rgba(36,86,166,0.4); }
.princ:hover{ transform:translateY(-6px); border-color:rgba(36,86,166,0.28); box-shadow:0 34px 64px -38px rgba(36,86,166,0.5); }
.princ-ico{ display:inline-flex; width:50px; height:50px; border-radius:14px; align-items:center; justify-content:center; color:#fff; margin-bottom:16px;
  background:linear-gradient(150deg,var(--red) 0%,#4a6fc0 100%); box-shadow:0 12px 24px -12px rgba(36,86,166,0.55); }
.princ-ico svg{ width:26px; height:26px; }
.princ h4{ font-family:var(--head); font-size:16.5px; font-weight:600; color:var(--navy); margin:0 0 9px; }
.princ p{ color:var(--muted); font-size:14.5px; line-height:1.58; margin:0; }

/* Déroulé de la mission (phases + livrables) */
.mission{ max-width:840px; margin:46px auto 0; display:flex; flex-direction:column; gap:16px; position:relative; }
.mission::before{ content:""; position:absolute; left:26px; top:20px; bottom:20px; width:2px; background:linear-gradient(180deg,var(--red),#4a6fc0); opacity:.35; }
.mission-phase{ position:relative; display:grid; grid-template-columns:auto 1fr; align-items:start; gap:26px;
  background:#fff; border:1px solid rgba(36,86,166,0.13); border-radius:18px; padding:24px 30px;
  box-shadow:0 20px 46px -36px rgba(36,86,166,0.4); transition:transform .34s cubic-bezier(.2,.7,.2,1), box-shadow .34s ease, border-color .3s ease; }
.mission-phase:hover{ transform:translateX(6px); border-color:rgba(36,86,166,0.28); box-shadow:0 32px 62px -38px rgba(36,86,166,0.5); }
.mission-step{ position:relative; z-index:1; align-self:flex-start; font-family:var(--head); font-weight:600; font-size:13px; letter-spacing:0.02em;
  color:#fff; background:linear-gradient(150deg,var(--red),#4a6fc0); padding:8px 4px; width:54px; text-align:center; border-radius:12px; line-height:1.2; }
.mission-body h3{ font-family:var(--head); font-size:19px; font-weight:600; color:var(--navy); margin:2px 0 9px; letter-spacing:-0.01em; }
.mission-body p{ color:var(--muted); font-size:15.5px; line-height:1.62; margin:0 0 14px; }
.mission-deliv{ display:inline-flex; align-items:center; font-size:13px; font-weight:600; color:var(--red);
  background:rgba(36,86,166,0.07); border:1px solid rgba(36,86,166,0.15); border-radius:999px; padding:6px 14px; }
@media(max-width:820px){ .princ-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){
  .mission::before{ display:none; }
  .mission-phase{ grid-template-columns:1fr; gap:14px; }
}

/* ===== SECTEURS : « Avec qui travaillons-nous ? » ===== */
.sectors-full .sec-center{ text-align:center; max-width:780px; margin:0 auto 52px; }
.sectors-full .sec-center .eyebrow{ display:inline-block; margin-bottom:10px; }
.sectors-full .sec-intro{ font-size:18px; color:var(--muted); line-height:1.62; margin:14px 0 0; }
.sector-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
.sector-card{ border:1px solid var(--line); border-radius:18px; padding:32px 34px 30px; background:#fff; transition:border-color .2s, box-shadow .2s, transform .2s; }
.sector-card:hover{ border-color:transparent; transform:translateY(-3px); box-shadow:0 26px 54px -28px rgba(20,30,60,0.30); }
.sector-head{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.sector-ico{ width:48px; height:48px; flex:0 0 auto; border-radius:13px; background:rgba(225,35,61,0.08); color:var(--red); display:flex; align-items:center; justify-content:center; }
.sector-ico svg{ width:25px; height:25px; }
.sector-card h3{ font-family:var(--head); font-size:22px; font-weight:600; color:var(--navy); margin:0; }
.sector-card p{ color:var(--muted); font-size:15.5px; line-height:1.6; margin:0 0 12px; }
.sector-card p:last-child{ margin-bottom:0; }
/* Bouton de dépliage : masqué hors téléphone (tout est visible sur grand écran) */
.sector-toggle{ display:none; }
.sector-card strong{ color:var(--navy); }

/* ===== SECTIONS ===== */
section.block{ padding:104px 0; }
.sec-head{ display:grid; grid-template-columns:1.15fr 1fr; gap:48px; align-items:end; margin-bottom:64px; }
.sec-head h2{ font-size:52px; margin-top:18px; }
.sec-head .intro{ font-size:18px; color:var(--muted); line-height:1.6; }
.sec-top{ display:flex; align-items:center; justify-content:space-between; }
.sec-link{ color:var(--red); font-weight:600; font-size:15px; border-bottom:1px solid var(--red); padding-bottom:2px; }
.block-title{ font-size:52px; margin:18px 0 60px; }

/* Leviers / expertises grid */
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:56px 48px; }
.lever .rule{ height:1px; background:var(--ink); margin-bottom:22px; }
.lever .num{ font-family:var(--head); font-size:13px; font-weight:600; color:var(--red); vertical-align:top; margin-right:10px; }
.lever h3{ display:inline; font-size:23px; font-weight:600; }
.lever p{ color:var(--muted); font-size:16px; margin-top:16px; line-height:1.6; }

/* Bande / offre */
.band{ border-radius:4px; overflow:hidden;
  background:linear-gradient(100deg, rgba(225,35,61,0.11) 0%, rgba(225,35,61,0.05) 42%, rgba(140,160,255,0.16) 100%), #fbfbfd; }
.band-inner{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; padding:72px 64px; align-items:center; }
.band h2{ font-size:44px; margin:20px 0 0; }
.band p{ color:var(--muted); font-size:18px; margin:24px 0 34px; max-width:42ch; }
.deliverables{ background:#fff; border-radius:12px; padding:10px 30px; box-shadow:0 30px 60px -30px rgba(20,30,60,0.22); }
.deliverables .dlbl{ font-size:12px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted-2); padding:22px 0 14px; }
.deliverables .row{ padding:20px 0; border-top:1px solid var(--line); font-size:17px; color:var(--ink); }

/* Secteurs */
.sectors{ display:grid; grid-template-columns:repeat(3,1fr); gap:56px 48px; }
.sector h3{ font-size:22px; font-weight:600; margin-bottom:14px; }
.sector p{ color:var(--muted); font-size:16px; line-height:1.6; }

/* Cabinet / steps */
.cabinet{ display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.cabinet--framed{ gap:64px; border:1px solid var(--line); border-radius:24px; padding:54px 60px; background:#fff; box-shadow:0 34px 80px -46px rgba(20,30,60,0.28); }
.cabinet h2{ font-size:52px; margin:18px 0 30px; }
.cabinet p{ color:var(--muted); font-size:18px; margin-bottom:20px; line-height:1.65; }
.steps .step{ display:grid; grid-template-columns:44px 1fr; gap:8px; padding:26px 0; border-top:1px solid var(--line); }
.steps .step:first-child{ border-top:0; }
.steps .k{ font-family:var(--head); font-size:12px; font-weight:600; color:var(--red); padding-top:6px; }
.steps h3{ font-size:22px; font-weight:600; }
.steps p{ color:var(--muted); font-size:16px; margin-top:8px; line-height:1.55; }

/* ===== SERVICE CARDS (nos services + pages détail) ===== */
.svc-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.svc-card{ display:block; border:1px solid var(--line); border-radius:16px; padding:34px 34px 30px; transition:border-color .2s, transform .2s, box-shadow .2s; background:#fff; }
.svc-card:hover{ border-color:transparent; transform:translateY(-4px); box-shadow:0 24px 50px -26px rgba(20,30,60,0.28); }
.svc-card .k{ font-family:var(--head); font-size:13px; font-weight:600; color:var(--red); }
.svc-card h3{ font-size:24px; font-weight:600; margin:14px 0 12px; }
.svc-card p{ color:var(--muted); font-size:16px; line-height:1.6; }
.svc-card .go{ display:inline-flex; align-items:center; gap:8px; color:var(--red); font-weight:600; font-size:15px; margin-top:20px; }

/* Sub-service list (pages détail) */
.subs{ display:grid; grid-template-columns:repeat(2,1fr); gap:0 56px; }
.sub{ padding:28px 0; border-top:1px solid var(--line); }
.sub h3{ font-size:20px; font-weight:600; margin-bottom:10px; }
.sub p{ color:var(--muted); font-size:16px; line-height:1.55; }

/* ===== BLOG ===== */
.article-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:34px; }
.article-card{ border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:transform .2s, box-shadow .2s; background:#fff; }
.article-card:hover{ transform:translateY(-4px); box-shadow:0 24px 50px -26px rgba(20,30,60,0.28); }
.article-thumb{ height:170px; background:linear-gradient(120deg, rgba(225,35,61,0.14), rgba(140,160,255,0.20)); }
.article-body{ padding:26px 26px 30px; }
.article-tag{ font-size:12px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--red); }
.article-card h3{ font-size:21px; font-weight:600; margin:12px 0 10px; line-height:1.2; }
.article-card p{ color:var(--muted); font-size:15px; line-height:1.55; }
.article-meta{ color:var(--muted-2); font-size:13px; margin-top:16px; }
.article-thumb{ background-size:cover; background-position:center; }
.article-thumb--vs{ display:flex; align-items:center; justify-content:center; gap:10px; background:#fff; overflow:hidden; }
.article-thumb--vs img{ height:158px; width:auto; object-fit:contain; }
.article-thumb--vs .vs-mark{ font-family:var(--head); font-weight:700; font-size:24px; color:var(--red); flex:0 0 auto; }
.article-thumb--vs .vs-label{ font-family:var(--head); font-weight:600; font-size:18px; line-height:1.2; color:var(--navy); text-align:left; flex:0 0 auto; }

/* ===== ARTICLE (page complète importée du blog) ===== */
.back-link{ display:inline-block; font-size:14px; color:var(--muted); margin-bottom:18px; }
.back-link:hover{ color:var(--red); }
.article-title{ font-size:44px; max-width:26ch; line-height:1.12; }
.article-content{ max-width:760px; }
.article-content p{ font-size:17px; line-height:1.75; color:var(--ink); margin:0 0 20px; }
.article-content h2{ font-family:var(--head); font-size:28px; font-weight:600; color:var(--navy); margin:42px 0 16px; }
.article-content h3{ font-family:var(--head); font-size:22px; font-weight:600; color:var(--navy); margin:32px 0 12px; }
.article-content h4{ font-family:var(--head); font-size:19px; font-weight:600; color:var(--navy); margin:26px 0 10px; }
.article-content ul, .article-content ol{ margin:0 0 20px; padding-left:22px; }
.article-content li{ font-size:17px; line-height:1.7; margin-bottom:8px; color:var(--ink); }
.article-content a{ color:var(--red); text-decoration:underline; }
/* le bouton porte déjà son filet : pas de soulignement d'article en plus */
.article-content a.btn{ color:var(--navy); text-decoration:none; }
.article-content a.btn:hover{ color:var(--red); }
.article-content strong{ color:var(--navy); }
.article-content img{ max-width:100%; height:auto; border-radius:12px; margin:18px 0; display:block; }
.article-content figure{ margin:18px 0; }
.article-content figcaption{ font-size:14px; color:var(--muted-2); text-align:center; margin-top:8px; }
.article-content blockquote{ border-left:3px solid var(--red); padding-left:20px; margin:24px 0; color:var(--muted); font-style:italic; }
.article-content iframe{ max-width:100%; border-radius:12px; margin:18px 0; }
.article-content .article-lead{ font-size:20px; line-height:1.6; color:var(--muted); margin:0 0 30px; }
.article-content .article-cta{ margin-top:36px; }

/* Tableau comparatif (colonne mise en avant) */
.compare-wrap{ overflow-x:auto; margin:26px 0 10px; }
.compare{ width:100%; border-collapse:separate; border-spacing:0; font-size:15px; min-width:580px; }
.compare th, .compare td{ padding:15px 18px; text-align:left; vertical-align:top; line-height:1.45; }
.compare thead th{ font-family:var(--head); font-size:17px; font-weight:600; }
.compare .crit{ width:22%; color:var(--muted-2); font-weight:600; font-size:12px; letter-spacing:0.06em; text-transform:uppercase; }
.compare thead .crit .vs{ color:var(--red); }
.compare tbody th.crit, .compare tbody td{ border-top:1px solid var(--line); }
.compare .col-tenacy, .compare .col-trad{ color:var(--muted); }
.compare thead .col-tenacy, .compare thead .col-trad{ color:var(--ink); }
.compare .col-galea{ background:rgba(46,196,182,0.09); color:var(--navy); font-weight:500; }
.compare thead .col-galea{ background:var(--navy); color:#fff; border-radius:14px 14px 0 0; }
.compare tbody tr:last-child .col-galea{ border-radius:0 0 14px 14px; }

/* ===== CONTACT ===== */
.contact-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:72px; align-items:start; }
.contact-info h3{ font-size:26px; font-weight:600; margin-bottom:20px; }
.contact-line{ display:flex; gap:14px; padding:16px 0; border-top:1px solid var(--line); }
.contact-line:first-of-type{ border-top:0; }
.contact-line .lbl{ font-size:12px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted-2); width:96px; flex-shrink:0; padding-top:2px; }
.contact-line .val{ font-size:16px; color:var(--ink); }
.contact-line .val a{ color:var(--red); }
.form{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form .full{ grid-column:1 / -1; }
.form label{ display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:8px; }
.form input, .form textarea{ width:100%; font-family:var(--body); font-size:15px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:10px; padding:14px 16px; transition:border-color .2s; }
.form input:focus, .form textarea:focus{ outline:none; border-color:var(--red); }
.form textarea{ min-height:140px; resize:vertical; }

/* ===== PAGE CONTACT (accroche + carte formulaire) ===== */
.contact-hero .container{ padding-top:76px; padding-bottom:104px; }
.contact-cols{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.contact-intro .ask{ font-family:var(--head); font-size:30px; font-weight:600; color:var(--navy); line-height:1.28; margin:0; }
.contact-intro h1{ font-family:var(--head); font-size:64px; font-weight:700; color:var(--navy); line-height:1.02; margin:40px 0 0; }
.contact-rule{ width:150px; height:2px; background:var(--navy); margin-top:44px; }
.contact-card{ background:#fff; border-radius:22px; box-shadow:0 40px 80px -30px rgba(20,30,60,0.32); padding:44px 40px; }
.cform{ display:flex; flex-direction:column; gap:20px; }
/* Champ leurre anti-bot : invisible et hors flux, jamais atteint au clavier. */
.hp-field{ position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden; }
.cform .field{ display:flex; flex-direction:column; }
.cform label{ font-size:15px; color:var(--ink); margin-bottom:9px; }
.cform .req{ color:var(--red); }
.cform input, .cform textarea{ width:100%; font-family:var(--body); font-size:15px; color:var(--ink); background:#fff; border:1px solid #d3d7de; border-radius:26px; padding:13px 20px; transition:border-color .2s, box-shadow .2s; }
.cform textarea{ border-radius:18px; min-height:120px; resize:vertical; padding:15px 20px; }
.cform input:focus, .cform textarea:focus{ outline:none; border-color:var(--navy); box-shadow:0 0 0 3px rgba(20,30,60,0.08); }
.cform button{ align-self:flex-start; margin-top:4px; font-family:var(--body); font-size:15px; font-weight:600; color:#fff; background:var(--navy); border:0; border-radius:999px; padding:14px 36px; cursor:pointer; transition:background .2s, transform .2s; }
.cform button:hover{ background:#132a4d; transform:translateY(-1px); }

/* ===== BLOCS "Qui sommes-nous" (carte + libellé) ===== */
.split{ display:grid; gap:56px; align-items:center; margin:0 0 64px; }
.split--cardleft{ grid-template-columns:3fr 2fr; }
.split--cardright{ grid-template-columns:2fr 3fr; }
.split-card{ background:#fff; border:1px solid var(--line); border-radius:22px; padding:48px 52px; box-shadow:0 34px 70px -40px rgba(20,30,60,0.22); }
.split-card h3{ font-size:30px; font-weight:600; color:var(--navy); margin-bottom:20px; line-height:1.16; }
.split-card p{ color:var(--muted); font-size:16px; line-height:1.65; margin-bottom:16px; }
.split-card p:last-child{ margin-bottom:0; }
.split-card strong{ color:var(--navy); font-weight:600; }
.split-label{ display:flex; align-items:center; gap:16px; }
.split-label svg{ color:var(--navy); flex-shrink:0; }
.split-label span{ font-family:var(--head); font-size:30px; font-weight:600; color:var(--navy); }

/* ===== CTA FINALE ===== */
.cta-final{ background:linear-gradient(100deg, rgba(225,35,61,0.12) 0%, rgba(225,35,61,0.05) 45%, rgba(140,160,255,0.18) 100%), #fbfbfd; }
.cta-final .container{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; padding-top:96px; padding-bottom:96px; }
.cta-final h2{ font-size:56px; }
.cta-final p{ color:var(--muted); font-size:19px; margin-top:24px; max-width:34ch; }
/* Actions finales : liste d'actions en typo de titre, filet fin + pastille fléchée,
   plutôt que deux pavés pleins. Portée volontairement limitée à .cta-actions :
   les .btn du reste du site gardent leur apparence. */
.cta-actions{ display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); }
.cta-actions .btn{
  position:relative; width:100%; margin:0;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:26px 2px; border:0; border-bottom:1px solid var(--line); border-radius:0;
  background:none; text-align:left;
  font-family:var(--head); font-weight:600; font-size:25px; letter-spacing:-0.015em;
  color:var(--navy); transition:color .22s ease;
}
/* filet qui se colore de gauche à droite au survol */
.cta-actions .btn::before{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:var(--red); transform:scaleX(0); transform-origin:left;
  transition:transform .32s cubic-bezier(.4,0,.2,1);
}
.cta-actions .btn::after{
  content:"→"; flex:0 0 auto;
  width:50px; height:50px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1.5px solid var(--line);
  font-family:var(--body); font-size:20px; font-weight:400; line-height:1;
  transition:transform .22s ease, background .22s ease, border-color .22s ease, color .22s ease;
}
.cta-actions .btn:hover{ color:var(--red); background:none; }
.cta-actions .btn:hover::before{ transform:scaleX(1); }
.cta-actions .btn:hover::after{ background:var(--red); border-color:var(--red); color:#fff; transform:translateX(5px); }
.cta-actions .btn:focus-visible{ outline:2px solid var(--red); outline-offset:4px; }
/* action principale : pastille déjà pleine au repos */
.cta-actions .btn-primary::after{ background:var(--red); border-color:var(--red); color:#fff; }
/* action secondaire : plus discrète */
.cta-actions .btn-soft{ font-size:19px; font-weight:500; color:var(--muted); }
.cta-actions .btn-soft::after{ width:44px; height:44px; font-size:17px; }

/* ===== FOOTER ===== */
.site-footer{ background:var(--navy); color:rgba(255,255,255,0.6); font-size:14px; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-top:64px; padding-bottom:48px; }
.footer-brand .logo-word{ font-size:24px; }
.footer-brand p{ margin-top:18px; max-width:34ch; line-height:1.6; color:rgba(255,255,255,0.55); }
.footer-col h5{ font-family:var(--head); font-size:13px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:#fff; margin-bottom:16px; }
.footer-col a{ display:block; color:rgba(255,255,255,0.6); padding:6px 0; font-size:14px; transition:color .15s; }
.footer-col a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid var(--line-2); padding:26px 0; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }

/* ===== RESPONSIVE ===== */
@media(max-width:960px){
  .container{ padding:0 24px; }
  .header-bar{ padding:16px 24px; }
  .logo img{ height:44px; } .logo-word{ font-size:24px; }
  /* --- Menu : burger + tiroir en colonne sur le côté droit --- */
  .nav-toggle{ display:flex; }
  .header-bar{ gap:12px; }
  .main-nav{
    position:fixed; top:0; right:0; bottom:0; z-index:100;
    width:min(78vw, 320px); margin-left:0;
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:0; padding:86px 26px 32px;
    background:#fff; box-shadow:-18px 0 50px -20px rgba(10,22,40,.45);
    transform:translateX(100%); transition:transform .28s ease;
    overflow-y:auto; overscroll-behavior:contain;
  }
  .main-nav.open{ transform:none; }
  .main-nav > a, .main-nav .nav-item > a{
    display:block; width:100%; padding:16px 0; font-size:20px; opacity:1;
    border-bottom:1px solid var(--line);
  }
  .main-nav a:hover{ transform:none; color:var(--red); }
  .main-nav .nav-item{ display:block; align-self:stretch; }
  .main-nav .caret{ display:none; }
  .nav-cta{
    margin-top:22px; border-bottom:0 !important;
    background:var(--red); color:#fff !important; font-weight:600;
    text-align:center; padding:14px 18px !important; border-radius:999px;
  }
  .nav-cta:hover{ background:var(--red-dark); color:#fff !important; }
  .mega{ display:none; }
  .hero h1{ font-size:52px; }
  .hero-cols{ flex-direction:column; align-items:stretch; gap:36px; }
  .hero-sectors{ flex-basis:auto; }
  .galea-intro-grid{ flex-direction:column; align-items:flex-start; gap:40px; }
  .galea-orb{ flex-basis:auto; align-self:center; }
  .galea-intro-text h2{ font-size:32px; }
  .page-hero h1{ font-size:40px; }
  .sec-head,.cabinet,.band-inner,.cta-final .container,.contact-grid,.contact-cols{ grid-template-columns:1fr; gap:32px; }
  .cabinet--framed{ padding:34px 26px; gap:32px; }
  .contact-intro h1{ font-size:48px; } .contact-intro .ask{ font-size:24px; }
  .sec-head h2,.cabinet h2,.cta-final h2,.block-title{ font-size:36px; }
  .grid-3,.sectors,.svc-grid,.subs,.article-grid,.form,.sector-cards,.svc-overview,.subsvc-grid,.two-col-text{ grid-template-columns:1fr; }
  .svc-overview > .svc-ov-card:nth-child(even),
  .subsvc-grid > .subsvc-card:nth-child(even){ margin-top:0; }
  .def-grid{ grid-template-columns:repeat(2,1fr); }
  .why-grid{ grid-template-columns:1fr; }
  .mod-grid{ grid-template-columns:1fr; }
  .sov-grid{ grid-template-columns:1fr; }
  .tars-flow{ grid-template-columns:1fr; column-gap:0; row-gap:32px; }
  .tars-flow-links{ display:none; }
  .tars-col--left{ padding-right:0; }
  .tars-col--right{ padding-left:0; }
  .tars-col--left .tars-colhead,
  .tars-col--right .tars-colhead{ text-align:left; }
  .tars-sources li{ text-align:left; padding-right:0; padding-left:18px; }
  .tars-sources li::after{ right:auto; left:0; }
  .tars-device{ margin:0 auto; }
  .cmp-panel.is-active{ grid-template-columns:1fr; gap:28px; }
  .flow-arrow{ display:none; }
  .timeline::before,.timeline::after{ left:7px; transform:none; }
  .tl-item,.tl-left,.tl-right{ width:100%; left:0; padding-left:34px; padding-right:0; }
  .tl-left::after,.tl-right::after{ left:0; right:auto; }
  .stats-row{ grid-template-columns:repeat(2,1fr); gap:36px 20px; }
  .stat-num{ font-size:52px; }
  .split--cardleft,.split--cardright{ grid-template-columns:1fr; gap:28px; }
  /* « Les défis » (et sa flèche) au-dessus de son cadre en pile */
  .split--cardleft .split-label{ order:-1; }
  .split-card{ padding:34px 28px; }
  .split-card h3{ font-size:24px; }
  .split-label span{ font-size:24px; }
  .band-inner{ padding:40px 28px; }
  section.block{ padding:64px 0; }
  .footer-top{ grid-template-columns:1fr 1fr; gap:28px; }
}

/* Tiroir ouvert : on bloque le défilement de la page derrière */
body.nav-open{ overflow:hidden; }

/* ===== TÉLÉPHONE ===== */
@media(max-width:600px){
  /* Le fond de page monte jusqu'en haut de l'écran, mais le contenu du header
     redescend sous la barre d'état. --safe-top permet à l'aperçu mobile de
     simuler la zone sûre, qu'une iframe ne reçoit pas via env(). */
  body{ background-attachment:scroll; }
  .site-header{ padding-top:max(env(safe-area-inset-top), var(--safe-top, 0px)); }
  .main-nav{ padding-top:calc(86px + max(env(safe-area-inset-top), var(--safe-top, 0px))); }

  /* Sous-titres : même taille que l'accroche sous « Cabinet de conseil » */
  .page-hero p.lead,
  .galea-intro-text p,
  .svc-section .section-lead,
  .center-lead,
  .sectors-full .sec-intro,
  .sec-head .intro,
  .band p,
  .cabinet p,
  .article-content .article-lead,
  .cta-final p{ font-size:15px; line-height:1.5; }
  /* Lien e-mail des actions finales : retiré sur téléphone (l'adresse reste
     dans le pied de page), on ne garde que la prise de rendez-vous. */
  .cta-actions a[href^="mailto:"]{ display:none; }

  .cta-actions .btn{ font-size:20px; padding:20px 2px; gap:14px; }
  .cta-actions .btn::after{ width:42px; height:42px; font-size:17px; }
  .cta-actions .btn-soft{ font-size:16px; }
  .cta-actions .btn-soft::after{ width:38px; height:38px; font-size:15px; }

  /* Scénario d'attaque : disposition en serpentin (1→2 puis 3←4, 5 au centre)
     avec des couloirs latéraux vides où passe le trait de liaison. */
  .flow{
    position:relative; display:grid; grid-template-columns:1fr 1fr;
    gap:34px 18px; padding:0 26px; margin-top:38px;
  }
  .flow-step{ position:relative; z-index:1; max-width:none; min-width:0; }
  .flow-step:nth-of-type(3){ grid-column:2; grid-row:2; }
  .flow-step:nth-of-type(4){ grid-column:1; grid-row:2; }
  .flow-step:nth-of-type(5){ grid-column:1 / -1; grid-row:3; justify-self:center; max-width:190px; }
  .flow-snake{
    position:absolute; inset:0; z-index:0; width:100%; height:100%;
    pointer-events:none; overflow:visible; color:var(--red);
  }

  /* « Agile, transparent, à vos côtés » : tient sur deux lignes */
  .cabinet h2{ font-size:26px; }

  /* Texte de présentation du cabinet : visible sur ordinateur uniquement */
  .cabinet-intro{ display:none; }

  /* Logos clients : deux bandeaux en sens opposés, logos réduits pour qu'il en
     tienne 4 à 5 par ligne, et fondu des bords élargi (sinon ils semblent coupés) */
  .marquee--second{ display:flex; }
  .marquee:not(.marquee--second) .ref-logo--b{ display:none; }
  .marquee{ --logo-h:50px; --logo-gap:34px; --fade:14%; margin-top:32px; }
  .marquee--second{ margin-top:14px; }
  .refs-clients{ padding:52px 0 56px; }
  .refs-clients-head h2{ font-size:26px; }

  /* Référentiels : libellé au-dessus, bandeau sur toute la largeur */
  .refs .container{ flex-direction:column; align-items:flex-start; gap:12px; padding-top:22px; padding-bottom:22px; }
  .refs-marquee{ width:100%; }
  .refs-track .item{ margin-right:28px; }
  .refs .item{ font-size:15px; }

  /* Cartes secteurs repliées : seul le nom reste visible */
  .sector-card{ padding:18px 20px; }
  .sector-head{ position:relative; margin-bottom:0; padding-right:34px; gap:12px; }
  .sector-card h3{ font-size:19px; }
  .sector-ico{ width:40px; height:40px; border-radius:11px; }
  .sector-ico svg{ width:21px; height:21px; }
  .sector-toggle{
    display:block; position:absolute; inset:0; width:100%; height:100%;
    padding:0; border:0; background:none; cursor:pointer;
  }
  .sector-toggle-label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .sector-chevron{
    position:absolute; right:2px; top:50%; width:10px; height:10px;
    border-right:2px solid var(--muted-2); border-bottom:2px solid var(--muted-2);
    transform:translateY(-70%) rotate(45deg); transition:transform .25s ease;
  }
  .sector-card.is-open .sector-chevron{ transform:translateY(-25%) rotate(-135deg); }
  .sector-body{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
  .sector-body-inner{ overflow:hidden; }
  .sector-card.is-open .sector-body{ grid-template-rows:1fr; }
  .sector-card.is-open .sector-body-inner{ padding-top:14px; }
  .sector-cards{ gap:14px; }

  /* Hero centré : titre sur une ligne, accroche sur 4 lignes */
  .hero .container{ padding-top:36px; padding-bottom:56px; }
  .hero-main{ text-align:center; }
  .hero h1{
    font-size:clamp(22px, 7.9vw, 34px);
    white-space:nowrap; max-width:none; margin-top:16px;
  }
  .hero .eyebrow--dash::before{ width:22px; margin-right:10px; }
  .hero p.lead{
    font-size:15px; line-height:1.5; margin:18px auto 0; max-width:34ch;
  }
  .hero p.lead br{ display:none; }
  .hero-badge{ margin-top:22px; font-size:13px; padding:8px 14px; }
  /* Liens de hero : même système que les boutons (filet fin + pastille fléchée),
     sinon un .btn et un .hero-link côte à côte ne se ressemblent pas du tout. */
  .hero-ctas{ flex-direction:column; align-items:flex-start; gap:2px; }
  .hero .hero-ctas{ margin-top:26px; align-items:center; }
  .hero-ctas .hero-link{
    position:relative; display:inline-flex; align-items:center; gap:14px;
    align-self:auto; padding:8px 0;
    font-family:var(--head); font-weight:600; font-size:18px; letter-spacing:-0.01em;
    color:var(--navy); text-decoration:none;
    border-bottom:1.5px solid var(--line);
    transition:color .22s ease;
  }
  .hero-ctas .hero-link::before{
    content:""; position:absolute; left:0; right:0; bottom:-1.5px; height:1.5px;
    background:var(--red); transform:scaleX(0); transform-origin:left;
    transition:transform .3s cubic-bezier(.4,0,.2,1);
  }
  .hero-ctas .hero-link::after{
    content:"→"; flex:0 0 auto;
    width:38px; height:38px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    border:1.5px solid var(--line);
    font-family:var(--body); font-size:16px; font-weight:400; line-height:1;
    transition:transform .22s ease, background .22s ease, border-color .22s ease, color .22s ease;
  }
  .hero-ctas .hero-link:hover{ opacity:1; color:var(--red); }
  .hero-ctas .hero-link:hover::before{ transform:scaleX(1); }
  .hero-ctas .hero-link:hover::after{ background:var(--red); border-color:var(--red); color:#fff; transform:translateX(4px); }
  .hero-ctas .hero-link:focus-visible{ outline:2px solid var(--red); outline-offset:4px; }
  .hero-sectors{ text-align:left; margin-right:0; }
}

/* ═══════════════════════════════════════════════════════════════════
   PAGE GALEA — couleurs du thème Galéa (teal + navy, plus de rouge)
   ═══════════════════════════════════════════════════════════════════ */
/* Toute la page en marine (thème sombre façon site Galéa) : fond navy, texte blanc, accents teal */
body[data-page="galea"]{ --red:#2EC4B6; --red-dark:#22a99d; color:#fff;
  background:linear-gradient(180deg, #eef8fa 0px, #eef8fa 90px, rgba(238,248,250,0) 180px) no-repeat, #0A1628; }
/* Téléphone : la zone claire du fond doit couvrir toute la hauteur de l'en-tête
   (barre d'état / encoche comprises) — sinon le dégradé qui vire au marine
   réapparaît sous l'en-tête transparent et crée une couture grise. */
@media (max-width:760px), (orientation:landscape) and (max-height:560px){
  body[data-page="galea"]{
    background:linear-gradient(180deg, #eef8fa 0px, #eef8fa 190px, rgba(238,248,250,0) 300px) no-repeat, #0A1628; }
}

/* En-tête + hero en BLANC (jusqu'au trait néon), le reste de la page reste navy */
body[data-page="galea"] .site-header{ background:transparent; }
body[data-page="galea"] .page-hero{
  background:
    radial-gradient(1500px 720px at 88% 30%, rgba(63,208,232,0.20) 0%, rgba(63,208,232,0.08) 40%, rgba(255,255,255,0) 72%),
    radial-gradient(1100px 620px at 8% 88%, rgba(46,196,182,0.14) 0%, rgba(255,255,255,0) 70%),
    linear-gradient(160deg, #eef8fa 0%, #f6fbfc 55%, #ffffff 100%);
  background-repeat:no-repeat; background-color:#f2fafb; }
/* Téléphone : le hero reprend EXACTEMENT la teinte du fond derrière l'en-tête
   (même #eef8fa, sans les halos teal) → raccord parfait sous l'en-tête
   transparent, plus aucune couture. Placé APRÈS la règle de base pour gagner
   dans la cascade. */
@media (max-width:760px), (orientation:landscape) and (max-height:560px){
  body[data-page="galea"] .page-hero{
    background:linear-gradient(180deg, #eef8fa 0%, #f4fafb 55%, #ffffff 100%);
    background-repeat:no-repeat; background-color:#eef8fa; }
}

/* Le méga-menu « Nos services » garde son thème blanc + rouge, même sur Galéa */
body[data-page="galea"] .mega{ border-top-color:#E1233D; }
body[data-page="galea"] .mega-col .cat-rule{ background:#E1233D; }
body[data-page="galea"] .mega-col:hover .cat-rule{ background:#E1233D; }
body[data-page="galea"] .mega-col h4 a:hover{ color:#E1233D; }

/* Hero sur fond blanc : titre navy, accents teal */
body[data-page="galea"] .page-hero .eyebrow{ color:#2EC4B6; }
body[data-page="galea"] .page-hero .eyebrow--dash::before{ background:#2EC4B6; }
body[data-page="galea"] .page-hero h1{ color:var(--navy); }
body[data-page="galea"] .page-hero h1 .red{ color:#2EC4B6; }
body[data-page="galea"] .page-hero p.lead{ color:var(--muted); }
body[data-page="galea"] .hero-link{ color:var(--navy); }
body[data-page="galea"] .page-hero::after{
  background:linear-gradient(180deg,
    rgba(46,196,182,0.9) 0%, rgba(46,196,182,0.9) 1px,
    rgba(46,196,182,0.42) 34%, rgba(46,196,182,0) 100%);
}

/* Section "Ce que fait Galea" navy */
body[data-page="galea"] .block .eyebrow{ color:#2EC4B6; }
body[data-page="galea"] .block-title{ color:#fff; }
body[data-page="galea"] .sub{ border-top-color:rgba(255,255,255,0.12); }
body[data-page="galea"] .sub h3{ color:#fff; }
body[data-page="galea"] .sub p{ color:rgba(255,255,255,0.62); }

/* CTA finale navy */
body[data-page="galea"] .cta-final{ background:linear-gradient(180deg,#0C1A33 0%,#0A1628 100%); }
body[data-page="galea"] .cta-final h2{ color:#fff; }
body[data-page="galea"] .cta-final p{ color:rgba(255,255,255,0.72); }
body[data-page="galea"] .btn-soft{ background:none; color:rgba(255,255,255,0.75); border-bottom-color:rgba(255,255,255,0.2); }
body[data-page="galea"] .btn-soft:hover{ background:none; }
/* Actions finales sur fond marine : filets et pastilles éclaircis (l'accent
   devient automatiquement le teal, --red étant redéfini pour cette page) */
body[data-page="galea"] .cta-actions{ border-top-color:rgba(255,255,255,0.16); }
body[data-page="galea"] .cta-actions .btn{ color:#fff; background:none; border-bottom-color:rgba(255,255,255,0.16); }
body[data-page="galea"] .cta-actions .btn::after{ background:none; border-color:rgba(255,255,255,0.3); color:#fff; }
body[data-page="galea"] .cta-actions .btn-primary::after{ background:var(--red); border-color:var(--red); color:#0A1628; }
body[data-page="galea"] .cta-actions .btn-soft{ color:rgba(255,255,255,0.7); }
body[data-page="galea"] .cta-actions .btn:hover{ color:var(--red); }
body[data-page="galea"] .cta-actions .btn:hover::after{ background:var(--red); border-color:var(--red); color:#0A1628; }
.galea-lockup{ height:48px; width:auto; display:block; margin:0 0 22px; }

/* Hero Galéa : titre à gauche, logo bouclier grand et centré dans l'espace libre à droite */
.galea-hero{ display:flex; align-items:center; gap:32px; }
.galea-hero-text{ flex:0 1 560px; min-width:0; }
.galea-emblem-wrap{ flex:1 1 auto; display:flex; align-items:center; justify-content:flex-end; }
.galea-emblem{ height:320px; width:auto; max-width:100%; }

/* ===== SECTIONS ENRICHIES DE L'ONGLET GALÉA (thème sombre) ===== */
body[data-page="galea"] .center-lead{ color:rgba(255,255,255,0.72); }
body[data-page="galea"] .center-note{ text-align:center; color:rgba(255,255,255,0.45); font-size:14px; margin-top:30px; }
body[data-page="galea"] .soft-navy{ background:#0C1A33; }
body[data-page="galea"] .eyebrow.center{ display:block; text-align:center; }
body[data-page="galea"] .block-title.center{ text-align:center; color:#fff; }

/* --- Cadrillage léger sur les sections sombres de l'onglet Galéa --- */
body[data-page="galea"] .galea-how,
body[data-page="galea"] .galea-modules,
body[data-page="galea"] .galea-compliance,
body[data-page="galea"] .galea-sov{ position:relative; overflow:hidden; }
body[data-page="galea"] .galea-how::before,
body[data-page="galea"] .galea-modules::before,
body[data-page="galea"] .galea-compliance::before,
body[data-page="galea"] .galea-sov::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0; opacity:.55;
  background-image:linear-gradient(rgba(46,196,182,0.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(46,196,182,0.05) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask:radial-gradient(120% 100% at 50% 0%, #000 55%, transparent 100%);
          mask:radial-gradient(120% 100% at 50% 0%, #000 55%, transparent 100%);
}
body[data-page="galea"] .galea-how > .container,
body[data-page="galea"] .galea-modules > .container,
body[data-page="galea"] .galea-compliance > .container,
body[data-page="galea"] .galea-sov > .container{ position:relative; z-index:1; }

/* --- Schéma TARS (identique au thème Galea) --- */
.tars-flow{ position:relative; display:grid; grid-template-columns:1fr 200px 1fr; column-gap:48px; align-items:start; margin-top:52px; }
.tars-flow-links{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.tars-flow-links path{ fill:none; stroke:rgba(46,196,182,0.4); stroke-width:1.2; vector-effect:non-scaling-stroke; }
.tars-col{ position:relative; z-index:1; }
.tars-colhead{ font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:26px; }
.tars-col--left{ padding-right:64px; }
.tars-col--right{ padding-left:64px; }
.tars-col--left .tars-colhead{ text-align:left; color:rgba(255,255,255,0.55); }
.tars-col--right .tars-colhead{ text-align:right; color:#2EC4B6; }
.tars-sources{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:17px; }
.tars-sources li{ position:relative; text-align:right; padding-right:22px; color:rgba(255,255,255,0.92); font-size:15px; font-weight:600; }
.tars-sources li span{ color:rgba(255,255,255,0.4); font-weight:500; }
.tars-sources li::after{ content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:7px; height:7px; border-radius:50%; background:#2EC4B6; box-shadow:0 0 0 4px rgba(46,196,182,0.15); }
.tars-col--center{ display:flex; justify-content:center; align-self:center; }
.tars-device{ position:relative; width:200px; padding:22px 20px; border-radius:30px; background:linear-gradient(155deg,#1C3D6B,#0A1628); border:1px solid rgba(63,208,232,0.28); box-shadow:0 24px 70px rgba(0,0,0,0.45), inset 0 0 40px rgba(63,208,232,0.06); text-align:center; }
.tars-device-dot{ position:absolute; top:18px; right:20px; width:9px; height:9px; border-radius:50%; background:#3FD0E8; box-shadow:0 0 10px #3FD0E8; animation:tars-led 1.1s ease-in-out infinite; }
@keyframes tars-led{ 0%,100%{opacity:.5} 50%{opacity:1} }
.tars-device-screen{ background:#05101C; border:1px solid rgba(63,208,232,0.22); border-radius:16px; padding:24px 16px; margin-bottom:16px; display:flex; flex-direction:column; align-items:center; gap:14px; }
.tars-device-screen-label{ font-size:11px; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,0.7); font-weight:600; }
.tars-device-screen-bar{ width:52px; height:6px; border-radius:3px; background:#3FD0E8; box-shadow:0 0 12px #3FD0E8; transform-origin:center; animation:tars-bar 1.1s ease-in-out infinite; }
@keyframes tars-bar{ 0%,100%{transform:scaleX(.4)} 50%{transform:scaleX(1)} }
.tars-device-name{ background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); border-radius:14px; padding:12px; font-size:26px; font-weight:800; letter-spacing:5px; color:#fff; margin-bottom:10px; }
.tars-device-sub{ border:1px solid rgba(255,255,255,0.1); border-radius:12px; padding:9px; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:rgba(255,255,255,0.5); font-weight:600; }
.tars-cards{ display:flex; flex-direction:column; gap:16px; }
.tars-card{ position:relative; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:16px 18px; }
.tars-card::before{ content:""; position:absolute; left:0; top:50%; transform:translate(-50%,-50%); width:7px; height:7px; border-radius:50%; background:#2EC4B6; box-shadow:0 0 0 4px rgba(46,196,182,0.15); }
.tars-card-title{ color:#fff; font-weight:700; font-size:16px; margin-bottom:12px; }
.tars-card-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.tars-chip{ font-size:12px; font-weight:700; padding:4px 10px; border-radius:8px; background:rgba(255,255,255,0.06); color:rgba(255,255,255,0.8); border:1px solid rgba(255,255,255,0.1); }
.tars-chip--danger{ color:#FF6B6B; border-color:rgba(255,107,107,0.4); background:rgba(255,107,107,0.08); }
.tars-chip--ok{ color:#2EC4B6; border-color:rgba(46,196,182,0.4); background:rgba(46,196,182,0.08); }
.tars-bar-row{ display:flex; align-items:center; gap:10px; margin-top:8px; }
.tars-bar-label{ font-size:12px; font-weight:700; color:rgba(255,255,255,0.6); width:42px; }
.tars-bar{ flex:1; height:8px; border-radius:4px; background:rgba(255,255,255,0.08); overflow:hidden; }
.tars-bar-fill{ display:block; height:100%; border-radius:4px; }
.tars-bar-val{ font-size:13px; font-weight:700; color:#fff; width:46px; text-align:right; }
.tars-card-note{ color:rgba(255,255,255,0.5); font-size:13px; margin:12px 0 0; line-height:1.5; }

/* --- Neuf modules --- */
.galea-mod-head{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.galea-pill{ font-size:12px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:#2EC4B6; padding:8px 16px; border:1px solid rgba(46,196,182,0.4); border-radius:999px; }
.mod-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:40px; }
.mod-card{ display:flex; flex-direction:column; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.09); border-radius:18px; padding:26px 28px 24px; color:#fff; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.mod-card:hover{ transform:translateY(-4px); border-color:rgba(46,196,182,0.5); box-shadow:0 26px 56px -30px rgba(46,196,182,0.4); }
.mod-head{ display:flex; align-items:center; gap:13px; }
.mod-ico{ flex:0 0 auto; width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(46,196,182,0.12); border:1px solid rgba(46,196,182,0.22); color:#2EC4B6; transition:background .25s ease, border-color .25s ease; }
.mod-ico svg{ width:22px; height:22px; }
.mod-card:hover .mod-ico{ background:rgba(46,196,182,0.2); border-color:rgba(46,196,182,0.5); }
.mod-num{ font-family:var(--head); font-size:15px; font-weight:700; letter-spacing:2px; color:#2EC4B6; }
.mod-card h3{ font-family:var(--head); font-size:20px; font-weight:600; color:#fff; margin:18px 0 6px; }
.mod-card p{ color:rgba(255,255,255,0.55); font-size:14px; margin:0; flex:1; }

/* --- 9 modules cliquables : focus sur une case + bulle explicative (comme le site Galéa) --- */
.mod-detail{ display:none; }
.mod-grid{ position:relative; }
.mod-card{ position:relative; cursor:pointer; outline:none;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), opacity .4s ease, filter .4s ease,
             border-color .3s, background .3s, box-shadow .3s; }
.mod-card:focus-visible{ box-shadow:0 0 0 2px #2EC4B6; }
.mod-grid.is-focus .mod-card{ opacity:.25; filter:saturate(.3) blur(.4px); transform:scale(.97); }
.mod-grid.is-focus .mod-card.is-active{
  opacity:1; filter:none; transform:translateY(-4px);
  border-color:#2EC4B6; background:linear-gradient(145deg, rgba(46,196,182,0.34), rgba(46,196,182,0.12));
  box-shadow:0 0 0 1px #2EC4B6 inset, 0 22px 50px -18px rgba(46,196,182,0.75); }
.mod-card.is-active .mod-ico{ background:#2EC4B6; color:#04241f; border-color:#2EC4B6; }
.mod-card.is-active .mod-num, .mod-card.is-active > p{ color:#fff; }

.mod-bubble{ position:absolute; z-index:5; box-sizing:border-box; padding:26px 30px 24px; border-radius:20px;
  background:rgba(10,22,40,0.94); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(46,196,182,0.55);
  box-shadow:0 30px 80px -24px rgba(0,0,0,0.75), 0 0 40px -10px rgba(46,196,182,0.35);
  opacity:0; transform:translateY(10px) scale(.97); transform-origin:var(--xp-origin, center);
  transition:opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1); }
.mod-bubble.is-open{ opacity:1; transform:none; }
.mod-bubble::before{ content:""; position:absolute; width:16px; height:16px; background:rgba(10,22,40,0.94);
  border:1px solid rgba(46,196,182,0.55); transform:rotate(45deg); }
.mod-bubble[data-side="left"]::before  { left:-9px;  top:var(--xp-arrow,40px); margin-top:-8px; border-right:0; border-top:0; }
.mod-bubble[data-side="right"]::before { right:-9px; top:var(--xp-arrow,40px); margin-top:-8px; border-left:0; border-bottom:0; }
.mod-bubble[data-side="top"]::before   { top:-9px;   left:var(--xp-arrow,40px); margin-left:-8px; border-right:0; border-bottom:0; }
.mod-bubble[data-side="bottom"]::before{ bottom:-9px; left:var(--xp-arrow,40px); margin-left:-8px; border-left:0; border-top:0; }
.mod-bubble-close{ position:absolute; top:14px; right:14px; width:32px; height:32px; border-radius:50%;
  border:1px solid rgba(255,255,255,0.15); background:rgba(255,255,255,0.04); color:rgba(255,255,255,0.75);
  font-size:20px; line-height:1; cursor:pointer; transition:.2s; }
.mod-bubble-close:hover{ border-color:#2EC4B6; color:#2EC4B6; }
.mod-bubble-head{ display:flex; align-items:center; gap:14px; margin:0 40px 14px 0; }
.mod-bubble-icon{ width:46px; height:46px; flex-shrink:0; border-radius:13px; background:#2EC4B6; color:#04241f;
  display:flex; align-items:center; justify-content:center; }
.mod-bubble-icon svg{ width:23px; height:23px; }
.mod-bubble-num{ display:block; font-family:var(--head); font-size:12px; font-weight:800; letter-spacing:3px; color:#2EC4B6; margin-bottom:2px; }
.mod-bubble-title{ font-family:var(--head); font-size:21px; font-weight:700; color:#fff; margin:0; letter-spacing:-0.3px; }
.mod-bubble-body p{ font-size:15.5px; line-height:1.65; color:rgba(255,255,255,0.82); margin:0 0 16px; }
.mod-chips{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.mod-chips li{ font-size:12.5px; font-weight:700; color:#2EC4B6; padding:6px 12px; border-radius:999px;
  background:rgba(46,196,182,0.10); border:1px solid rgba(46,196,182,0.35);
  opacity:0; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease; }
.mod-bubble.is-open .mod-chips li{ opacity:1; transform:none; }
.mod-bubble.is-open .mod-chips li:nth-child(2){ transition-delay:.05s; }
.mod-bubble.is-open .mod-chips li:nth-child(3){ transition-delay:.10s; }
.mod-bubble.is-open .mod-chips li:nth-child(4){ transition-delay:.15s; }
.mod-bubble.is-open .mod-chips li:nth-child(5){ transition-delay:.20s; }
/* Bouton « suivant » : passe à la bulle du module suivant. En bas à droite,
   dans une marge réservée pour ne pas chevaucher les puces. */
.mod-bubble{ padding-bottom:52px; }
.mod-bubble-next{ position:absolute; right:16px; bottom:14px; width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0;
  border:1px solid #2EC4B6; background:#2EC4B6; color:#04241f;
  box-shadow:0 8px 20px -8px rgba(46,196,182,0.7);
  transition:transform .18s ease, filter .2s ease; z-index:3; }
.mod-bubble-next svg{ width:18px; height:18px; }
.mod-bubble-next:hover{ transform:translateX(3px); filter:brightness(1.08); }
.mod-bubble-next:active{ transform:translateX(1px) scale(.94); }
@media (max-width:600px){ .mod-bubble{ padding-bottom:50px; } }
@media (max-width:600px){ .mod-bubble{ padding:22px 20px 20px; } .mod-bubble-title{ font-size:18px; } }
@media (prefers-reduced-motion: reduce){ .mod-card, .mod-bubble, .mod-chips li{ transition:none !important; } }

/* --- Conformité : onglets + jauge --- */
.cmp-tabs{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:44px; }
.cmp-tab{ font-family:var(--body); font-size:14.5px; font-weight:600; color:rgba(255,255,255,0.72); background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius:999px; padding:11px 22px; cursor:pointer; transition:.2s; }
.cmp-tab:hover{ color:#fff; border-color:rgba(46,196,182,0.5); }
.cmp-tab.is-active{ color:#0a1424; background:#2EC4B6; border-color:#2EC4B6; }
.cmp-panels{ margin-top:30px; }
.cmp-panel{ display:none; grid-template-columns:1.2fr .8fr; gap:40px; align-items:center; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.09); border-radius:20px; padding:40px 44px; }
.cmp-panel.is-active{ display:grid; }
.cmp-text h3{ font-family:var(--head); font-size:26px; font-weight:600; color:#fff; margin:0 0 12px; }
.cmp-text p{ color:rgba(255,255,255,0.62); font-size:15px; line-height:1.6; margin:0 0 18px; }
.cmp-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.cmp-list li{ position:relative; padding-left:26px; font-size:14.5px; font-weight:600; color:#fff; }
.cmp-list li::before{ content:"✓"; position:absolute; left:0; top:0; color:#2EC4B6; font-weight:700; }
.gauge{ background:rgba(10,20,36,0.6); border:1px solid rgba(46,196,182,0.25); border-radius:18px; padding:28px; text-align:center; }
.gauge-label{ font-size:11px; letter-spacing:1.4px; text-transform:uppercase; color:rgba(255,255,255,0.5); margin-bottom:10px; }
.gauge-num{ font-family:var(--head); font-size:56px; font-weight:700; color:#2EC4B6; line-height:1; }
.gauge-bar{ height:9px; border-radius:6px; background:rgba(255,255,255,0.1); overflow:hidden; margin:18px 0 14px; }
.gauge-fill{ display:block; height:100%; width:0; border-radius:6px; background:linear-gradient(90deg,#2EC4B6,#3B8EEA); transition:width 1.1s cubic-bezier(.2,.7,.2,1); }
.gauge-foot{ display:flex; justify-content:space-between; font-size:12.5px; color:rgba(255,255,255,0.5); }

/* --- Souveraineté --- */
.sov-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px; }
.sov-item{ text-align:center; }
.sov-item p{ max-width:340px; margin-left:auto; margin-right:auto; }
.sov-ico{ display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:14px; background:rgba(46,196,182,0.12); color:#2EC4B6; margin-bottom:16px; font-size:24px; }
.sov-ico svg{ width:26px; height:26px; }
.sov-item h4{ font-family:var(--head); font-size:18px; font-weight:600; color:#fff; margin:0 0 10px; }
.sov-item p{ color:rgba(255,255,255,0.6); font-size:15px; line-height:1.6; margin:0; }
.sov-ico--tars{ padding:6px; }
.sov-ico--tars svg{ width:34px; height:34px; }

/* Liens teal « en savoir plus » (onglet Galéa) */
.galea-how-link{ margin:34px 0 0; }
.galea-how-link.center{ text-align:center; }
.galea-how-link a{ display:inline-flex; align-items:center; gap:8px; color:#2EC4B6; font-weight:600; font-size:15px; border-bottom:1px solid rgba(46,196,182,0.4); padding-bottom:2px; transition:gap .2s ease, color .2s ease; }
.galea-how-link a:hover{ gap:13px; color:#5fe0d0; }

/* Vidéo de présentation Galéa (centrée, lumineuse, halo turquoise) */
.galea-video-block{ text-align:center; }
.galea-video-block .eyebrow{ display:inline-block; margin-bottom:30px; }
.galea-video-frame{
  position:relative; max-width:900px; margin:0 auto;
  border-radius:18px; overflow:hidden;
  border:1px solid rgba(46,196,182,0.25); background:#050b16;
  box-shadow:0 44px 90px -14px rgba(46,196,182,0.50), 0 0 54px rgba(46,196,182,0.28);
}
.galea-video{ display:block; width:100%; height:auto; filter:brightness(1.14) saturate(1.06) contrast(1.02); }
@media(max-width:760px){
  .galea-hero{ flex-direction:column; align-items:flex-start; gap:24px; }
  .galea-emblem-wrap{ align-self:center; }
  .galea-emblem{ height:180px; }
}

/* ═══════════════════════════════════════════════════════════════════
   VITRINE PC ANIMÉE (scroll épinglé) — page Galea
   ═══════════════════════════════════════════════════════════════════ */
#carto-showcase{ background:#0A1628; color:#fff; position:relative; }
.carto-copy .device-copy{ margin-bottom:0; }
.carto-copy--1{ padding-top:64px; padding-bottom:30px; }
.carto-copy--2{ padding-top:30px; padding-bottom:64px; }
.carto-panel + .carto-panel{ margin-top:48px; }
#carto-showcase.carto-scroll{ padding-top:0; padding-bottom:0; }
.carto-scroll .carto-pin{ position:relative; height:440vh; }
.carto-scroll .carto-viewport{ position:sticky; top:0; overflow:hidden; }
.carto-scroll .carto-panel{ position:absolute; top:0; left:0; right:0; bottom:0; margin:0; display:flex; align-items:center; justify-content:center; background:transparent; }
.carto-scroll .carto-panel--1{ z-index:1; }
.carto-scroll .carto-panel--2{ z-index:2; transform:translateY(100%); will-change:transform; }
.carto-scroll .carto-panel--3{ z-index:3; transform:translateY(100%); will-change:transform; }
.carto-scroll .carto-panel--4{ z-index:4; transform:translateY(100%); will-change:transform; }
.carto-scroll .carto-panel .laptop{ width:min(935px,127.5vh); max-width:none; }
.device-copy{ text-align:center; max-width:720px; margin:0 auto 32px; }
.device-kicker{ font-size:12px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:#2EC4B6; margin-bottom:12px; }
.device-copy h3{ font-family:var(--head); font-size:28px; font-weight:600; letter-spacing:-0.6px; color:#fff; line-height:1.2; margin:0 0 12px; }
.device-copy p{ font-size:16px; line-height:1.65; color:rgba(255,255,255,0.68); margin:0; }
.laptop{ max-width:986px; margin:0 auto; }
.laptop-screen{ position:relative; padding:5px; overflow:hidden;
  background:linear-gradient(158deg,#e6eaf0 0%,#bcc4d0 20%,#9aa4b3 48%,#c4cbd6 74%,#858f9e 100%);
  border-radius:16px 16px 5px 5px;
  box-shadow:0 54px 100px -34px rgba(0,0,0,0.78),0 0 0 1px rgba(0,0,0,0.42),inset 0 1px 0 rgba(255,255,255,0.55); }
.laptop-surface{ position:relative; aspect-ratio:16/10; overflow:hidden; background:#070f1e; border-radius:11px 11px 2px 2px; }
.laptop-iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; pointer-events:none; transform-origin:top left; }
.laptop-base{ height:22px; margin:0 -4%;
  background:linear-gradient(180deg,#e9edf3 0%,#b3bdcb 55%,#8c97a8 100%);
  border-radius:3px 3px 15px 15px; position:relative; box-shadow:0 30px 46px -20px rgba(0,0,0,0.6); }
.laptop-base::before{ content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:15%; height:7px; background:#7c8899; border-radius:0 0 9px 9px; }
@media (max-width:900px){ .laptop-surface{ aspect-ratio:4/3; } }
@media (max-width:600px){ .device-copy h3{ font-size:21px; } .laptop-screen{ padding:3px; } }

/* Vitrine carto — TÉLÉPHONE : carrousel « coverflow » de 4 écrans (construit par JS) */
.screens{ position:relative; margin-top:12px; padding:8px 0 6px; }
.screens-stage{ position:relative; width:100%; max-width:1100px; margin:0 auto; aspect-ratio:16/10; perspective:1800px; }
.screen{ position:absolute; inset:0; margin:0; border-radius:16px; overflow:hidden; background:#070f1e;
  border:1px solid rgba(46,196,182,0.35);
  box-shadow:0 40px 90px -40px rgba(0,0,0,0.85), 0 0 0 1px rgba(255,255,255,0.03) inset;
  transition:transform .75s cubic-bezier(.22,.9,.24,1), opacity .6s ease, filter .6s ease;
  will-change:transform, opacity; cursor:grab; }
.screen:active{ cursor:grabbing; }
.screen.is-front{ transform:none; opacity:1; filter:none; z-index:3;
  box-shadow:0 46px 110px -40px rgba(0,0,0,0.9), 0 0 0 1px rgba(46,196,182,0.5) inset, 0 0 46px -12px rgba(46,196,182,0.45); }
.screen.is-left { transform:translateX(-46%) scale(.74) rotateY(16deg);  opacity:.45; filter:saturate(.7) brightness(.75); z-index:2; }
.screen.is-right{ transform:translateX(46%)  scale(.74) rotateY(-16deg); opacity:.45; filter:saturate(.7) brightness(.75); z-index:2; }
.screen.is-back { transform:scale(.6); opacity:0; z-index:1; pointer-events:none; }
.screen .laptop-iframe{ position:absolute; top:0; left:0; border:0; pointer-events:none; transform-origin:top left; }
.screens-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:5;
  width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(10,22,40,0.8); color:#2EC4B6; border:1px solid rgba(46,196,182,0.45);
  cursor:pointer; transition:.2s; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.screens-nav:hover{ background:#2EC4B6; color:#04241f; }
.screens-nav--prev{ left:2px; }
.screens-nav--next{ right:2px; }
.screens-caption{ max-width:760px; margin:40px auto 0; text-align:center; min-height:150px;
  transition:opacity .3s ease, transform .3s ease; }
.screens-caption-kicker{ font-size:12px; font-weight:800; letter-spacing:1.6px; text-transform:uppercase; color:#2EC4B6; margin-bottom:12px; }
.screens-caption-title{ font-family:var(--head); font-size:21px; font-weight:600; letter-spacing:-0.4px; color:#fff; line-height:1.22; margin:0 0 12px; }
.screens-caption-desc{ font-size:14.5px; line-height:1.65; color:rgba(255,255,255,0.68); margin:0; }
.screens-caption.is-swapping{ opacity:0; transform:translateY(8px); }
.screens-dots{ display:flex; justify-content:center; gap:10px; margin-top:24px; }
.screens-dot{ width:9px; height:9px; border-radius:50%; border:0; padding:0; cursor:pointer; background:rgba(255,255,255,0.22); transition:.2s; }
.screens-dot.is-active{ background:#2EC4B6; transform:scale(1.25); box-shadow:0 0 12px rgba(46,196,182,0.8); }
@media (max-width:600px){
  .screen.is-left { transform:translateX(-56%) scale(.66) rotateY(12deg); opacity:.3; }
  .screen.is-right{ transform:translateX(56%)  scale(.66) rotateY(-12deg); opacity:.3; }
}
@media (prefers-reduced-motion: reduce){ .screen, .screens-caption{ transition:none; } }

/* ============ Équipe (page À propos) ============ */
.team-head{ text-align:center; max-width:720px; margin:0 auto; }
.team-head .eyebrow{ display:inline-block; margin-bottom:10px; }
.team-head .eyebrow--dash::before{ margin:0 10px 3px 0; }
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; max-width:960px; margin:52px auto 0; }
.team-card{ background:#fff; border:1px solid rgba(36,86,166,0.13); border-radius:22px; padding:36px 30px 32px; text-align:center;
  box-shadow:0 26px 56px -38px rgba(36,86,166,0.42); transition:transform .38s cubic-bezier(.2,.7,.2,1), box-shadow .38s ease, border-color .3s ease; }
.team-card:hover{ transform:translateY(-6px); border-color:rgba(36,86,166,0.26); box-shadow:0 44px 82px -40px rgba(36,86,166,0.5); }
.team-photo{ width:132px; height:132px; border-radius:50%; padding:4px; margin:0 auto 22px; box-shadow:0 16px 32px -16px rgba(10,22,40,0.5); }
.team-photo img{ width:100%; height:100%; border-radius:50%; object-fit:cover; object-position:center 18%; display:block; border:3px solid #fff; }
.team-card h3{ font-family:var(--head); font-size:20px; font-weight:600; color:var(--navy); margin:0 0 6px; letter-spacing:-0.01em; }
.team-role{ font-family:var(--head); font-size:12.5px; font-weight:600; color:var(--red); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:14px; }
.team-card p{ color:var(--muted); font-size:14.5px; line-height:1.6; margin:0; }
@media(max-width:820px){ .team-grid{ grid-template-columns:1fr; max-width:420px; } }

/* Rayonnement rouge néon autour des cartes (page À propos) */
body[data-page="about"] .split-card{
  border-color:rgba(225,35,61,0.45);
  box-shadow:0 0 0 1px rgba(225,35,61,0.3), 0 0 20px rgba(225,35,61,0.33), 0 0 46px rgba(225,35,61,0.2), 0 34px 70px -40px rgba(20,30,60,0.22);
  transition:box-shadow .4s ease, border-color .3s ease;
}
body[data-page="about"] .split-card:hover{
  border-color:rgba(225,35,61,0.7);
  box-shadow:0 0 0 1px rgba(225,35,61,0.55), 0 0 30px rgba(225,35,61,0.5), 0 0 72px rgba(225,35,61,0.32), 0 34px 70px -40px rgba(20,30,60,0.22);
}

/* ===== Badges de conformité (page Stratégie, rangée 1) ===== */
.cert-badges{ display:flex; flex-wrap:wrap; gap:26px 30px; margin-top:26px; }
.cert-badge{ display:flex; flex-direction:column; align-items:center; gap:9px; width:78px; }
.cert-emblem{ width:66px; height:66px; filter:drop-shadow(0 10px 20px rgba(20,30,60,0.22)); transition:transform .35s cubic-bezier(.2,.7,.2,1); }
.cert-badge:hover .cert-emblem{ transform:translateY(-5px) scale(1.05); }
.cert-name{ font-family:var(--head); font-size:12.5px; font-weight:600; color:var(--navy); text-align:center; letter-spacing:-0.01em; }
.zz-alt .cert-badges{ justify-content:flex-end; }

/* ===== Mini-dashboard phishing (page Stratégie, rangée 4) ===== */
.phish-panel{ margin-top:24px; max-width:440px; background:#fff; border:1px solid rgba(36,86,166,0.14);
  border-radius:18px; padding:22px 24px; box-shadow:0 30px 60px -38px rgba(36,86,166,0.42); }
.zz-alt .phish-panel{ margin-left:auto; }
.phish-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.phish-stats > div{ text-align:left; }
.phish-stats b{ display:block; font-family:var(--head); font-size:22px; font-weight:700; color:var(--red); line-height:1; }
.phish-stats span{ display:block; font-size:11px; color:var(--muted); margin-top:5px; line-height:1.25; }
.phish-bar{ height:9px; border-radius:6px; background:rgba(36,86,166,0.1); margin:20px 0 10px; overflow:hidden; display:flex; }
.phish-bar-open{ display:block; height:100%; background:linear-gradient(90deg,#f5b301,#ff7a59); }
.phish-legend{ display:flex; flex-wrap:wrap; gap:8px 16px; }
.phish-legend span{ display:inline-flex; align-items:center; gap:6px; font-size:11.5px; color:var(--muted); }
.phish-legend i{ width:9px; height:9px; border-radius:50%; display:inline-block; }
.phish-legend .d-open{ background:#f5b301; }
.phish-legend .d-click{ background:#ff5470; }
.phish-legend .d-report{ background:#2ec4b6; }
.phish-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; padding-top:16px; border-top:1px solid rgba(36,86,166,0.12); }
.phish-live{ display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); }
.phish-live i{ width:8px; height:8px; border-radius:50%; background:#2ec4b6; box-shadow:0 0 0 0 rgba(46,196,182,0.6); animation:phish-pulse 1.8s infinite; }
@keyframes phish-pulse{ 0%{ box-shadow:0 0 0 0 rgba(46,196,182,0.55);} 70%{ box-shadow:0 0 0 7px rgba(46,196,182,0);} 100%{ box-shadow:0 0 0 0 rgba(46,196,182,0);} }
.phish-foot strong{ font-family:var(--head); font-size:14.5px; font-weight:600; color:var(--navy); }
@media(max-width:560px){ .phish-stats{ grid-template-columns:repeat(2,1fr); } .phish-panel{ max-width:none; } }

/* ===== EBIOS RM : hero 2 colonnes + carte stats compacte ===== */
.ehero{ display:grid; grid-template-columns:1fr minmax(340px,420px); gap:48px; align-items:center; }
.ehero-copy{ min-width:0; }
.ebfig-card--sm{ max-width:none; margin:0; padding:26px 26px 24px; }
.ebfig-card--sm .ebfig-card-head{ margin-bottom:20px; }
.ebfig-card--sm .ebfig-card-head h2{ font-size:28px; }
.ebfig-card--sm .ebfig-kicker{ font-size:10.5px; }
.ebfig-card--sm .ebfig-grid{ gap:12px; }
.ebfig-card--sm .ebfig{ padding:14px 8px; }
.ebfig-card--sm .ebfig-num{ font-size:30px; }
.ebfig-card--sm .ebfig-lbl{ font-size:11px; }
.ebfig-card--sm .ebfig-points{ margin-top:20px; gap:8px 20px; }
.ebfig-card--sm .ebfig-points span{ font-size:12px; }
@media(max-width:900px){
  .ehero{ grid-template-columns:1fr; gap:34px; }
  .ehero-fig{ max-width:460px; }
}

/* ===== Cartographie des risques (matrice 4×4) ===== */
.rmap{ display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:30px; align-items:start; margin-top:44px;
  background:#fff; border:1px solid rgba(36,86,166,0.14); border-radius:22px; padding:30px 32px;
  box-shadow:0 30px 64px -40px rgba(36,86,166,0.42); }
.rmap-matrix{ display:grid; grid-template-columns:22px minmax(0,1fr); grid-template-rows:1fr 22px; gap:8px; min-width:0; }
.rmap-yaxis{ grid-column:1; grid-row:1; display:flex; align-items:center; justify-content:center; }
.rmap-yaxis span{ writing-mode:vertical-rl; transform:rotate(180deg); font-size:11px; font-weight:700; letter-spacing:0.05em; color:var(--muted); text-transform:uppercase; }
.rmap-grid{ grid-column:2; grid-row:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(4,1fr); gap:8px; aspect-ratio:1.25/1; min-width:0; }
.rmap-cell{ min-width:0; }
.rmap-xaxis{ grid-column:2; grid-row:2; text-align:center; }
.rmap-xaxis span{ font-size:11px; font-weight:700; letter-spacing:0.05em; color:var(--muted); text-transform:uppercase; }
.rmap-cell{ border-radius:12px; display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap; min-height:56px; }
.lvl-low{ background:#5ec98a; } .lvl-mod{ background:#f2c744; } .lvl-high{ background:#ef6b5f; } .lvl-crit{ background:#8f1d2e; }
.rmap-chip{ font-family:var(--head); font-size:12.5px; font-weight:700; color:#12351f; background:rgba(255,255,255,0.86); border-radius:20px; padding:3px 9px; }
.rmap-chip--w{ color:#fff; background:rgba(255,255,255,0.22); border:1px solid rgba(255,255,255,0.5); }
.rmap-side{ display:flex; flex-direction:column; gap:16px; }
.rmap-legend{ display:flex; flex-wrap:wrap; gap:8px 16px; }
.rmap-legend span{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--muted); font-weight:500; }
.rmap-legend i{ width:11px; height:11px; border-radius:4px; display:inline-block; }
.lg-low{ background:#5ec98a; } .lg-mod{ background:#f2c744; } .lg-high{ background:#ef6b5f; } .lg-crit{ background:#8f1d2e; }
.rmap-total{ background:rgba(36,86,166,0.06); border:1px solid rgba(36,86,166,0.14); border-radius:14px; padding:16px 18px; font-size:14.5px; color:var(--muted); line-height:1.4; }
.rmap-total b{ font-family:var(--head); font-size:26px; color:var(--navy); margin-right:6px; }
.rmap-total span{ font-size:13px; }
.rmap-prio-label{ font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--red); margin-top:4px; }
.rmap-prio{ display:flex; align-items:center; gap:14px; padding:10px 0; border-top:1px solid rgba(36,86,166,0.1); }
.rmap-prio:first-of-type{ border-top:0; }
.rmap-dot{ flex:0 0 auto; width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-family:var(--head); font-weight:700; font-size:13px; color:#fff; }
.rmap-prio strong{ display:block; font-size:14.5px; color:var(--navy); font-weight:600; }
.rmap-prio em{ font-style:normal; font-size:12.5px; color:var(--muted); }
@media(max-width:840px){ .rmap{ grid-template-columns:1fr; } }
@media(max-width:560px){
  .rmap{ padding:18px 16px; }
  .rmap-matrix{ grid-template-columns:15px minmax(0,1fr); gap:6px; }
  .rmap-grid{ gap:6px; }
  .rmap-chip{ font-size:11px; padding:2px 7px; }
  .rmap-yaxis span, .rmap-xaxis span{ font-size:9px; }
}

/* ===== Bande référentiels (page RSSI) ===== */
.cert-strip{ margin:52px auto 0; text-align:center; }
.cert-strip-label{ display:block; font-family:var(--head); font-size:14px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted); margin-bottom:24px; }
.cert-badges--center{ justify-content:center; gap:30px 40px; }

/* ============ Section « Piloté avec Galéa » (page RSSI) ============ */
.galea-sec .center-eyebrow{ display:block; text-align:center; margin-bottom:10px; }
.galea-sec .center-eyebrow.eyebrow--dash::before{ display:none; }
.gvrow{ display:grid; grid-template-columns:1fr 1.15fr; gap:48px; align-items:center; max-width:1040px; margin:56px auto 0; }
.gvrow--rev .gv-copy{ order:2; }
.gvrow--rev .gv-fig{ order:1; }
.gv-tag{ display:inline-block; font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--red); margin-bottom:12px; }
.gv-copy h3{ font-family:var(--head); font-size:25px; font-weight:600; color:var(--navy); margin:0 0 14px; letter-spacing:-0.01em; line-height:1.18; }
.gv-copy p{ color:var(--muted); font-size:15.5px; line-height:1.64; margin:0 0 12px; }
.gv-note{ color:var(--navy)!important; font-size:14.5px!important; }
.gv-fig{ min-width:0; }

/* Carte générique Galéa */
.gcard{ background:#fff; border:1px solid rgba(36,86,166,0.14); border-radius:20px; padding:22px 24px; box-shadow:0 34px 70px -42px rgba(36,86,166,0.45); }
.gcard-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:18px; }
.gcard-head strong{ display:block; font-family:var(--head); font-size:16.5px; color:var(--navy); }
.gcard-head span{ display:block; font-size:12.5px; color:var(--muted); margin-top:3px; }
.gcard-badge{ flex:0 0 auto; font-size:11px; font-weight:600; color:#c26a00; background:#fff3df; border:1px solid #ffe0b0; border-radius:999px; padding:5px 11px; }
.gcov{ display:flex; flex-direction:column; gap:12px; }
.gcov-row{ display:grid; grid-template-columns:1fr 90px auto; gap:12px; align-items:center; }
.gcov-dom{ display:inline-flex; align-items:center; gap:9px; font-size:13.5px; color:var(--navy); }
.gcov-dom i{ width:10px; height:10px; border-radius:4px; display:inline-block; flex:0 0 auto; }
.gcov-bar{ height:7px; border-radius:5px; background:rgba(36,86,166,0.1); overflow:hidden; display:block; }
.gcov-bar b{ display:block; height:100%; border-radius:5px; background:#3a7bd5; }
.gcov-val{ font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums; text-align:right; }
.gref{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px 18px; margin-top:18px; padding-top:16px; border-top:1px solid rgba(36,86,166,0.1); }
.gref-item{ display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; }
.gref-item span:first-child{ font-size:12px; font-weight:600; color:var(--navy); min-width:58px; }
.gref-item em{ font-style:normal; font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }

/* Carte sombre : cartographie SI */
.gcard--dark{ background:linear-gradient(165deg,#0d1b33,#0a1628); border-color:rgba(255,255,255,0.08); }
.gmap-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:6px; }
.gmap-head strong{ font-family:var(--head); font-size:16px; color:#fff; }
.gmap-head span{ font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:#ff6b7d; }
.gmap{ width:100%; height:auto; display:block; }
.gnode rect{ fill:rgba(255,255,255,0.03); stroke-width:1.4; }
.gnode circle{ fill:none; stroke-width:1.6; }
.gnode--red rect{ stroke:#ff3b52; fill:rgba(255,59,82,0.08); } .gnode--red circle{ stroke:#ff6b7d; }
.gnode--amber rect{ stroke:#f5a623; fill:rgba(245,166,35,0.07); } .gnode--amber circle{ stroke:#f5b955; }
.gnode--green rect{ stroke:#2ec4b6; fill:rgba(46,196,182,0.06); } .gnode--green circle{ stroke:#4fd6c8; }
.gnode .gpulse{ fill:#ff3b52; stroke:none; animation:gpulse 1.8s infinite; }
@keyframes gpulse{ 0%{ opacity:1; } 50%{ opacity:.35; } 100%{ opacity:1; } }
.gmap-lbl{ font-family:var(--head); font-weight:600; font-size:12px; fill:#fff; }
.gmap-lbl--red{ fill:#ff8a97; } .gmap-lbl--amber{ fill:#f5c06a; } .gmap-lbl--green{ fill:#6fe0d3; }
.gmap-legend{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:14px; }
.gmap-legend span{ display:inline-flex; align-items:center; gap:7px; font-size:11.5px; color:rgba(255,255,255,0.72); }
.gmap-legend i{ width:10px; height:10px; border-radius:3px; display:inline-block; }

/* Carte scénario → plan */
.gscn{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:0; background:#fff; border:1px solid rgba(36,86,166,0.14); border-radius:20px; overflow:hidden; box-shadow:0 34px 70px -42px rgba(36,86,166,0.45); }
.gscn-left{ padding:24px 26px; border-right:1px solid rgba(36,86,166,0.12); }
.gscn-right{ padding:24px 26px; background:#fbfcfe; }
.gscn-kicker{ display:block; font-family:var(--head); font-size:11px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.gscn-kicker--teal{ color:#1fa89b; }
.gscn-left h4{ font-family:var(--head); font-size:21px; font-weight:600; color:var(--navy); margin:0 0 16px; }
.gscn-meta{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid rgba(36,86,166,0.1); font-size:13.5px; }
.gscn-meta span{ color:var(--muted); } .gscn-meta b{ color:var(--navy); font-weight:600; text-align:right; }
.gscn-risk{ display:inline-block; margin-top:16px; font-family:var(--head); font-size:13px; font-weight:600; border-radius:8px; padding:7px 13px; }
.gscn-risk--high{ color:#e0384d; border:1px solid rgba(224,56,77,0.4); background:rgba(224,56,77,0.06); }
.gmes{ margin-bottom:14px; }
.gmes-top{ display:flex; justify-content:space-between; gap:10px; margin-bottom:6px; font-size:13.5px; }
.gmes-top span{ color:var(--navy); font-weight:600; } .gmes-top em{ font-style:normal; color:var(--muted); font-variant-numeric:tabular-nums; }
.gscn-resid{ margin-top:16px; padding-top:14px; border-top:1px solid rgba(36,86,166,0.12); font-size:13.5px; color:var(--muted); }
.gscn-resid strong{ color:#1fa89b; font-family:var(--head); }
@media(max-width:820px){
  .gvrow, .gvrow--rev{ grid-template-columns:1fr; gap:26px; }
  .gvrow--rev .gv-copy{ order:1; } .gvrow--rev .gv-fig{ order:2; }
  .gscn{ grid-template-columns:1fr; } .gscn-left{ border-right:0; border-bottom:1px solid rgba(36,86,166,0.12); }
  .gref{ grid-template-columns:1fr; }
}

/* ============ Visuel pentest (page Audits) ============ */
.ptest{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:18px; max-width:1040px; margin:44px auto 0;
  font-family:'JetBrains Mono',monospace; }
.ptest-col{ background:linear-gradient(165deg,#0e1f39,#0a1628); border:1px solid rgba(255,255,255,0.08);
  border-radius:20px; padding:24px 26px; box-shadow:0 34px 70px -42px rgba(10,22,40,0.6); }
.c-red{ color:#ff5a6e!important; }
/* colonne gauche : cible */
.ptest-host{ display:flex; align-items:center; gap:10px; font-size:19px; font-weight:600; color:#fff; letter-spacing:-0.01em; }
.ptest-host i{ width:9px; height:9px; border-radius:50%; background:#2ec4b6; box-shadow:0 0 8px #2ec4b6; }
.ptest-sub{ display:block; font-size:12.5px; color:rgba(255,255,255,0.5); margin-top:6px; letter-spacing:0.02em; }
.ptest-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:20px 0 22px; }
.ptest-stats > div{ background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07); border-radius:12px; padding:14px 8px; text-align:center; }
.ptest-stats b{ display:block; font-size:26px; font-weight:700; color:#fff; line-height:1; }
.ptest-stats span{ display:block; font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.45); margin-top:7px; }
.ptest-meta{ margin:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px 18px; align-items:baseline; }
.ptest-meta dt{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); }
.ptest-meta dd{ margin:0; font-size:14px; color:#fff; font-weight:600; }
.ptest-progress-lbl{ margin:22px 0 12px; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.4); }
.ptest-steps{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.ptest-chip{ font-size:13px; color:#8ff0e4; border:1px solid rgba(46,196,182,0.5); border-radius:9px; padding:6px 13px; }
.ptest-chip--red{ color:#ff8a97; border-color:rgba(255,90,110,0.55); }
.ptest-dash{ color:rgba(255,255,255,0.3); }
.ptest-foot{ margin:20px 0 0; font-size:12.5px; color:rgba(255,255,255,0.5); }
/* colonne droite : chemin + failles */
.ptest-path{ border:1px solid rgba(255,255,255,0.08); border-radius:14px; padding:16px; margin-bottom:20px; }
.ptest-path-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.ptest-path-head span:first-child{ font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:#3FD0E8; }
.ptest-badge{ font-size:11px; color:#ff8a97; border:1px solid rgba(255,90,110,0.5); border-radius:999px; padding:3px 11px; }
.ptest-node{ background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:11px; padding:13px 15px; margin-bottom:9px; }
.ptest-node:last-child{ margin-bottom:0; }
.ptest-node--entry{ border-color:rgba(63,208,232,0.28); }
.ptest-node-k{ display:block; font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.42); margin-bottom:6px; }
.ptest-node strong{ font-size:14px; color:#fff; font-weight:600; line-height:1.35; }
.ptest-vulns-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:12px; }
.ptest-vulns-head span:first-child{ font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:#3FD0E8; }
.ptest-vulns-count{ font-size:12px; color:rgba(255,255,255,0.42); }
.ptest-vuln{ background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07); border-left:3px solid #ff5a6e; border-radius:10px; padding:12px 15px; margin-bottom:9px; font-size:13.5px; }
.ptest-vuln:last-child{ margin-bottom:0; }
.ptest-vuln b{ color:#fff; font-weight:600; }
.ptest-vuln code{ color:rgba(255,255,255,0.55); font-family:'JetBrains Mono',monospace; }
@media(max-width:820px){ .ptest{ grid-template-columns:1fr; } .ptest-stats{ grid-template-columns:repeat(3,1fr); } }

/* ============ Flux serpentant « Que réalise un RSSI ? » (page RSSI) ============ */
.serp{ position:relative; max-width:1000px; margin:52px auto 0; padding:10px 0; }
.serp-line{ position:absolute; inset:0; width:100%; height:100%; z-index:0; overflow:visible; pointer-events:none; }
.serp-line path{ fill:none; stroke-linecap:round; stroke-width:3; }
.serp-base{ stroke:rgba(36,86,166,0.14); }
.serp-draw{ stroke:var(--red); stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--serp,0));
  filter:drop-shadow(0 0 5px rgba(36,86,166,0.4)); transition:stroke-dashoffset .1s linear; }
.serp-item{ position:relative; z-index:1; margin:0 auto 36px; }
.serp-item:last-child{ margin-bottom:0; }
.serp-item--l{ max-width:460px; margin-left:0; margin-right:auto; }
.serp-item--r{ max-width:460px; margin-left:auto; margin-right:0; }
.serp-item--wide{ max-width:660px; margin-bottom:82px; }
.serp-item--wl{ margin-left:0; margin-right:auto; }
.serp-item--wr{ margin-left:auto; margin-right:0; }
.serp-item--narrow{ max-width:560px; }
/* groupement : l'étape colle à son visuel, le visuel se détache de l'étape suivante */
.serp-item:has(+ .serp-item--wide){ margin-bottom:16px; }
.serp-item--wide:has(+ .serp-item--wide){ margin-bottom:36px; }

.serp-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px 26px 22px;
  box-shadow:0 22px 52px -32px rgba(56,104,196,0.30); transition:transform .28s ease, box-shadow .28s ease; }
.serp-card:hover{ transform:translateY(-4px); box-shadow:0 32px 64px -34px rgba(46,96,178,0.48); }
.serp-step{ position:absolute; top:-14px; left:24px; display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:28px; padding:0 9px; border-radius:9px; font-family:var(--head); font-weight:700; font-size:13px; color:#fff;
  background:linear-gradient(135deg,var(--red),#4a7fd6); box-shadow:0 8px 18px -8px rgba(36,86,166,0.6); }
.serp-card h4{ font-family:var(--head); font-size:18px; font-weight:600; color:var(--navy); margin:6px 0 10px; }
.serp-card p{ color:var(--muted); font-size:15px; line-height:1.55; margin:0 0 14px; }
.serp-card p:last-child{ margin-bottom:0; }
.serp-card .btn{ font-size:16px; padding:6px 0; gap:11px; }
.serp-card .btn::after{ width:32px; height:32px; font-size:14px; }

.serp-cap{ text-align:left; max-width:320px; margin:0 0 20px; }
.serp-item--wr .serp-cap{ text-align:right; margin-left:auto; margin-right:0; }
.serp-tag{ display:inline-block; font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--red); margin-bottom:9px; }
.serp-cap h3{ font-family:var(--head); font-size:22px; font-weight:600; color:var(--navy); margin:0 0 9px; letter-spacing:-0.01em; line-height:1.2; }
.serp-cap p{ color:var(--muted); font-size:14.5px; line-height:1.55; margin:0; }
.serp-fig{ position:relative; }

@media(max-width:820px){
  .serp-line{ display:none; }
  .serp-item--l, .serp-item--r, .serp-item--wide{ max-width:none; transform:none; margin:0 0 30px; }
}

/* ============ TARS : disposition verticale sur téléphone (galea.html) ============ */
@media(max-width:760px){
  .tars-flow--vertical{ display:flex; flex-direction:column; align-items:center; gap:34px;
    grid-template-columns:none; column-gap:0; row-gap:0; }
  /* (5) décoller le bloc TARS des résultats + rendre le trait visible */
  .tars-flow--vertical .tars-col--center{ margin-bottom:30px; }
  .tars-flow--vertical .tars-col--right{ margin-top:12px; }
  .tars-flow--vertical .tars-col{ width:100%; padding:0; }
  .tars-flow--vertical .tars-colhead{ text-align:center!important; margin-bottom:14px; font-size:11px; }
  .tars-flow--vertical .tars-flow-links{ display:block; }
  /* sources : tuiles 2 colonnes, point d'accroche sous chaque tuile */
  .tars-flow--vertical .tars-sources{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
  .tars-flow--vertical .tars-sources li{ text-align:center; padding:11px 10px 13px; font-size:12.5px; line-height:1.35;
    border-radius:12px; background:#0C1A2E; border:1px solid rgba(255,255,255,0.08); }
  .tars-flow--vertical .tars-sources li span{ display:block; font-size:11px; margin-top:2px; }
  .tars-flow--vertical .tars-sources li::after{ left:50%; right:auto; top:auto; bottom:0; transform:translate(-50%,50%);
    width:6px; height:6px; background:#3FD0E8; box-shadow:0 0 0 4px rgba(63,208,232,0.15); }
  .tars-flow--vertical .tars-col--center{ margin-top:22px; }
  .tars-flow--vertical .tars-device{ width:190px; padding:16px; margin:0 auto; }
  /* « Ce que Galea produit » passe sous la dernière carte */
  .tars-flow--vertical .tars-col--right{ display:flex; flex-direction:column; }
  .tars-flow--vertical .tars-col--right .tars-colhead{ order:2; margin:16px 0 0; }
  /* livrables : cartes empilées, point d'accroche au-dessus */
  .tars-flow--vertical .tars-cards{ display:grid; grid-template-columns:1fr; gap:14px; }
  .tars-flow--vertical .tars-card{ padding:14px 14px 16px; background:#0C1A2E; }
  .tars-flow--vertical .tars-card::before{ left:50%; top:0; transform:translate(-50%,-50%);
    width:6px; height:6px; background:#3FD0E8; box-shadow:0 0 0 4px rgba(63,208,232,0.15); }
  .tars-flow--vertical .tars-card-title{ font-size:14.5px; margin-bottom:10px; }
  .tars-flow--vertical .tars-chip{ font-size:11px; padding:3px 9px; }
  .tars-flow--vertical .tars-card-note{ font-size:12px; margin-top:10px; }
  .tars-flow--vertical .tars-flow-links path{ stroke:rgba(63,208,232,0.55); stroke-width:1.6; filter:none; }
}

/* ===== Duo superposé socle (RSSI) ===== */
.serp-duo{ display:flex; justify-content:center; align-items:flex-start; }
.serp-duo .pyr-card{ width:58%; margin-top:30px; transform:rotate(-1.2deg); z-index:1;
  box-shadow:0 30px 64px -40px rgba(36,86,166,0.5); }
.serp-duo .cov-card{ width:46%; margin-left:-42px; z-index:2; box-shadow:0 44px 80px -42px rgba(36,86,166,0.55); }

/* Pyramide documentaire (compacte) */
.pyr-card{ padding:18px 20px; }
.pyr{ display:flex; flex-direction:column; gap:5px; }
.pyr-lvl{ display:flex; align-items:center; gap:9px; border-radius:10px; padding:7px 11px; margin:0 auto; box-sizing:border-box; }
.pyr-n1{ background:linear-gradient(90deg,#2456A6,#3d6fc6); color:#fff; }
.pyr-n2{ background:#5f86d1; color:#fff; }
.pyr-n3{ background:#a3bce8; color:#12325f; }
.pyr-n4{ background:#d0dff4; color:#42577b; }
.pyr-badge{ flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:rgba(255,255,255,0.22); display:flex; align-items:center; justify-content:center; font-family:var(--head); font-weight:700; font-size:11px; }
.pyr-n3 .pyr-badge, .pyr-n4 .pyr-badge{ background:rgba(18,50,95,0.14); }
.pyr-txt{ flex:1; min-width:0; }
.pyr-txt strong{ display:block; font-size:12.5px; font-weight:600; line-height:1.1; }
.pyr-txt em{ font-style:normal; font-size:9.5px; opacity:0.8; }
.pyr-val{ text-align:right; flex:0 0 auto; line-height:1.05; }
.pyr-val b{ font-family:var(--head); font-size:13.5px; }
.pyr-val span{ display:block; font-size:9px; opacity:0.8; }
.pyr-note{ text-align:center; font-style:italic; font-size:10.5px; color:var(--muted); margin:11px 0 0; line-height:1.35; }
.pyr-foot{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; }
.pyr-foot-dark{ background:#0f2444; color:#fff; border-radius:11px; padding:10px 13px; }
.pyr-foot-light{ background:#f4f7fd; border:1px solid rgba(36,86,166,0.12); border-radius:11px; padding:10px 13px; }
.pyr-foot span{ display:block; font-size:8.5px; letter-spacing:0.06em; text-transform:uppercase; opacity:0.7; margin-bottom:2px; }
.pyr-foot b{ font-family:var(--head); font-size:20px; }
.pyr-foot-light b{ color:var(--navy); }
.pyr-foot i{ font-style:normal; font-size:12px; opacity:0.55; }
.pyr-foot em{ display:block; font-style:normal; font-size:9.5px; opacity:0.72; margin-top:2px; line-height:1.25; }

/* ===== Mini-dashboard phishing (RSSI, clair) ===== */
.c-amber{ color:#e08e00!important; } .c-red2{ color:#e0384d!important; } .c-green{ color:#1fa89b!important; }
.phd{ background:#fff; border:1px solid rgba(36,86,166,0.14); border-radius:20px; padding:22px 24px; box-shadow:0 34px 70px -42px rgba(36,86,166,0.45); }
.phd-head{ display:flex; align-items:baseline; gap:10px; margin-bottom:18px; flex-wrap:wrap; }
.phd-head strong{ font-family:var(--head); font-size:19px; color:var(--navy); }
.phd-head span{ font-size:13px; color:var(--muted); }
.phd-body{ display:grid; grid-template-columns:210px minmax(0,1fr); gap:22px; }
.phd-check{ list-style:none; margin:0 0 18px; padding:0; display:flex; flex-direction:column; gap:14px; }
.phd-check li{ position:relative; padding-left:24px; font-size:13px; color:var(--navy); line-height:1.42; }
.phd-check li::before{ content:"✓"; position:absolute; left:0; top:0; color:#2ec4b6; font-weight:700; }
.phd-live{ border-top:1px solid rgba(36,86,166,0.12); padding-top:14px; }
.phd-live span{ display:block; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); margin-bottom:3px; }
.phd-live strong{ font-family:var(--head); font-size:15px; color:var(--navy); }
.phd-main{ min-width:0; }
.phd-stats{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; margin-bottom:12px; }
.phd-stats > div{ background:#f4f7fd; border:1px solid rgba(36,86,166,0.1); border-radius:11px; padding:11px 7px; }
.phd-stats b{ display:block; font-family:var(--head); font-size:19px; color:var(--red); line-height:1; }
.phd-stats span{ display:block; font-size:10px; color:var(--muted); margin-top:5px; line-height:1.2; }
.phd-sub{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-bottom:18px; }
.phd-sub > div{ background:#fff; border:1px solid rgba(36,86,166,0.13); border-radius:11px; padding:11px 12px; }
.phd-sub b{ display:block; font-family:var(--head); font-size:16px; color:var(--navy); line-height:1; }
.phd-sub span{ font-size:11px; color:var(--muted); }
.phd-metrics-lbl{ display:block; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.phd-mrow{ display:grid; grid-template-columns:135px 1fr 44px; gap:12px; align-items:center; margin-bottom:9px; }
.phd-mrow > span:first-child{ font-size:13px; color:var(--navy); }
.phd-mbar{ height:7px; border-radius:5px; background:rgba(36,86,166,0.1); overflow:hidden; display:block; }
.phd-mbar i{ display:block; height:100%; border-radius:5px; }
.phd-mrow em{ font-style:normal; font-weight:600; font-size:13px; text-align:right; font-variant-numeric:tabular-nums; }

@media(max-width:820px){
  .serp-duo{ flex-direction:column; align-items:center; gap:18px; }
  .serp-duo > .gcard{ width:100%; max-width:420px; }
  .serp-duo .pyr-card{ margin-top:0; transform:none; }
  .serp-duo .cov-card{ margin-left:0; }
  .phd-body{ grid-template-columns:1fr; gap:16px; }
  .phd-stats{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .phd-sub{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pyr-foot{ grid-template-columns:1fr; }
}

/* ============ Fil compact « Que réalise un RSSI ? » (rail à gauche) ============ */
.rflow{ position:relative; width:100%; max-width:1120px; margin:40px auto 0; padding-left:50px; box-sizing:border-box; }
.rflow-rail{ position:absolute; left:15px; top:16px; bottom:16px; width:2px; background:rgba(36,86,166,0.14); border-radius:2px; }
.rflow-rail-fill{ position:absolute; left:0; top:0; width:100%; height:var(--serp,0%);
  background:linear-gradient(180deg,var(--red),#4a7fd6); border-radius:2px; box-shadow:0 0 6px rgba(36,86,166,0.4); transition:height .1s linear; }
.rf-row{ position:relative; display:grid; grid-template-columns:286px 700px; gap:32px; align-items:center; justify-content:start;
  width:100%; box-sizing:border-box; padding:26px 0; border-top:1px solid rgba(36,86,166,0.1); }
@media(max-width:1180px){ .rf-row{ grid-template-columns:250px 560px; gap:28px; } }
@media(max-width:1000px){ .rf-row{ grid-template-columns:210px 460px; gap:22px; } }
.rf-row:first-of-type{ border-top:0; padding-top:6px; }
.rf-row::before{ content:""; position:absolute; left:-42px; top:36px; width:13px; height:13px; border-radius:50%;
  background:#fff; border:3px solid var(--red); box-shadow:0 0 0 4px rgba(36,86,166,0.08); z-index:1; }
.rf-row--sub::before{ width:9px; height:9px; border-width:2px; left:-40px; top:38px; opacity:.75; }
.rf-txt{ min-width:0; }
.rf-step{ display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:27px; padding:0 9px;
  border-radius:9px; font-family:var(--head); font-weight:700; font-size:13px; color:#fff;
  background:linear-gradient(135deg,var(--red),#4a7fd6); margin-bottom:12px; }
.rf-tag{ display:inline-block; font-family:var(--head); font-size:11.5px; font-weight:600; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--red); margin-bottom:9px; }
.rf-txt h4{ font-family:var(--head); font-size:19px; font-weight:600; color:var(--navy); margin:0 0 10px; line-height:1.2; }
.rf-txt p{ color:var(--muted); font-size:14.5px; line-height:1.55; margin:0 0 14px; }
.rf-txt .btn{ font-size:15px; padding:5px 0; gap:10px; }
.rf-txt .btn::after{ width:30px; height:30px; font-size:13px; }
.rf-fig{ min-width:0; }
.rf-fig--text{ display:flex; flex-direction:column; justify-content:center; }
.rf-fig--text p{ color:var(--muted); font-size:15.5px; line-height:1.62; margin:0 0 16px; max-width:560px; }
.rf-fig--text .btn{ font-size:15px; padding:4px 0; gap:10px; }
.rf-fig--text .btn::after{ width:30px; height:30px; font-size:13px; }
/* les visuels remplissent la colonne, sans marges superflues */
.rf-fig{ min-width:0; }
.rf-fig > *{ width:100%; box-sizing:border-box; }
.rf-fig .rmap, .rf-fig .gscn, .rf-fig .phd, .rf-fig .ptest, .rf-fig .gcard{ margin:0; }
.rf-fig .gcard{ box-shadow:0 26px 56px -40px rgba(36,86,166,0.4); }
@media(max-width:860px){
  .rflow{ padding-left:34px; }
  .rflow-rail{ left:9px; }
  .rf-row, .rf-row--text{ grid-template-columns:1fr; gap:18px; }
  .rf-row::before{ left:-30px; top:30px; }
}

/* ===== Barre de recherche du blog ===== */
.blog-search{ position:relative; max-width:520px; margin:26px 0 0; }
.blog-search svg{ position:absolute; left:18px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--muted); pointer-events:none; }
.blog-search input{ width:100%; box-sizing:border-box; padding:15px 18px 15px 50px; font-family:var(--body); font-size:16px; color:var(--navy);
  background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 40px -30px rgba(36,86,166,0.4); transition:border-color .2s, box-shadow .2s; }
.blog-search input::placeholder{ color:var(--muted); }
.blog-search input:focus{ outline:none; border-color:var(--red); box-shadow:0 0 0 3px rgba(225,35,61,0.12), 0 18px 40px -30px rgba(36,86,166,0.4); }
.blog-noresult{ text-align:center; color:var(--muted); font-size:16px; padding:30px 0; display:none; }
.blog-noresult.show{ display:block; }

/* ═══════════════ AJUSTEMENTS TÉLÉPHONE (≤760px) — compaction + secteurs en quinconce ═══════════════ */
@media(max-width:760px){
  /* (2) Compaction générale : moins de blanc vertical */
  section.block{ padding:46px 0; }
  .block-title{ margin:14px 0 30px; }
  .page-hero .container{ padding-top:60px; padding-bottom:44px; }
  .def-grid{ gap:22px 20px; margin-top:34px; }
  .two-col-text{ gap:26px; margin-top:26px; }
  .center-lead{ margin-top:12px; }
  .refs-underline{ margin-top:14px; }

  /* (1) Secteurs du hero : une simple ligne des 5 icônes, cliquables → section « Nos secteurs » */
  .hero-sectors{ flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; text-align:left; margin-right:0; }
  .hero-sectors-label{ flex-basis:100%; width:100%; margin-bottom:14px; }
  .hero-sector{ flex:1 1 0; min-width:0; width:auto; padding:0; margin:0; border:0!important; background:none; justify-content:center; }
  .hero-sector h3{ display:none; }
  .hero-sector-ico{ width:52px; height:52px; border-radius:15px; }
  .hero-sector-ico svg{ width:26px; height:26px; }
  .hero-sector:active .hero-sector-ico{ transform:scale(0.94); background:rgba(225,35,61,0.2); }

  /* (3) Page RSSI : définitions centrées */
  body[data-page="services"] .def{ text-align:center; }
  body[data-page="services"] .def-ico{ justify-content:center; width:100%; }
}

/* (4) Aperçus des graphiques RSSI (téléphone) : on montre le haut de l'image,
   puis un dégradé flouté la coupe ; un clic révèle le reste. */
.rf-fade, .rf-reduce{ display:none; }
@media(max-width:760px){
  .rf-collapsible .rf-fig{ position:relative; max-height:172px; overflow:hidden; cursor:pointer; }
  .rf-collapsible.rf-open .rf-fig{ max-height:none; overflow:visible; cursor:default; }
  .rf-fade{ display:flex; position:absolute; left:0; right:0; bottom:0; height:130px; align-items:flex-end; justify-content:center; padding-bottom:14px;
    background:linear-gradient(to bottom, rgba(249,250,253,0) 0%, rgba(249,250,253,0.7) 58%, rgba(249,250,253,0.97) 100%);
    -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 52%); mask-image:linear-gradient(to bottom, transparent 0%, #000 52%);
    pointer-events:none; z-index:2; }
  .rf-open .rf-fade{ display:none; }
  .rf-fade-pill{ display:inline-flex; align-items:center; gap:8px; background:var(--navy); color:#fff;
    font-family:var(--head); font-weight:600; font-size:13px; padding:9px 17px; border-radius:999px; box-shadow:0 12px 26px -10px rgba(10,22,40,0.55); }
  .rf-fade-pill b{ font-weight:700; }
  .rf-open .rf-reduce{ display:inline-flex; align-items:center; gap:7px; width:auto; margin:14px auto 0; cursor:pointer;
    background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 18px;
    font-family:var(--head); font-weight:600; font-size:13px; color:var(--navy); }
}

/* (2) Compaction ciblée téléphone : Galéa, hero accueil, bento Audits */
@media(max-width:760px){
  .galea-intro{ padding:42px 0; }
  .galea-intro-grid{ gap:22px; }
  .galea-orb-img{ height:150px; }
  .galea-intro-text h2{ margin:10px 0 12px; font-size:30px; }
  .galea-hero{ gap:18px; }
  .hero .container{ padding-top:30px; padding-bottom:40px; }
  .bento{ gap:12px; margin-top:30px; }
  .zz-row{ padding:22px 0; }
  .frow{ padding:18px 22px; }
  .cta-final .container{ padding-top:52px; padding-bottom:52px; }
}

/* ═══ Galéa téléphone : gros vides + souveraineté en lignes ═══ */
@media(max-width:760px){
  /* hero : le flex-basis 560px devenait une HAUTEUR en colonne → gros vide sous le titre */
  .galea-hero{ gap:16px; }
  .galea-hero-text{ flex:0 0 auto; }
  .galea-emblem-wrap{ flex:0 0 auto; }
  .galea-emblem{ height:148px; }

  /* (7) Souveraineté : 3 lignes (icône à gauche, titre + texte à droite) */
  .sov-grid{ grid-template-columns:1fr; gap:12px; margin-top:28px; }
  .sov-item{ display:grid; grid-template-columns:auto 1fr; column-gap:15px; text-align:left;
    background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:15px 17px; }
  .sov-ico{ grid-column:1; grid-row:1 / span 2; align-self:start; margin-bottom:0; width:44px; height:44px; }
  .sov-ico--tars{ padding:5px; }
  .sov-item h4{ grid-column:2; grid-row:1; align-self:center; margin:0 0 4px; }
  .sov-item p{ grid-column:2; grid-row:2; text-align:left; max-width:none; margin:0; }
}

/* 9 modules Galéa (téléphone) : 2 colonnes qui tiennent dans l'écran (plus de débordement) */
@media(max-width:760px){
  .mod-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:30px; }
  .mod-card{ padding:17px 15px 17px; border-radius:16px; }
  .mod-head{ gap:9px; }
  .mod-ico{ width:38px; height:38px; border-radius:11px; }
  .mod-ico svg{ width:19px; height:19px; }
  .mod-num{ font-size:13px; letter-spacing:1.5px; }
  .mod-card h3{ font-size:15.5px; margin-top:13px; line-height:1.2; }
  .mod-card p{ font-size:12.5px; }
}

/* ═══════════════ TÉLÉPHONE EN PAYSAGE (orientation paysage, faible hauteur) ═══════════════ */
@media (orientation:landscape) and (max-height:540px){
  /* (1) Marges latérales de sécurité : le texte reste écarté de l'encoche / barre caméra */
  .container{ padding-left:max(40px, env(safe-area-inset-left)); padding-right:max(40px, env(safe-area-inset-right)); }
  .header-bar{ padding-left:max(40px, env(safe-area-inset-left)); padding-right:max(40px, env(safe-area-inset-right)); }
  .site-footer .container{ padding-left:max(40px, env(safe-area-inset-left)); padding-right:max(40px, env(safe-area-inset-right)); }
  /* Logo : hauteur fixe + largeur auto → jamais déformé, même en paysage */
  .logo{ align-items:center; }
  .logo img{ height:38px; width:auto; flex:0 0 auto; object-fit:contain; }

  /* (2) Secteurs du hero : une simple ligne des 5 icônes cliquables (comme en portrait) */
  .hero-cols{ flex-direction:column; align-items:stretch; gap:22px; }
  .hero-sectors{ flex:0 0 auto; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; text-align:left; margin-right:0; }
  .hero-sectors-label{ flex-basis:100%; width:100%; margin-bottom:8px; }
  .hero-sector{ flex:1 1 0; min-width:0; width:auto; padding:0; margin:0; border:0!important; background:none; justify-content:center; }
  .hero-sector h3{ display:none; }
  .hero-sector-ico{ width:46px; height:46px; border-radius:13px; }
  .hero-sector-ico svg{ width:24px; height:24px; }
  .hero-sector:active .hero-sector-ico{ transform:scale(0.94); background:rgba(225,35,61,0.2); }

  /* (5) Blog : deux articles par ligne plutôt qu'un seul étalé */
  .article-grid{ grid-template-columns:1fr 1fr; gap:22px; }

  /* (6) À propos : les trois membres de l'équipe côte à côte */
  .team-grid{ grid-template-columns:repeat(3,1fr); max-width:none; }

  /* (C) Bento « Nos prestations » : plus de grands vides dans les cases */
  .bento{ grid-template-columns:1fr 1fr; grid-auto-rows:auto; gap:14px; }
  .bento-cell,.bento-feature,.bento-cell:nth-child(4),.bento-cell:nth-child(5),.bento-cell:nth-child(6){ grid-column:span 1; grid-row:auto; }
  .bento-cell{ padding:22px 24px; }
  .bento-tag{ margin-bottom:12px; }
  .bento-feature{ justify-content:flex-start; }
  .bento-feature h3{ margin-top:14px; font-size:26px; }

  /* (3) Page RSSI : mêmes aperçus des graphiques qu'en portrait */
  .rflow{ padding-left:34px; }
  .rflow-rail{ left:9px; }
  .rf-row, .rf-row--text{ grid-template-columns:1fr; gap:18px; }
  .rf-row::before{ left:-30px; top:30px; }
  .rf-collapsible .rf-fig{ position:relative; max-height:200px; overflow:hidden; cursor:pointer; }
  .rf-collapsible.rf-open .rf-fig{ max-height:none; overflow:visible; cursor:default; }
  .rf-fade{ display:flex; position:absolute; left:0; right:0; bottom:0; height:130px; align-items:flex-end; justify-content:center; padding-bottom:14px;
    background:linear-gradient(to bottom, rgba(249,250,253,0) 0%, rgba(249,250,253,0.7) 58%, rgba(249,250,253,0.97) 100%);
    -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 52%); mask-image:linear-gradient(to bottom, transparent 0%, #000 52%);
    pointer-events:none; z-index:2; }
  .rf-open .rf-fade{ display:none; }
  .rf-fade-pill{ display:inline-flex; align-items:center; gap:8px; background:var(--navy); color:#fff;
    font-family:var(--head); font-weight:600; font-size:13px; padding:9px 17px; border-radius:999px; box-shadow:0 12px 26px -10px rgba(10,22,40,0.55); }
  .rf-fade-pill b{ font-weight:700; }
  .rf-open .rf-reduce{ display:inline-flex; align-items:center; gap:7px; width:auto; margin:14px auto 0; cursor:pointer;
    background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 18px;
    font-family:var(--head); font-weight:600; font-size:13px; color:var(--navy); }
}

/* Téléphone paysage — (4) Graphique TARS (onglet Galéa) : on rétablit la version
   d'origine (disposition en 3 colonnes, liens néon bleus, points de liaison côté
   TARS) mais compactée pour tenir en entier dans la hauteur réduite du paysage. */
@media (orientation:landscape) and (max-height:540px){
  .tars-flow--vertical{ display:grid; grid-template-columns:1fr 132px 1fr; column-gap:18px; row-gap:0; margin-top:20px; align-items:center; }
  .tars-flow--vertical .tars-col{ width:auto; padding:0; }
  .tars-flow--vertical .tars-flow-links{ display:block; }
  .tars-flow--vertical .tars-flow-links path{ stroke:rgba(63,208,232,0.6); stroke-width:1.4; }
  .tars-flow--vertical .tars-col--left{ padding-right:16px; }
  .tars-flow--vertical .tars-col--right{ padding-left:16px; }
  .tars-flow--vertical .tars-col--left .tars-colhead{ text-align:left!important; }
  .tars-flow--vertical .tars-col--right .tars-colhead{ text-align:right!important; }
  .tars-flow--vertical .tars-colhead{ margin-bottom:10px; font-size:9.5px; letter-spacing:1.5px; }
  /* Sources : dos aligné à droite, points de liaison côté TARS (à droite) */
  .tars-flow--vertical .tars-sources{ display:flex; flex-direction:column; gap:9px; grid-template-columns:none; }
  .tars-flow--vertical .tars-sources li{ text-align:right; padding-right:18px; padding-left:0; font-size:11px; line-height:1.3; }
  .tars-flow--vertical .tars-sources li span{ display:inline; font-size:10px; margin-top:0; }
  .tars-flow--vertical .tars-sources li::after{ right:0; left:auto; top:50%; bottom:auto; transform:translateY(-50%); width:6px; height:6px; }
  /* Boîte TARS compacte */
  .tars-flow--vertical .tars-col--center{ margin:0; }
  .tars-flow--vertical .tars-device{ width:132px; padding:12px 10px; margin:0 auto; }
  .tars-flow--vertical .tars-device-screen{ padding:10px 8px; margin-bottom:8px; gap:8px; }
  .tars-flow--vertical .tars-device-name{ font-size:15px; letter-spacing:2px; padding:7px; margin-bottom:6px; }
  .tars-flow--vertical .tars-device-sub{ font-size:8px; padding:6px; }
  /* Résultats : points de liaison côté TARS (à gauche), cartes compactes */
  .tars-flow--vertical .tars-col--right{ display:block; }
  .tars-flow--vertical .tars-col--right .tars-colhead{ order:0; margin:0 0 10px; }
  .tars-flow--vertical .tars-cards{ display:flex; flex-direction:column; gap:8px; grid-template-columns:none; }
  .tars-flow--vertical .tars-card{ padding:9px 11px; }
  .tars-flow--vertical .tars-card::before{ left:0; }
  .tars-flow--vertical .tars-card-title{ font-size:12px; margin-bottom:6px; }
  .tars-flow--vertical .tars-card-tags{ gap:5px; }
  .tars-flow--vertical .tars-chip{ font-size:9px; padding:2px 6px; }
  .tars-flow--vertical .tars-bar-row{ gap:6px; margin-top:5px; }
  .tars-flow--vertical .tars-bar-label{ font-size:9px; width:30px; }
  .tars-flow--vertical .tars-bar-val{ font-size:9px; width:32px; }
  .tars-flow--vertical .tars-card-note{ font-size:9px; margin-top:6px; line-height:1.4; }
}

/* Onglet Galéa — téléphone portrait : plus aucune ligne de démarcation en haut.
   Au sommet, l'en-tête est transparent → fondu parfait avec le hero (aucune bande,
   aucune couture). Dès qu'on défile, un fond plein opaque (sans dégradé, donc sans
   bande visible) masque le contenu qui passe dessous. La bascule marine (is-dark)
   reste prioritaire sur fond marine. */
@media (max-width:760px), (orientation:landscape) and (max-height:560px){
  /* Même effet qu'ailleurs : dégradé doux au bas de l'en-tête (le flou ::before
     reste actif), mais dans la teinte du hero (#eef8fa) au lieu du blanc → raccord
     invisible au sommet, et le contenu se fond en douceur au défilement. */
  body[data-page="galea"] .site-header:not(.is-dark)::after{
    background:linear-gradient(to bottom, #eef8fa 0%, #eef8fa 40%, rgba(238,248,250,0) 100%); }
}

/* Services > EBIOS RM — TÉLÉPHONE PORTRAIT : les 2 échelles ANSSI sur une même
   ligne, en carrousel ; on glisse à gauche/droite pour afficher l'autre. */
@media (max-width:760px) and (orientation:portrait){
  .eb-scales{
    display:flex; grid-template-columns:none; gap:14px;
    overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    margin:34px -24px 0; padding:2px 24px 4px; scrollbar-width:none;
  }
  .eb-scales::-webkit-scrollbar{ display:none; }
  .eb-scale{ flex:0 0 84%; scroll-snap-align:center; margin:0; }
  .eb-scale.reveal{ opacity:1; transform:none; }
  .eb-scales-dots{ display:flex; justify-content:center; gap:9px; margin-top:16px; }
  .eb-scales-dot{ width:8px; height:8px; border-radius:50%; border:0; padding:0; cursor:pointer;
    background:rgba(36,86,166,0.28); transition:transform .2s ease, background .2s ease; }
  .eb-scales-dot.is-active{ background:var(--red); transform:scale(1.3); }
}

/* ===== SÉLECTEUR DE LANGUE ================================================
   6 langues : FR (racine) + EN/ES/DE/ZH/AR en sous-dossiers.
   Suit la bascule .is-dark de l'en-tête comme le reste de la nav.
   ========================================================================= */
.nav-lang-switcher{ position:relative; flex:0 0 auto; }
.nav-lang-current{
  display:flex; align-items:center; gap:7px;
  padding:7px 11px; border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,0.6); cursor:pointer;
  font-family:var(--menu); font-size:15.5px; font-weight:500; color:#16181D;
  letter-spacing:0.04em; line-height:1;
  transition:border-color .2s, background .2s, color .3s ease;
}
.nav-lang-current:hover{ border-color:var(--red); color:var(--red); }
.nav-lang-caret{ font-size:10px; opacity:.6; transition:transform .2s; }
.nav-lang-current[aria-expanded="true"] .nav-lang-caret{ transform:rotate(180deg); }

.nav-lang-dropdown{
  position:absolute; top:calc(100% + 10px); right:0; z-index:300;
  min-width:158px; padding:7px; display:flex; flex-direction:column; gap:1px;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 26px 60px -26px rgba(10,22,40,0.45);
}
.nav-lang-dropdown[hidden]{ display:none; }
.main-nav .nav-lang-dropdown a.nav-lang-item{
  display:block; padding:9px 13px; border-radius:9px;
  font-family:var(--body); font-size:15px; font-weight:500; letter-spacing:0;
  color:var(--ink) !important; opacity:1; text-decoration:none;
  transition:background .15s ease, color .15s ease;
}
.main-nav .nav-lang-dropdown a.nav-lang-item:hover{
  background:rgba(225,35,61,0.07); color:var(--red) !important; transform:none;
}
.main-nav .nav-lang-dropdown a.nav-lang-item.active{
  font-weight:700; color:var(--red) !important; background:rgba(225,35,61,0.06);
}

/* En-tête sombre : le bouton s'inverse, le menu déroulant reste clair */
.site-header.is-dark .nav-lang-current{
  border-color:rgba(255,255,255,0.28); background:rgba(255,255,255,0.08); color:#fff;
}
.site-header.is-dark .nav-lang-current:hover{ border-color:#fff; color:#fff; }

@media (max-width:980px){
  /* Dans le tiroir : plus de menu déroulant, les langues sont listées à plat */
  .nav-lang-switcher{ margin-top:18px; border-top:1px solid var(--line); padding-top:14px; }
  .nav-lang-current{ display:none; }
  .nav-lang-dropdown{
    position:static; padding:0; min-width:0; border:0; box-shadow:none;
    display:flex !important; flex-direction:row; flex-wrap:wrap; gap:6px;
  }
  .nav-lang-dropdown[hidden]{ display:flex !important; }
  .main-nav .nav-lang-dropdown a.nav-lang-item{
    padding:9px 12px; border:1px solid var(--line); border-radius:999px; font-size:14.5px;
  }
}

/* Bandeau des versions traduites du blog : les articles restent en français */
.blog-lang-notice{
  display:flex; align-items:center; gap:10px;
  margin:0 0 26px; padding:13px 17px;
  background:rgba(225,35,61,0.05); border:1px solid rgba(225,35,61,0.18);
  border-radius:12px; color:var(--muted); font-size:14.5px; line-height:1.5;
}