/* SPC — maquette v0.1 — charte : #193258 marine, #CAD400 anis, #71AECB bleu clair, #DDDCDC gris */
:root{
  --navy:#193258; --lime:#CAD400; --blue:#71AECB; --grey:#DDDCDC;
  --bg:#F4F6F9; --paper:#FFFFFF; --muted:#5B6A80; --line:#E1E5EB;
  --display:"Bebas Neue","Arial Narrow",Impact,sans-serif;
  --sans:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--bg);color:var(--navy);font:500 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
.mono{font-family:var(--mono)}
.wrap{max-width:1240px;margin:0 auto;padding-inline:clamp(16px,4vw,48px)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:8px;font:600 14px/1 var(--sans);padding:14px 20px;border-radius:999px;text-decoration:none;border:1.5px solid transparent;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-1px)}
.btn-lime{background:var(--lime);color:var(--navy)}
.btn-line{border-color:currentColor}

/* ---------- Boot ---------- */
.boot{position:fixed;inset:0;z-index:100;background:#fff;display:grid;place-items:center;align-content:center;gap:28px;padding:24px}
.boot.gone{pointer-events:none}
.boot-logo{position:relative;width:min(440px,72vw);aspect-ratio:2.5499}
.boot-logo img{position:absolute;display:block;height:auto}
.boot-logo .text{inset:0;width:100%}
.boot-log{margin:0;height:9em;overflow:hidden;width:min(440px,72vw);font:400 12px/1.8 var(--mono);color:var(--muted);white-space:pre}
.boot-log b{color:var(--navy);font-weight:500}
.boot-bar{width:min(440px,72vw);height:2px;background:var(--line)}
.boot-bar span{display:block;height:100%;width:0;background:var(--lime)}
.boot-skip{position:absolute;right:24px;bottom:calc(20px + env(safe-area-inset-bottom,0px));font:500 12px/1 var(--mono);letter-spacing:.08em;color:var(--muted);background:none;border:0;cursor:pointer;padding:8px}
.boot-skip:hover{color:var(--navy)}

/* ---------- Nav ---------- */
.nav{position:fixed;z-index:50;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 14px);padding-inline:clamp(12px,3vw,32px)}
.nav-bar{max-width:960px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:8px 8px 8px 18px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(25,50,88,.08);box-shadow:0 6px 30px rgba(25,50,88,.08)}
.nav-logo img{height:30px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:20px}
.nav-links a{text-decoration:none;font-size:14px;font-weight:600}
.nav-links a:hover{color:var(--blue)}
.nav-right{display:flex;align-items:center;gap:12px}
.lang{font:400 12px/1 var(--mono);color:var(--muted)}
.lang b{color:var(--navy);font-weight:500}
.nav .btn{padding:11px 18px}


/* Logo SPC en grand à la sortie de la caméra, qui remonte dans le menu */
.hero-logo{position:fixed;z-index:60;left:0;top:0;height:auto;opacity:0;pointer-events:none;transform-origin:50% 50%}

/* ---------- Scrolly ---------- */
.scrolly{position:relative;height:1000vh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
#scene{position:absolute;inset:0;width:100%;height:100%;display:block}
.step{position:absolute;left:clamp(16px,6vw,96px);bottom:clamp(96px,16vh,170px);max-width:min(620px,88vw);opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s;pointer-events:none}
.step.is-on{opacity:1;transform:none}
.step.s-right{left:auto;right:clamp(16px,6vw,96px);text-align:right}
.step.s-top{bottom:auto;top:clamp(104px,15vh,150px)}
.step.s0{bottom:clamp(72px,12vh,130px)}
.step h1{font:400 clamp(48px,6.6vw,104px)/.9 var(--display);letter-spacing:.01em;color:var(--navy)}
.step .kicker{margin-bottom:18px}
.step .sub{margin-top:18px;font:800 clamp(18px,2vw,26px)/1.25 var(--sans);letter-spacing:-.01em;color:var(--navy);max-width:30ch;text-shadow:0 1px 18px rgba(244,246,249,.9)}
.step .tag{display:inline-block;font-size:13px;letter-spacing:.16em;background:var(--navy);color:#fff;padding:7px 10px;min-height:1em;min-width:2ch}
.step .line{margin-top:14px;font:800 clamp(24px,3.2vw,42px)/1.12 var(--sans);letter-spacing:-.02em;color:var(--navy);text-shadow:0 1px 18px rgba(244,246,249,.9)}
.detect{position:absolute;left:0;top:0;transform:translate(-50%,-100%);background:var(--lime);color:var(--navy);font-size:11px;font-weight:500;padding:5px 7px;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}
.detect.is-on{opacity:1}
.hud{position:absolute;left:clamp(16px,3vw,32px);bottom:calc(18px + env(safe-area-inset-bottom,0px));display:grid;gap:2px;font-size:10.5px;letter-spacing:.08em;color:var(--muted)}
.hud-r{left:auto;right:clamp(16px,3vw,32px);text-align:right}
.hud .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--lime);margin-right:4px;box-shadow:0 0 0 3px rgba(202,212,0,.25)}
.rail{position:absolute;right:clamp(16px,3vw,32px);top:50%;transform:translateY(-50%);width:2px;height:28vh;background:rgba(25,50,88,.12)}
.rail span{position:absolute;left:0;top:0;width:100%;height:0;background:var(--navy)}
.iris{position:absolute;inset:0;background:var(--bg);clip-path:circle(0% at 50% 50%);pointer-events:none}
@media (max-width:640px){.hud{display:none}.rail{display:none}.step.s-right{left:16px;right:auto;text-align:left}}
@media (prefers-reduced-motion:reduce){.step{transition:none}}

/* ---------- Blocks ---------- */
.block{padding-block:clamp(72px,10vw,140px);background:var(--bg)}
.head{display:grid;gap:16px;margin-bottom:clamp(36px,5vw,64px)}
.head h2,.cta h2{font:400 clamp(44px,6.5vw,92px)/.92 var(--display);letter-spacing:.01em}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{display:grid;grid-template-rows:auto 1fr;background:var(--paper);border-radius:18px;overflow:hidden;text-decoration:none;border:1px solid var(--line);transition:transform .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(25,50,88,.10)}
.card .ph{aspect-ratio:4/3;background:
  repeating-linear-gradient(-30deg,rgba(113,174,203,.16) 0 1px,transparent 1px 14px),linear-gradient(160deg,#EEF3F8,#E2E9F1);display:grid;place-items:end start;padding:14px}
.card .ph span{font-size:10.5px;letter-spacing:.1em;color:var(--muted)}
.card .ph.has-media{position:relative;overflow:hidden;padding:0;background:#DDE4EC}
.card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover .ph img{transform:scale(1.05)}
.card .txt{padding:22px 22px 24px;display:grid;gap:10px;align-content:start}
.card h3{font:400 30px/1 var(--display);letter-spacing:.02em}
.card p{color:var(--muted);font-size:14.5px}
.card .go{font-size:12px;letter-spacing:.08em;margin-top:6px;justify-self:start;border-bottom:2px solid var(--lime);padding-bottom:3px}
@media (max-width:1000px){.cards{grid-template-columns:1fr 1fr}}
.card .ref{font-size:11px;letter-spacing:.14em;color:var(--blue)}
@media (max-width:560px){.cards{grid-template-columns:1fr}}

.logos-band{padding-block:48px;border-block:1px solid var(--line)}
.logos-band .wrap{display:grid;gap:22px}
.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.logos span{height:64px;display:grid;place-items:center;border:1px dashed #C7CFDA;border-radius:12px;font:500 12px/1 var(--mono);letter-spacing:.14em;color:#9AA6B5}
@media (max-width:720px){.logos{grid-template-columns:repeat(3,1fr)}}

.cta{background:var(--paper)}
.cta-in{display:flex;flex-wrap:wrap;gap:28px;align-items:end;justify-content:space-between}
.cta-btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- Pied de page ---------- */
.foot{background:var(--navy);color:#DDE4EE;padding-block:64px 28px}
.foot a{color:#DDE4EE;text-decoration:none}
.foot a:hover{color:#fff}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.foot-brand{display:grid;gap:14px;align-content:start;max-width:34ch}
.foot-brand p{font-size:14px;color:#AFC0D4}
.foot-logo{width:170px;height:auto}
.foot-col{display:grid;gap:8px;align-content:start;font-size:14px}
.foot-col .kicker{color:#8FA3BF;margin-bottom:4px}
.foot-col.mono{font-size:13px}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:48px;padding-top:18px;border-top:1px solid rgba(221,228,238,.15);font-size:11.5px;letter-spacing:.06em;color:#9FB0C6}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:480px){.foot-grid{grid-template-columns:1fr}}

/* ---------- Menu : liste des métiers, menu mobile ---------- */
.nav-links a[aria-current="page"],.dd-btn.is-active{color:var(--blue)}
.dd{position:relative}
.dd-btn{font:600 14px/1 var(--sans);color:var(--navy);background:none;border:0;padding:8px 0;cursor:pointer}
.dd-btn:hover{color:var(--blue)}
.dd-btn span{font-size:10px;margin-left:2px;display:inline-block;transition:transform .2s}
.dd-btn[aria-expanded="true"] span{transform:rotate(180deg)}
.dd-panel{position:absolute;left:50%;top:calc(100% + 18px);transform:translateX(-50%);width:min(560px,90vw);display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:10px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(25,50,88,.08);border-radius:18px;box-shadow:0 18px 50px rgba(25,50,88,.14)}
.dd-panel a{display:grid;gap:2px;padding:12px 14px;border-radius:12px;text-decoration:none}
.dd-panel a:hover,.dd-panel a[aria-current="page"]{background:#EEF3F8}
.dd-panel b{font-weight:700;font-size:14px}
.dd-panel span{font-size:12.5px;color:var(--muted)}
.burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;place-items:center}
.burger span{display:block;width:16px;height:1.5px;background:var(--navy);box-shadow:0 5px 0 var(--navy),0 -5px 0 var(--navy)}
.mnav{max-width:1240px;margin:10px auto 0;padding:14px;display:grid;gap:2px;background:rgba(255,255,255,.97);border:1px solid rgba(25,50,88,.08);border-radius:20px;box-shadow:0 18px 50px rgba(25,50,88,.14);max-height:calc(100svh - 110px);overflow:auto}
.mnav .kicker{margin:10px 8px 4px}
.mnav a{padding:11px 10px;border-radius:10px;text-decoration:none;font-weight:600}
.mnav a[aria-current="page"]{background:#EEF3F8;color:var(--blue)}
@media (max-width:860px){.nav-links{display:none}.lang{display:none}.burger{display:grid}}
@media (min-width:861px){.mnav{display:none!important}}

/* ---------- Pages intérieures ---------- */
.subpage{padding-top:calc(env(safe-area-inset-top,0px) + 96px)}
.tabs{position:sticky;top:calc(env(safe-area-inset-top,0px) + 80px);z-index:40;padding-block:6px}
.tabs-in{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-block:4px}
.tabs-in::-webkit-scrollbar{display:none}
.tab{flex:none;font:600 13.5px/1 var(--sans);text-decoration:none;padding:11px 16px;border-radius:999px;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);white-space:nowrap}
.tab:hover{border-color:var(--blue)}
.tab[aria-current="page"]{background:var(--navy);border-color:var(--navy);color:#fff}
.phero{padding-block:clamp(40px,7vw,90px) 0}
.phero-in{display:grid;gap:18px;margin-bottom:clamp(28px,4vw,48px)}
.phero h1{font:400 clamp(64px,13vw,190px)/.85 var(--display);letter-spacing:.005em;text-transform:uppercase}
.phero .accroche{font:800 clamp(22px,2.8vw,36px)/1.15 var(--sans);letter-spacing:-.02em;max-width:26ch}
.visual{position:relative;aspect-ratio:21/9;max-width:100%;border-radius:22px;overflow:hidden;background:linear-gradient(160deg,#FFFFFF,#E7EDF4)}
.visual svg{position:absolute;inset:0;width:100%;height:100%}
.visual.has-media{background:#DDE4EC}
.sound-btn{position:absolute;right:16px;bottom:16px;z-index:2;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--navy);background:rgba(255,255,255,.88);border:0;border-radius:999px;padding:9px 14px;cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.sound-btn::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--muted)}
.sound-btn[aria-pressed="true"]::before{background:var(--lime)}
.sound-btn:hover{background:#fff}
.visual img,.visual video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.visual.has-media::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(25,50,88,.06);pointer-events:none}
.visual-tag{position:absolute;left:18px;bottom:16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:rgba(255,255,255,.8);padding:6px 9px;border-radius:6px}
@media (max-width:640px){.visual{aspect-ratio:4/3}}
.intro-in{display:grid;grid-template-columns:220px 1fr;gap:24px}
.intro .lead{font:600 clamp(20px,2.2vw,28px)/1.45 var(--sans);max-width:48ch}
@media (max-width:760px){.intro-in{grid-template-columns:1fr}}
.comp{background:var(--paper)}
.comp-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.comp-item{padding:28px 26px 32px 0;border-bottom:1px solid var(--line);display:grid;gap:10px;align-content:start}
.comp-item:not(:nth-child(3n+1)){padding-left:26px;border-left:1px solid var(--line)}
.comp-item .ref{font-size:11.5px;letter-spacing:.12em;color:var(--blue)}
.comp-item h3{font:400 30px/1 var(--display);letter-spacing:.02em}
.comp-item p{color:var(--muted);font-size:15px}
@media (max-width:900px){.comp-grid{grid-template-columns:1fr 1fr}.comp-item,.comp-item:not(:nth-child(3n+1)){padding:24px 18px 26px 0;border-left:0}.comp-item:nth-child(2n){padding-left:18px;border-left:1px solid var(--line)}}
@media (max-width:560px){.comp-grid{grid-template-columns:1fr}.comp-item:nth-child(2n){padding-left:0;border-left:0}}
.sect-in{display:flex;flex-wrap:wrap;gap:24px 48px;align-items:end;justify-content:space-between}
.sect-in h2,.two h2,.sector h2{font:400 clamp(36px,4.6vw,60px)/.95 var(--display);letter-spacing:.01em;margin-top:10px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;text-decoration:none;font-weight:600;font-size:14px}
a.chip:hover{border-color:var(--navy)}
.chip code{font:500 11px/1 var(--mono);color:var(--muted)}
.chip.home{background:var(--navy);border-color:var(--navy);color:#fff}
.chip.home code{color:var(--lime)}
.pager{padding-block:0 clamp(56px,8vw,96px)}
.pager-in{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pg{display:grid;gap:8px;padding:24px 26px;border-radius:18px;background:#fff;border:1px solid var(--line);text-decoration:none;transition:transform .25s,box-shadow .25s}
.pg:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(25,50,88,.08)}
.pg b{font:400 34px/1 var(--display);letter-spacing:.02em}
.pg.next{text-align:right}
@media (max-width:560px){.pager-in{grid-template-columns:1fr}.pg.next{text-align:left}}

/* Secteurs */
.sectors{display:grid;gap:clamp(40px,6vw,80px)}
.sector{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;scroll-margin-top:110px}
.sector:nth-child(2n) .visual{order:2}
.sector-txt{display:grid;gap:14px;align-content:start}
.sector-txt>p:not(.kicker){color:var(--muted);font-size:16px;max-width:46ch}
.sector .visual{aspect-ratio:16/10}
@media (max-width:820px){.sector{grid-template-columns:1fr}.sector:nth-child(2n) .visual{order:0}}

/* Qui sommes-nous */
.figures-band{background:var(--navy);color:#fff;margin-top:clamp(40px,6vw,80px)}
.figures{display:grid;grid-template-columns:repeat(4,1fr)}
.figures div{padding:34px 24px;display:grid;gap:8px}
.figures div+div{border-left:1px solid rgba(255,255,255,.14)}
.figures b{font:400 clamp(48px,6vw,80px)/.9 var(--display);font-variant-numeric:tabular-nums}
.figures span{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:#AFC0D4}
@media (max-width:760px){.figures{grid-template-columns:1fr 1fr}.figures div:nth-child(3){border-left:0}}
.two{display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:860px){.two{grid-template-columns:1fr}}
.timeline{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--line)}
.timeline li{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
.timeline .yr{font-size:14px;color:var(--blue);padding-top:4px}
.timeline h3{font:800 19px/1.25 var(--sans)}
.timeline p{color:var(--muted);font-size:15px;margin-top:4px}
.timeline li.todo h3,.timeline li.todo .yr{color:#9AA6B5}
.team-band{background:var(--paper)}
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.member{display:grid;gap:10px;align-content:start}
.member .ph{aspect-ratio:4/5;border-radius:18px;background:repeating-linear-gradient(-30deg,rgba(113,174,203,.16) 0 1px,transparent 1px 14px),linear-gradient(160deg,#EEF3F8,#E2E9F1);display:grid;place-items:end start;padding:14px}
.member .ph span{font-size:10.5px;letter-spacing:.1em;color:var(--muted)}
.member .ph.has-media{position:relative;overflow:hidden;padding:0;background:#DDE4EC}
.member .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prop-tag{position:absolute;right:12px;top:12px;z-index:2;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--navy);background:rgba(255,255,255,.85);padding:5px 8px;border-radius:6px}
.member h3{font:400 28px/1 var(--display);letter-spacing:.02em;margin-top:6px}
.member p{color:var(--muted);font-size:14.5px}
@media (max-width:900px){.team{grid-template-columns:1fr 1fr}}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.values article{padding:26px;border-radius:18px;background:#fff;border:1px solid var(--line);display:grid;gap:10px;align-content:start;position:relative;overflow:hidden}
.values article::before{content:"";position:absolute;left:26px;top:0;width:36px;height:4px;background:var(--lime);border-radius:0 0 4px 4px}
.values h3{font:400 32px/1 var(--display);letter-spacing:.02em;margin-top:6px}
.values p{color:var(--muted);font-size:15px}
@media (max-width:900px){.values{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.values,.team{grid-template-columns:1fr}}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.form{display:grid;gap:16px;padding:clamp(22px,3vw,36px);border-radius:22px;background:#fff;border:1px solid var(--line);scroll-margin-top:110px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:560px){.pair{grid-template-columns:1fr}}
.form label{display:grid;gap:7px;font-size:13.5px;font-weight:600}
.form input,.form select,.form textarea{font:500 16px/1.4 var(--sans);color:var(--navy);background:var(--bg);border:1.5px solid transparent;border-radius:12px;padding:13px 14px;width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--blue);background:#fff}
.form textarea{min-height:130px;resize:vertical}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:13.5px;color:var(--muted)}
.form .check input{width:18px;height:18px;margin-top:1px;flex:none;accent-color:var(--navy)}
.form-foot{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.form button{border:0;cursor:pointer}
.note{font-size:13px;color:var(--muted)}
.note.ok{color:var(--navy);background:#F2F5C4;padding:9px 12px;border-radius:10px}
.note.err{color:#8A2A1A;background:#FBE3DD;padding:9px 12px;border-radius:10px}
.side{display:grid;gap:24px}
.form.doc{background:var(--navy);border-color:var(--navy);color:#fff}
.form.doc h2{font:400 40px/.95 var(--display);letter-spacing:.01em}
.form.doc p:not(.note):not(.kicker){color:#C9D4E3;font-size:14.5px}
.form.doc .kicker{color:#8FA3BF}
.form.doc input{background:rgba(255,255,255,.1);color:#fff}
.form.doc input:focus{background:rgba(255,255,255,.16)}
.form.doc .note{color:#AFC0D4}
.form.doc .note.ok{color:var(--navy)}
.coords{display:grid;gap:16px;padding:6px 4px}
.coord{display:grid;gap:4px}
.coord>span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.coord b{font-weight:700;font-size:17px;user-select:all}
.coord .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.copy{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:6px 9px;border-radius:8px;background:#fff;border:1px solid var(--line);color:var(--muted);cursor:pointer}
.copy:hover{color:var(--navy);border-color:var(--navy)}

/* ---------- Accueil : experts en programmation ---------- */
.expertise{background:var(--paper)}
.expertise .head{grid-template-columns:1fr 1fr;align-items:end;gap:20px 48px}
.expertise .head .kicker{grid-column:1/-1}
.lead-sm{color:var(--muted);font-size:17px;max-width:46ch}
@media (max-width:820px){.expertise .head{grid-template-columns:1fr}}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pillar{position:relative;display:grid;gap:12px;align-content:start;padding:30px 28px 28px;border-radius:20px;background:var(--bg);border:1px solid var(--line);text-decoration:none;overflow:hidden;transition:transform .3s,box-shadow .3s,background .3s}
.pillar::before{content:"";position:absolute;left:28px;top:0;width:44px;height:4px;background:var(--lime);border-radius:0 0 4px 4px}
.pillar:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(25,50,88,.10);background:#fff}
.pillar .ref{font-size:11.5px;letter-spacing:.14em;color:var(--blue)}
.pillar h3{font:400 clamp(30px,3vw,40px)/.95 var(--display);letter-spacing:.01em}
.pillar p{color:var(--muted);font-size:15px}
.pillar .go{font-size:12px;letter-spacing:.08em;margin-top:6px;justify-self:start;border-bottom:2px solid var(--lime);padding-bottom:3px}
@media (max-width:900px){.pillars{grid-template-columns:1fr}}

/* ---------- v0.17 : prestations, pour qui, direction, blocs Vision IA et GTB ---------- */
.presta-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:clamp(40px,5vw,64px) 0 18px}
.presta-head h3{font:400 clamp(28px,3vw,40px)/1 var(--display);letter-spacing:.01em}
.presta-head p{flex-basis:100%;max-width:62ch;color:var(--muted)}
.presta{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.presta li{display:grid;gap:6px;align-content:start;padding:20px 20px 24px 0;border-bottom:1px solid var(--line)}
.presta li:not(:nth-child(3n+1)){padding-left:20px;border-left:1px solid var(--line)}
.presta .n{font-size:11.5px;letter-spacing:.12em;color:var(--blue)}
.presta b{font:800 17px/1.25 var(--sans);justify-self:start}
.presta li:nth-child(2) b{box-shadow:inset 0 -7px 0 rgba(202,212,0,.55)}
.presta p{color:var(--muted);font-size:14px}
@media (max-width:900px){.presta{grid-template-columns:1fr 1fr}.presta li,.presta li:not(:nth-child(3n+1)){padding:18px 14px 20px 0;border-left:0}.presta li:nth-child(2n){padding-left:14px;border-left:1px solid var(--line)}}


.leaders{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.leader{display:grid;grid-template-columns:1fr;gap:18px;align-content:start;padding:18px 18px 26px;border-radius:20px;background:var(--bg);border:1px solid var(--line)}
.leader>div:last-child{padding-inline:8px}
.leader-ph{position:relative;width:100%;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#DDE4EC}
.leader-ph::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--lime)}
.leader-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 40%;filter:grayscale(1)}
.leader h3{font:400 32px/1 var(--display);letter-spacing:.02em}
.leader .role{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin:6px 0 10px}
.leader p:not(.role){color:var(--muted);font-size:15px}
.head-next{margin-top:clamp(56px,7vw,96px)}
@media (max-width:860px){.leaders{grid-template-columns:1fr}.leader{grid-template-columns:120px 1fr;gap:18px;align-items:center;padding:16px}.leader>div:last-child{padding-inline:0}}
@media (max-width:440px){.leader{grid-template-columns:1fr}}

.vx{background:var(--bg)}
.vx-first{padding-top:0}
.vx-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.vx-cards article{position:relative;display:grid;gap:10px;align-content:start;padding:30px 26px 28px;border-radius:18px;background:#fff;border:1px solid var(--line);overflow:hidden}
.vx-cards article::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--lime)}
.vx-cards .c-blue::before{background:var(--blue)}
.vx-cards .c-navy::before{background:var(--navy)}
.vx-cards h3{font:400 34px/1 var(--display);letter-spacing:.02em}
.vx-cards p{color:var(--muted);font-size:15px}
@media (max-width:860px){.vx-cards{grid-template-columns:1fr}}

.vsys{background:var(--navy);color:#fff}
.vsys-in{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:center}
.vsys .kicker{color:var(--lime)}
.vsys h2{font:400 clamp(44px,6vw,84px)/.92 var(--display);letter-spacing:.01em;margin:14px 0 16px}
.vsys .lead-sm{color:#C9D4E3}
.vsys-list{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
.vsys-list li{display:grid;gap:4px;align-content:start;padding-top:14px;border-top:1px solid rgba(255,255,255,.16)}
.vsys-list b{font:800 15px/1.3 var(--sans);color:#fff}
.vsys-list span{font-size:14px;color:#AFC0D4}
@media (max-width:900px){.vsys-in{grid-template-columns:1fr}}
@media (max-width:520px){.vsys-list{grid-template-columns:1fr}}
.vsys-screen{margin:0;display:grid;gap:10px}
.vsys-screen figcaption{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#8FA3BF}
.scr{border-radius:16px;overflow:hidden;background:#F4F6F9;border:6px solid #0F2440;box-shadow:0 30px 60px rgba(0,0,0,.3)}
.scr-top{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--navy);color:#fff;font-size:11px;letter-spacing:.1em;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.1)}
.scr-top .live{display:inline-flex;align-items:center;gap:6px;text-transform:uppercase}
.scr-top .live i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(202,212,0,.25)}
.scr-body{display:grid;grid-template-columns:1.6fr 1fr;gap:12px;padding:12px}
.scr-img{border-radius:10px;overflow:hidden;background:#1E3A63;line-height:0}
.scr-img svg{width:100%;height:auto}
.scr-side{display:grid;gap:8px;align-content:start;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;color:var(--navy)}
.scr-res{background:var(--lime);border-radius:10px;font:800 clamp(28px,3vw,40px)/1 var(--sans);text-align:center;padding:12px 0}
.scr-k{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.pareto{display:flex;align-items:flex-end;gap:5px;height:56px;border-bottom:1px solid var(--line)}
.pareto span{flex:1;height:calc(var(--h) * 100%);background:var(--blue);border-radius:3px 3px 0 0}
.pareto span:first-child{background:var(--navy)}
.gauge{height:8px;border-radius:99px;background:#E9EEF4;overflow:hidden}
.gauge span{display:block;height:100%;width:14%;background:var(--lime)}
.scr-btn{justify-self:start;margin-top:4px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--navy);border-radius:99px;padding:6px 10px}
@media (max-width:520px){.scr-body{grid-template-columns:1fr}}

.steps-band{background:var(--paper)}
.steps5{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:2px solid var(--lime)}
.steps5 li{display:grid;gap:8px;align-content:start;padding:22px 18px 8px 0}
.steps5 li+li{padding-left:18px;border-left:1px solid var(--line)}
.steps5 .n{font:400 46px/1 var(--display);color:var(--blue)}
.steps5 b{font:800 17px/1.25 var(--sans)}
.steps5 p{color:var(--muted);font-size:14.5px}
@media (max-width:900px){.steps5{grid-template-columns:1fr 1fr}.steps5 li,.steps5 li+li{padding:18px 14px 14px 0;border-left:0}.steps5 li:nth-child(2n){padding-left:14px;border-left:1px solid var(--line)}}
@media (max-width:480px){.steps5{grid-template-columns:1fr}.steps5 li:nth-child(2n){padding-left:0;border-left:0}}

.archi-band{background:var(--bg)}
.archi{margin:0;display:grid;gap:14px}
.archi-scroll{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(14px,3vw,32px)}
.archi-scroll svg{display:block;width:100%;min-width:680px;height:auto}
.archi figcaption{color:var(--muted);font-size:15px;max-width:70ch}

/* ---------- v0.19 : étiquettes, introduction de Qui sommes-nous ---------- */
.tags-line{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tags-line li{font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:9px 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg)}

.qhero{overflow-x:clip;padding-bottom:clamp(8px,2vw,24px)}
.qhero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center}
.qhero-txt{display:grid;gap:20px;align-content:center}
.qhero h1{font:400 clamp(56px,7.4vw,116px)/.88 var(--display);letter-spacing:.005em;text-transform:uppercase}
.qhero h1 .hl{background:linear-gradient(transparent 62%,var(--lime) 62% 90%,transparent 90%);padding:0 .04em}
.qlead{font:800 clamp(20px,2vw,26px)/1.25 var(--sans);letter-spacing:-.01em;max-width:30ch}
.qsub{color:var(--muted);font-size:17px;max-width:44ch}
.qteam{display:flex;align-items:center;gap:14px;margin-top:4px}
.avatars{display:flex;flex:none}
.avatars img{width:54px;height:54px;border-radius:50%;object-fit:cover;filter:grayscale(1);border:3px solid var(--bg);box-shadow:0 0 0 2px var(--lime);background:#DDE4EC}
.avatars img+img{margin-left:-12px}
.qteam p{display:grid;line-height:1.3}
.qteam b{font:800 15px/1.3 var(--sans)}
.qteam span{font-size:14px;color:var(--muted)}
.qhero-media{position:relative;isolation:isolate}
.qhero-media .visual{aspect-ratio:4/5;border-radius:28px;box-shadow:0 30px 60px rgba(25,50,88,.14)}
.qshapes{position:absolute;left:-12%;top:-12%;width:124%;height:124%;z-index:-1;pointer-events:none}
.qbadge{position:absolute;left:-46px;bottom:52px;width:128px;height:128px;border-radius:50%;background:var(--lime);display:grid;place-items:center;box-shadow:0 16px 34px rgba(25,50,88,.18)}
.qbadge svg{position:absolute;inset:0;width:100%;height:100%;animation:qspin 20s linear infinite}
.qbadge text{font:500 10.5px var(--mono);letter-spacing:.12em;fill:var(--navy)}
.qbadge b{font:400 32px/1 var(--display);color:var(--navy);letter-spacing:.04em}
@keyframes qspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.qbadge svg{animation:none}}
@media (max-width:860px){.qhero-in{grid-template-columns:1fr}.qhero-media{margin-top:12px}.qhero-media .visual{aspect-ratio:4/3;border-radius:22px}.qbadge{left:auto;right:12px;bottom:auto;top:-44px;width:104px;height:104px}.qbadge b{font-size:26px}}

/* ---------- v0.20 : message de défilement pendant toute l'ouverture ---------- */
.scroll-hint{position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:3;transform:translateX(-50%);display:flex;align-items:center;gap:12px;margin:0;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);background:rgba(255,255,255,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:999px;padding:9px 16px;white-space:nowrap;transition:opacity .4s}
.scroll-hint i{flex:none;width:8px;height:8px;border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);animation:hintbob 1.4s ease-in-out infinite}
.scroll-hint.is-off{opacity:0;pointer-events:none}
@keyframes hintbob{0%,100%{transform:translateY(-3px) rotate(45deg)}50%{transform:translateY(2px) rotate(45deg)}}
@media (prefers-reduced-motion:reduce){.scroll-hint i{animation:none;transform:rotate(45deg)}}
@media (max-width:760px){.scroll-hint{bottom:calc(66px + env(safe-area-inset-bottom,0px));font-size:10.5px;padding:8px 13px}}

/* ---------- v0.20 : bandeau sécurité de l'accueil ---------- */
.safety{background:var(--navy);color:#fff}
.safety-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:start}
.safety .head{margin-bottom:0}
.safety .kicker{color:var(--lime)}
.safety .lead-sm{color:#C9D4E3}
.safety-list{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid rgba(255,255,255,.16)}
.safety-list li{display:grid;grid-template-columns:52px 1fr;gap:4px 16px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.safety-list .n{grid-row:span 2;font:400 34px/1 var(--display);color:var(--lime)}
.safety-list b{font:800 18px/1.3 var(--sans);color:#fff}
.safety-list p{color:#AFC0D4;font-size:15px}
@media (max-width:860px){.safety-in{grid-template-columns:1fr}}

/* ---------- v0.21 : cartes de la section Réseau ---------- */
.netmaps{display:grid;grid-template-columns:1fr;gap:16px}
.netcard{margin:0;display:grid;gap:14px;align-content:start;padding:clamp(18px,2.4vw,28px);border-radius:22px;background:#fff;border:1px solid var(--line)}
.netcard-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.legend{display:flex;align-items:center;gap:8px;margin:0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.legend .lg-on{width:12px;height:12px;border-radius:3px;background:var(--lime)}
.legend .lg-pace{width:10px;height:10px;border-radius:50%;background:var(--navy);margin-left:10px}
.netcard .countries{gap:6px;margin-top:4px}
.netcard .chip{padding:6px 11px;font-size:12.5px}
.map-world{display:block;width:100%;height:auto}
.map-world .land{fill:#E3E8EF;stroke:#fff;stroke-width:.5;stroke-linejoin:round}
.map-world .land.on{fill:var(--lime)}
.map-world .arc{fill:none;stroke:var(--navy);stroke-width:1.3;stroke-linecap:round;stroke-dasharray:3 4;opacity:.8;animation:arcflow 1.4s linear infinite}
.map-world .dot{fill:var(--navy)}
.map-world .zoom-box{fill:none;stroke:var(--navy);stroke-width:1.2;stroke-dasharray:3 2}
.map-world .pace .pin{fill:var(--navy);stroke:#fff;stroke-width:1.4}
.pace .pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2.2s ease-out infinite}
.map-world .pace .pulse{fill:var(--navy)}
@keyframes arcflow{to{stroke-dashoffset:-14}}
@keyframes pulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(3.4);opacity:0}}
.netcard-west{background:var(--navy);border-color:var(--navy);color:#fff}
.netcard-west .kicker{color:var(--lime)}
.netcard-west h3{font:400 clamp(32px,3.2vw,46px)/.95 var(--display);letter-spacing:.01em}
.netcard-west{grid-template-columns:.6fr 1.4fr;gap:clamp(20px,4vw,56px);align-items:center}
.west-txt{display:grid;gap:14px;align-content:center}
.west-txt>p:not(.kicker){color:#C9D4E3;font-size:16px;max-width:40ch}
.west-tags{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.west-tags li{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;padding:8px 13px;border-radius:999px;background:var(--lime);color:var(--navy)}
.map-world .zoom-t{font:500 13px var(--mono);letter-spacing:.06em;fill:var(--navy)}
.map-west{display:block;width:100%;height:auto;border-radius:14px}
.map-west .sea{fill:#12274A}
.map-west .dep{fill:#27446F;stroke:#12274A;stroke-width:1.2;stroke-linejoin:round}
.map-west .dep.go{fill:var(--lime)}
.map-west .region{font:500 15px var(--mono);letter-spacing:.24em;fill:#12274A;opacity:.55}
.map-west .reach{fill:none;stroke:#fff;stroke-opacity:.4;stroke-width:1.2;stroke-dasharray:4 7}
.map-west .city{fill:#fff;stroke:#12274A;stroke-width:1.5}
.map-west .city-t{font:700 17px var(--sans);fill:#fff;paint-order:stroke;stroke:#12274A;stroke-width:4px;stroke-linejoin:round}
.map-west .pace .pin{fill:#fff;stroke:var(--navy);stroke-width:3}
.map-west .pace .pulse{fill:#fff}
.map-west .pace-label rect{fill:var(--navy);stroke:#fff;stroke-width:1.5}
.map-west .pace-label text{font:500 16px var(--mono);letter-spacing:.08em;fill:var(--lime)}
@media (prefers-reduced-motion:reduce){.map-world .arc,.pace .pulse{animation:none}}
@media (max-width:900px){.netcard-west{grid-template-columns:1fr}}

/* ---------- v0.21 : barre de navigation garnie ---------- */
.dd-panel.dd-sect{width:min(620px,92vw);grid-template-columns:repeat(3,1fr)}
.dd-panel.dd-sect a{padding:11px 14px}
.dd-panel .dd-all{grid-column:1/-1;border-top:1px solid var(--line);border-radius:0 0 12px 12px;margin-top:4px}
.dd-panel .dd-all b{color:var(--blue)}
.dd-panel.dd-qui{width:min(320px,90vw);grid-template-columns:1fr}
section[id],.head[id]{scroll-margin-top:100px}

/* ---------- v0.21 : photos des dirigeants à leur taille réelle, carré vert décalé ---------- */
.leader{grid-template-columns:1fr;gap:14px;padding:30px 26px 26px;align-content:start}
.leader>div:last-child{padding-inline:0}
.leader-ph{position:relative;width:144px;height:144px;aspect-ratio:auto;overflow:visible;background:none;border-radius:0;margin-bottom:14px}
.leader-ph::after{content:none}
.leader-ph::before{content:"";position:absolute;left:12px;top:12px;width:100%;height:100%;border-radius:20px;background:var(--lime);transition:transform .35s ease}
.leader-ph img{position:relative;width:144px;height:144px;border-radius:20px;object-fit:cover;object-position:50% 35%;filter:grayscale(1) contrast(1.06);box-shadow:0 14px 28px rgba(25,50,88,.16)}
.leader:hover .leader-ph::before{transform:translate(-5px,-5px)}
@media (max-width:860px){.leader{grid-template-columns:144px 1fr;gap:30px;align-items:center;padding:24px}}
@media (max-width:440px){.leader{grid-template-columns:1fr}}

/* ---------- v0.22 : direction en format éditorial (un dirigeant par ligne) ---------- */
.team-band{overflow-x:clip}
.leaders2{display:grid;gap:clamp(56px,8vw,110px);margin-top:clamp(8px,2vw,24px)}
.leader2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,7vw,110px);align-items:center}
.leader2:nth-child(2n) .leader2-media{order:2}
.leader2-media{position:relative;isolation:isolate;width:100%;max-width:440px;justify-self:center;margin:0 22px 22px 0}
.leader2-media img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:28px;box-shadow:0 34px 70px rgba(25,50,88,.20)}
.leader2-media::before{content:"";position:absolute;right:-22px;bottom:-22px;width:64%;height:52%;border-radius:28px;background:var(--lime);z-index:-1}
.leader2-shapes{position:absolute;left:-18%;top:-12%;width:136%;height:124%;z-index:-2;pointer-events:none}
.leader2-txt{display:grid;gap:16px;align-content:center;max-width:52ch}
.leader2-txt h3{font:400 clamp(52px,6.6vw,96px)/.88 var(--display);letter-spacing:.005em}
.leader2-txt .role{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.leader2-lead{font:600 clamp(18px,1.6vw,21px)/1.5 var(--sans);color:var(--navy)}
.leader2-tags{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.leader2-tags li{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;padding:8px 13px;border-radius:999px;border:1px solid var(--line);background:var(--bg)}
.leader2-txt .btn{justify-self:start;margin-top:10px}
@media (max-width:860px){.leader2{grid-template-columns:1fr}.leader2:nth-child(2n) .leader2-media{order:0}.leader2-media{max-width:340px;justify-self:start;margin:0 14px 14px 0}.leader2-media::before{right:-14px;bottom:-14px}}
@media (max-width:900px) and (min-width:521px){.team{grid-template-columns:1fr 1fr}}
.qbadge .trisk{position:relative;width:58px;height:58px;color:var(--navy);animation:qspin 16s linear infinite reverse}
@media (prefers-reduced-motion:reduce){.qbadge .trisk{animation:none}}
@media (max-width:860px){.qbadge .trisk{width:48px;height:48px}}

/* ---------- v0.23 : barre plus étroite, « Demander une présentation » ---------- */
.nav-right{gap:10px}
.nav-ico{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;font:800 13px/1 var(--sans);text-decoration:none;color:var(--navy)}
.nav-ico svg{width:15px;height:15px}
.nav-ico:hover{color:var(--blue);border-color:var(--blue)}
.nav .nav-pres{padding:10px 16px;font-size:13px;white-space:nowrap}
.nav .nav-pres:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
@media (max-width:940px){.nav .nav-pres{display:none}}
@media (max-width:860px){.nav-ico{display:none}}
.nav-bar{gap:16px}
.dd-panel::before{content:"";position:absolute;left:0;right:0;top:-22px;height:22px}

/* ---------- v0.25 : emplacement de portrait en attendant une photo HD ---------- */
.leader2-ph{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:4/5;border-radius:28px;background:repeating-linear-gradient(-30deg,rgba(113,174,203,.16) 0 1px,transparent 1px 16px),linear-gradient(160deg,#FFFFFF,#E4EBF3);box-shadow:0 34px 70px rgba(25,50,88,.14);border:1px solid var(--line)}
.leader2-ph b{font:400 clamp(110px,13vw,180px)/1 var(--display);letter-spacing:.02em;color:var(--navy)}
.leader2-ph span{position:absolute;left:18px;bottom:18px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:rgba(255,255,255,.85);padding:6px 10px;border-radius:8px}
.leader2:nth-child(2n){grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
@media (max-width:860px){.leader2:nth-child(2n){grid-template-columns:1fr}}

/* ---------- v0.26 : « Ce qui nous guide », encadré détaillé au survol ---------- */
.values article.value{transition:background .3s,border-color .3s}
.values article.value h3,.values article.value p{transition:color .3s}
.values article.value.is-active{background:var(--navy);border-color:var(--navy)}
.values article.value.is-active h3{color:#fff}
.values article.value.is-active p{color:#C9D4E3}
.value-more{justify-self:start;align-self:end;margin-top:8px;display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);background:none;border:0;border-bottom:2px solid var(--lime);padding:0 0 4px;cursor:pointer}
.value-more span{font:600 15px/1 var(--sans);transition:transform .3s}
.value-more[aria-expanded="true"] span{transform:rotate(45deg)}
.values article.value.is-active .value-more{color:#fff}
.value-panels{display:grid;grid-template-rows:0fr;margin-top:0;transition:grid-template-rows .45s ease,margin-top .45s ease}
.value-panels.is-open{grid-template-rows:1fr;margin-top:16px}
.value-panels-in{overflow:hidden;min-height:0}
.value-panel{border-radius:22px;padding:clamp(26px,4vw,52px)}
.value-panel .head h2{font:400 clamp(40px,5vw,72px)/.92 var(--display);letter-spacing:.01em}
@media (prefers-reduced-motion:reduce){.value-panels{transition:none}}
.values article.value{grid-template-rows:auto 1fr auto;align-content:stretch}
.values .value-panels{grid-column:1/-1}
/* v0.28 : onglets des métiers centrés (défilement conservé sur petit écran) */
.tabs-in .tab:first-child{margin-left:auto}
.tabs-in .tab:last-child{margin-right:auto}
/* v0.29 : FR / EN tout à droite, un peu décalé du bouton Contact */
.nav-right .lang{margin-left:6px;margin-right:6px}
/* ---------- v0.31 : page Contact simplifiée ---------- */
.objet{border:0;margin:0;padding:0;display:grid;gap:10px}
.objet legend{padding:0;margin-bottom:10px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{position:relative;cursor:pointer}
.pill input{position:absolute;opacity:0;pointer-events:none}
.pill span{display:inline-block;padding:10px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);font:600 14px/1 var(--sans);transition:background .2s,border-color .2s,color .2s}
.pill input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.pill input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.contact-grid>.coords{align-self:start;padding:clamp(22px,3vw,36px);border-radius:22px;background:#fff;border:1px solid var(--line)}

/* ---------- v0.32 : préparation à la mise en ligne ---------- */
.skip{position:absolute;left:12px;top:-60px;z-index:200;padding:10px 16px;border-radius:999px;background:var(--navy);color:#fff;font:600 14px/1 var(--sans);text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.foot-legal a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.foot-legal a:hover{color:#fff}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form .check a{color:inherit;text-decoration:underline}
.member .ph.ph-ico{place-items:center;padding:0}
.member .ph.ph-ico svg{width:46%;height:auto}
.legal-in{max-width:78ch;display:grid;gap:clamp(22px,3vw,34px)}
.legal-sec{display:grid;gap:10px;padding-top:22px;border-top:1px solid var(--line)}
.legal-sec h2{font:400 clamp(28px,3vw,38px)/1 var(--display);letter-spacing:.01em}
.legal-sec p,.legal-sec li{color:var(--muted);font-size:16px}
.legal-sec ul{margin:0;padding-left:20px;display:grid;gap:6px}
.legal-sec a{color:var(--navy)}
.legal-maj{font-size:12px;letter-spacing:.08em;color:var(--muted)}
.phero .cta-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
/* accueil de repli quand la 3D ne peut pas s'afficher (WebGL absent) */
.no-3d .boot,.no-3d .hero-logo,.no-3d #scene,.no-3d .hud,.no-3d .rail,.no-3d .iris,.no-3d .detect,.no-3d .scroll-hint,.no-3d .step:not(.s0){display:none!important}
.no-3d .scrolly{height:auto}
.no-3d .stage{position:relative;height:auto;min-height:88svh;background:linear-gradient(90deg,rgba(244,246,249,.97) 34%,rgba(244,246,249,.55)),url(../assets/photos/metiers/robotique-palettisation.jpg) center/cover}
.no-3d .step.s0{opacity:1!important;transform:none!important}
/* lisibilité de l'ouverture 3D (tests du 28/09) : halo plus fort, encadré devant l'écran de supervision */
.step .line,.step .sub{text-shadow:0 0 2px rgba(244,246,249,.95),0 1px 16px rgba(244,246,249,.95),0 0 34px rgba(244,246,249,.9)}
.step.s-top{background:rgba(244,246,249,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:18px 24px 22px;border-radius:18px;box-shadow:0 16px 40px rgba(25,50,88,.14)}
@media (max-width:760px){.step.s0{bottom:clamp(110px,16vh,150px)}}
@media (max-width:640px){.scroll-hint{bottom:calc(16px + env(safe-area-inset-bottom,0px))}}
.mnav{background:#fff}
