:root{

    /* Palette — jetons de marque (image 8) */

    --orange:#FF7D01;

    --orange-dark:#E86A00;      /* dérivé pour survol */

    --charcoal:#2F2F2F;

    --charcoal-deep:#242424;    /* dérivé pour panneaux */

    --charcoal-line:#3c3c3c;

    --grey-mid:#5D5D5D;

    --grey-on-dark:#cfcfcf;

    --white:#FFFFFF;

    --grey-section:#F4F4F4;

    --grey-border:#e4e4e4;

    /* Système */

    --maxw:1280px;

    --radius:6px;

    --display:'Barlow Condensed',sans-serif;

    --body:'Inter','Liberation Sans',Arial,sans-serif;

  }

  *{box-sizing:border-box;margin:0;padding:0}

  html{scroll-behavior:smooth}

  body{font-family:var(--body);color:#2b2b2b;background:var(--white);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}

  h1,h2,h3,h4,h5,.display{font-family:var(--display);line-height:1.04;color:var(--charcoal);font-weight:700}

  a{color:inherit;text-decoration:none}

  img{max-width:100%;display:block}



  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px)}

  .eyebrow{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--orange);display:inline-block;margin-bottom:14px}

  .filet{height:3px;width:52px;background:var(--orange);border-radius:2px}

  section.block{padding:clamp(64px,9vw,110px) 0}

  .lead{font-size:1.14rem;color:var(--grey-mid);max-width:62ch}

  .center{text-align:center}

  .center .lead{margin-left:auto;margin-right:auto}



  /* Boutons (image 8) */

  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:600;font-size:.92rem;letter-spacing:.02em;padding:13px 24px;border-radius:var(--radius);cursor:pointer;border:2px solid transparent;transition:.18s ease;white-space:nowrap;text-transform:uppercase}

  .btn-primary{background:var(--orange);color:#fff}

  .btn-primary:hover{background:var(--orange-dark)}

  .btn-ghost{background:transparent;color:var(--charcoal);border-color:var(--charcoal)}

  .btn-ghost:hover{background:var(--charcoal);color:#fff}

  .btn-ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}

  .btn-ghost-light:hover{border-color:var(--orange);color:var(--orange)}

  .btn .arrow{transition:transform .18s ease}

  .btn:hover .arrow{transform:translateX(3px)}



  /* NAV */

  header.nav{position:sticky;top:0;z-index:50;background:var(--charcoal);border-bottom:1px solid var(--charcoal-line)}

  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}

  .logo{display:flex;align-items:center;gap:11px;cursor:pointer}

  .logo .tri{width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;border-bottom:19px solid var(--orange)}

  .logo .mark{font-family:var(--display);font-weight:700;font-size:1.7rem;letter-spacing:.02em;color:#fff}

  nav.links{display:flex;gap:30px;align-items:center}

  nav.links a{font-family:var(--body);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:.82rem;color:#ededed;padding:7px 0;border-bottom:2px solid transparent;transition:.15s;white-space:nowrap}

  nav.links a:hover{color:#fff}

  nav.links a.active{color:#fff;border-bottom-color:var(--orange)}

  .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}

  .burger span{width:24px;height:2px;background:#fff;display:block}



  /* HERO (style image 1) */

  .hero{background:var(--charcoal);color:#fff;position:relative;overflow:hidden}

  .hero:before{content:"";position:absolute;inset:0;background:radial-gradient(880px 480px at 80% 15%, rgba(255,125,1,.15), transparent 60%),linear-gradient(180deg,#2b2b2b,#333)}

  .hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(700px 500px at 82% 20%,#000,transparent 70%);mask-image:radial-gradient(700px 500px at 82% 20%,#000,transparent 70%)}

  .hero-grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center;padding:clamp(48px,7vw,86px) 0}

  .hero h1{color:#fff;font-size:clamp(2.4rem,5vw,4.1rem);font-weight:700;letter-spacing:.005em}

  .hero h1 .hl{color:var(--orange)}

  .hero p.sub{color:var(--grey-on-dark);font-size:1.12rem;margin:22px 0 0;max-width:50ch}

  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}

  .hero-visual{position:relative}

  .hero-visual .frame{border:2px solid var(--charcoal-line);border-radius:10px;overflow:hidden;box-shadow:0 40px 70px -30px rgba(0,0,0,.7)}

  .hero-visual .frame:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange);z-index:2}

  .hero-visual img{width:100%;height:auto}



  /* Bande signature (une ligne) */

  .oneliner{background:var(--charcoal-deep);padding:22px 0;text-align:center;font-family:var(--display);font-weight:500;font-size:1.2rem;color:#fff;letter-spacing:.01em;border-top:1px solid var(--charcoal-line)}

  .oneliner b{color:var(--orange);font-weight:700}



  /* En-têtes de section */

  .sec-head{margin-bottom:46px;max-width:66ch}

  .sec-head.center{margin-left:auto;margin-right:auto}

  .sec-head h2{font-size:clamp(1.8rem,3.4vw,2.7rem);font-weight:700}

  .sec-head p{margin-top:14px}



  /* SCADA — supervision (image 3) */

  .scada-wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}

  .scada{background:var(--charcoal-deep);border:1px solid var(--charcoal-line);border-radius:10px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(0,0,0,.35)}

  .scada .bar{height:3px;background:var(--orange)}

  .scada .head{display:flex;align-items:flex-start;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--charcoal-line)}

  .scada .head .title{font-family:var(--display);font-weight:600;color:#fff;font-size:1.12rem}

  .scada .head .lot{font-size:.74rem;color:var(--grey-on-dark);margin-top:3px}

  .live{display:inline-flex;align-items:center;gap:6px;font-size:.68rem;color:#8fd18f;text-transform:uppercase;letter-spacing:.08em;font-weight:600}

  .live .dot{width:7px;height:7px;border-radius:50%;background:#57c957;animation:pulse 1.8s infinite}

  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(87,201,87,.55)}70%{box-shadow:0 0 0 8px rgba(87,201,87,0)}100%{box-shadow:0 0 0 0 rgba(87,201,87,0)}}

  .scada .body{padding:18px 20px}

  .recipe{display:flex;align-items:center;justify-content:space-between;font-size:.82rem;color:var(--grey-on-dark);margin-bottom:16px}

  .recipe .lock{color:var(--orange);font-weight:700;display:inline-flex;align-items:center;gap:6px}

  .ing{margin-bottom:13px}

  .ing .row{display:flex;justify-content:space-between;font-size:.84rem;color:#e7e7e7;margin-bottom:6px}

  .ing .row .val{font-family:var(--display);font-weight:600;color:#fff;font-size:.98rem}

  .track{height:8px;background:#3a3a3a;border-radius:5px;overflow:hidden}

  .track i{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--orange-dark));width:0;transition:width 1s ease}

  .kpis{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--charcoal-line)}

  .kpi{background:#2c2c2c;border-radius:var(--radius);padding:14px}

  .kpi b{display:block;font-family:var(--display);font-weight:700;font-size:1.6rem;color:var(--orange)}

  .kpi span{font-size:.64rem;color:var(--grey-on-dark);text-transform:uppercase;letter-spacing:.06em}

  .trace{margin-top:16px;font-size:.76rem;color:#8fd18f;display:flex;align-items:center;gap:8px}



  /* Grille de cartes (services — image 4) */

  .grid{display:grid;gap:24px}

  .g3{grid-template-columns:repeat(3,1fr)}

  .g2{grid-template-columns:repeat(2,1fr)}

  .card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:28px;transition:.2s;position:relative;overflow:hidden}

  .card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}

  .card:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.3);transform:translateY(-3px)}

  .card:hover:before{transform:scaleX(1)}

  .card .ic{width:46px;height:46px;border-radius:var(--radius);background:rgba(255,125,1,.12);display:grid;place-items:center;margin-bottom:18px}

  .card .ic svg{width:22px;height:22px;stroke:var(--orange);fill:none;stroke-width:2}

  .card h3{font-size:1.32rem;font-weight:700;margin-bottom:9px}

  .card p{font-size:.95rem;color:var(--grey-mid)}

  .card .more{display:inline-flex;align-items:center;gap:6px;margin-top:16px;color:var(--orange);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}



  /* Domaines (secteurs) */

  .sector{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:26px;position:relative;transition:.2s}

  .sector:hover{box-shadow:0 16px 36px -24px rgba(0,0,0,.28);transform:translateY(-2px)}

  .sector .tag{font-family:var(--display);font-weight:700;font-size:1.3rem;color:var(--charcoal);margin-bottom:12px}

  .sector .pain{font-size:.86rem;color:var(--grey-mid);margin-bottom:8px}

  .sector .pain b{color:var(--charcoal)}

  .sector .sol{font-size:.9rem;color:#2b2b2b}

  .sector .metric{margin-top:14px;font-family:var(--display);font-weight:600;color:var(--orange);font-size:.95rem;border-top:1px dashed var(--grey-border);padding-top:12px}

  .sector .link{display:inline-block;margin-top:14px;color:var(--orange);font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}

  .sector:hover .link{color:var(--orange-dark)}



  /* Projets (réalisations) */

  .proj{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.2s}

  .proj:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.3);transform:translateY(-3px)}

  .proj .ph{aspect-ratio:16/10;background:linear-gradient(150deg,#2f2f2f,#3f3f3f);position:relative;display:grid;place-items:center}

  .proj .ph:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:26px 26px}

  .proj .ph svg{width:46px;height:46px;stroke:var(--orange);fill:none;stroke-width:1.6;opacity:.8;position:relative}

  .proj .pin{position:absolute;top:14px;left:14px;background:var(--orange);color:#fff;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:3px}

  .proj .pbody{padding:22px;flex:1;display:flex;flex-direction:column}

  .proj h3{font-size:1.2rem;font-weight:700;margin-bottom:10px}

  .proj .r{font-size:.9rem;color:var(--grey-mid);margin-bottom:6px}

  .proj .r b{color:var(--charcoal);font-weight:600}

  .proj .res{margin-top:auto;padding-top:14px;font-family:var(--display);font-weight:600;color:var(--orange);font-size:.95rem}



  /* Dual CTA (images 5 & 6) */

  .dual{display:grid;grid-template-columns:1fr 1fr;gap:24px}

  .panel{border-radius:10px;padding:clamp(26px,3.5vw,38px)}

  .panel.relational{background:var(--charcoal);color:#fff}

  .panel.relational h3{color:#fff}

  .panel.transactional{background:var(--grey-section);border:1px solid var(--grey-border)}

  .panel .ptag{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--orange);margin-bottom:12px;display:block}

  .panel h3{font-size:1.7rem;font-weight:700;margin-bottom:14px}

  .panel .pdesc{font-size:.96rem;margin-bottom:18px}

  .panel.relational .pdesc{color:var(--grey-on-dark)}

  .panel.transactional .pdesc{color:var(--grey-mid)}

  .avail{display:inline-flex;align-items:center;gap:8px;background:rgba(122,197,122,.15);color:#8fd18f;font-size:.76rem;font-weight:600;padding:7px 13px;border-radius:20px;margin-bottom:16px}

  .avail .d{width:8px;height:8px;border-radius:50%;background:#57c957}

  .promise-list{list-style:none;margin:14px 0 20px}

  .promise-list li{font-size:.92rem;color:var(--grey-on-dark);padding-left:26px;position:relative;margin-bottom:11px}

  .promise-list li:before{content:"✓";position:absolute;left:0;color:var(--orange);font-weight:700}

  .form-row{margin-bottom:15px}

  .form-row label{display:block;font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--grey-mid);margin-bottom:7px}

  .form-row input,.form-row select,.form-row textarea{width:100%;padding:12px 14px;border:1px solid #cfcfcf;border-radius:var(--radius);font-family:var(--body);font-size:.95rem;background:#fff;color:#2b2b2b}

  .form-row textarea{min-height:84px;resize:vertical}

  .odoo-tag{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;color:var(--grey-mid);margin-top:14px}

  .odoo-tag.light{color:var(--grey-on-dark)}

  .odoo-tag .d{width:8px;height:8px;border-radius:50%;background:#7ac57a}

  .slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}

  .slot{padding:13px 6px;text-align:center;border:1px solid var(--charcoal-line);border-radius:var(--radius);cursor:pointer;font-family:var(--display);font-weight:600;font-size:1rem;color:#fff;transition:.15s;line-height:1.2}

  .slot .d{display:block;font-family:var(--body);font-size:.64rem;font-weight:600;color:#9a9a9a;margin-bottom:4px;text-transform:uppercase;letter-spacing:.05em}

  .slot:hover{border-color:var(--orange)}

  .slot.on{background:var(--orange);border-color:var(--orange);color:#fff}

  .slot.on .d{color:#fff}



  /* Équipe (image 7) */

  .team-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}

  .member{text-align:center}

  .member .av{aspect-ratio:1/.86;border-radius:8px;background:var(--charcoal-deep);border:1px solid var(--charcoal-line);display:grid;place-items:center;margin-bottom:14px;position:relative;overflow:hidden}

  .member .av .init{font-family:var(--display);font-weight:700;font-size:2.6rem;color:var(--orange)}

  .member .av .mini{position:absolute;bottom:10px;right:10px;width:22px;height:22px}

  .member .av .mini svg{width:22px;height:22px}

  .member h4{font-family:var(--display);font-weight:600;font-size:1.1rem;color:var(--charcoal)}

  .member span{font-size:.82rem;color:var(--grey-mid)}

  .values{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:44px}

  .value{padding:24px;background:var(--grey-section);border-radius:var(--radius);border-top:3px solid var(--orange)}

  .value h4{font-family:var(--display);font-weight:600;font-size:1.18rem;margin-bottom:9px;color:var(--charcoal)}

  .value p{font-size:.9rem;color:var(--grey-mid)}



  /* Bande équipe (avatar) sur À propos */

  .teamhero{background:var(--charcoal);color:#fff;border-radius:12px;overflow:hidden;position:relative;border:1px solid var(--charcoal-line)}

  .teamhero img{width:100%;height:auto}



  /* Footer */

  footer{background:var(--charcoal);color:var(--grey-on-dark);padding:60px 0 26px}

  .foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}

  .foot-brand .mark{font-family:var(--display);font-weight:700;color:#fff;font-size:1.5rem}

  .foot-brand p{font-size:.9rem;margin-top:12px;max-width:34ch;color:var(--grey-on-dark)}

  footer h5{font-family:var(--display);font-weight:600;color:#fff;font-size:1.05rem;margin-bottom:14px}

  footer ul{list-style:none}

  footer li{margin-bottom:9px;font-size:.9rem;cursor:pointer}

  footer li:hover{color:#fff}

  .foot-bot{margin-top:44px;padding-top:22px;border-top:1px solid var(--charcoal-line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.8rem}



  /* Bandeau maquette */

  .mock-ribbon{background:var(--orange);color:#fff;text-align:center;font-family:var(--body);font-weight:600;font-size:.78rem;letter-spacing:.02em;padding:8px}

  .mock-ribbon b{text-transform:uppercase}



  /* Pages */

  .page{display:none}

  .page.active{display:block}



  /* Responsive */

  @media(max-width:900px){

    nav.links{position:fixed;top:72px;left:0;right:0;background:var(--charcoal);flex-direction:column;gap:0;padding:10px 0;border-bottom:1px solid var(--charcoal-line);display:none}

    nav.links.open{display:flex}

    nav.links a{padding:13px 24px;width:100%}

    .burger{display:flex}

    .hero-grid,.scada-wrap{grid-template-columns:1fr;gap:34px}

    .hero-visual{order:-1}

    .g3,.g2{grid-template-columns:1fr}

    .dual{grid-template-columns:1fr}

    .team-grid{grid-template-columns:repeat(2,1fr)}

    .values{grid-template-columns:1fr 1fr}

    .foot-grid{grid-template-columns:1fr 1fr}

  }

  @media(max-width:520px){

    .kpis{grid-template-columns:1fr}

    .slots{grid-template-columns:1fr 1fr}

    .team-grid{grid-template-columns:1fr}

    .values{grid-template-columns:1fr}

    .foot-grid{grid-template-columns:1fr}

  }



  /* ===== Éléments réintégrés de l'ancienne page d'accueil ===== */

  .g4{grid-template-columns:repeat(4,1fr)}



  /* Barre de confiance (héros) */

  .trustline{display:flex;gap:26px;flex-wrap:wrap;margin-top:32px;padding-top:24px;border-top:1px solid var(--charcoal-line)}

  .trustline .t{display:flex;flex-direction:column}

  .trustline .t b{font-family:var(--display);font-weight:700;font-size:1.6rem;color:var(--orange);line-height:1.1}

  .trustline .t span{font-size:.8rem;color:var(--grey-on-dark);text-transform:uppercase;letter-spacing:.05em}



  /* Différenciateur */

  .diff-grid{display:grid;grid-template-columns:1fr 1fr 1fr;border:1px solid var(--charcoal-line);border-radius:10px;overflow:hidden}

  .diff{padding:34px 28px;background:var(--charcoal-deep)}

  .diff+.diff{border-left:1px solid var(--charcoal-line)}

  .diff .n{font-family:var(--display);font-weight:700;font-size:2.4rem;color:var(--orange);line-height:1}

  .diff h3{color:#fff;font-size:1.25rem;font-weight:600;margin:12px 0 8px}

  .diff p{color:var(--grey-on-dark);font-size:.92rem}



  /* IA + 24/7 */

  .badge-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}

  .badge-card{background:var(--charcoal-deep);border:1px solid var(--charcoal-line);border-radius:10px;padding:30px;color:#fff}

  .badge-card .ic{width:48px;height:48px;border-radius:10px;background:rgba(255,125,1,.14);display:grid;place-items:center;margin-bottom:16px}

  .badge-card .ic svg{width:26px;height:26px;stroke:var(--orange);fill:none}

  .badge-card h3{color:#fff;font-size:1.3rem;font-weight:700;margin-bottom:8px}

  .badge-card p{color:var(--grey-on-dark);font-size:.94rem}

  .badge-card .tagnew{display:inline-block;background:var(--orange);color:#fff;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 9px;border-radius:3px;margin-bottom:12px}



  /* Calculateur « faire ou acheter » */

  .calc{background:var(--charcoal);color:#fff;border-radius:12px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr}

  .calc .inp{padding:clamp(26px,3vw,38px)}

  .calc .out{padding:clamp(26px,3vw,38px);background:var(--charcoal-deep);border-left:1px solid var(--charcoal-line)}

  .calc h3{color:#fff;font-size:1.4rem}

  .field{margin:20px 0}

  .field label{display:block;font-size:.82rem;color:var(--grey-on-dark);text-transform:uppercase;letter-spacing:.05em;margin-bottom:9px}

  .field .rangeval{color:var(--orange);font-family:var(--display);font-weight:700;font-size:1.1rem;text-transform:none;letter-spacing:0}

  input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:4px;background:#454545;outline:none}

  input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--orange);cursor:pointer;border:3px solid rgba(255,255,255,.15)}

  input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--orange);cursor:pointer;border:3px solid rgba(255,255,255,.15)}

  .segbtns{display:flex;gap:8px;flex-wrap:wrap}

  .seg{flex:1;min-width:90px;text-align:center;padding:11px 8px;border:1px solid var(--charcoal-line);border-radius:var(--radius);cursor:pointer;font-size:.85rem;color:var(--grey-on-dark);transition:.15s;font-family:var(--body)}

  .seg.on{border-color:var(--orange);background:rgba(255,125,1,.12);color:#fff}

  .bigfig{font-family:var(--display);font-weight:700;font-size:3.2rem;color:var(--orange);line-height:1;margin-top:6px}

  .compare{margin-top:22px}

  .cmp-row{margin-bottom:16px}

  .cmp-row .top{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:6px}

  .cmp-row .top .who{color:var(--grey-on-dark)}

  .cmp-row .top .amt{font-family:var(--display);font-weight:600;color:#fff}

  .cmp-bar{height:14px;border-radius:4px;background:#3a3a3a;overflow:hidden}

  .cmp-bar i{display:block;height:100%;transition:width .6s ease}

  .cmp-bar.internal i{background:var(--grey-mid)}

  .cmp-bar.nivek i{background:linear-gradient(90deg,var(--orange),var(--orange-dark))}

  .save-note{margin-top:20px;padding-top:18px;border-top:1px solid var(--charcoal-line);font-size:.88rem;color:var(--grey-on-dark)}

  .save-note b{color:#fff}

  .disc{font-size:.72rem;color:#8a8a8a;margin-top:14px;font-style:italic}



  



  @media(max-width:900px){

    .diff-grid{grid-template-columns:1fr}

    .diff+.diff{border-left:0;border-top:1px solid var(--charcoal-line)}

    .badge-row{grid-template-columns:1fr}

    .calc{grid-template-columns:1fr}

    .calc .out{border-left:0;border-top:1px solid var(--charcoal-line)}

    .g4{grid-template-columns:1fr 1fr}

  }

  @media(max-width:520px){

    .g4{grid-template-columns:1fr}

    .trustline{gap:18px}

  }

  /* ===== Sections reprises du site — harmonisées à l'image de marque NIVEK ===== */

  .stg{--stg-ink:#2F2F2F;--stg-body:#5D5D5D;background:transparent;font-family:var(--body);color:var(--stg-body)}

  .stg .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px)}

  .stg .sec{padding:clamp(60px,8vw,100px) 0}

  .stg .eyebrow2{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--orange);display:block;margin-bottom:14px}

  .stg h2{font-family:var(--display);font-weight:700;color:var(--stg-ink);font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.05}

  .stg .head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:46px}

  .stg .link{font-family:var(--body);color:var(--orange);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;cursor:pointer}



  /* Bandeau de confiance (domaines défilants) */

  .stg .ticker-wrap{padding:40px 0 16px;background:#f5f2ec;border-bottom:1px solid #e7e1d6}

  .stg .ticker-lbl{text-align:center;font-family:var(--body);font-weight:600;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;color:#8b95a3;margin-bottom:24px}

  .stg .ticker{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}

  .stg .ticker .track{display:flex;gap:60px;width:max-content;animation:stg-scroll 34s linear infinite;padding-bottom:22px}

  .stg .ticker .item{font-family:var(--body);font-weight:500;font-size:1.4rem;color:#b6b6b6;white-space:nowrap;letter-spacing:.01em}

  @keyframes stg-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}



  /* Cartes services numérotées */

  .stg .cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

  .stg .scard{background:#fff;border:1px solid var(--grey-border);border-radius:8px;padding:32px 28px;transition:.2s;position:relative;overflow:hidden}

  .stg .scard:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}

  .stg .scard:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.3);transform:translateY(-3px)}

  .stg .scard:hover:before{transform:scaleX(1)}

  .stg .scard .num{font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.9rem;line-height:1;margin-bottom:16px}

  .stg .scard h3{font-family:var(--display);font-weight:600;color:var(--stg-ink);font-size:1.45rem;margin-bottom:12px;line-height:1.15}

  .stg .scard p{color:var(--stg-body);font-size:.96rem;line-height:1.6}



  /* Notre approche */

  .stg .approach{background:#fff;border:1px solid var(--grey-border);border-radius:12px;padding:clamp(36px,5vw,60px);box-shadow:0 18px 44px -30px rgba(0,0,0,.18)}

  .stg .approach .top{text-align:center;margin-bottom:44px}

  .stg .steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;text-align:center;max-width:940px;margin:0 auto}

  .stg .step .n{font-family:var(--display);font-weight:700;color:var(--orange);font-size:2.7rem;line-height:1;margin-bottom:16px}

  .stg .step h4{font-family:var(--display);font-weight:600;color:var(--stg-ink);font-size:1.3rem;margin-bottom:12px}

  .stg .step p{color:var(--stg-body);font-size:.95rem;line-height:1.55}



  /* Domaines d'expertise */

  .stg .cards6{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

  .stg .dcard{background:#fff;border:1px solid var(--grey-border);border-radius:8px;padding:26px 28px;transition:.2s}

  .stg .dcard:hover{box-shadow:0 16px 38px -28px rgba(0,0,0,.28);transform:translateY(-2px)}

  .stg .dcard h3{font-family:var(--display);font-weight:600;color:var(--stg-ink);font-size:1.25rem;margin-bottom:12px}



  /* Projets (preuve) */

  .stg .proj3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:56px}

  .stg .pcard{background:#fff;border:1px solid var(--grey-border);border-radius:8px;overflow:hidden;transition:.2s}

  .stg .pcard:hover{box-shadow:0 18px 42px -28px rgba(0,0,0,.28);transform:translateY(-3px)}

  .stg .pcard .ph{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#ececec 0 12px,#f3f3f3 12px 24px);display:grid;place-items:center}

  .stg .pcard .ph span{font-family:var(--body);font-size:.78rem;color:#a9a9a9;letter-spacing:.04em;text-transform:uppercase}

  .stg .pcard .pb{padding:24px 26px}

  .stg .pcard .cat{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:var(--orange);margin-bottom:12px}

  .stg .pcard h3{font-family:var(--display);font-weight:600;color:var(--stg-ink);font-size:1.3rem;line-height:1.16;margin-bottom:12px}

  .stg .pcard .sum{color:var(--stg-body);font-size:.95rem}



  /* Statistiques */

  .stg .stats{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border:1px solid var(--grey-border);border-radius:10px;overflow:hidden}

  .stg .stat{padding:44px 24px;text-align:center}

  .stg .stat+.stat{border-left:1px solid var(--grey-border)}

  .stg .stat b{display:block;font-family:var(--display);font-weight:700;color:var(--orange);font-size:3.4rem;line-height:1}

  .stg .stat span{color:var(--stg-body);font-size:.95rem;margin-top:10px;display:block}



  /* Industrie 4.0 */

  .stg .i40{background:#fff;border:1px solid var(--grey-border);border-radius:12px;padding:clamp(30px,4vw,52px);display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center;position:relative;overflow:hidden}

  .stg .i40:before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;background:var(--orange)}

  .stg .i40 p{color:var(--stg-body);font-size:1rem;line-height:1.7;margin:18px 0 26px}

  .stg .i40 .ph{aspect-ratio:16/11;background:repeating-linear-gradient(135deg,#ececec 0 12px,#f3f3f3 12px 24px);border-radius:8px;display:grid;place-items:center}

  .stg .i40 .ph span{font-family:var(--body);font-size:.78rem;color:#a9a9a9;text-transform:uppercase;letter-spacing:.04em}



  /* Boutons (alignés sur les boutons de marque) */

  .stg .btn2{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:700;font-size:.95rem;letter-spacing:.02em;padding:14px 24px;border-radius:4px;cursor:pointer;border:2px solid transparent;transition:.18s ease;text-transform:uppercase;text-decoration:none}

  .stg .btn2.solid{background:var(--orange);color:#fff}

  .stg .btn2.solid:hover{background:var(--orange-dark)}

  .stg .btn2.ghost{background:transparent;color:var(--charcoal);border-color:var(--charcoal)}

  .stg .btn2.ghost:hover{background:var(--charcoal);color:#fff}



  /* Parlons de votre prochain projet */

  .stg .cta{background:#fff;border:1px solid var(--grey-border);border-radius:12px;padding:clamp(46px,6vw,80px) 24px;text-align:center;box-shadow:0 18px 44px -30px rgba(0,0,0,.18)}

  .stg .cta h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:16px}

  .stg .cta h2 .hl{color:var(--orange)}

  .stg .cta p{color:var(--stg-body);font-size:1.05rem;max-width:46ch;margin:0 auto 30px}

  .stg .cta .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}



  @media(max-width:900px){

    .stg .cards3,.stg .steps3,.stg .proj3,.stg .stats,.stg .i40{grid-template-columns:1fr}

    .stg .cards6{grid-template-columns:1fr 1fr}

    .stg .stat+.stat{border-left:0;border-top:1px solid var(--grey-border)}

    .stg .head-row{flex-direction:column;align-items:flex-start}

    .stg .i40:before{width:100%;height:4px;bottom:auto}

  }

  @media(max-width:640px){

    .stg .cards6{grid-template-columns:1fr}

  }



  /* ===== Services : piliers ===== */

  .svc-pillar{background:#fff;border:1px solid var(--grey-border);border-radius:14px;padding:clamp(26px,3.5vw,44px);box-shadow:0 20px 50px -34px rgba(0,0,0,.25);position:relative;overflow:hidden;margin-top:28px}

  .svc-pillar::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange)}

  .svc-pillar.first{margin-top:12px}

  .svc-topline{display:flex;align-items:center;gap:16px;margin-bottom:10px}

  .svc-topline .n{font-family:var(--display);font-weight:700;color:#fff;font-size:1.5rem;line-height:1;background:var(--orange);width:52px;height:52px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto}

  .svc-topline h3{font-family:var(--display);font-weight:700;color:var(--charcoal);font-size:1.7rem}

  .svc-sub{color:var(--grey-mid);margin:0 0 22px;max-width:72ch}

  .svc-outcome{margin-top:18px;background:rgba(255,125,1,.06);border-left:3px solid var(--orange);border-radius:0 var(--radius) var(--radius) 0;padding:15px 20px;font-size:.94rem;color:#2b2b2b}

  .svc-outcome b{color:var(--charcoal)}

  .card.plain{background:var(--grey-section)}

  .card.plain h3{font-family:var(--display);font-weight:600;font-size:1.28rem;margin-bottom:9px}



  /* ===== Support technique ===== */

  .support-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:start}

  .ticket-card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:clamp(24px,3vw,34px)}

  .ticket-card h3{font-family:var(--display);font-weight:700;font-size:1.6rem;margin-bottom:22px;color:var(--charcoal)}

  .ticket-row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}

  .support-side{display:flex;flex-direction:column;gap:22px}

  .urgence-card{background:linear-gradient(180deg,#fff3ea,#fff);border:1px solid #f3ddca;border-radius:var(--radius);padding:28px}

  .libre-card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:28px}

  .support-tag{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;color:var(--orange);margin-bottom:12px;display:block}

  .urgence-card h3{font-family:var(--display);font-weight:700;font-size:1.5rem;margin-bottom:10px;color:var(--charcoal)}

  .urgence-card p{color:var(--grey-mid);font-size:.94rem;margin-bottom:18px}

  .libre-card p{color:#2b2b2b;font-size:.94rem}

  .libre-card ul{list-style:none;margin:14px 0 20px}

  .libre-card li{padding-left:18px;position:relative;margin-bottom:10px;font-size:.94rem;color:#2b2b2b}

  .libre-card li:before{content:"\25AA";position:absolute;left:0;color:var(--orange)}

  .support-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px}

  .sstep{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:24px;text-align:center}

  .sstep h4{font-family:var(--display);font-weight:700;font-size:1.15rem;margin-bottom:8px;color:var(--charcoal)}

  .sstep p{color:var(--grey-mid);font-size:.9rem}



  /* ===== Espace client (emplacement) ===== */

  .portal{max-width:440px;margin:0 auto;background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:clamp(28px,4vw,40px);text-align:center}

  .portal .lockic{width:56px;height:56px;border-radius:50%;background:rgba(255,125,1,.12);display:grid;place-items:center;margin:0 auto 20px}

  .portal .lockic svg{width:26px;height:26px;stroke:var(--orange);fill:none;stroke-width:2}

  .portal .btn{width:100%;justify-content:center;margin-top:8px}

  .portal .soon{display:inline-block;margin-top:18px;font-size:.76rem;color:var(--grey-mid)}



  /* ===== À propos ===== */

  .vision-hero{aspect-ratio:21/8;background:repeating-linear-gradient(135deg,#ededed 0 14px,#f4f4f4 14px 28px);border:1px solid var(--grey-border);border-radius:var(--radius);display:grid;place-items:center;margin-bottom:38px}

  .vision-hero span{font-family:var(--body);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;color:#a9a9a9}

  .partenaires-band{background:linear-gradient(180deg,#fff3ea,#fff);border:1px solid #f3ddca;border-radius:var(--radius);padding:34px;text-align:center;margin-top:40px}

  .partenaires-band .p1{font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.3rem;letter-spacing:.02em}

  .partenaires-band .p2{font-style:italic;color:var(--grey-mid);margin-top:8px;font-size:1rem}



  /* nav utilitaire */

  .nav-sep{width:1px;height:20px;background:var(--charcoal-line);flex:0 0 auto}

  nav.links a.util{color:#c2c2c2;font-size:.78rem}

  nav.links a.util:hover{color:#fff}



  @media(max-width:900px){

    .support-grid,.ticket-row2,.support-steps{grid-template-columns:1fr}

    .nav-sep{display:none}

  }



  /* ===== Équipe : photos d'avatars ===== */

  .member .av{aspect-ratio:4/5;background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);overflow:hidden;display:block;margin-bottom:14px}

  .member .av img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}



  /* ===== Carte Joindre l'équipe ===== */

  .join-card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:30px;max-width:540px;margin-top:44px}

  .join-card h3{font-family:var(--display);font-weight:700;font-size:1.5rem;color:var(--charcoal);margin-bottom:8px}

  .join-card p{color:var(--grey-mid);font-size:.95rem;margin-bottom:16px}

  .olink{color:var(--orange);font-weight:700;font-size:.86rem;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;display:inline-block}

  .olink:hover{color:var(--orange-dark)}



  /* ===== Formation ===== */

  .form-card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}

  .form-visual{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#ededed 0 14px,#f4f4f4 14px 28px);display:grid;place-items:center}

  .form-visual span{font-family:var(--body);text-transform:uppercase;letter-spacing:.06em;font-size:.76rem;color:#a9a9a9}

  .form-body{padding:24px;flex:1;display:flex;flex-direction:column}

  .form-badge{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;color:var(--orange);margin-bottom:12px}

  .form-body h3{font-family:var(--display);font-weight:700;font-size:1.35rem;color:var(--charcoal);margin-bottom:10px;line-height:1.15}

  .form-body p{color:var(--grey-mid);font-size:.94rem;flex:1}

  .form-foot{display:flex;justify-content:space-between;align-items:center;margin-top:18px}

  .form-foot .dur{font-size:.85rem;color:var(--grey-mid)}



  /* ===== Pages de service détaillées ===== */

  .breadcrumb{font-family:var(--body);font-size:.82rem;color:var(--grey-mid);margin-bottom:18px}

  .breadcrumb span[data-nav]{cursor:pointer}

  .breadcrumb span[data-nav]:hover{color:var(--charcoal)}

  .breadcrumb .cur{color:var(--orange)}

  .svc-h1{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,5vw,3.6rem);color:var(--charcoal);line-height:1.02;margin:6px 0 18px}

  .svc-visual{aspect-ratio:16/7;background:repeating-linear-gradient(135deg,#ededed 0 14px,#f4f4f4 14px 28px);border:1px solid var(--grey-border);border-radius:var(--radius);display:grid;place-items:center;margin:32px 0 8px}

  .svc-visual span{font-family:var(--body);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;color:#a9a9a9}

  .svc-sub-h{font-family:var(--display);font-weight:700;font-size:1.7rem;color:var(--charcoal);margin:52px 0 24px}

  .comprend-card{background:#fff;border:1px solid var(--grey-border);border-radius:var(--radius);padding:24px;display:flex;gap:14px;align-items:flex-start}

  .comprend-card .ar{color:var(--orange);font-weight:700;flex:0 0 auto;font-size:1.1rem}

  .comprend-card h4{font-family:var(--display);font-weight:600;font-size:1.22rem;color:var(--charcoal);margin-bottom:6px}

  .comprend-card p{color:var(--grey-mid);font-size:.94rem}

  .sector-pills{display:flex;flex-wrap:wrap;gap:12px}

  .pill{border:1px solid var(--grey-border);border-radius:30px;padding:10px 20px;font-size:.92rem;color:var(--charcoal);background:#fff;cursor:pointer;transition:.15s}

  .pill:hover{border-color:var(--orange);color:var(--orange)}

  .rowbetween{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-top:52px}

  .proj-ph{aspect-ratio:16/9;background:repeating-linear-gradient(135deg,#ededed 0 14px,#f4f4f4 14px 28px);border:1px solid var(--grey-border);border-radius:var(--radius);display:grid;place-items:center}

  .proj-ph span{font-family:var(--body);text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;color:#a9a9a9}



  @media(max-width:900px){

    .rowbetween{flex-direction:column;align-items:flex-start}

  }



  /* ===== Promesses de marque (réparties) ===== */

  .promise{background:var(--charcoal);color:#fff;text-align:center;padding:clamp(50px,7vw,88px) 0}

  .promise .kick{display:inline-block;width:46px;height:3px;background:var(--orange);border-radius:2px;margin-bottom:22px}

  .promise .txt{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4vw,3rem);line-height:1.08;color:#fff;max-width:22ch;margin:0 auto}

  .promise .txt .o{color:var(--orange)}

  .teamhero-full{border-radius:var(--radius);overflow:hidden;border:1px solid var(--grey-border);margin-bottom:38px}

  .teamhero-full img{width:100%;height:auto;display:block}



  /* ===== FeedMatik spotlight ===== */

  .feedmatik{background:var(--charcoal);color:#fff;position:relative;overflow:hidden}

  .feedmatik:before{content:"";position:absolute;inset:0;background:radial-gradient(900px 500px at 85% 50%,rgba(255,125,1,.12),transparent 65%)}

  .feedmatik .inner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:clamp(64px,9vw,110px) 0}

  .feedmatik .tag{display:inline-block;border:1px solid rgba(255,125,1,.5);color:var(--orange);font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;padding:5px 12px;border-radius:3px;margin-bottom:18px}

  .feedmatik h2{font-family:var(--display);font-weight:700;font-size:clamp(2rem,3.6vw,2.8rem);color:#fff;line-height:1.06;margin-bottom:16px}

  .feedmatik h2 .o{color:var(--orange)}

  .feedmatik .lead-w{color:var(--grey-on-dark);font-size:1.06rem;line-height:1.68;max-width:52ch}

  .feedmatik .feats{list-style:none;margin:26px 0 30px;display:grid;gap:11px}

  .feedmatik .feats li{display:flex;align-items:flex-start;gap:11px;color:#d9d9d9;font-size:.95rem}

  .feedmatik .feats li:before{content:"→";color:var(--orange);font-weight:700;flex:0 0 auto;margin-top:1px}

  .feedmatik .dash-panel{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:14px}

  .feedmatik .kpi-tile{background:rgba(255,255,255,.06);border-radius:6px;padding:18px 16px;border-top:2px solid var(--orange)}

  .feedmatik .kpi-tile .val{font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.9rem;line-height:1}

  .feedmatik .kpi-tile .lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--grey-on-dark);margin-top:6px}

  .feedmatik .kpi-tile .sub{font-size:.78rem;color:#8c8c8c;margin-top:3px}

  .feedmatik .panel-head{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}

  .feedmatik .panel-head .t{font-family:var(--display);font-weight:600;color:#fff;font-size:1rem}

  .feedmatik .live2{display:flex;align-items:center;gap:6px;font-size:.68rem;color:#8fd18f;text-transform:uppercase;letter-spacing:.08em}

  .feedmatik .live2 .dot{width:7px;height:7px;border-radius:50%;background:#57c957;animation:pulse 1.8s infinite}



  /* ===== Services récurrents (le pilier 04 hérite du panneau blanc standard) ===== */



  @media(max-width:900px){

    .feedmatik .inner,.feedmatik .dash-panel{grid-template-columns:1fr}

  }



  /* ===== D'irritants aux gains ===== */

  .gains{background:var(--charcoal);color:#fff}

  .gains .wrap{padding:clamp(64px,9vw,100px) clamp(20px,5vw,40px)}

  .gains .eyebrow{color:var(--orange)}

  .gains h2{color:#fff;margin-bottom:48px}

  .gains-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border:1px solid var(--charcoal-line);border-radius:10px;overflow:hidden}

  .gains-col{padding:clamp(22px,3vw,36px)}

  .gains-col.irritants{background:rgba(255,255,255,.04)}

  .gains-col.solutions{background:rgba(255,125,1,.1)}

  .gains-col.resultats{background:rgba(255,255,255,.06)}

  .gains-col h4{font-family:var(--display);font-weight:700;font-size:1.1rem;margin-bottom:18px;padding-bottom:12px;border-bottom:2px solid rgba(255,255,255,.1)}

  .gains-col.solutions h4{border-color:var(--orange);color:var(--orange)}

  .gains-col.irritants h4{color:#d0d0d0}

  .gains-col.resultats h4{color:#fff}

  .gains-row{display:flex;align-items:flex-start;gap:9px;margin-bottom:14px;font-size:.92rem}

  .gains-row .ico{flex:0 0 auto;margin-top:2px;font-size:1rem}

  .gains-col.irritants .gains-row{color:var(--grey-on-dark)}

  .gains-col.solutions .gains-row{color:#e8e8e8}

  .gains-col.resultats .gains-row b{display:block;font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.3rem;line-height:1;margin-bottom:3px}

  .gains-col.resultats .gains-row{color:var(--grey-on-dark)}

  .gains-note{margin-top:30px;text-align:center;font-family:var(--display);font-weight:700;font-size:1.15rem;color:#fff;letter-spacing:.01em}

  .gains-note .o{color:var(--orange)}



  /* ===== Intégration 3 phases ===== */

  .phases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

  .phase{border-radius:var(--radius);padding:30px;border:1px solid var(--grey-border);background:#fff;position:relative;overflow:hidden}

  .phase:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--orange)}

  .phase .ph-num{font-family:var(--display);font-weight:700;font-size:3rem;color:rgba(255,125,1,.12);position:absolute;top:12px;right:16px;line-height:1}

  .phase .ph-tag{font-family:var(--body);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;color:var(--orange);margin-bottom:8px;display:block}

  .phase h3{font-family:var(--display);font-weight:700;font-size:1.35rem;color:var(--charcoal);margin-bottom:16px}

  .phase ul{list-style:none}

  .phase li{font-size:.92rem;color:var(--grey-mid);padding-left:16px;position:relative;margin-bottom:9px}

  .phase li:before{content:"—";position:absolute;left:0;color:var(--orange);font-weight:700}



  /* ===== USP Engrais ===== */

  .usp-engrais{position:relative;overflow:hidden;color:#fff}

  .usp-engrais .bg-img{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.25)}

  .usp-engrais .inner{position:relative;padding:clamp(64px,9vw,100px) 0}

  .usp-engrais .filet2{width:60px;height:3px;background:var(--orange);border-radius:2px;margin-bottom:20px}

  .usp-engrais h2{color:#fff;font-size:clamp(1.8rem,3.4vw,2.7rem);margin-bottom:12px}

  .usp-engrais .sub{color:var(--grey-on-dark);font-size:1.05rem;margin-bottom:44px;max-width:62ch}

  .usp-pts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

  .usp-pt{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:22px}

  .usp-pt .n{font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.8rem;line-height:1;margin-bottom:10px}

  .usp-pt p{color:var(--grey-on-dark);font-size:.9rem}



  /* ===== Pcard photos (project cards with images) ===== */

  .pcard .ph img{width:100%;height:100%;object-fit:cover;display:block}

  .stg .pcard .ph{aspect-ratio:16/10;overflow:hidden}

  .stg .pcard .ph img{width:100%;height:100%;object-fit:cover}



  @media(max-width:900px){

    .gains-grid{grid-template-columns:1fr}

    .gains-col.solutions h4:before{content:""}

    .phases-grid{grid-template-columns:1fr}

    .usp-pts{grid-template-columns:1fr 1fr}

  }

  @media(max-width:520px){

    .usp-pts{grid-template-columns:1fr}

  }



  /* ===== Pages de domaine ===== */

  .domain-hero{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-bottom:52px}

  .domain-hero .dh-text h1{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,4.5vw,3.2rem);color:var(--charcoal);line-height:1.04;margin-bottom:16px}

  .domain-hero .dh-text .lead{color:var(--grey-mid);font-size:1.08rem}

  .domain-visual-block{aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;position:relative}

  .domain-visual-block img{width:100%;height:100%;object-fit:cover;display:block}

  .domain-visual-block .dvb-fallback{width:100%;height:100%;background:var(--charcoal);display:grid;place-items:center}

  .domain-visual-block .dvb-fallback .icon-wrap{text-align:center}

  .domain-visual-block .dvb-fallback svg{width:80px;height:80px;stroke:var(--orange);fill:none;stroke-width:1.4;opacity:.7}

  .domain-visual-block .dvb-fallback .tag{font-family:var(--display);font-weight:700;font-size:1.5rem;color:rgba(255,255,255,.12);margin-top:12px;text-transform:uppercase;letter-spacing:.1em}

  .pain-sol{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-bottom:48px}

  .ps-card{border-radius:var(--radius);padding:28px}

  .ps-card.irritants{background:var(--grey-section);border:1px solid var(--grey-border)}

  .ps-card.solutions{background:var(--charcoal);color:#fff}

  .ps-card h3{font-family:var(--display);font-weight:700;font-size:1.3rem;margin-bottom:18px}

  .ps-card.solutions h3{color:#fff}

  .ps-card.irritants h3{color:var(--charcoal)}

  .ps-list{list-style:none}

  .ps-list li{font-size:.95rem;padding-left:20px;position:relative;margin-bottom:12px;line-height:1.5}

  .ps-list li:before{position:absolute;left:0;font-weight:700}

  .ps-card.irritants .ps-list li:before{content:"—";color:var(--grey-mid)}

  .ps-card.solutions .ps-list li{color:var(--grey-on-dark)}

  .ps-card.solutions .ps-list li:before{content:"✓";color:var(--orange)}

  .metric-band{background:var(--orange);color:#fff;border-radius:var(--radius);padding:26px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:48px;flex-wrap:wrap}

  .metric-band .ml{font-family:var(--display);font-weight:700;font-size:1.4rem}

  .domain-services{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:48px}



  @media(max-width:900px){

    .domain-hero{grid-template-columns:1fr}

    .pain-sol{grid-template-columns:1fr}

    .metric-band{flex-direction:column;align-items:flex-start}

    .domain-services{grid-template-columns:1fr 1fr}

  }

  @media(max-width:520px){

    .domain-services{grid-template-columns:1fr}

  }



  /* ===== Pages de domaine — style staging ===== */

  .dom-pg{background:#ffffff;color:#26231e;min-height:80vh}

  .dom-pg .iwrap{max-width:1100px;margin:0 auto;padding:0 clamp(20px,5vw,40px)}

  .dom-bread{font-family:'Space Mono',monospace,sans-serif;font-size:.78rem;color:#8b95a3;margin-bottom:22px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}

  .dom-bread a,.dom-bread span{cursor:pointer;text-decoration:none;color:inherit}

  .dom-bread a:hover{color:#26231e}

  .dom-bread .cur{color:var(--orange)}

  .dom-bread .sep{color:#c4bdb3}

  .dom-tag{font-family:'Space Mono',monospace;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.22em;color:#26231e;background:rgba(0,0,0,.07);display:inline-block;padding:4px 10px;border-radius:3px;margin-bottom:16px}

  .dom-pg h1{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:clamp(2.4rem,5vw,3.4rem);color:#26231e;line-height:1.04;margin-bottom:18px;letter-spacing:-.01em}

  .dom-intro{font-size:1.08rem;color:#4a4540;line-height:1.68;max-width:72ch;margin-bottom:40px}

  .dom-intro b,.dom-intro strong{color:#26231e}

  .ph-install{border-radius:16px;overflow:hidden;background:repeating-linear-gradient(135deg,#e8e3da 0 14px,#f0ebe2 14px 28px);aspect-ratio:16/6;display:grid;place-items:center;margin-bottom:48px}

  .ph-install img{width:100%;height:100%;object-fit:cover;display:block}

  .ph-install span{font-family:'Space Mono',monospace;font-size:.8rem;color:#a9a09a;letter-spacing:.04em;text-transform:lowercase}



  /* FeedMatik / approche card */

  .fm-card{background:#fff;border:1.5px solid #e8ddd3;border-radius:18px;padding:clamp(28px,4vw,44px);display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-bottom:48px}

  .fm-card.approach{background:linear-gradient(180deg,#fff8f4,#fff)}

  .fm-tag{font-family:'Space Mono',monospace;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.22em;color:var(--orange);margin-bottom:14px;display:block}

  .fm-card h2{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:clamp(1.6rem,3vw,2.1rem);color:#26231e;line-height:1.12;margin-bottom:14px}

  .fm-card p{color:#4a4540;font-size:.98rem;line-height:1.68;margin-bottom:18px}

  .fm-card blockquote{font-style:italic;color:#4a4540;font-size:1rem;margin-bottom:16px;line-height:1.6}

  .fm-ph{aspect-ratio:4/3;background:repeating-linear-gradient(135deg,#e8e3da 0 12px,#f0ebe2 12px 24px);border-radius:12px;border:1px solid #e0d9d0;display:grid;place-items:center}

  .fm-ph img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block}

  .fm-ph span{font-family:'Space Mono',monospace;font-size:.76rem;color:#a9a09a;letter-spacing:.04em}

  .btn-pill-org{display:inline-flex;align-items:center;gap:8px;background:var(--orange);color:#fff;font-family:'Space Grotesk',var(--display),sans-serif;font-weight:600;font-size:.96rem;padding:13px 26px;border-radius:40px;cursor:pointer;border:0;white-space:nowrap;text-decoration:none;transition:.18s}

  .btn-pill-org:hover{background:var(--orange-dark)}

  .btn-pill-ghost{display:inline-flex;align-items:center;gap:8px;background:transparent;color:#26231e;font-family:'Space Grotesk',var(--display),sans-serif;font-weight:600;font-size:.96rem;padding:12px 24px;border-radius:40px;border:1.5px solid #26231e;cursor:pointer;transition:.18s}

  .btn-pill-ghost:hover{background:#26231e;color:#fff}



  /* Steps */

  .dom-sec-label{font-family:'Space Mono',monospace;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.22em;color:var(--orange);margin-bottom:12px;display:block}

  .dom-sec-title{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:clamp(1.6rem,2.8vw,2rem);color:#26231e;margin-bottom:28px}

  .step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:48px}

  .step-card{background:#fff;border:1px solid #e8e3da;border-radius:12px;padding:22px 20px}

  .step-card h4{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:1.05rem;color:var(--orange);margin-bottom:10px}

  .step-card p{font-size:.93rem;color:#4a4540;line-height:1.55}

  .step-card.sur-mesure h4{color:#26231e}



  /* Benefits */

  .benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:48px}

  .benefit-card{background:#fff;border:1px solid #e8e3da;border-radius:12px;padding:20px 18px;display:flex;align-items:flex-start;gap:14px}

  .benefit-card .arrow{color:var(--orange);font-weight:700;font-size:1.1rem;flex:0 0 auto;margin-top:2px}

  .benefit-card div h4{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:1rem;color:#26231e;margin-bottom:6px}

  .benefit-card div p{font-size:.88rem;color:#4a4540;line-height:1.5}



  /* Services pertinents */

  .svc-pertinents h3{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:1.4rem;color:#26231e;margin-bottom:16px}

  .svc-pills-stg{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:48px}

  .svc-pill-stg{background:#fff;border:1.5px solid #d0cbc3;border-radius:30px;padding:10px 20px;font-size:.92rem;color:#26231e;cursor:pointer;transition:.15s;font-family:'Space Grotesk',var(--display),sans-serif;font-weight:500}

  .svc-pill-stg:hover{border-color:var(--orange);color:var(--orange)}



  /* Projets dans ce secteur */

  .proj-sec h3{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:1.4rem;color:#26231e;margin-bottom:0}

  .proj-sec .proj-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:20px}

  .proj-sec .all-link{color:var(--orange);font-size:.96rem;font-weight:600;cursor:pointer;white-space:nowrap;font-family:'Space Grotesk',var(--display),sans-serif}

  .proj-grid-stg{display:grid;gap:20px;margin-bottom:40px}

  .proj-grid-stg.c2{grid-template-columns:1fr 1fr}

  .proj-grid-stg.c3{grid-template-columns:1fr 1fr 1fr}

  .proj-card-stg{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #e8e3da}

  .proj-card-stg .proj-ph-stg{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#e8e3da 0 12px,#f0ebe2 12px 24px);display:grid;place-items:center}

  .proj-card-stg .proj-ph-stg img{width:100%;height:100%;object-fit:cover;display:block}

  .proj-card-stg .proj-ph-stg span{font-family:'Space Mono',monospace;font-size:.76rem;color:#b5afa8;letter-spacing:.04em}

  .proj-card-stg .proj-name{padding:18px 20px;font-family:'Space Grotesk',var(--display),sans-serif;font-weight:600;font-size:1rem;color:#26231e}



  /* CTA banner */

  .dom-cta{background:linear-gradient(180deg,#fff4ed,#fff8f4);border:1.5px solid #f0ddd0;border-radius:18px;padding:clamp(36px,5vw,56px) 24px;text-align:center}

  .dom-cta h2{font-family:'Space Grotesk',var(--display),sans-serif;font-weight:700;font-size:clamp(1.6rem,3vw,2rem);color:#26231e;margin-bottom:12px}

  .dom-cta p{color:#4a4540;font-size:1rem;margin-bottom:24px;max-width:50ch;margin-left:auto;margin-right:auto}



  @media(max-width:900px){

    .fm-card{grid-template-columns:1fr}

    .step-grid{grid-template-columns:1fr 1fr}

    .benefit-grid{grid-template-columns:1fr 1fr}

    .proj-grid-stg.c3{grid-template-columns:1fr 1fr}

  }

  @media(max-width:580px){

    .step-grid,.benefit-grid{grid-template-columns:1fr}

    .proj-grid-stg.c2,.proj-grid-stg.c3{grid-template-columns:1fr}

  }



  /* ===== NOUVEAU · Flux d'intégration verticale ===== */

  .vflow{position:relative;background:var(--charcoal-deep);color:#fff}

  .vflow .sec-head h2{color:#fff}

  .vflow-steps{display:grid;grid-template-columns:repeat(5,1fr);margin-top:38px;align-items:stretch}

  .vstep{position:relative;padding:0 11px;display:flex}

  .vstep .node{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:22px 18px;width:100%;position:relative}

  .vstep .node:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange);border-radius:12px 12px 0 0}

  .vstep .lbl{font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--orange);margin-bottom:8px}

  .vstep .desc{color:#fff;font-size:.9rem;margin-bottom:14px}

  .vstep .tags{display:flex;flex-wrap:wrap;gap:6px}

  .vstep .tags span{font-size:.7rem;color:var(--grey-on-dark);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:3px 10px}

  .vstep .arr{position:absolute;top:50%;right:-9px;transform:translateY(-50%);z-index:2;font-family:var(--display);font-weight:700;color:var(--orange);font-size:1.5rem;line-height:1}

  .vstep:last-child .arr{display:none}

  .vflow-foot{margin-top:30px;border-top:1px solid var(--charcoal-line);padding-top:20px;color:var(--grey-on-dark);font-size:.82rem;text-align:center;line-height:1.8}

  @media(max-width:820px){

    .vflow-steps{grid-template-columns:1fr;gap:30px}

    .vstep{padding:0}

    .vstep .arr{top:auto;right:auto;bottom:-22px;left:50%;transform:translateX(-50%) rotate(90deg)}

  }



  /* ===== NOUVEAU · Comparaison qualitative ===== */

  .qcmp{max-width:940px;margin:34px auto 0;background:var(--charcoal-deep);border:1px solid var(--charcoal-line);border-radius:14px;overflow:hidden}

  .qcmp-head,.qcmp-row{display:grid;grid-template-columns:1.1fr 1.4fr 1.4fr}

  .qcmp-head{background:rgba(255,255,255,.04);border-bottom:1px solid var(--charcoal-line)}

  .qcmp-head>div{padding:15px 18px;font-family:var(--display);font-weight:700;font-size:.95rem;text-transform:uppercase;letter-spacing:.04em;color:#fff}

  .qcmp-head .h-niv{color:var(--orange)}

  .qcmp-row{border-bottom:1px solid var(--charcoal-line)}

  .qcmp-row:last-child{border-bottom:0}

  .qcmp-row>div{padding:16px 18px;font-size:.88rem;display:flex;gap:10px;align-items:flex-start}

  .qcmp-crit{font-family:var(--display);font-weight:700;color:#fff;font-size:1rem;text-transform:uppercase;letter-spacing:.03em}

  .qcmp-int{color:var(--grey-on-dark)}

  .qcmp-niv{color:#fff}

  .qcmp-row .mk{flex:0 0 auto;font-weight:700;line-height:1.35}

  .qcmp-int .mk{color:var(--grey-mid)}

  .qcmp-niv .mk{color:var(--orange)}

  @media(max-width:720px){

    .qcmp-head{display:none}

    .qcmp-row{grid-template-columns:1fr}

    .qcmp-row>div{padding:10px 18px}

    .qcmp-crit{padding-top:16px;padding-bottom:2px}

    .qcmp-int:before{content:"Internaliser — ";color:var(--grey-mid);font-weight:700}

    .qcmp-niv:before{content:"NIVEK — ";color:var(--orange);font-weight:700}

    .qcmp-row:last-child .qcmp-niv{padding-bottom:16px}

  }



  .kpis .kpi-note{grid-column:1/-1;margin-top:6px;font-size:.7rem;color:var(--grey-on-dark);opacity:.8;text-align:center;letter-spacing:.02em;text-transform:none}

  .btn-diag{background:rgba(255,125,1,.14);border:1px solid var(--orange);color:#fff}

  .btn-diag:hover{background:rgba(255,125,1,.24);border-color:var(--orange)}



  /* ===== Autodiagnostic — modale conversationnelle ===== */

  .diag-overlay{position:fixed;inset:0;background:rgba(20,20,20,.62);display:flex;align-items:center;justify-content:center;z-index:1200;padding:18px}

  .diag-overlay[hidden]{display:none}

  .diag-modal{background:#fff;border-radius:16px;width:100%;max-width:560px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;position:relative;box-shadow:0 24px 70px rgba(0,0,0,.45);outline:none}

  .diag-close{position:absolute;top:10px;right:14px;background:none;border:0;font-size:1.7rem;color:var(--grey-mid);cursor:pointer;line-height:1;z-index:2;padding:4px}

  .diag-close:hover{color:var(--charcoal)}

  .diag-head{padding:20px 24px 12px;border-bottom:1px solid var(--grey-border);display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto}

  .diag-eyebrow{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;color:var(--orange)}

  .diag-prog{font-family:var(--display);font-weight:700;color:var(--grey-mid);font-size:.85rem;white-space:nowrap}

  .diag-body{padding:20px 24px 24px;overflow-y:auto;display:flex;flex-direction:column}

  .diag-bubble{max-width:90%;margin-bottom:10px;padding:12px 15px;border-radius:14px;font-size:.94rem;line-height:1.45;animation:diagIn .25s ease}

  .diag-bubble.bot{background:var(--grey-section);color:var(--charcoal);border-bottom-left-radius:4px;align-self:flex-start}

  .diag-bubble.user{background:var(--orange);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}

  .diag-bubble.react{background:none;color:var(--grey-mid);font-size:.84rem;padding:0 4px;margin-bottom:18px;align-self:flex-start}

  .diag-theme{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.7rem;color:var(--orange);margin-bottom:4px}

  .diag-opts{display:flex;flex-wrap:wrap;gap:10px;margin:2px 0 10px;align-self:flex-start}

  .diag-opts button{border:1px solid var(--grey-border);background:#fff;border-radius:10px;padding:10px 18px;font-size:.9rem;cursor:pointer;color:var(--charcoal);font-family:var(--body);transition:.15s}

  .diag-opts button:hover{border-color:var(--orange);background:rgba(255,125,1,.07)}

  .diag-result{text-align:center;padding:10px 0 4px;align-self:stretch;animation:diagIn .25s ease}

  .diag-result .g{font-family:var(--display);font-weight:700;font-size:1.55rem;color:var(--charcoal);margin-bottom:8px}

  .diag-result .g b{color:var(--orange)}

  .diag-result p{color:var(--grey-mid);margin:0 auto 18px;max-width:46ch;line-height:1.5}

  .diag-restart{display:block;margin:12px auto 0;background:none;border:0;color:var(--grey-mid);font-size:.82rem;text-decoration:underline;cursor:pointer}

  @keyframes diagIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

  @media(max-width:560px){.diag-modal{max-height:92vh}.diag-body{padding:16px 18px 20px}}

  header.nav{transition:box-shadow .22s ease}

  header.nav.scrolled{box-shadow:0 8px 28px rgba(0,0,0,.32)}

  nav.links a.nav-tool{color:var(--orange)}

  nav.links a.nav-tool:hover{color:var(--orange-dark)}

  @media(max-width:900px){ nav.links.open{animation:navDrop .22s ease} nav.links a.nav-tool{color:var(--orange)} }

  @keyframes navDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}



/* ===== Intégration Odoo (NIVEK) ===== */

/* Masquer l'en-tête/pied Odoo par défaut UNIQUEMENT sur les pages NIVEK

   (celles qui contiennent notre <header class="nav">) — via :has(),

   pour ne pas affecter eLearning, boutique, portail, etc. */

#wrapwrap:has(#wrap > header.nav) > header#top,

#wrapwrap:has(#wrap > header.nav) > footer#bottom{display:none !important}

/* Corriger la collision avec la classe Bootstrap .mark (surlignage jaune) */

.logo .mark{background:transparent !important;padding:0 !important}



/* ===== Correctifs QC (TA-04325) ===== */

/* BUG MAJEUR : les calques décoratifs (dégradé/grille) captaient les clics et

   bloquaient TOUS les boutons du héros. Les rendre transparents aux clics. */

.hero:before,.hero:after,.feedmatik:before,.promise:after,.cta:before,.page-hero:before,.page-hero:after{pointer-events:none}

/* Logo image dans l'en-tête (TA-04565 : logo HD, ne pas laisser le flex l'écraser) */

.nav .logo{flex-shrink:0}

.nav .logo .logo-img{height:38px;width:auto;display:block;flex-shrink:0;max-width:none}

/* TA-04620 : compacter l'en-tête pour qu'il tienne dans la largeur du corps (pas de débordement à droite) */

.nav .nav-inner{gap:0}

.nav .logo{margin-right:20px}

.nav nav.links{gap:16px}

.nav nav.links a{font-size:.77rem}

.nav .nav-sep{margin:0 2px}

.nav .nav-inner > .btn-primary{margin-left:10px;padding:10px 15px !important;font-size:.8rem}

/* TA-04593 : images éditables facilement dans Odoo (pas de ratio forcé) */

.ph-install,.fm-ph{overflow:visible;aspect-ratio:auto;height:auto;background:transparent;display:block}

.ph-install img,.fm-ph img{width:100%;height:auto;object-fit:initial;display:block;border-radius:8px}

.proj-ph-stg{overflow:hidden;position:relative}

.proj-ph-stg img{width:100%;height:100%;object-fit:cover;display:block}

/* TA-04613 : bandeau défilant sans couture (espacement par margin, pas par gap) */

.stg .ticker .track{gap:0}

.stg .ticker .item{margin-right:60px}

/* TA-04607 : case « Sur mesure » pleine largeur + impact visuel (meunerie) */

.step-grid .sur-mesure{grid-column:1 / -1;background:rgba(255,125,1,.07);border:1px solid rgba(255,125,1,.35)}

.step-grid .sur-mesure h4{color:var(--orange)}

/* TA-04605 : domaines non disponibles (hors meunerie) — non cliquables */

.sector.soon,.dcard.soon{opacity:.72}

.sector.soon:hover,.dcard.soon:hover{box-shadow:none;transform:none;cursor:default}

.badge-soon{display:inline-block;margin-top:8px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--grey-mid);background:var(--grey-section);border:1px solid var(--grey-border);border-radius:20px;padding:4px 12px}

/* Autodiagnostic : passer au-dessus de tout (barre d'édition Odoo incluse) */

.diag-overlay{z-index:2147483000 !important}

/* Logo image dans le pied (TA-04589) */

.foot-brand .logo-img{height:40px;width:auto;display:block;margin-bottom:14px}

.foot-brand .mark{background:transparent !important;padding:0 !important}

/* TA-04563 : espace entre le logo et la navigation */

.nav .logo{margin-right:34px}

/* TA-04561 : padding vertical sur la PISTE (le clip horizontal ne touche pas le vertical) */

.stg .ticker{overflow:hidden}

.stg .ticker .track{align-items:center;padding:14px 0}

.stg .ticker .item{font-size:22px;line-height:28px;color:#8f8f8f}

/* TA-04575 : uniformiser la couleur du bandeau avec les sections grises */

.stg .ticker-wrap{padding:30px 0 14px;background:var(--grey-section);border-bottom-color:var(--grey-border)}

/* TA-04567 : le compteur ne doit pas chevaucher le bouton de fermeture */

.diag-head{padding-right:48px}

/* TA-04569 : agrandir la modale d'autodiagnostic */

.diag-modal{max-width:720px}

/* TA-04577 : espace entre « Espace client » et le bouton « Réserver un appel » */

.nav .nav-inner > .btn-primary{margin-left:26px}

/* TA-04583 : colonnes de support à hauteurs uniformes (case étirée, contenu centré) */

.support-grid{align-items:stretch}

.support-grid > .ticket-card{display:flex;flex-direction:column;justify-content:center}

/* TA-04591 : pages domaine au thème blanc comme le reste du site */

.dom-pg{background:#fff}

/* TA-04496 : espace entre la grille de projets et la bande d'appel à l'action (domaines) */

.dom-cta{margin-top:56px}

/* AUDIT-1 : en-tête compact en mobile (corrige le défilement horizontal global) */

@media(max-width:560px){

  .nav .nav-inner{height:58px}

  .nav .logo{margin-right:8px}

  .nav .logo .logo-img{height:24px}

  .nav .lang-switch{margin-left:6px;font-size:.72rem;gap:3px}

  .nav .nav-inner > .btn-primary{margin-left:8px;padding:8px 10px !important;font-size:.68rem;white-space:nowrap}

}

/* AUDIT-7 : les titres principaux convertis en H1 gardent le visuel des H2 */

h1.h2s{font-size:clamp(1.8rem,3.4vw,2.7rem);font-weight:700}

/* FIX ÉDITEUR : le panneau d'options d'Odoo 19 plante sur les valeurs mot-clé

   (« cover » lu comme nombre e + unité r). On sort background-size/position/blend

   du style en ligne du héros ; seule l'image reste en ligne (éditable). */

.hero{background-size:cover;background-position:center;background-blend-mode:multiply}

/* TA-04529 : validation des formulaires */

.nvk-invalid{border-color:#e53935 !important;background:#fff6f6 !important}

.nvk-form-error{color:#e53935;font-size:.85rem;font-weight:600;margin:10px 0 4px}

/* TA-04656 : sélecteur de langue FR|EN dans l'en-tête */

.nav .lang-switch{display:flex;align-items:center;gap:6px;margin-left:16px;flex-shrink:0;font-size:.8rem;font-weight:700;letter-spacing:.03em}

.nav .lang-switch a{color:#bfbfbf;text-decoration:none;padding:2px 5px;border-radius:4px;line-height:1}

.nav .lang-switch a:hover{color:#fff}

.nav .lang-switch a.on{color:#fff;background:var(--orange)}

.nav .lang-switch .sep{color:#666}


/* TA-04715 : rythme vertical entre les projets et la bande de statistiques */
.stg .stats{margin-top:24px}
.stg .stat{padding:26px 24px}

/* TA-04717 : bandeau de confiance — visuel charbon assorti a la marque */
.stg .ticker-wrap{padding:22px 0 18px;background:var(--charcoal-deep);border-top:1px solid var(--charcoal-line);border-bottom:1px solid var(--charcoal-line)}
.stg .ticker-lbl{color:var(--orange);font-weight:700;letter-spacing:.26em;font-size:.72rem;margin-bottom:12px}
.stg .ticker{-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.stg .ticker .track{padding:8px 0}
.stg .ticker .item{display:flex;align-items:center;font-family:var(--display);font-weight:600;font-size:21px;line-height:30px;color:#fff;opacity:.85;text-transform:uppercase;letter-spacing:.05em;margin-right:0}
.stg .ticker .item:after{content:"";width:7px;height:7px;background:var(--orange);transform:rotate(45deg);margin:0 28px;flex:none}

/* Loi 25 : polices auto-hébergées (aucun transfert vers Google Fonts) */
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:400;font-display:swap;src:url('/web/content/31821?unique=6437503e6b7206f481d65305a11d3fde87c901f5') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('/web/content/31822?unique=0a7db4011ad8495d15f98572df81b76120c267ee') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url('/web/content/31823?unique=05ba48a1a6621b8a5f0c9735aaffd0e9577797e5') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/web/content/31824?unique=f11d729bb0a4d8350d2ea3d0fc062cf6ef2d5298') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/web/content/31825?unique=f11d729bb0a4d8350d2ea3d0fc062cf6ef2d5298') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/web/content/31826?unique=f11d729bb0a4d8350d2ea3d0fc062cf6ef2d5298') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* Loi 25 : liens légaux + avis de collecte */
.foot-legal{padding-top:14px;font-size:13px}.foot-legal a{color:#cfcfcf;text-decoration:none}.foot-legal a:hover{color:#fff;text-decoration:underline}.foot-legal .sep{color:#cfcfcf;opacity:.5}.nvk-form-notice{margin-top:12px;font-size:12px;line-height:1.5;color:var(--grey-mid,#5D5D5D)}.nvk-form-notice a{color:var(--orange);font-weight:600;text-decoration:none}.nvk-form-notice a:hover{text-decoration:underline}

/* TA-04747 : en-tete espace client */
#wrapwrap.o_portal header#top,#wrapwrap.o_portal .o_header_affix{display:none!important}.nvk-pnav{position:sticky;top:0;z-index:1030;background:var(--charcoal,#2F2F2F);border-bottom:1px solid var(--charcoal-line,#3c3c3c)}.nvk-pnav-inner{display:flex;align-items:center;gap:22px;min-height:64px}.nvk-pnav-logo .logo-img{height:26px;display:block}.nvk-pnav-groups{display:flex;align-items:center;gap:2px;margin-right:auto}.nvk-pnav-toggle{display:inline-flex;align-items:center;gap:5px;color:#fff;font-family:var(--display,inherit);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.02em;padding:10px 12px;text-decoration:none;white-space:nowrap}.nvk-pnav-toggle:hover,.nvk-pnav-toggle:focus{color:var(--orange,#FF7D01)}.nvk-pnav .nvk-caret{font-size:10px;opacity:.7}.nvk-pnav .dropdown-menu{border:none;border-radius:8px;box-shadow:0 10px 34px rgba(0,0,0,.18);padding:6px;margin-top:4px;min-width:230px}.nvk-pnav .dropdown-item{border-radius:6px;font-size:14px;padding:8px 12px;color:var(--charcoal,#2F2F2F)}.nvk-pnav .dropdown-item:hover{background:var(--grey-section,#f4f4f4);color:var(--orange,#FF7D01)}.nvk-pnav-tools{display:flex;align-items:center;gap:14px}.nvk-pnav-icon{color:#cfcfcf;font-size:16px;text-decoration:none;line-height:1}.nvk-pnav-icon:hover{color:#fff}.nvk-pnav-quit{color:#cfcfcf;font-size:13px;text-decoration:none;white-space:nowrap}.nvk-pnav-quit:hover{color:#fff;text-decoration:underline}.nvk-pnav-lang{display:flex;align-items:center;gap:6px}.nvk-pnav-lang a{color:#cfcfcf;text-decoration:none;font-size:13px}.nvk-pnav-lang a.on{color:#fff;font-weight:700}.nvk-pnav-lang .sep{color:#666}.nvk-pnav-user{margin:0;padding:0}.nvk-pnav-user .nav-link{color:#fff!important;font-size:14px;padding:6px 8px}.nvk-pnav-cta{padding:9px 18px;white-space:nowrap}@media(max-width:991px){.nvk-pnav-groups{display:none}}

/* TA-04771 : visuels de domaine */
.dom-visual{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:10px;margin-bottom:16px;background:var(--charcoal,#2F2F2F)}.sector .dom-visual{margin-bottom:14px}.dom-hero-visual{display:block;width:100%;max-width:460px;height:auto;border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.18)}

/* TA-04785 : temoignages clients (encadre + carrousel) */
.nvk-testi{position:relative;margin:52px 0;padding:32px 32px 24px;background:var(--charcoal,#2F2F2F);border-radius:12px;color:#fff;overflow:hidden}
.nvk-testi:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--orange,#FF7D01);pointer-events:none}
.nvk-testi .nvk-testi-lbl{color:var(--orange,#FF7D01);margin-bottom:12px}
.nvk-testi-stage{position:relative;transition:opacity .4s ease-in-out;opacity:1}
.nvk-testi-item{margin:0;padding:0;display:none}
.nvk-testi-item:first-child{display:block}
.nvk-testi.is-live .nvk-testi-item{display:none}
.nvk-testi.is-live .nvk-testi-item.on{display:block}
.nvk-testi-quote{margin:0 0 16px;padding:0;border:0;font-family:var(--display,inherit);font-weight:500;font-size:26px;line-height:1.32;color:#fff;white-space:pre-line}
.nvk-testi-quote:before{content:"\201C"}
.nvk-testi-quote:after{content:"\201D"}
.nvk-testi-by{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;font-size:14px;color:#cfcfcf}
.nvk-testi-name{font-weight:700;color:#fff}
.nvk-testi-org:before{content:"\2022";color:var(--orange,#FF7D01);margin-right:10px;pointer-events:none}
.nvk-testi-nav{display:none;align-items:center;gap:8px;margin-top:20px}
.nvk-testi.is-live .nvk-testi-nav{display:flex}
.nvk-testi-dots{display:flex;gap:8px;margin-right:auto}
.nvk-testi-dot{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:#5c5c5c;cursor:pointer}
.nvk-testi-dot.on{background:var(--orange,#FF7D01)}
.nvk-testi-dot:focus-visible{outline:2px solid var(--orange,#FF7D01);outline-offset:2px}
.nvk-testi-arrow{width:32px;height:32px;padding:0;border:1px solid var(--charcoal-line,#3c3c3c);border-radius:50%;background:transparent;color:#cfcfcf;font-size:20px;line-height:1;cursor:pointer}
.nvk-testi-arrow:hover{border-color:var(--orange,#FF7D01);color:var(--orange,#FF7D01)}
@media(max-width:600px){.nvk-testi{padding:24px 20px 20px}.nvk-testi-quote{font-size:21px}}

/* TA-04785 : temoignage rattache a une realisation (carte projet) */
.proj-testi{margin-top:14px;padding-top:12px;border-top:1px solid #e6e2dc}
.proj-testi-q{display:block;font-style:italic;font-size:14px;line-height:1.55;color:#4a4540}
.proj-testi-q:before{content:"\201C"}
.proj-testi-q:after{content:"\201D"}
.proj-testi-by{display:block;margin-top:6px;font-size:12.5px;font-weight:600;color:var(--grey-mid,#5D5D5D)}

/* TA-04779 : bandeau de bascule des domaines */
.dom-bar{background:var(--charcoal,#2F2F2F);padding:24px 0 20px;border-bottom:1px solid var(--charcoal-line,#3c3c3c)}
.dom-bar .dom-bar-lbl{display:block;color:var(--orange,#FF7D01);margin-bottom:14px}
.dom-bar-tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.dom-tile{display:block;text-decoration:none;border-radius:10px;overflow:hidden;background:var(--charcoal-deep,#242424);border:1px solid var(--charcoal-line,#3c3c3c);box-shadow:inset 0 3px 0 transparent;transition:border-color .18s,box-shadow .18s,transform .18s}
.dom-tile:hover{border-color:var(--orange,#FF7D01);transform:translateY(-2px)}
.dom-tile.on{border-color:var(--orange,#FF7D01);box-shadow:inset 0 3px 0 var(--orange,#FF7D01)}
.dom-tile:focus-visible{outline:2px solid var(--orange,#FF7D01);outline-offset:2px}
.dom-tile-img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;opacity:.55;transition:opacity .18s}
.dom-tile:hover .dom-tile-img,.dom-tile.on .dom-tile-img{opacity:1}
.dom-tile-name{display:block;padding:10px 12px;font-family:var(--display,inherit);font-weight:600;font-size:15px;line-height:1.18;color:#b9b9b9;text-transform:uppercase;letter-spacing:.03em}
.dom-tile.on .dom-tile-name{color:#fff}
#dom-panel-host{transition:opacity .2s ease-in-out}
#dom-panel-host.is-loading{opacity:.35}
@media(max-width:980px){.dom-bar-tiles{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.dom-bar-tiles{grid-template-columns:repeat(2,1fr);gap:8px}.dom-tile-name{font-size:13px;padding:8px 10px}}

/* TA-04769 : la carte de projet est un lien -- neutraliser le style de lien */
a.proj{text-decoration:none;color:inherit}
a.proj:hover,a.proj:focus{text-decoration:none;color:inherit}
a.proj:focus-visible{outline:2px solid var(--orange,#FF7D01);outline-offset:3px}

/* TA-04763 : boutons du heros a largeur egale (bords droits alignes) */
.hero-ctas{display:grid;grid-template-columns:repeat(2,max-content);align-items:start;justify-content:start}
.hero-ctas .btn{width:100%;justify-content:center}
@media(max-width:760px){.hero-ctas{grid-template-columns:1fr}}

/* TA-04763 : gouttiere du heros en mobile (.hero-grid annulait celle de .wrap) */
@media(max-width:760px){.hero-grid{padding-left:clamp(20px,5vw,40px);padding-right:clamp(20px,5vw,40px)}}

/* TA-04781 : visuel a cote de la carte « Joindre l'equipe » */
.join-wrap{display:grid;grid-template-columns:minmax(0,540px) minmax(0,540px);gap:24px;align-items:stretch;margin-top:44px}
.join-wrap .join-card{margin-top:0;max-width:none}
.join-visual{border:1px solid var(--grey-border);border-radius:var(--radius);overflow:hidden;background:var(--grey-section,#F4F4F4)}
.join-visual img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.join-wrap{grid-template-columns:1fr}.join-visual{aspect-ratio:4/3}}

/* TA-04841 : aligner la largeur de « Joindre l'equipe » sur la rangee de valeurs */
.join-wrap{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}

/* TA-04841 : la bascule mobile doit rester APRES la regle de largeur */
@media(max-width:900px){.join-wrap{grid-template-columns:minmax(0,1fr)}}

/* TA-04845 : portail client — rendre aux titres la hauteur de ligne de Bootstrap.
   Le theme du site impose 1.04, ce qui fait deborder les jambages de Barlow
   Condensed et colle le titre du fil de discussion au composeur de message. */
#wrapwrap.o_portal h1,#wrapwrap.o_portal h2,#wrapwrap.o_portal h3,
#wrapwrap.o_portal h4,#wrapwrap.o_portal h5{line-height:1.2}
#wrapwrap.o_portal .o_portal_messages_container>h3{margin-bottom:1rem}

/* TA-04783 : boutons reseaux sociaux du pied de page */
.foot-social{display:flex;gap:12px;margin-top:16px}
.foot-social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.28);border-radius:50%;color:#cfcfcf;transition:border-color .18s,color .18s}
.foot-social a:hover{border-color:var(--orange,#FF7D01);color:var(--orange,#FF7D01)}
.foot-social a:focus-visible{outline:2px solid var(--orange,#FF7D01);outline-offset:2px}
.foot-social svg{width:17px;height:17px;fill:currentColor;display:block}

/* TA-04767 : « d'irritants aux gains » — lecture en lignes alignees.
   Les 3 colonnes se repondent une a une : on les fait lire en 5 lignes
   irritant > solution > resultat, sans toucher au balisage. */
@media(min-width:901px){
  .gains-grid{grid-template-columns:1.05fr 1.2fr .95fr;grid-auto-flow:column;grid-template-rows:auto repeat(5,auto);align-items:stretch}
  .gains-col{display:contents}
  .gains-col>*{margin:0;padding:15px clamp(16px,2vw,26px)}
  .gains-col.irritants>*{background:rgba(255,255,255,.04)}
  .gains-col.solutions>*{background:rgba(255,125,1,.1)}
  .gains-col.resultats>*{background:rgba(255,255,255,.06)}
  .gains-col>h4{padding-top:clamp(20px,3vw,30px);margin-bottom:0}
  .gains-col>.gains-row{align-items:center;min-height:74px;border-top:1px solid rgba(255,255,255,.07)}
  .gains-col>.gains-row:last-child{padding-bottom:clamp(20px,3vw,30px)}
  .gains-col.irritants>.gains-row,.gains-col.solutions>.gains-row{position:relative}
  .gains-col.irritants>.gains-row:after,.gains-col.solutions>.gains-row:after{content:"\203A";position:absolute;right:-8px;top:50%;transform:translateY(-50%);font-family:var(--display,inherit);font-size:26px;line-height:1;color:var(--orange,#FF7D01);opacity:.6;pointer-events:none;z-index:2}
}
/* le chiffre est le point d'accroche */
.gains-col.resultats .gains-row b{font-size:1.7rem;letter-spacing:-.01em;margin-bottom:4px}
.gains-col.resultats .gains-row .ico{display:none}
/* irritants assourdis : c'est le contraste qui porte le message */
.gains-col.irritants .gains-row{color:#9c9c9c}
.gains-col.irritants .gains-row .ico{color:var(--orange,#FF7D01);opacity:.5}
.gains-col.solutions .gains-row .ico{color:var(--orange,#FF7D01)}
/* apparition en cascade au defilement */
@media(prefers-reduced-motion:no-preference){
  .gains-grid .gains-row{opacity:0;transform:translateY(10px);transition:opacity .5s ease-out,transform .5s ease-out}
  .gains-grid.is-in .gains-row{opacity:1;transform:none}
  .gains-col>.gains-row:nth-child(2){transition-delay:.04s}
  .gains-col>.gains-row:nth-child(3){transition-delay:.10s}
  .gains-col>.gains-row:nth-child(4){transition-delay:.16s}
  .gains-col>.gains-row:nth-child(5){transition-delay:.22s}
  .gains-col>.gains-row:nth-child(6){transition-delay:.28s}
}

/* TA-04851 : pages Nouvelles (blog) — habillage NIVEK.
   Le module rend ses pages avec l'en-tete et le pied standard d'Odoo : on les
   masque, les notres sont injectes par la vue nivek.blog_layout. */
#wrapwrap.nvk-blog>header#top,#wrapwrap.nvk-blog .o_header_affix{display:none!important}
#wrapwrap.nvk-blog>footer{display:none!important}
#wrapwrap.nvk-blog main{padding-top:0}
#wrapwrap.nvk-blog h1,#wrapwrap.nvk-blog h2,#wrapwrap.nvk-blog h3,
#wrapwrap.nvk-blog h4,#wrapwrap.nvk-blog h5{line-height:1.2}

/* TA-04791 : bloc « faire ou acheter » de l'accueil — detail au survol */
.i40-txt .i40-hint{display:inline-block;margin-top:12px;font-size:12.5px;color:var(--grey-mid,#5D5D5D);border-bottom:1px dotted var(--grey-mid,#5D5D5D);transition:opacity .3s}
.i40:hover .i40-hint,.i40:focus-within .i40-hint{opacity:0}
.i40-more{max-height:0;opacity:0;overflow:hidden;margin-top:0;transition:max-height .45s ease,opacity .35s ease,margin-top .45s ease}
.i40:hover .i40-more,.i40:focus-within .i40-more{max-height:340px;opacity:1;margin-top:16px}
.i40-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.i40-fig{padding:12px 14px;border-radius:8px;background:#fff;border:1px solid var(--grey-border,#e4e4e4)}
.i40-fig b{display:block;font-family:var(--display,inherit);font-weight:700;font-size:1.45rem;line-height:1.1;color:var(--charcoal,#2F2F2F)}
.i40-fig.niv b,.i40-fig.save b{color:var(--orange,#FF7D01)}
.i40-fig span{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:var(--grey-mid,#5D5D5D)}
.i40-note{margin-top:10px;font-size:12.5px;line-height:1.5;color:var(--grey-mid,#5D5D5D)}
.i40-txt .btn2{margin-top:18px}
/* sans survol (tactile) : on montre tout d'emblee */
@media(hover:none){.i40-more{max-height:none;opacity:1;margin-top:16px}.i40-hint{display:none}}
@media(max-width:760px){.i40-figs{grid-template-columns:1fr}}

/* TA-04897 : avatar recrutement pose a meme la page, sans cadre ni fond gris */
.join-visual{background:transparent;border:0}

/* Animation par particules (heros de l'accueil) */
.nvk-part{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 48%,#3a3532 0%,#242424 68%)}
.nvk-part-canvas{display:block;width:100%;height:100%}

.hero-visual .nvk-part{aspect-ratio:1/1}
@media(max-width:900px){.hero-visual .nvk-part{aspect-ratio:4/3}}

/* Correctif particules : le canvas ne doit pas dicter la largeur de la grille */
.nvk-part-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-visual{min-width:0}

/* Particules sans cadre : le heros se voit derriere */
.nvk-part{background:none}

/* Quadrillage du heros plus present (etait a .03 et masque en 700x500) */
.hero:after{background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);-webkit-mask-image:radial-gradient(900px 640px at 82% 22%,#000,transparent 72%);mask-image:radial-gradient(900px 640px at 82% 22%,#000,transparent 72%)}

/* TA-04895 : les quatre paliers sur une seule ligne + relance autodiagnostic */
.steps4{grid-template-columns:repeat(4,1fr);max-width:1120px}
.approach-cta{margin-top:44px;text-align:center}
.approach-cta .approach-q{font-family:var(--display);font-weight:600;font-size:1.15rem;color:var(--stg-ink,#2F2F2F);margin-bottom:16px}
@media(max-width:1000px){.steps4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.steps4{grid-template-columns:1fr}}

/* TA-04895 (correctif de priorite) : la regle d'origine est « .stg .steps3 »,
   soit deux classes — il faut la meme portee pour l'emporter. */
.stg .steps4{grid-template-columns:repeat(4,1fr);max-width:1120px}
@media(max-width:1000px){.stg .steps4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.stg .steps4{grid-template-columns:1fr}}

/* TA-04895 : le bouton d'autodiagnostic passe sur fond clair (texte blanc illisible) */
.approach-cta .btn-diag{background:rgba(255,125,1,.10);border:2px solid var(--orange);color:var(--orange)}
.approach-cta .btn-diag:hover{background:var(--orange);color:#fff}

/* TA-04757 : chaine d'integration reprise dans une page de service */
.vflow-inline{background:var(--charcoal-deep);border-radius:12px;padding:34px 28px;margin:38px 0 8px;color:#fff}
.vflow-inline .dom-sec-label{color:var(--orange)}
.vflow-inline .dom-sec-title{color:#fff;margin-bottom:6px}
.vflow-inline .vstep .desc{margin-bottom:0}
.vflow-retour{display:flex;align-items:center;gap:12px;margin-top:26px;padding-top:18px;border-top:1px dashed rgba(255,255,255,.22);color:var(--grey-on-dark);font-size:.9rem}
.vflow-retour-fleche{color:var(--orange);font-size:1.5rem;line-height:1;flex:none}
@media(max-width:900px){.vflow-inline .vflow-steps{grid-template-columns:1fr;gap:18px}}

/* --- calculateur en modale (TA-05017) --- */
.calc-modal{max-width:1000px}
.calc-modal-body{padding:18px;overflow-y:auto;flex:1 1 auto}
.calc-modal-body .calc{border-radius:12px}
@media(max-width:640px){.calc-modal-body{padding:12px}}

/* --- pertes invisibles sur les pages de services (TA-04765) --- */
.ci{background:var(--charcoal);border-radius:12px;padding:clamp(30px,4vw,52px);
    margin:56px 0;color:#fff;text-align:center}
.ci-h{font-family:var(--display);color:#fff;margin:0;line-height:1.15;
      font-size:clamp(1.5rem,2.6vw,2.15rem)}
.ci-sub{font-family:var(--display);font-weight:700;color:var(--orange);
        margin:8px 0 0;font-size:clamp(1.05rem,1.8vw,1.45rem)}
.ci-rule{height:3px;border-radius:2px;margin:26px auto 30px;max-width:920px;
         background:linear-gradient(90deg,var(--orange),var(--orange-dark))}
.ci-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ci-card{background:var(--orange);color:#fff;border-radius:10px;padding:22px 16px;
         display:flex;align-items:center;justify-content:center;text-align:center;
         font-family:var(--display);font-weight:700;font-size:1.05rem;line-height:1.35;
         min-height:132px}
@media(max-width:900px){.ci-grid{grid-template-columns:repeat(2,1fr)}
  .ci-card{min-height:92px}}
@media(max-width:520px){.ci-grid{grid-template-columns:1fr}
  .ci-card{min-height:0;padding:16px}}

/* TA-05100 : l'accroche de « Notre approche » etait centree en texte mais le bloc
   lui-meme restait cale a gauche (.lead a un max-width de 62ch) */
.stg .approach .top .lead{margin-left:auto;margin-right:auto}

/* TA-05101 : bouton « appel de decouverte » centre dans le panneau fonce */
.panel.relational > .btn{display:flex;width:max-content;max-width:100%;
  margin-left:auto;margin-right:auto;justify-content:center}

/* TA-05103 : titre « Developper a l'interne ou confier a un partenaire ? » sorti
   de la colonne de texte, pose en tete de la grille et centre. Il ne reste sur une
   seule ligne que si la largeur le permet ; en dessous il se replie normalement. */
.i40-head{grid-column:1/-1;text-align:center;margin-bottom:10px}
.i40-head .eyebrow2{display:block;margin-bottom:6px}
.i40-head h2{margin:0}
@media(min-width:1040px){.i40-head h2{white-space:nowrap}}

/* TA-05105 : le texte « Notre vision » prend la largeur de la photo au-dessus */
#apropos .sec-head.vision{max-width:none}

/* TA-05106 : formulaire « Demande de renseignements » centre */
#apropos .ticket-card{margin-left:auto;margin-right:auto}

/* TA-05117 : resumes de realisations sur plusieurs lignes, avec puces.
   Le champ est du texte brut : pre-line rend les sauts de ligne saisis dans la
   fiche, sans autoriser de HTML (donc sans risque d'injection depuis le back-office). */
.proj .r{line-height:1.55}
.proj .r p{margin:0 0 10px}
.proj .r p:last-child{margin-bottom:0}
.proj .r b{color:var(--charcoal);font-weight:600}
.proj .r ul{margin:0 0 10px;padding-left:18px;list-style:disc}
.proj .r li{margin:0 0 4px}
.proj .r li::marker{color:var(--orange)}

/* TA-05186 : banniere de confiance, nouvelle version (fonce raffine).
   Le bandeau se fond dans le heros : degrade leger, filet orange discret.
   Les elements sont des liens ; le defilement se met en pause au survol. */
.stg .ticker-wrap{padding:20px 0 14px;background:linear-gradient(180deg,#242424,#1d1d1d);
  border-top:1px solid rgba(255,125,1,.35);border-bottom:1px solid var(--charcoal-line)}
.stg .ticker .item{font-weight:600;font-size:19px;line-height:28px;letter-spacing:.06em;
  color:#fff;opacity:.8;text-decoration:none;transition:color .2s,opacity .2s}
.stg .ticker .item:hover{opacity:1;color:var(--orange)}
.stg .ticker .item.srv{color:var(--orange);opacity:.95;font-weight:700}
.stg .ticker .item.srv:hover{color:#fff}
.stg .ticker:hover .track{animation-play-state:paused}
/* TA-05186 : decision de Kevin — le defilement pour tous, aucune barre */

/* TA-05186b : banniere conforme a l'image de reference — domaines en blanc,
   phrase « 10 ans » en orange DANS la liste, filet orange plein, rien au-dessus. */
.stg .ticker-wrap{padding:0;background:#1d1d1d;border-top:1px solid var(--orange);
  border-bottom:1px solid var(--charcoal-line)}
.stg .ticker .track{padding:19px 0}
.stg .ticker .item{font-family:var(--display);font-weight:600;font-size:16px;
  line-height:22px;letter-spacing:.08em;text-transform:uppercase;color:#fff;opacity:.95;
  text-decoration:none;transition:color .2s}
.stg .ticker a.item:hover{color:var(--orange)}
.stg .ticker .item.lbl{color:var(--orange)}
.stg .ticker .item:after{width:5px;height:5px;margin:0 24px}
/* 6 copies de la serie : la demi-piste couvre les ecrans larges sans trou ;
   la duree suit la distance pour garder la meme vitesse */
.stg .ticker .track{animation-duration:102s}