/* =====================================================================
   IRON GLOBAL — Refonte "coup de punch" (design-system global)
   Chargé APRÈS app.css : surcouche moderne, cohérente sur TOUTES les pages.
   Réutilise les classes existantes (.btn-ms, .card-services, .header-anim…)
   ===================================================================== */

:root{
  --ig-navy:#0c4c8a;        /* primary existant */
  --ig-navy-d:#0a2540;      /* marine profond (hero/footer) */
  --ig-accent:#f88d01;      /* tertiary existant (or/orange) */
  --ig-accent-d:#d97a00;
  --ig-gold:#f3b62b;        /* éclat doré (highlights) */
  --ig-ink:#16243a;
}

html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%}

/* ---- Barre de progression de scroll (moderne) ---------------------- */
.ig-progress{position:fixed;top:0;left:0;height:4px;width:100%;z-index:3000;background:transparent;pointer-events:none}
.ig-progress > span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ig-accent),var(--ig-gold),var(--ig-navy));box-shadow:0 0 12px rgba(248,141,1,.6)}
@supports (animation-timeline: scroll()){
  .ig-progress > span{width:100%;transform:scaleX(0);transform-origin:left;animation:igProg linear both;animation-timeline:scroll(root)}
  @keyframes igProg{to{transform:scaleX(1)}}
}

/* ---- Reveal au scroll (global, sans toucher au HTML des pages) ------ */
.reveal-ready [data-reveal]{opacity:0;transform:translateY(34px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal-ready [data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal-ready [data-reveal]{opacity:1!important;transform:none!important}
  *{animation:none!important}
}

/* ---- Boutons (toutes les pages) ------------------------------------ */
.btn-ms{
  background:var(--ig-navy)!important;color:#fff!important;border:none!important;
  border-radius:12px!important;font-weight:600;letter-spacing:.2px;
  transition:transform .25s,box-shadow .3s,background .25s!important;
  display:inline-flex;align-items:center;gap:.5rem;will-change:transform}
.btn-ms:hover{background:var(--ig-accent)!important;color:#fff!important;
  transform:translateY(-3px);box-shadow:0 14px 30px rgba(248,141,1,.35)}
.btn-secm{border-radius:12px!important;transition:.25s}
.btn-secm:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(248,141,1,.3)}
.btn-gold{background:var(--ig-accent);color:#fff;font-weight:700;border:none;
  padding:.8rem 1.6rem;border-radius:12px;display:inline-flex;align-items:center;gap:.5rem;
  transition:transform .25s,box-shadow .3s,background .25s;will-change:transform}
.btn-gold:hover{background:var(--ig-accent-d);color:#fff;box-shadow:0 14px 30px rgba(248,141,1,.4)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.5);color:#fff;font-weight:600;
  padding:.75rem 1.5rem;border-radius:12px;background:rgba(255,255,255,.05);
  backdrop-filter:blur(4px);display:inline-flex;align-items:center;gap:.5rem;transition:.25s}
.btn-ghost:hover{background:#fff;color:var(--ig-navy);border-color:#fff}

/* ---- Cartes (services, blog, contact) ------------------------------ */
.card-services,.card-blog{border-radius:18px!important;border:1px solid #eef1f6;
  box-shadow:0 10px 34px rgba(12,45,82,.08);
  transition:transform .25s ease,box-shadow .35s ease;overflow:visible}
.card-services{position:relative}
.card-services::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  border-radius:18px;opacity:0;transition:.3s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(248,141,1,.15),transparent 45%)}
.card-services:hover::before{opacity:1}
.card-services:hover,.card-blog:hover{box-shadow:0 26px 56px rgba(12,45,82,.2)}
.contact-shadow,.contact__form .card{border-radius:18px!important;box-shadow:0 10px 30px rgba(12,45,82,.08)!important;transition:.3s}
.contact-shadow:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(12,45,82,.16)!important}
.card-services .rounded-circle.bg-primary,.svc-badge{box-shadow:0 10px 22px rgba(12,76,138,.4)}

/* form inputs un peu plus modernes */
.contact__form .form-control,.form-control{border-radius:12px;transition:.2s}
.contact__form .form-control:focus{border-color:var(--ig-accent);box-shadow:0 0 0 .2rem rgba(248,141,1,.18)}

/* ---- Header / nav : glassmorphism au scroll ------------------------ */
.header-anim.stick-100{
  background:rgba(255,255,255,.72)!important;
  backdrop-filter:blur(14px) saturate(160%);
  box-shadow:0 8px 30px rgba(10,37,64,.12)!important}
.nav-link{position:relative}
.navbar .nav-link::after{content:"";position:absolute;left:.6rem;right:.6rem;bottom:0;
  height:2px;background:var(--ig-accent);transform:scaleX(0);transform-origin:left;transition:.25s}
.navbar .nav-link:hover::after{transform:scaleX(1)}

/* ---- Bandeau de sous-page (bradecrumb) : modernisé ----------------- */
.breadcrumb-container{height:340px!important;
  background:linear-gradient(105deg,rgba(10,37,64,.92),rgba(10,37,64,.55)),url('/assets/images/hand.jpg') center/cover!important}
.breadcrumb-container::after{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:54px 54px;-webkit-mask-image:radial-gradient(circle at 50% 40%,#000,transparent 72%);mask-image:radial-gradient(circle at 50% 40%,#000,transparent 72%)}
.breadcrumb-container h2{font-weight:800;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.5px;position:relative;z-index:2}
.breadcrumb-container .breadcrumb{position:relative;z-index:2}

/* ---- Titres de section : petit liseré doré ------------------------- */
section h2 + .bg-primary,
.w-100 .bg-primary[style*="width: 60px"]{background:linear-gradient(90deg,var(--ig-accent),var(--ig-gold))!important;border-radius:3px}

/* =====================================================================
   HERO nouvelle génération (page d'accueil) — classes namespacées irx-
   ===================================================================== */
.irx-hero{position:relative;min-height:94vh;display:flex;align-items:center;overflow:hidden;background:var(--ig-navy-d)}
.irx-hero__img{position:absolute;inset:-8% 0;z-index:0;background-size:cover;background-position:center;
  transform:translateY(0) scale(1.08);will-change:transform}
.irx-hero__veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(105deg,rgba(8,22,40,.95) 0%,rgba(8,22,40,.78) 42%,rgba(8,22,40,.30) 100%),
  linear-gradient(to top,rgba(8,22,40,.96),transparent 42%)}
.irx-grid{position:absolute;inset:0;z-index:1;
  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:60px 60px;-webkit-mask-image:radial-gradient(circle at 28% 50%,#000,transparent 75%);mask-image:radial-gradient(circle at 28% 50%,#000,transparent 75%)}
.irx-blob{position:absolute;border-radius:50%;filter:blur(70px);mix-blend-mode:screen;z-index:1;pointer-events:none}
.irx-blob.b1{width:480px;height:480px;background:radial-gradient(circle,var(--ig-navy),transparent 65%);top:-120px;right:-80px;opacity:.6;animation:igDrift1 15s ease-in-out infinite}
.irx-blob.b2{width:420px;height:420px;background:radial-gradient(circle,var(--ig-accent),transparent 65%);bottom:-140px;left:-60px;opacity:.32;animation:igDrift2 19s ease-in-out infinite}
@keyframes igDrift1{50%{transform:translate(-40px,60px) scale(1.15)}}
@keyframes igDrift2{50%{transform:translate(50px,-40px) scale(1.1)}}
.irx-hero__inner{position:relative;z-index:3}
.irx-eyebrow{display:inline-flex;align-items:center;gap:.5rem;color:var(--ig-gold);font-weight:600;
  letter-spacing:3px;text-transform:uppercase;font-size:.78rem;padding:.4rem .9rem;
  border:1px solid rgba(243,182,43,.35);border-radius:100px;background:rgba(243,182,43,.06)}
.irx-hero h1{color:#fff;font-weight:800;font-size:clamp(2.2rem,5vw,4rem);line-height:1.07;letter-spacing:-1px}
.grad-text{background:linear-gradient(100deg,var(--ig-accent),var(--ig-gold),#ffe39a,var(--ig-accent));
  background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:igShine 6s linear infinite}
@keyframes igShine{to{background-position:300% 0}}
.irx-hero p.irx-lead{color:#d7e2f0;max-width:580px;font-size:1.1rem;line-height:1.7}
.irx-trust{display:flex;gap:1.4rem;flex-wrap:wrap;color:#cfe0f3;font-size:.9rem}
.irx-trust i{color:var(--ig-accent)}
/* révélation mot par mot au chargement */
.irx-rw{opacity:0;transform:translateY(38px);animation:igWordUp .8s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes igWordUp{to{opacity:1;transform:none}}
.irx-cue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:3;color:#cfe0f3;font-size:.72rem;letter-spacing:2px;text-transform:uppercase;text-align:center}
.irx-mouse{width:24px;height:40px;border:2px solid rgba(255,255,255,.5);border-radius:14px;margin:0 auto 8px;position:relative}
.irx-mouse::after{content:"";position:absolute;top:7px;left:50%;width:4px;height:8px;background:var(--ig-accent);border-radius:4px;transform:translateX(-50%);animation:igWheel 1.6s infinite}
@keyframes igWheel{0%{opacity:0;top:7px}30%,70%{opacity:1}100%{opacity:0;top:20px}}

/* bande de services qui chevauche le bas du hero */
.irx-strip{position:relative;z-index:5;margin-top:-70px}

/* ---- Bande chiffres-clés ------------------------------------------- */
.irx-stats{background:linear-gradient(135deg,var(--ig-navy-d),#0c3257);color:#fff;overflow:hidden;position:relative}
.irx-stats .num{font-weight:800;font-size:2.6rem;color:var(--ig-gold);line-height:1}
.irx-stats p{color:#bcd0e8;margin:.4rem 0 0;font-size:.95rem}

/* ---- Marquee partenaires ------------------------------------------- */
.irx-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.irx-marquee__track{display:flex;gap:3.5rem;width:max-content;animation:igScrollX 26s linear infinite}
.irx-marquee:hover .irx-marquee__track{animation-play-state:paused}
.irx-marquee__track span{font-weight:700;font-size:1.25rem;color:#9aa9bd;white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem}
@keyframes igScrollX{to{transform:translateX(-50%)}}

/* ---- Footer modernisé ---------------------------------------------- */
#footer{background:#081320!important}
#footer .one,#footer h5{position:relative;padding-bottom:.6rem}
#footer .one::after,#footer h5::after{content:"";position:absolute;left:0;bottom:0;width:42px;height:3px;background:var(--ig-accent);border-radius:2px}
#footer a.text-white{transition:.2s}
#footer a.text-white:hover{color:var(--ig-accent)!important;padding-left:4px}
#footer ul li a{display:inline-block}
#footer .list-unstyled.d-flex li a{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.07);display:inline-flex!important;align-items:center;justify-content:center;transition:.25s}
#footer .list-unstyled.d-flex li a:hover{background:var(--ig-accent);transform:translateY(-3px)}
#footer .list-unstyled.d-flex li a i{margin:0!important}

/* ---- Bouton retour-haut ------------------------------------------- */
.cd-top{transition:.25s}
.cd-top:hover{transform:translateY(-4px)}

/* ---- Barre de contact (top bar) ------------------------------------ */
.ig-topbar{background:var(--ig-navy-d);color:#cfe0f3;font-size:.85rem;padding:.45rem 0}
.ig-topbar a{color:#cfe0f3;text-decoration:none;transition:.2s}
.ig-topbar a:hover{color:var(--ig-accent)}
.ig-topbar-info i,.ig-hours i{color:var(--ig-accent);margin-right:.25rem}
.ig-topbar-soc a{display:inline-flex;width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.08);align-items:center;justify-content:center;color:#fff}
.ig-topbar-soc a:hover{background:var(--ig-accent);color:#fff;transform:translateY(-2px)}
@media (max-width:575px){
  .ig-topbar{font-size:.76rem}
  .ig-topbar .container{justify-content:center;row-gap:.35rem}
  .ig-topbar-info{justify-content:center;width:100%}
}

/* ---- Menu : espacement & alignement -------------------------------- */
.header-anim .navbar-nav{align-items:center}
.header-anim .navbar-nav .nav-link{padding:.5rem .95rem!important;display:flex;align-items:center;font-weight:600}
.dropdown-service .dropdown-toggle::after{display:none}   /* évite la double flèche */
.dropdown-service .dropdown-toggle .bi-chevron-down{transition:transform .25s}
.dropdown-service:hover .dropdown-toggle .bi-chevron-down{transform:rotate(180deg)}

/* ---- Bouton "retour en haut" : à gauche (n'écrase plus le chat) ----- */
.cd-top{left:24px!important;right:auto!important;z-index:990}

/* ---- Petites finitions --------------------------------------------- */
.bg-tertiary{background:var(--ig-accent)!important}
a{transition:color .2s}
