@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700;800&family=Inter:wght@400;500;600&display=swap');

:root {
  --accent:    #0ea5e9;
  --accent2:   #0284c7;
  --dark:      #050d1a;
  --dark2:     #0c1a2e;
  --mid:       #1e3a5f;
  --gray:      #64748b;
  --light:     #f0f6ff;
  --white:     #ffffff;
  --border:    rgba(255,255,255,0.08);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--white);color:#0f172a;line-height:1.6;overflow-x:hidden;}
h1,h2,h3,h4{font-family:'Sora',sans-serif;}
img{max-width:100%;}

/* CONTAINER */
.wrap{max-width:1180px;margin:0 auto;padding:0 2rem;}

/* ──────────────────────────────
   NAVBAR
────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:999;
  padding:0 2rem;
  transition:all .3s;
}
.nav.scrolled{
  background:rgba(5,13,26,.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
  box-shadow:0 4px 30px rgba(0,0,0,.4);
}
.nav-inner{
  max-width:1180px;margin:0 auto;
  height:72px;display:flex;align-items:center;gap:1.5rem;
}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;}
.logo img{height:52px;object-fit:contain;}
.logo-name{font-family:'Sora',sans-serif;font-weight:800;font-size:1.15rem;color:var(--white);letter-spacing:-.01em;}
.logo-name em{color:var(--accent);font-style:normal;}

.nav-links{list-style:none;display:flex;gap:.15rem;margin-left:auto;}
.nav-links a{
  display:block;text-decoration:none;color:rgba(255,255,255,.65);
  font-size:.84rem;font-weight:500;padding:.45rem .85rem;border-radius:.5rem;
  transition:all .2s;
}
.nav-links a:hover{color:var(--white);background:rgba(255,255,255,.08);}
.nav-cta{
  display:inline-flex;align-items:center;gap:.4rem;margin-left:.5rem;
  background:var(--accent);color:var(--white)!important;
  padding:.5rem 1.2rem!important;border-radius:.6rem!important;
  font-weight:700!important;font-size:.84rem!important;
  transition:all .2s!important;
}
.nav-cta:hover{background:var(--accent2)!important;transform:translateY(-1px);box-shadow:0 4px 18px rgba(14,165,233,.4)!important;}
.burger{display:none;background:none;border:none;color:white;font-size:1.5rem;cursor:pointer;margin-left:auto;}

/* ──────────────────────────────
   HERO
────────────────────────────── */
.hero{
  position:relative;min-height:100vh;
  display:flex;align-items:center;overflow:hidden;
}
.hero-video{position:absolute;inset:0;z-index:0;}
.hero-video video{width:100%;height:100%;object-fit:cover;}
.hero-grad{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(120deg,rgba(5,13,26,.88) 45%,rgba(14,165,233,.18) 100%);
}
.hero-body{
  position:relative;z-index:2;
  padding-top:72px;color:var(--white);max-width:820px;
}
.hero-pill{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(14,165,233,.15);border:1px solid rgba(14,165,233,.35);
  color:#7dd3fc;padding:.35rem 1rem;border-radius:9999px;
  font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:1.8rem;
}
.hero-h1{
  font-size:clamp(2rem,4vw,3.4rem);
  font-weight:800;line-height:1.12;margin-bottom:1.3rem;letter-spacing:-.02em;
}
.hero-h1 .hl{
  background:linear-gradient(90deg,#7dd3fc,#38bdf8);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-p{
  font-size:1.1rem;color:rgba(255,255,255,.65);
  line-height:1.8;margin-bottom:2.8rem;max-width:600px;
}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:4rem;}
.btn-solid{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--accent);color:var(--white);text-decoration:none;
  padding:.9rem 2.2rem;border-radius:.7rem;font-weight:700;font-size:.95rem;
  transition:all .25s;border:2px solid transparent;
}
.btn-solid:hover{background:var(--accent2);transform:translateY(-2px);box-shadow:0 10px 30px rgba(14,165,233,.45);}
.btn-outline{
  display:inline-flex;align-items:center;gap:.5rem;
  background:transparent;color:var(--white);text-decoration:none;
  padding:.9rem 2.2rem;border-radius:.7rem;font-weight:600;font-size:.95rem;
  border:2px solid rgba(255,255,255,.3);transition:all .25s;
}
.btn-outline:hover{border-color:var(--white);background:rgba(255,255,255,.08);}
.hero-trust{display:flex;gap:2.5rem;flex-wrap:wrap;}
.trust-item{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:rgba(255,255,255,.5);}
.trust-dot{width:7px;height:7px;border-radius:50%;background:#34d399;flex-shrink:0;}

/* ──────────────────────────────
   SECTIONS
────────────────────────────── */
.sec{padding:6rem 0;}
.sec-light{background:var(--light);}
.sec-dark{background:var(--dark);color:var(--white);}
.sec-mid{background:var(--dark2);color:var(--white);}

.label{
  display:inline-block;font-size:.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.18em;color:var(--accent);
  margin-bottom:.75rem;
}
.sec-dark .label,.sec-mid .label{color:#7dd3fc;}
.sec-title{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;line-height:1.2;margin-bottom:.8rem;letter-spacing:-.02em;}
.sec-dark .sec-title,.sec-mid .sec-title{color:var(--white);}
.sec-sub{font-size:.97rem;color:var(--gray);max-width:560px;}
.sec-dark .sec-sub,.sec-mid .sec-sub{color:rgba(255,255,255,.5);}
.center{text-align:center;}
.center .sec-sub{margin:0 auto;}

/* ──────────────────────────────
   ÉTAPES
────────────────────────────── */
.steps{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:2rem;margin-top:3.5rem;position:relative;
}
.steps::after{
  content:'';position:absolute;top:52px;
  left:calc(16.66% + 1.2rem);right:calc(16.66% + 1.2rem);
  height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);
}
.step{
  background:var(--white);border:1px solid rgba(0,0,0,.07);
  border-radius:1.2rem;padding:2.2rem 1.8rem;text-align:center;
  position:relative;z-index:1;transition:all .3s;
}
.step:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(14,165,233,.12);border-color:var(--accent);}
.step-n{
  width:56px;height:56px;background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:'Sora',sans-serif;font-size:1.3rem;font-weight:800;margin:0 auto 1.2rem;
  box-shadow:0 6px 20px rgba(14,165,233,.4);
}
.step-ico{font-size:2rem;margin-bottom:.75rem;}
.step-img{height:120px;object-fit:contain;margin:-10px auto 1.2rem;display:block;}
.step h3{font-size:.97rem;font-weight:700;margin-bottom:.5rem;}
.step p{font-size:.83rem;color:var(--gray);line-height:1.65;}

/* ──────────────────────────────
   SERVICES CARDS
────────────────────────────── */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3.5rem;}
.card{
  background:var(--white);border:1px solid rgba(0,0,0,.07);
  border-radius:1.1rem;padding:2rem 1.6rem;
  transition:all .3s;position:relative;overflow:hidden;
}
.card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  transform:scaleX(0);transform-origin:left;transition:transform .3s;
}
.card:hover{transform:translateY(-5px);box-shadow:0 16px 45px rgba(0,0,0,.1);}
.card:hover::before{transform:scaleX(1);}
.card-ico{font-size:2.4rem;margin-bottom:1rem;}
.card-img{height:100px;object-fit:contain;margin-bottom:1.2rem;}
.card h3{font-size:.97rem;font-weight:700;margin-bottom:.5rem;}
.card p{font-size:.83rem;color:var(--gray);line-height:1.65;}

/* ──────────────────────────────
   STATS BANDE
────────────────────────────── */
.stats-band{
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent2) 100%);
  padding:3.5rem 0;
}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center;}
.stat-n{font-family:'Sora',sans-serif;font-size:2.8rem;font-weight:800;color:var(--white);line-height:1;}
.stat-l{font-size:.82rem;color:rgba(255,255,255,.75);margin-top:.4rem;text-transform:uppercase;letter-spacing:.08em;}

/* ──────────────────────────────
   MATÉRIAUX
────────────────────────────── */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3.5rem;}
.mat{
  background:rgba(255,255,255,.04);border:1px solid var(--border);
  border-radius:1rem;padding:1.8rem 1.2rem;text-align:center;transition:all .25s;
}
.mat:hover{background:rgba(14,165,233,.08);border-color:rgba(14,165,233,.3);transform:translateY(-3px);}
.mat-ico{font-size:2.2rem;margin-bottom:.7rem;display:block;}
.mat h4{font-size:.88rem;font-weight:700;color:var(--white);margin-bottom:.3rem;}
.mat p{font-size:.75rem;color:rgba(255,255,255,.4);line-height:1.5;}

/* ──────────────────────────────
   COFRAC
────────────────────────────── */
.cofrac-layout{display:grid;grid-template-columns:380px 1fr;gap:5rem;align-items:center;}
.cofrac-box{
  background:var(--light);border-radius:1.5rem;padding:3rem;
  text-align:center;border:1px solid rgba(14,165,233,.15);
}
.cofrac-box img{width:180px;margin-bottom:1.5rem;}
.cofrac-badge{
  display:inline-block;background:var(--accent);color:white;
  padding:.4rem 1.2rem;border-radius:9999px;font-size:.78rem;font-weight:700;
}
.cofrac-list{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin-top:1.5rem;}
.cofrac-list li{
  display:flex;align-items:flex-start;gap:.75rem;
  font-size:.9rem;color:#334155;
}
.cofrac-list li span.chk{
  width:22px;height:22px;min-width:22px;background:var(--accent);color:white;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:.7rem;font-weight:700;margin-top:1px;
}

/* ──────────────────────────────
   LIMS MOCKUP
────────────────────────────── */
.lims-layout{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
.lims-text h2{font-size:2rem;font-weight:800;color:var(--white);margin-bottom:.9rem;}
.lims-desc{color:rgba(255,255,255,.55);line-height:1.8;margin-bottom:1.5rem;}
.lims-pts{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:2rem;}
.lims-pts li{font-size:.87rem;color:rgba(255,255,255,.7);display:flex;align-items:center;gap:.6rem;}
.lims-pts li::before{content:'›';color:var(--accent);font-size:1.1rem;font-weight:700;}
.btn-glass{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.07);color:var(--white);text-decoration:none;
  padding:.8rem 1.8rem;border-radius:.7rem;font-weight:600;font-size:.9rem;
  border:1px solid rgba(255,255,255,.15);transition:all .25s;
}
.btn-glass:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.3);}

.mockup{
  background:#0c1a2e;border-radius:1.2rem;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.07);
}
.mockup-top{background:#1e3a5f;padding:.6rem 1rem;display:flex;align-items:center;gap:.4rem;}
.d{width:11px;height:11px;border-radius:50%;}
.d.r{background:#ef4444;}.d.y{background:#f59e0b;}.d.g{background:#22c55e;}
.murl{margin-left:.7rem;font-size:.68rem;color:#94a3b8;background:#0c1a2e;padding:.15rem .6rem;border-radius:.25rem;}
.mockup-body{display:flex;}
.mside{background:#050d1a;width:140px;padding:.8rem 0;}
.mi{padding:.45rem .9rem;font-size:.68rem;color:rgba(255,255,255,.35);}
.mi.a{color:#38bdf8;background:rgba(14,165,233,.1);font-weight:600;}
.mmain{flex:1;padding:.9rem;background:#f8fafc;}
.mkpis{display:flex;gap:.5rem;margin-bottom:.7rem;}
.mkpi{flex:1;border-radius:.4rem;padding:.55rem .4rem;text-align:center;}
.mkpi.b{background:#dbeafe;}.mkpi.g{background:#d1fae5;}.mkpi.o{background:#fef3c7;}
.mkpi-n{font-size:.95rem;font-weight:800;color:#0f172a;}
.mkpi-l{font-size:.58rem;color:#64748b;}
.mrow{height:20px;background:white;border-radius:.25rem;margin-bottom:.3rem;border:1px solid #e2e8f0;}

/* ──────────────────────────────
   FAQ
────────────────────────────── */
.faq-wrap{max-width:760px;margin:3rem auto 0;display:flex;flex-direction:column;gap:.75rem;}
.faq-item{border:1px solid rgba(0,0,0,.08);border-radius:.9rem;overflow:hidden;background:white;}
.faq-q{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.1rem 1.5rem;cursor:pointer;font-weight:600;font-size:.9rem;
  color:#0f172a;transition:all .2s;user-select:none;
}
.faq-q:hover,.faq-q.open{color:var(--accent);background:#f0f9ff;}
.faq-arr{font-size:.7rem;transition:transform .3s;color:var(--gray);}
.faq-q.open .faq-arr{transform:rotate(180deg);color:var(--accent);}
.faq-a{
  display:none;padding:0 1.5rem 1.2rem;font-size:.86rem;
  color:var(--gray);line-height:1.75;border-top:1px solid rgba(0,0,0,.05);
}
.faq-a.open{display:block;}

/* ──────────────────────────────
   CONTACT
────────────────────────────── */
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:800px;margin:3rem auto 0;}
.cc{
  background:rgba(255,255,255,.05);border:1px solid var(--border);
  border-radius:1rem;padding:2rem 1.5rem;text-align:center;transition:all .25s;
}
.cc:hover{background:rgba(14,165,233,.1);border-color:rgba(14,165,233,.3);}
.cc-ico{font-size:2rem;margin-bottom:.75rem;}
.cc-lbl{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.3);margin-bottom:.4rem;}
.cc-val{font-size:.95rem;font-weight:600;color:var(--white);}

/* ──────────────────────────────
   FOOTER
────────────────────────────── */
footer{
  background:#030810;border-top:1px solid rgba(255,255,255,.05);
  padding:2.5rem 0;
}
.foot-inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.foot-logo{display:flex;align-items:center;gap:.65rem;font-family:'Sora',sans-serif;font-weight:800;font-size:.95rem;color:white;}
.foot-logo img{height:30px;object-fit:contain;}
.foot-links{display:flex;gap:1.5rem;flex-wrap:wrap;}
.foot-links a{color:rgba(255,255,255,.3);text-decoration:none;font-size:.8rem;transition:color .2s;}
.foot-links a:hover{color:white;}
.foot-copy{font-size:.75rem;color:rgba(255,255,255,.2);}

/* ──────────────────────────────
   RESPONSIVE
────────────────────────────── */
@media(max-width:960px){
  .steps{grid-template-columns:1fr;}.steps::after{display:none;}
  .grid3{grid-template-columns:1fr 1fr;}
  .grid4{grid-template-columns:1fr 1fr;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .cofrac-layout,.lims-layout{grid-template-columns:1fr;gap:3rem;}
  .cofrac-box{max-width:360px;margin:0 auto;}
}
@media(max-width:640px){
  .grid3,.grid4,.contact-cards{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .nav-links{display:none;flex-direction:column;position:fixed;top:72px;left:0;right:0;background:var(--dark);padding:1rem;z-index:998;border-bottom:1px solid var(--border);}
  .nav-links.open{display:flex;}
  .burger{display:block;}
  .nav .nav-cta{display:none;}
  .hero-actions{flex-direction:column;}
  .hero-trust{gap:1.2rem;}
  .foot-inner{flex-direction:column;text-align:center;}
  .foot-links{justify-content:center;}
}