/* ═══════════════════════════════════════════════════
   DiFTeK — style.css v2
   Rouge #E8391D · Bleu marine #1A2B5F · Noir #0D0D0F
   Police : Rajdhani + Space Grotesk (tech premium)
═══════════════════════════════════════════════════ */

:root {
  --red:       #E8391D;
  --red-dk:    #C42E14;
  --red-lt:    #FF5A3D;
  --navy:      #1A2B5F;
  --navy-lt:   #243880;
  --black:     #0D0D0F;
  --card-bg:   #10131A;
  --card-bg2:  #14182200;
  --card-bd:   rgba(232,57,29,0.12);
  --cyan:      #00C8FF;
  --white:     #FFFFFF;
  --grey-1:    #D8E0EE;
  --grey-2:    #7A8BA8;
  --grey-3:    #2E3A50;
  --success:   #00C48C;
  --r-sm:      6px;
  --r-md:      12px;
  --r-lg:      20px;
  --font-head: 'Rajdhani', sans-serif;
  --font-body: 'Space Grotesk', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --tr:        0.25s cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--black);color:var(--white);overflow-x:hidden;line-height:1.6}
body.preloading{overflow:hidden}
a{color:inherit;text-decoration:none;transition:color var(--tr)}
img{max-width:100%;height:auto;display:block}

/* ── GRILLE TECH FOND ── */
body::before{
  content:'';position:fixed;inset:0;
  background-image:
    linear-gradient(rgba(232,57,29,0.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(232,57,29,0.03) 1px,transparent 1px);
  background-size:52px 52px;
  pointer-events:none;z-index:0;
}

/* ══════════ PRELOADER ══════════ */
#preloader{
  position:fixed;inset:0;background:var(--black);
  z-index:9999;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:2rem;
}
.preloader-logo-wrap{display:flex;align-items:center;justify-content:center}
.preloader-logo-wrap img{
  width:240px;height:auto;
  animation:logo-glow 1.5s ease-in-out infinite alternate;
}
.preloader-logo-wrap video{width:240px;height:auto}
/* Fallback texte si pas de logo */
.preloader-brand{
  font-family:var(--font-head);font-size:4rem;font-weight:700;
  letter-spacing:0.06em;text-transform:uppercase;
}
.brand-dif{color:var(--red)}
.brand-te{color:var(--white)}
.brand-k{color:var(--navy)}
@keyframes logo-glow{
  from{filter:drop-shadow(0 0 8px rgba(232,57,29,0.3))}
  to  {filter:drop-shadow(0 0 24px rgba(232,57,29,0.7))}
}
.preloader-bar{
  width:260px;height:2px;
  background:rgba(255,255,255,0.07);
  border-radius:2px;overflow:hidden;
}
.preloader-progress{
  height:100%;width:0%;
  background:linear-gradient(90deg,var(--red),var(--navy));
  border-radius:2px;
}
.preloader-label{
  font-family:var(--font-mono);font-size:0.68rem;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--grey-2);
}

/* ══════════ NAVBAR ══════════ */
.dt-navbar{
  background:rgba(13,13,15,0);
  backdrop-filter:blur(0);
  border-bottom:1px solid transparent;
  transition:all 0.4s;padding:1.2rem 0;
  position:fixed;top:0;left:0;right:0;z-index:100;
}
.dt-navbar.scrolled{
  background:rgba(13,13,15,0.94);
  backdrop-filter:blur(18px);
  border-bottom-color:rgba(232,57,29,0.18);
  padding:0.65rem 0;
}
.dt-brand{
  font-family:var(--font-head);font-size:1.65rem;font-weight:700;
  color:var(--white)!important;display:flex;align-items:center;
  gap:0.5rem;letter-spacing:0.05em;text-transform:uppercase;
}
.dt-brand em{color:var(--red);font-style:normal}
.nav-logo-img{height:34px;width:auto;object-fit:contain;filter:none!important}
.dt-navbar .nav-link{
  color:var(--grey-1)!important;font-size:0.85rem;font-weight:500;
  padding:0.4rem 0.75rem!important;border-radius:var(--r-sm);
  letter-spacing:0.04em;font-family:var(--font-body);
  transition:color var(--tr),background var(--tr);
}
.dt-navbar .nav-link:hover,
.dt-navbar .nav-link.active{color:var(--red)!important;background:rgba(232,57,29,0.07)}
.dt-btn-nav{
  background:var(--red);color:var(--white)!important;
  font-family:var(--font-head);font-weight:600;font-size:0.9rem;
  letter-spacing:0.06em;text-transform:uppercase;
  padding:0.5rem 1.4rem;border-radius:var(--r-sm);
  transition:background var(--tr),transform 0.2s;
}
.dt-btn-nav:hover{background:var(--red-dk);transform:scale(1.04)}
.dt-toggler{border:none;background:none;display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.dt-toggler span{display:block;width:22px;height:2px;background:var(--white);border-radius:2px;transition:all 0.3s}

/* ══════════ UTILITAIRES ══════════ */
.section-eyebrow{
  font-family:var(--font-mono);font-size:0.68rem;font-weight:500;
  letter-spacing:0.22em;text-transform:uppercase;color:var(--red);
  margin-bottom:0.6rem;display:flex;align-items:center;gap:0.5rem;
}
.section-eyebrow::before{content:'';display:inline-block;width:18px;height:1.5px;background:var(--red);border-radius:2px}
.section-title{
  font-family:var(--font-head);
  font-size:clamp(2rem,3.5vw,3.2rem);
  font-weight:700;line-height:1.05;
  margin-bottom:1rem;letter-spacing:0.03em;text-transform:uppercase;
}
.section-title .txt-red {color:var(--red)}
.section-title .txt-cyan{color:var(--cyan)}
.section-desc{color:var(--grey-2);font-size:0.97rem;line-height:1.78;max-width:600px}
.section-desc.mx-auto{margin:0 auto}
.dt-section{padding:6rem 0;position:relative;z-index:1}
.dt-section-alt{background:rgba(16,19,26,0.65)}
.reveal-up   {opacity:0;transform:translateY(38px)}
.reveal-left {opacity:0;transform:translateX(-42px)}
.reveal-right{opacity:0;transform:translateX(42px)}

/* ══════════ BOUTONS ══════════ */
.btn-dt-primary{
  display:inline-flex;align-items:center;gap:0.5rem;
  background:var(--red);color:var(--white);
  font-family:var(--font-head);font-weight:600;font-size:1rem;
  letter-spacing:0.07em;text-transform:uppercase;
  padding:0.85rem 2.2rem;border-radius:var(--r-sm);
  border:none;cursor:pointer;
  transition:background var(--tr),transform 0.2s,box-shadow var(--tr);
}
.btn-dt-primary:hover{
  background:var(--red-dk);color:var(--white);
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(232,57,29,0.4);
}
.btn-dt-secondary{
  display:inline-flex;align-items:center;gap:0.5rem;
  background:transparent;color:var(--white);
  font-family:var(--font-head);font-weight:600;font-size:1rem;
  letter-spacing:0.07em;text-transform:uppercase;
  padding:0.85rem 2.2rem;border-radius:var(--r-sm);
  border:1.5px solid rgba(255,255,255,0.18);cursor:pointer;
  transition:border-color var(--tr),color var(--tr);
}
.btn-dt-secondary:hover{border-color:var(--red);color:var(--red)}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
#hero{
  min-height:100vh;display:flex;align-items:center;
  position:relative;overflow:hidden;padding:7rem 0 4rem;
}
#networkCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0.55}

/* Dégradés d'ambiance */
.hero-grad-red{
  position:absolute;width:700px;height:700px;border-radius:50%;
  background:radial-gradient(circle,rgba(232,57,29,0.09) 0%,transparent 65%);
  top:50%;right:-120px;transform:translateY(-50%);pointer-events:none;
}
.hero-grad-navy{
  position:absolute;width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(26,43,95,0.22) 0%,transparent 65%);
  bottom:0;left:0;pointer-events:none;
}

/* Badge statut */
.hero-status{
  display:inline-flex;align-items:center;gap:0.55rem;
  background:rgba(0,196,140,0.07);
  border:1px solid rgba(0,196,140,0.22);
  color:var(--success);
  font-family:var(--font-mono);font-size:0.68rem;
  letter-spacing:0.12em;text-transform:uppercase;
  padding:0.32rem 0.9rem;border-radius:3px;
  margin-bottom:1.5rem;
}
.hero-status::before{
  content:'';width:6px;height:6px;border-radius:50%;
  background:var(--success);animation:blink 1.8s infinite;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.15}}

.hero-title{
  font-family:var(--font-head);
  font-size:clamp(3rem,6vw,5.5rem);
  font-weight:700;line-height:0.98;
  letter-spacing:0.03em;text-transform:uppercase;
  margin-bottom:1.2rem;
}
.hero-title .accent    {color:var(--red)}
.hero-title .accent-dim{color:var(--grey-2)}

.hero-slogan{
  font-family:var(--font-mono);font-size:0.8rem;
  color:var(--grey-2);letter-spacing:0.1em;
  margin-bottom:1.5rem;
  padding-left:1rem;border-left:2px solid var(--red);
}
.hero-desc{
  font-size:1.02rem;line-height:1.78;
  color:var(--grey-2);max-width:540px;margin-bottom:2.5rem;
}

/* Stats hero */
.hero-stats{
  display:flex;gap:2.5rem;flex-wrap:wrap;
  padding-top:2rem;margin-top:2rem;
  border-top:1px solid rgba(255,255,255,0.06);
}
.stat-val{
  font-family:var(--font-head);font-size:2.4rem;font-weight:700;
  color:var(--red);line-height:1;letter-spacing:0.04em;
}
.stat-lbl{
  font-family:var(--font-mono);font-size:0.65rem;
  color:var(--grey-2);margin-top:0.2rem;letter-spacing:0.1em;text-transform:uppercase;
}

/* Panneau terminal (remplace l'image héro) */
.hero-terminal{
  background:rgba(16,19,26,0.85);
  border:1px solid rgba(232,57,29,0.2);
  border-radius:var(--r-md);
  overflow:hidden;
  backdrop-filter:blur(8px);
  box-shadow:0 20px 60px rgba(0,0,0,0.5),0 0 0 1px rgba(232,57,29,0.08);
}
.terminal-bar{
  background:rgba(232,57,29,0.12);
  border-bottom:1px solid rgba(232,57,29,0.15);
  padding:0.7rem 1rem;
  display:flex;align-items:center;gap:0.5rem;
}
.t-dot{width:10px;height:10px;border-radius:50%}
.t-dot-r{background:#E8391D}
.t-dot-y{background:#F7941D}
.t-dot-g{background:#00C48C}
.terminal-title{
  font-family:var(--font-mono);font-size:0.7rem;
  color:var(--grey-2);letter-spacing:0.1em;margin-left:0.5rem;
}
.terminal-body{padding:1.5rem;font-family:var(--font-mono);font-size:0.78rem;line-height:1.9}
.t-line{display:flex;gap:0.5rem;margin-bottom:0.1rem}
.t-prompt{color:var(--red);flex-shrink:0}
.t-cmd{color:var(--grey-1)}
.t-out{color:var(--success);padding-left:1.2rem}
.t-out.warn{color:#F7941D}
.t-out.info{color:var(--cyan)}
.t-cursor{
  display:inline-block;width:8px;height:14px;
  background:var(--red);vertical-align:middle;
  animation:cursor-blink 1s infinite;margin-left:2px;
}
@keyframes cursor-blink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* Métriques live */
.metrics-strip{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(232,57,29,0.12);
}
.metric{
  padding:0.9rem 1rem;text-align:center;
  border-right:1px solid rgba(232,57,29,0.1);
}
.metric:last-child{border-right:none}
.metric-val{
  font-family:var(--font-head);font-size:1.3rem;font-weight:700;
  color:var(--red);letter-spacing:0.04em;
}
.metric-lbl{
  font-family:var(--font-mono);font-size:0.6rem;
  color:var(--grey-2);letter-spacing:0.1em;text-transform:uppercase;
  margin-top:0.15rem;
}

/* ══════════════════════════════════════════════
   SERVICES
══════════════════════════════════════════════ */
.service-card{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:var(--r-md);padding:1.75rem;
  height:100%;position:relative;overflow:hidden;
  transition:transform var(--tr),border-color var(--tr),box-shadow var(--tr);
}
.service-card::before{
  content:'';position:absolute;top:0;left:0;right:0;
  height:2px;background:linear-gradient(90deg,var(--red),transparent);
  transform:scaleX(0);transform-origin:left;transition:transform 0.4s;
}
.service-card:hover{
  transform:translateY(-6px);
  border-color:rgba(232,57,29,0.3);
  box-shadow:0 20px 48px rgba(0,0,0,0.45);
}
.service-card:hover::before{transform:scaleX(1)}
.service-icon-wrap{
  width:48px;height:48px;border-radius:var(--r-sm);
  background:rgba(232,57,29,0.08);
  border:1px solid rgba(232,57,29,0.18);
  display:flex;align-items:center;justify-content:center;
  font-size:1.25rem;margin-bottom:1.1rem;
  transition:background var(--tr);
}
.service-card:hover .service-icon-wrap{background:rgba(232,57,29,0.18)}
.service-card h3{
  font-family:var(--font-head);font-size:1rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.05em;margin-bottom:0.5rem;
}
.service-card p{font-size:0.85rem;color:var(--grey-2);line-height:1.68}
.service-num{
  position:absolute;top:1rem;right:1rem;
  font-family:var(--font-mono);font-size:0.6rem;color:var(--grey-3);
}

/* ══════════════════════════════════════════════
   CYBERSÉCURITÉ
══════════════════════════════════════════════ */
#cybersecurite{
  background:linear-gradient(180deg,rgba(232,57,29,0.04) 0%,transparent 100%);
  border-top:1px solid rgba(232,57,29,0.12);
  border-bottom:1px solid rgba(232,57,29,0.08);
}
.cyber-card{
  background:var(--card-bg);
  border:1px solid rgba(232,57,29,0.1);
  border-radius:var(--r-md);padding:1.25rem 1.5rem;
  display:flex;gap:1rem;align-items:flex-start;
  transition:border-color var(--tr),transform var(--tr),background var(--tr);
}
.cyber-card:hover{border-color:rgba(232,57,29,0.4);transform:translateX(5px);background:rgba(232,57,29,0.04)}
.cyber-icon{
  width:40px;height:40px;flex-shrink:0;
  border-radius:var(--r-sm);
  background:rgba(232,57,29,0.1);
  border:1px solid rgba(232,57,29,0.2);
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.cyber-card h4{
  font-family:var(--font-head);font-size:0.9rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.05em;margin-bottom:0.25rem;
}
.cyber-card p{font-size:0.83rem;color:var(--grey-2);line-height:1.6;margin:0}

/* Shield visuel */
.cyber-visual{
  position:relative;display:flex;
  align-items:center;justify-content:center;
  padding:2rem;
}
.shield-ring{
  position:absolute;border-radius:50%;
  border:1px solid rgba(232,57,29,0.1);
  animation:ring-pulse 3s linear infinite;
}
.ring-1{width:260px;height:260px;animation-delay:0s}
.ring-2{width:320px;height:320px;animation-delay:1s}
.ring-3{width:380px;height:380px;animation-delay:2s}
@keyframes ring-pulse{
  0%  {opacity:0.6;transform:scale(0.95)}
  100%{opacity:0;  transform:scale(1.12)}
}
.shield-center{
  width:180px;height:180px;
  background:rgba(232,57,29,0.07);
  border:2px solid rgba(232,57,29,0.3);
  border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  position:relative;z-index:1;
  animation:shield-breathe 3s ease-in-out infinite;
}
@keyframes shield-breathe{
  0%,100%{box-shadow:0 0 20px rgba(232,57,29,0.15)}
  50%    {box-shadow:0 0 50px rgba(232,57,29,0.4)}
}
.shield-icon{font-size:2.5rem;margin-bottom:0.3rem}
.shield-label{
  font-family:var(--font-head);font-size:0.75rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.08em;color:var(--red);
}
.shield-status{
  font-family:var(--font-mono);font-size:0.6rem;
  color:var(--success);letter-spacing:0.1em;margin-top:0.15rem;
}

/* ══════════════════════════════════════════════
   EXPERTISES
══════════════════════════════════════════════ */
.expertise-card{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:var(--r-md);padding:2rem 1.5rem;
  text-align:center;position:relative;overflow:hidden;
  transition:transform var(--tr),border-color var(--tr);
}
.expertise-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:2px;background:linear-gradient(90deg,var(--red),var(--navy-lt));
  transform:scaleX(0);transition:transform 0.4s;
}
.expertise-card:hover{transform:translateY(-6px);border-color:rgba(232,57,29,0.3)}
.expertise-card:hover::after{transform:scaleX(1)}
.expertise-pct{
  font-family:var(--font-head);font-size:2.8rem;font-weight:700;
  color:var(--red);line-height:1;margin-bottom:0.4rem;letter-spacing:0.04em;
}
.expertise-card h3{
  font-family:var(--font-head);font-size:0.95rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.07em;margin-bottom:0.4rem;
}
.expertise-card p{font-size:0.82rem;color:var(--grey-2);line-height:1.6}

/* ══════════════════════════════════════════════
   TECHNOLOGIES
══════════════════════════════════════════════ */
.tech-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(115px,1fr));
  gap:0.875rem;
}
.tech-item{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:var(--r-sm);padding:1.1rem 0.5rem;
  text-align:center;
  transition:border-color var(--tr),transform var(--tr),background var(--tr);
  cursor:default;
}
.tech-item:hover{border-color:var(--red);transform:translateY(-3px);background:rgba(232,57,29,0.05)}
.tech-logo-text{
  width:42px;height:42px;border-radius:var(--r-sm);
  background:rgba(232,57,29,0.07);
  border:1px solid rgba(232,57,29,0.14);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:0.58rem;font-weight:600;
  color:var(--red);margin:0 auto 0.55rem;letter-spacing:0.02em;
}
.tech-item span{font-size:0.72rem;color:var(--grey-2);font-weight:500;display:block}

/* ══════════════════════════════════════════════
   CERTIFICATIONS
══════════════════════════════════════════════ */
.cert-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(155px,1fr));
  gap:1.1rem;
}
.cert-card{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:var(--r-md);padding:1.6rem 1.2rem;
  text-align:center;
  transition:border-color var(--tr),transform var(--tr);
}
.cert-card:hover{border-color:var(--cyan);transform:translateY(-4px)}
.cert-card-logo{width:64px;height:64px;object-fit:contain;margin:0 auto 0.75rem;display:block}
.cert-card-icon{
  width:64px;height:64px;border-radius:var(--r-sm);
  background:rgba(0,200,255,0.05);
  border:1px solid rgba(0,200,255,0.14);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:0.62rem;font-weight:700;
  color:var(--cyan);margin:0 auto 0.75rem;
}
.cert-card h4{
  font-family:var(--font-head);font-size:0.92rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.04em;margin-bottom:0.25rem;
}
.cert-card p{font-size:0.76rem;color:var(--grey-2)}

/* ══════════════════════════════════════════════
   PARTENAIRES
══════════════════════════════════════════════ */
.partners-track-wrap{
  overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);
}
.partners-track{
  display:flex;gap:2.5rem;align-items:center;
  width:max-content;
  animation:slide-partners 26s linear infinite;
}
.partners-track:hover{animation-play-state:paused}
@keyframes slide-partners{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.partner-logo{height:64px;width:160px;object-fit:contain;filter:grayscale(20%) brightness(1.15);transition:filter var(--tr),transform var(--tr);flex-shrink:0;padding:4px}
.partner-logo:hover{filter:none;transform:scale(1.08)}
.partner-logo-text{
  height:64px;padding:0 2rem;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-size:0.9rem;font-weight:600;
  color:var(--grey-1);flex-shrink:0;letter-spacing:0.06em;text-transform:uppercase;
  transition:border-color var(--tr),color var(--tr);
}
.partner-logo-text:hover{border-color:var(--red);color:var(--red)}

/* ══════════════════════════════════════════════
   PROCESSUS
══════════════════════════════════════════════ */
.process-line{position:relative;padding-left:2.5rem}
.process-line::before{
  content:'';position:absolute;left:16px;top:0;bottom:0;
  width:1.5px;background:linear-gradient(180deg,var(--red),var(--navy));
}
.process-step{position:relative;padding:0 0 2.5rem 2rem}
.process-step:last-child{padding-bottom:0}
.process-dot{
  position:absolute;left:-2.5rem;top:0.1rem;
  width:32px;height:32px;border-radius:3px;
  background:var(--black);border:1.5px solid var(--red);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:0.68rem;font-weight:700;color:var(--red);
  transition:background var(--tr),color var(--tr);
}
.process-step.active .process-dot,
.process-step:hover  .process-dot{background:var(--red);color:var(--white)}
.process-step h4{
  font-family:var(--font-head);font-size:1rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.05em;margin-bottom:0.35rem;
}
.process-step p{font-size:0.86rem;color:var(--grey-2);line-height:1.65}

/* ══════════════════════════════════════════════
   CHIFFRES CLÉS
══════════════════════════════════════════════ */
.chiffres-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1.25rem;
}
.chiffre-card{
  background:var(--card-bg);
  border:1px solid rgba(232,57,29,0.12);
  border-radius:var(--r-md);padding:2rem 1.5rem;
  text-align:center;position:relative;overflow:hidden;
}
.chiffre-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--red)}
.chiffre-val{
  font-family:var(--font-head);font-size:3rem;font-weight:700;
  color:var(--red);line-height:1;margin-bottom:0.5rem;letter-spacing:0.04em;
}
.chiffre-card h3{
  font-family:var(--font-head);font-size:0.9rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.07em;margin-bottom:0.35rem;
}
.chiffre-card p{font-size:0.8rem;color:var(--grey-2)}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.cta-section{background:rgba(16,19,26,0.5);border-top:1px solid rgba(255,255,255,0.04)}
.cta-inner{
  background:linear-gradient(135deg,rgba(26,43,95,0.35) 0%,rgba(232,57,29,0.07) 100%);
  border:1px solid rgba(232,57,29,0.18);
  border-radius:var(--r-lg);padding:4rem 3rem;text-align:center;
  position:relative;overflow:hidden;
}
.cta-inner::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--red),var(--navy),var(--red));
}
.cta-inner h2{
  font-family:var(--font-head);
  font-size:clamp(1.8rem,3vw,2.8rem);font-weight:700;
  text-transform:uppercase;letter-spacing:0.04em;margin-bottom:1rem;
}
.cta-inner p{color:var(--grey-2);font-size:0.97rem;max-width:520px;margin:0 auto 2rem}

/* ══════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════ */
.dt-footer{background:#080A0E;border-top:1px solid rgba(232,57,29,0.12)}
.footer-top{padding:5rem 0 3rem}
.footer-brand{
  font-family:var(--font-head);font-size:1.8rem;font-weight:700;
  color:var(--white);letter-spacing:0.06em;text-transform:uppercase;
}
.footer-brand em{color:var(--red);font-style:normal}
.footer-desc{font-size:0.86rem;color:var(--grey-2);line-height:1.72}
.footer-socials{display:flex;gap:0.55rem}
.social-icon{
  width:34px;height:34px;border-radius:var(--r-sm);
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.07);
  display:flex;align-items:center;justify-content:center;
  font-size:0.9rem;color:var(--grey-2);
  transition:all var(--tr);
}
.social-icon:hover{background:rgba(232,57,29,0.14);border-color:var(--red);color:var(--red)}
.footer-heading{
  font-family:var(--font-head);font-size:0.82rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.12em;
  color:var(--white);margin-bottom:1.2rem;
}
.footer-list{list-style:none;padding:0;margin:0}
.footer-list li{margin-bottom:0.55rem}
.footer-list a{font-size:0.84rem;color:var(--grey-2);transition:color var(--tr)}
.footer-list a:hover{color:var(--red)}
.footer-contact-list{list-style:none;padding:0;margin:0}
.footer-contact-list li{display:flex;align-items:flex-start;gap:0.7rem;font-size:0.84rem;color:var(--grey-2);margin-bottom:0.85rem}
.footer-contact-list i{color:var(--red);margin-top:2px;flex-shrink:0}
.footer-contact-list a{color:var(--grey-2);transition:color var(--tr)}
.footer-contact-list a:hover{color:var(--red)}
.btn-dt-footer{
  display:inline-flex;align-items:center;gap:0.4rem;
  background:var(--red);color:var(--white);
  font-family:var(--font-head);font-weight:600;font-size:0.82rem;
  letter-spacing:0.06em;text-transform:uppercase;
  padding:0.55rem 1.35rem;border-radius:var(--r-sm);
  transition:background var(--tr),transform 0.2s;
}
.btn-dt-footer:hover{background:var(--red-dk);transform:scale(1.03);color:var(--white)}
.footer-bottom{padding:1.2rem 0;border-top:1px solid rgba(255,255,255,0.04);font-size:0.76rem;color:var(--grey-3)}
.footer-slogan{color:var(--grey-2);font-family:var(--font-mono);font-size:0.68rem;font-style:italic}

/* ══════════════════════════════════════════════
   PAGE CONTACT
══════════════════════════════════════════════ */
.contact-hero{padding:10rem 0 5rem;text-align:center}
.contact-logo-wrap{margin-bottom:2rem}
.contact-logo-wrap img,.contact-logo-wrap video{width:200px;margin:0 auto}
.contact-logo-text{
  font-family:var(--font-head);font-size:2.8rem;font-weight:700;
  color:var(--white);letter-spacing:0.06em;text-transform:uppercase;
}
.contact-logo-text em{color:var(--red);font-style:normal}

.contact-form-wrap{
  background:var(--card-bg);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:var(--r-lg);padding:3rem;
  position:relative;overflow:hidden;
}
.contact-form-wrap::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--red),var(--navy));
}
.dt-label{
  font-family:var(--font-mono);font-size:0.68rem;font-weight:500;
  color:var(--grey-2);letter-spacing:0.12em;text-transform:uppercase;
  margin-bottom:0.4rem;display:block;
}
.dt-input,.dt-textarea,.dt-select{
  width:100%;background:rgba(13,13,15,0.9);
  border:1px solid rgba(255,255,255,0.09);
  border-radius:var(--r-sm);padding:0.78rem 1rem;
  color:var(--white);font-family:var(--font-body);
  font-size:0.93rem;transition:border-color var(--tr),box-shadow var(--tr);outline:none;
}
.dt-input:focus,.dt-textarea:focus,.dt-select:focus{
  border-color:var(--red);box-shadow:0 0 0 3px rgba(232,57,29,0.1);
}
.dt-input.error,.dt-textarea.error,.dt-select.error{border-color:#f87171}
.dt-input::placeholder,.dt-textarea::placeholder{color:var(--grey-3)}
.dt-textarea{resize:vertical;min-height:128px}
.dt-select option{background:var(--black)}
.service-checks{display:grid;grid-template-columns:1fr 1fr;gap:0.45rem}
.dt-check-label{
  display:flex;align-items:center;gap:0.5rem;
  font-size:0.86rem;color:var(--grey-2);cursor:pointer;padding:0.35rem 0;
}
.dt-check-label input[type="checkbox"]{width:14px;height:14px;accent-color:var(--red);cursor:pointer}
.rgpd-label{
  display:flex;align-items:flex-start;gap:0.6rem;
  font-size:0.8rem;color:var(--grey-2);cursor:pointer;line-height:1.55;
}
.rgpd-label input{margin-top:2px;accent-color:var(--red);flex-shrink:0}
.rgpd-label a{color:var(--cyan);text-decoration:underline}
.hp-field{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.field-error{font-size:0.73rem;color:#f87171;margin-top:0.28rem;display:none}
.field-error.visible{display:block}
.btn-submit-main{
  background:linear-gradient(135deg,var(--red),var(--red-dk));
  color:var(--white);font-family:var(--font-head);
  font-weight:600;font-size:0.97rem;letter-spacing:0.06em;text-transform:uppercase;
  padding:0.9rem 2.5rem;border-radius:var(--r-sm);border:none;cursor:pointer;
  transition:transform 0.2s,box-shadow var(--tr);
  box-shadow:0 4px 16px rgba(232,57,29,0.28);
}
.btn-submit-main:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(232,57,29,0.44)}
.btn-submit-main:disabled{opacity:0.6;cursor:not-allowed;transform:none}

/* Succès overlay */
#success-overlay{
  display:none;position:fixed;inset:0;z-index:9999;
  background:rgba(13,13,15,0.97);
  align-items:center;justify-content:center;
  flex-direction:column;gap:1.5rem;text-align:center;
}
#success-overlay.active{display:flex}
#success-overlay .success-logo img{width:160px;margin:0 auto;
  animation:logo-glow 1.5s ease-in-out infinite alternate}
#success-overlay .success-logo-text{
  font-family:var(--font-head);font-size:2.5rem;font-weight:700;
  letter-spacing:0.06em;text-transform:uppercase;margin-bottom:0.5rem;
}
#success-overlay h2{
  font-family:var(--font-head);font-size:2.2rem;font-weight:700;
  color:var(--red);text-transform:uppercase;letter-spacing:0.04em;
}
#success-overlay p{color:var(--grey-2);font-size:0.97rem;max-width:480px}
.btn-back-home{
  display:inline-flex;align-items:center;gap:0.5rem;
  background:var(--red);color:var(--white);
  font-family:var(--font-head);font-weight:600;letter-spacing:0.06em;text-transform:uppercase;
  padding:0.75rem 2rem;border-radius:var(--r-sm);border:none;cursor:pointer;margin-top:1rem;
  transition:background var(--tr);
}
.btn-back-home:hover{background:var(--red-dk);color:var(--white)}

/* ══════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════ */
@media(max-width:991px){
  #hero{text-align:center;padding-top:8rem}
  .hero-desc,.hero-slogan{margin-left:auto;margin-right:auto}
  .hero-slogan{border-left:none;border-top:2px solid var(--red);padding:0.5rem 0 0;display:inline-block}
  .hero-stats{justify-content:center}
  .hero-terminal{margin-top:3rem}
  .service-checks{grid-template-columns:1fr}
  .contact-form-wrap{padding:2rem 1.5rem}
}
@media(max-width:575px){
  .tech-grid{grid-template-columns:repeat(3,1fr)}
  .cert-grid{grid-template-columns:repeat(2,1fr)}
  .chiffres-grid{grid-template-columns:1fr 1fr}
}