/* ── VARIABLES — DA light bleu-blanc, charte 3cs.fr élevée ── */
:root {
  --bg:            #FFFFFF;
  --bg-alt:        #F0F5FF;
  --bg-dark:       #0C1D47;
  --primary:       #1A3D7C;
  --primary-light: #EEF3FF;
  --primary-border:rgba(26,61,124,.13);
  --blue:          #2563EB;
  --orange:        #FF5C28;
  --orange-dim:    rgba(255,92,40,.08);
  --text:          #0F1E3C;
  --text-muted:    #64748B;
  --text-light:    #94A3B8;
  --border:        #E2E8F0;
  --r:             12px;
  --r-sm:          8px;
  --t:             .3s cubic-bezier(.4,0,.2,1);
  --shadow:        0 2px 12px rgba(15,30,64,.07);
  --shadow-md:     0 4px 24px rgba(15,30,64,.10);
  --shadow-lg:     0 8px 40px rgba(15,30,64,.14);
}

/* ── RESET ── */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); font-family: 'DM Sans', sans-serif; line-height: 1.65; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
img { max-width: 100%; display: block; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }

/* ── TYPOGRAPHY ── */
h1,h2,h3 { font-family: 'Bebas Neue', sans-serif; line-height: .95; letter-spacing: .02em; }
.section-label { font-size: .7rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--blue); display: block; margin-bottom: 10px; }
.section-title { font-size: clamp(1.9rem, 4.5vw, 3.2rem); color: var(--text); margin-bottom: 14px; }
.section-sub { color: var(--text-muted); font-size: 1rem; max-width: 560px; line-height: 1.7; }
.section-header { margin-bottom: 48px; }

/* ── LAYOUT ── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
section { padding: 88px 0; }

/* ── BUTTONS ── */
.btn-primary {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, #FF5C28, #FF8542);
  color: #fff; padding: 14px 28px; border-radius: var(--r-sm);
  font-size: .95rem; font-weight: 700; display: inline-block;
  transition: transform var(--t), box-shadow var(--t);
  box-shadow: 0 4px 20px rgba(255,92,40,.30);
}
.btn-primary::before {
  content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  animation: shine 2.8s ease-in-out infinite;
}
@keyframes shine { 0%{left:-100%;} 50%,100%{left:110%;} }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(255,92,40,.42); }
.btn-blue { background: var(--primary); color: #fff; padding: 14px 28px; border-radius: var(--r-sm); font-size: .95rem; font-weight: 700; display: inline-block; transition: transform var(--t), box-shadow var(--t); }
.btn-blue:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(26,61,124,.35); background: var(--blue); }
.btn-ghost { background: transparent; color: var(--primary); padding: 13px 27px; border-radius: var(--r-sm); border: 1px solid var(--primary-border); font-size: .95rem; font-weight: 600; display: inline-block; transition: background var(--t), transform var(--t), border-color var(--t); }
.btn-ghost:hover { background: var(--primary-light); border-color: var(--primary); transform: translateY(-2px); }
.btn-ghost-light { background: rgba(255,255,255,.06); color: #fff; padding: 13px 27px; border-radius: var(--r-sm); border: 1px solid rgba(255,255,255,.25); font-size: .95rem; font-weight: 600; display: inline-block; transition: background var(--t), transform var(--t), border-color var(--t); backdrop-filter: blur(6px); }
.btn-ghost-light:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.5); transform: translateY(-2px); }

/* ── NAVIGATION ── */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(255,255,255,.95); transition: box-shadow var(--t), background var(--t); }
nav.scrolled { background: rgba(255,255,255,.98); box-shadow: 0 1px 0 var(--border), var(--shadow); }
.nav-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; height: 70px; }
.nav-logo img, .nav-logo svg { height: 46px; width: auto; }
.logo-text { font-family: 'Bebas Neue', sans-serif; font-size: 1.9rem; letter-spacing: .1em; color: var(--primary); }
.logo-svg-text { font-family: 'Bebas Neue', sans-serif; }
.footer-logo-wrap svg { height: 40px; width: auto; }
.nav-links { display: flex; gap: 6px; align-items: center; }
.nav-links > li > a { font-size: .875rem; font-weight: 500; color: var(--text); padding: 8px 12px; border-radius: var(--r-sm); transition: color var(--t), background var(--t); white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.nav-links > li > a:hover { color: var(--blue); background: var(--primary-light); }
.nav-links .nav-cta { background: var(--orange) !important; color: #fff !important; font-weight: 700 !important; padding: 9px 18px !important; }
.nav-links .nav-cta:hover { opacity: .88; transform: translateY(-1px); }
.nav-arrow { font-size: .65rem; opacity: .7; }
/* Dropdown — glassmorphism (21dev adapted) */
.has-dropdown { position: relative; }
.dropdown { position:absolute; top:calc(100% + 10px); left:0; min-width:220px; background:rgba(255,255,255,.96); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid rgba(26,61,124,.1); border-radius:14px; box-shadow:0 12px 40px rgba(15,30,64,.16),0 4px 12px rgba(15,30,64,.08); padding:6px; max-height:0; overflow:hidden; opacity:0; visibility:hidden; transform:translateY(-8px) scale(.97); transition:max-height .3s cubic-bezier(.4,0,.2,1),opacity .22s ease,visibility .22s,transform .26s cubic-bezier(.4,0,.2,1); pointer-events:none; }
.has-dropdown.open .dropdown { max-height:320px; opacity:1; visibility:visible; transform:none; pointer-events:auto; }
.dropdown a { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:10px; font-size:.875rem; color:var(--text); font-weight:500; transition:background .16s,color .16s,padding-left .2s; }
.dropdown a::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--blue); flex-shrink:0; opacity:0; transform:scale(0); transition:opacity .16s,transform .16s; }
.dropdown a:hover { background:var(--primary-light); color:var(--blue); padding-left:18px; }
.dropdown a:hover::before { opacity:1; transform:scale(1); }
.nav-arrow { display:inline-block; transition:transform .26s cubic-bezier(.4,0,.2,1); font-size:.6rem; }
.has-dropdown.open .nav-arrow { transform:rotate(180deg); }
/* Hamburger */
.hamburger { display: none; flex-direction: column; gap: 5px; padding: 4px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--text); border-radius: 2px; transition: var(--t); }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }
.nav-mobile { display: none; flex-direction: column; background: white; border-top: 1px solid var(--border); max-height: calc(100vh - 70px); overflow-y: auto; }
.nav-mobile.open { display: flex; }
.nav-mobile a { padding: 13px 24px; font-size: .9rem; color: var(--text-muted); border-bottom: 1px solid var(--border); transition: color var(--t), background var(--t); }
.nav-mobile a:hover { color: var(--blue); background: var(--primary-light); }

/* ── HOMEPAGE HERO V2 — animated mesh gradient (21dev HeroMeshGradient) ── */
.hero-v2 { min-height:100vh; padding-top:70px; position:relative; overflow:hidden; display:flex; align-items:center; background:#060d1e; }
.hero-v2::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px); background-size:64px 64px; pointer-events:none; z-index:1; }
.hero-blob { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; z-index:0; }
.hero-blob-1 { width:700px; height:600px; top:-180px; left:-120px; background:rgba(26,61,124,.58); animation:blob1 9s ease-in-out infinite; }
.hero-blob-2 { width:550px; height:680px; top:80px; right:-80px; background:rgba(37,99,235,.36); animation:blob2 11s ease-in-out infinite; }
.hero-blob-3 { width:420px; height:420px; bottom:-60px; left:38%; background:rgba(255,92,40,.18); animation:blob3 7.5s ease-in-out infinite; }
@keyframes blob1 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(50px,-40px) scale(1.07);} }
@keyframes blob2 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-40px,50px) scale(.93);} }
@keyframes blob3 { 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-50px,-25px) scale(1.09);} }
.hero-v2-inner { position:relative; z-index:2; padding:100px 0 80px; width:100%; }
.hero-v2-title { color:#fff; font-size:clamp(3.8rem,9vw,7.5rem); line-height:.9; margin-bottom:26px; letter-spacing:.04em; }
.hero-v2-title span { background:linear-gradient(135deg,#5BC8F5 0%,#FF7D4D 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-v2-sub { color:rgba(255,255,255,.6); font-size:1.05rem; max-width:540px; line-height:1.78; margin-bottom:38px; }
.hero-v2-ctas { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:72px; }
.hero-v2-stats { display:flex; align-items:center; flex-wrap:wrap; gap:0; }
.hero-stat-num { font-family:'DM Mono',monospace; font-size:1.7rem; font-weight:500; color:#fff; display:block; line-height:1; margin-bottom:5px; }
.hero-stat-label { font-size:.67rem; color:rgba(255,255,255,.38); text-transform:uppercase; letter-spacing:.14em; }
.hero-stat-sep { width:1px; height:40px; background:rgba(255,255,255,.12); margin:0 30px; }
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; }

/* ── IMAGE BIM PLACEHOLDER ── */
.img-bim-ph { width:100%; height:220px; position:relative; overflow:hidden; border-radius:var(--r); background:linear-gradient(135deg,#0C1D47 0%,#1A3D7C 55%,#0e2d5e 100%); display:flex; align-items:center; justify-content:center; }
.img-bim-ph::before { 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:22px 22px; }
.img-bim-ph::after { content:'BIM'; position:absolute; bottom:14px; right:16px; font-family:'Bebas Neue',sans-serif; font-size:1.8rem; color:rgba(255,255,255,.1); letter-spacing:.3em; }
.img-bim-ph-icon { width:48px; height:48px; border:2px solid rgba(255,255,255,.18); border-radius:10px; display:flex; align-items:center; justify-content:center; position:relative; z-index:1; }
.img-bim-ph-icon svg { width:26px; height:26px; fill:rgba(255,255,255,.4); }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  padding: 140px 0 80px;
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--bg-dark) 0%, var(--primary) 100%);
  color: white;
}
.page-hero::before {
  content: ''; position: absolute; inset: 0;
  background: var(--hero-bg-img) center/cover no-repeat;
  opacity: .18; pointer-events: none;
}
.page-hero .breadcrumb { font-size: .78rem; color: rgba(255,255,255,.55); margin-bottom: 16px; }
.page-hero .breadcrumb a { color: rgba(255,255,255,.55); transition: color var(--t); }
.page-hero .breadcrumb a:hover { color: white; }
.page-hero h1 { color: white; font-size: clamp(3rem, 7vw, 6rem); margin-bottom: 18px; }
.page-hero .hero-sub { color: rgba(255,255,255,.75); font-size: 1.05rem; max-width: 560px; line-height: 1.75; }
.page-hero .hero-ctas { display: flex; gap: 14px; margin-top: 32px; flex-wrap: wrap; }

/* ── BADGE URGENCE ── */
.badge-urgence {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--orange-dim); border: 1px solid rgba(255,92,40,.28);
  color: var(--orange); padding: 8px 16px; border-radius: 100px;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 24px;
}
.badge-dot { width: 7px; height: 7px; background: var(--orange); border-radius: 50%; animation: pulse 1.5s ease-in-out infinite; flex-shrink: 0; }
@keyframes pulse { 0%,100%{transform:scale(1);opacity:1;} 50%{transform:scale(1.8);opacity:.4;} }

/* ── ACCORDION ── */
.accordion { border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; }
.acc-item { border-bottom: 1px solid var(--border); }
.acc-item:last-child { border-bottom: none; }
.acc-trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; color: var(--text); font-size: .95rem; font-weight: 600; text-align: left; transition: background var(--t); }
.acc-trigger:hover { background: var(--bg-alt); }
.acc-icon { width: 22px; height: 22px; border: 1px solid var(--primary-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: .85rem; flex-shrink: 0; transition: transform var(--t); font-style: normal; }
.acc-trigger.active .acc-icon { transform: rotate(45deg); background: var(--primary); color: white; border-color: var(--primary); }
.acc-body { max-height: 0; overflow: hidden; transition: max-height .4s ease, padding .3s ease; padding: 0 24px; }
.acc-body.open { max-height: 200px; padding: 0 24px 20px; }
.acc-body p { color: var(--text-muted); font-size: .9rem; line-height: 1.7; }

/* ── CARDS ── */
.card { background: white; border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); transition: transform var(--t), box-shadow var(--t), border-color var(--t); }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--primary-border); }
.card-img { width: 100%; height: 200px; object-fit: cover; display: block; }
.card-img-placeholder { height: 200px; background: linear-gradient(135deg, var(--bg-alt), var(--primary-light)); display: flex; align-items: center; justify-content: center; }
.card-body { padding: 24px; }
.card-label { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); margin-bottom: 6px; }
.card-title { font-weight: 700; font-size: 1.05rem; margin-bottom: 8px; color: var(--text); }
.card-desc { font-size: .85rem; color: var(--text-muted); line-height: 1.6; }
.card-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 14px; }
.card-tag { font-size: .68rem; font-weight: 600; padding: 3px 10px; border-radius: 100px; background: var(--primary-light); border: 1px solid var(--primary-border); color: var(--primary); }

/* ── URGENCY BANNER ── */
.urgency-banner { background: linear-gradient(90deg,var(--orange-dim),rgba(255,92,40,.13),var(--orange-dim)); border-top: 1px solid rgba(255,92,40,.2); border-bottom: 1px solid rgba(255,92,40,.2); padding: 15px 0; }
.urgency-inner { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; text-align: center; }
.urgency-text { font-size: .875rem; font-weight: 500; color: var(--text); }
.urgency-text strong { color: var(--orange); }

/* ── FEATURE LIST ── */
.feature-list { display: flex; flex-direction: column; gap: 10px; }
.feature-item { display: flex; align-items: flex-start; gap: 12px; font-size: .9rem; color: var(--text-muted); line-height: 1.55; }
.feature-check { width: 20px; height: 20px; background: var(--primary-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.feature-check svg { width: 10px; height: 10px; color: var(--primary); }

/* ── FOOTER ── */
footer { background: var(--bg-dark); color: rgba(255,255,255,.8); padding: 64px 0 28px; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-logo-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.footer-logo-wrap img { height: 40px; background: #fff; border-radius: 8px; padding: 6px 12px; }
.footer-logo-text { font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; letter-spacing: .1em; color: white; }
.footer-desc { font-size: .83rem; color: rgba(255,255,255,.5); line-height: 1.7; margin-bottom: 18px; }
.footer-certs { display: flex; flex-wrap: wrap; gap: 7px; }
.footer-cert { font-size: .67rem; font-weight: 700; padding: 4px 10px; border: 1px solid rgba(255,255,255,.15); border-radius: 100px; color: rgba(255,255,255,.6); }
.footer-heading { font-weight: 700; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: white; margin-bottom: 14px; }
.footer-links { display: flex; flex-direction: column; gap: 9px; }
.footer-links a { font-size: .83rem; color: rgba(255,255,255,.5); transition: color var(--t); }
.footer-links a:hover { color: white; }
.footer-info { font-size: .8rem; color: rgba(255,255,255,.5); line-height: 1.9; }
.footer-info a { color: rgba(99,179,237,.85); transition: color var(--t); }
.footer-info a:hover { color: #93C5FD; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.08); font-size: .72rem; color: rgba(255,255,255,.3); }

/* ── SCROLL REVEAL ── */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }

/* ── PROCESS STEPS ── */
.process-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 48px; }
.process-step { background: white; border: 1px solid var(--border); border-radius: var(--r); padding: 28px 22px; box-shadow: var(--shadow); }
.step-num { font-family: 'DM Mono', monospace; font-size: 2rem; font-weight: 500; color: var(--primary-border); line-height: 1; margin-bottom: 12px; }
.step-title { font-weight: 700; font-size: .95rem; color: var(--text); margin-bottom: 7px; }
.step-desc { font-size: .82rem; color: var(--text-muted); line-height: 1.65; }

/* ── SECTOR CARDS ── */
.sectors-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 40px; }
.sector-card { background: white; border: 1px solid var(--border); border-radius: var(--r); padding: 22px; display: flex; align-items: center; gap: 14px; transition: border-color var(--t), box-shadow var(--t), transform var(--t); }
.sector-card:hover { border-color: var(--primary-border); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.sector-icon { width: 40px; height: 40px; background: var(--primary-light); border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sector-icon svg { width: 18px; height: 18px; color: var(--primary); }
.sector-name { font-weight: 700; font-size: .88rem; color: var(--text); margin-bottom: 2px; }
.sector-ex { font-size: .72rem; color: var(--text-muted); line-height: 1.4; }

/* ── TESTIMONIALS ── */
.slider-wrap { border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); margin-top: 48px; }
.slider-track { display: flex; transition: transform .5s cubic-bezier(.4,0,.2,1); }
.slide { min-width: 100%; padding: 44px 48px; background: white; }
.slide-quote { font-size: 1.05rem; line-height: 1.75; font-style: italic; color: var(--text); padding-left: 20px; border-left: 3px solid var(--blue); margin-bottom: 24px; }
.slide-author { display: flex; align-items: center; gap: 14px; }
.slide-avatar { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg,var(--primary-light),var(--primary-border)); border: 2px solid var(--primary-border); display: flex; align-items: center; justify-content: center; font-family: 'DM Mono', monospace; font-size: .72rem; font-weight: 500; color: var(--primary); flex-shrink: 0; }
.slide-name { font-weight: 700; font-size: .9rem; color: var(--text); }
.slide-role { font-size: .78rem; color: var(--text-muted); margin-top: 2px; }
.slider-nav { display: flex; justify-content: center; gap: 8px; padding: 18px; background: var(--bg-alt); border-top: 1px solid var(--border); }
.slider-dot { width: 8px; height: 8px; border-radius: 100px; background: var(--border); cursor: pointer; transition: var(--t); border: none; }
.slider-dot.active { background: var(--blue); width: 24px; }

/* ── COUNTER SECTION ── */
.counters-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; }
.counter-item { background: white; padding: 36px 24px; text-align: center; }
.counter-num { font-family: 'DM Mono', monospace; font-size: clamp(1.9rem,4.5vw,2.6rem); font-weight: 500; color: var(--primary); display: block; margin-bottom: 7px; }
.counter-label { font-size: .74rem; color: var(--text-muted); line-height: 1.45; }

/* ── SERVICE CARDS ── */
.services-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.service-card { background: white; border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); transition: transform var(--t), box-shadow var(--t), border-color var(--t); }
.service-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--primary-border); }
.service-card-img { width: 100%; height: 160px; object-fit: cover; }
.service-card-body { padding: 24px; }
.service-card-name { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: .05em; color: var(--text); margin-bottom: 8px; }
.service-card-desc { color: var(--text-muted); font-size: .875rem; line-height: 1.6; }
.service-card-link { display: inline-flex; align-items: center; gap: 6px; color: var(--blue); font-size: .83rem; font-weight: 600; margin-top: 14px; transition: gap var(--t); }
.service-card-link:hover { gap: 10px; }

/* ── TEAM CARDS ── */
.team-members { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.team-card { background: white; border: 1px solid var(--border); border-radius: var(--r); padding: 18px 20px; display: flex; align-items: center; gap: 12px; box-shadow: var(--shadow); }
.team-avatar { width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg,var(--primary-light),var(--primary-border)); border: 2px solid var(--primary-border); display: flex; align-items: center; justify-content: center; font-family: 'DM Mono', monospace; font-size: .7rem; color: var(--primary); flex-shrink: 0; }
.team-name { font-weight: 700; font-size: .86rem; color: var(--text); }
.team-role { font-size: .7rem; color: var(--text-muted); margin-top: 1px; line-height: 1.3; }

/* ── FORM ── */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.form-full { grid-column: 1 / -1; }
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field label { font-size: .78rem; font-weight: 600; color: var(--text-muted); }
.form-field input, .form-field textarea, .form-field select { background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 12px 15px; color: var(--text); font-family: inherit; font-size: .9rem; transition: border-color var(--t), box-shadow var(--t); width: 100%; resize: none; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(37,99,235,.08); }
.form-field textarea { height: 108px; }
.form-success { display: none; text-align: center; padding: 32px; background: var(--primary-light); border: 1px solid var(--primary-border); border-radius: var(--r); }
.form-success.visible { display: block; }
.form-success h3 { font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; color: var(--primary); margin-bottom: 8px; }

/* ── SPLIT LAYOUT (texte + image) ── */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.split img { width: 100%; border-radius: var(--r); border: 1px solid var(--border); box-shadow: var(--shadow-md); }
.split.reverse .split-img { order: 2; }
@media(max-width:768px) { .split { grid-template-columns: 1fr; } .split.reverse .split-img { order: 0; } }

/* ── GALLERY ── */
.gallery-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.gallery-grid img { width: 100%; height: 220px; object-fit: cover; border-radius: var(--r); border: 1px solid var(--border); transition: transform var(--t); }
.gallery-grid img:hover { transform: scale(1.02); }
@media(max-width:768px) { .gallery-grid { grid-template-columns: 1fr; } }

/* ── CTA STRIP (mini, fin de page) ── */
.cta-strip { background: linear-gradient(135deg, var(--bg-dark) 0%, var(--primary) 100%); border-radius: var(--r); padding: 56px 32px; text-align: center; color: #fff; }
.cta-strip h3 { color: #fff; font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem,4vw,2.6rem); margin-bottom: 12px; letter-spacing: .02em; }
.cta-strip p { color: rgba(255,255,255,.75); margin-bottom: 28px; max-width: 480px; margin-left: auto; margin-right: auto; }
.cta-strip .hero-ctas { justify-content: center; }

/* ── CROSS-LINK CARDS ── */
.crosslink-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.crosslink-card { background: white; border: 1px solid var(--border); border-radius: var(--r); padding: 24px 20px; text-align: center; transition: transform var(--t), box-shadow var(--t), border-color var(--t); }
.crosslink-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--primary-border); }
.crosslink-card .crosslink-name { font-weight: 700; font-size: .92rem; color: var(--text); margin-bottom: 6px; }
.crosslink-card .crosslink-desc { font-size: .78rem; color: var(--text-muted); line-height: 1.5; }
@media(max-width:1024px) { .crosslink-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:768px) { .crosslink-grid { grid-template-columns: 1fr; } }

/* ── KEY NUMBER BLOCK ── */
.kpi-row { display: flex; gap: 32px; flex-wrap: wrap; margin-top: 32px; }
.kpi-item { flex: 1; min-width: 140px; }
.kpi-num { font-family: 'DM Mono', monospace; font-size: 2.2rem; color: var(--primary); font-weight: 500; display: block; margin-bottom: 4px; }
.kpi-label { font-size: .8rem; color: var(--text-muted); }

/* ── CTA FINAL (dark) ── */
.cta-final { background: linear-gradient(135deg, var(--bg-dark) 0%, var(--primary) 100%); color: #fff; }
.cta-final .section-title { color: #fff; }
.cta-final .section-sub { color: rgba(255,255,255,.75); }
.cta-final .section-label { color: #93C5FD; }
.cta-final .form-wrap { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: var(--r); padding: 32px; backdrop-filter: blur(8px); }
.cta-final .form-field label { color: rgba(255,255,255,.7); }
.cta-final .form-field input, .cta-final .form-field textarea { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16); color: #fff; }
.cta-final .form-field input::placeholder, .cta-final .form-field textarea::placeholder { color: rgba(255,255,255,.35); }
.cta-final .form-field input:focus, .cta-final .form-field textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(37,99,235,.18); }
.cta-final .form-field select { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16); color: #fff; border-radius: var(--r-sm); padding: 12px 15px; font-family: inherit; font-size: .9rem; width: 100%; }
.cta-final .form-success { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
.cta-final .form-success h3 { color: #93C5FD; }
.cta-final .form-success p { color: rgba(255,255,255,.75); }

/* ── WAVE FOOTER BARS ── */
.wave-bars { display:flex; align-items:flex-end; justify-content:center; gap:3px; height:40px; margin:32px 0 28px; }
.wb { width:3px; height:8px; background:rgba(255,255,255,.14); border-radius:3px; }

/* footer logo — override SVG text fill for dark background */
.footer-logo-wrap .nav-logo-svg text { fill: white; }

/* hero-v2 responsive */
@media(max-width:768px) {
  .hero-v2-title { font-size:clamp(3rem,14vw,5rem); }
  .hero-v2-stats { gap:16px; }
  .hero-stat-sep { display:none; }
  .hero-v2-ctas { flex-direction:column; align-items:flex-start; }
}

/* ── BIM HERO — scroll-driven video scrub ── */
.bim-hero-scroll { height: 300vh; }
.bim-hero-sticky {
  position: sticky; top: 0; height: 100vh;
  overflow: hidden; background: #04080f;
}
.bim-hero-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.bim-hero-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(to right, rgba(4,8,15,.75) 0%, rgba(4,8,15,.3) 55%, transparent 100%),
    linear-gradient(to top,   rgba(4,8,15,.85) 0%, rgba(4,8,15,.2) 40%, transparent 70%);
}
.bim-hero-content {
  position: absolute; bottom: 60px;
  left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 1200px; padding: 0 24px;
}
.bim-hero-eyebrow {
  display: inline-block; font-size: .68rem; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--primary); margin-bottom: 18px;
}
.bim-hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3.8rem, 7.5vw, 7rem);
  line-height: .9; letter-spacing: .02em;
  color: var(--text); margin-bottom: 22px;
}
.bim-hero-sub {
  color: var(--text-muted); font-size: 1rem;
  max-width: 460px; line-height: 1.75; margin-bottom: 34px;
}
.bim-hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.bim-hero-progress {
  position: absolute; top: 80px; right: 28px;
  width: 2px; height: calc(100vh - 160px);
  background: rgba(26,61,124,.1); border-radius: 2px;
}
.bim-hero-progress-fill {
  position: absolute; top: 0; left: 0; width: 100%; height: 0%;
  background: var(--primary); border-radius: 2px;
}
.bim-hero-scroll-hint {
  position: absolute; bottom: 68px; right: 40px;
  display: flex; flex-direction: column;
  align-items: center; gap: 10px;
  opacity: 1; transition: opacity .5s;
}
.bim-hero-scroll-hint.hide { opacity: 0; pointer-events: none; }
.bim-hero-scroll-hint > span {
  font-size: .62rem; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--primary); writing-mode: vertical-lr;
}
.bim-scroll-line {
  width: 1px; height: 44px; background: var(--primary);
  animation: scrollpulse 1.8s ease-in-out infinite;
}
@keyframes scrollpulse {
  0%   { transform: scaleY(0); transform-origin: top; }
  49%  { transform: scaleY(1); transform-origin: top; }
  50%  { transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}
@media(max-width:768px) {
  .bim-hero-title { font-size: clamp(3rem, 13vw, 5rem); }
  .bim-hero-content { bottom: 36px; }
  .bim-hero-progress, .bim-hero-scroll-hint { display: none; }
}

/* ── RESPONSIVE ── */
@media(max-width:1024px) { .process-steps{grid-template-columns:repeat(2,1fr);} }
@media(max-width:768px) {
  .nav-links { display: none; }
  .hamburger { display: flex; }
  section { padding: 64px 0; }
  .services-grid { grid-template-columns: 1fr; }
  .counters-grid { grid-template-columns: repeat(2,1fr); }
  .sectors-grid { grid-template-columns: 1fr; }
  .process-steps { grid-template-columns: 1fr; }
  .team-members { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 6px; text-align: center; }
  .form-grid { grid-template-columns: 1fr; }
  .page-hero { padding: 120px 0 60px; }
  .slide { padding: 28px 24px; }
  .mosaic-grid { grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,clamp(80px,20vw,130px)); }
  .mosaic-logo-wrap { width:100px; height:100px; }
  .mosaic-logo-svg { width:64px; height:64px; }
  .hero-headline { padding:36px 0 44px; }
}
/* ── BH CHAPTERS — scroll-driven text ── */
.bh-chapters {
  position: absolute; bottom: 72px;
  left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 1200px; padding: 0 48px;
  height: 340px;
}
.bh-ch {
  position: absolute; bottom: 0; left: 48px;
  max-width: 660px; opacity: 0;
  will-change: transform, opacity;
}
.bh-label {
  display: inline-block;
  font-size: .6rem; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  background: var(--orange);
  color: #fff; border-radius: 40px;
  padding: 5px 16px; margin-bottom: 24px;
}
.bh-headline {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3.2rem, 6.5vw, 6.5rem);
  line-height: .92; color: #fff;
  margin-bottom: 24px; letter-spacing: .025em;
  text-shadow: 0 2px 32px rgba(0,0,0,.8);
}
.bh-accent { color: #5BC8F5; }
.bh-sub {
  color: rgba(255,255,255,.88);
  font-size: 1.05rem; line-height: 1.78;
  max-width: 480px; margin-bottom: 38px;
  text-shadow: 0 1px 16px rgba(0,0,0,.7);
}
.bh-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
/* scroll hint — white on dark video */
.bim-hero-scroll-hint > span { color: rgba(255,255,255,.55); }
.bim-scroll-line { background: rgba(255,255,255,.55); }
@media(max-width:768px) {
  .bh-chapters { padding: 0 20px; height: auto; }
  .bh-ch { left: 20px; max-width: calc(100vw - 40px); }
  .bh-headline { font-size: clamp(2.6rem, 11vw, 4.5rem); }
}

/* ── FRAME CANVAS HERO ── */
.frame-hero-scroll { height: 600vh; position: relative; }
.frame-hero-sticky {
  position: sticky; top: 0;
  width: 100%; height: 100vh;
  overflow: hidden; background: #030810;
}
#frame-canvas {
  position: absolute; inset: 0; display: block;
}
.fh-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(to right, rgba(3,8,16,.65) 0%, transparent 55%),
    linear-gradient(to top, rgba(3,8,16,.72) 0%, transparent 45%);
}
.fh-content {
  position: absolute; left: clamp(24px, 5vw, 72px); bottom: 100px;
  z-index: 2; color: #fff; max-width: 560px;
}
.fh-eyebrow {
  font-family: 'DM Mono', monospace;
  font-size: .7rem; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.55); margin-bottom: 18px; display: block;
}
.fh-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3.8rem, 8.5vw, 7.5rem);
  line-height: .9; margin-bottom: 28px; letter-spacing: .03em;
}
.fh-title em {
  font-style: normal;
  background: linear-gradient(135deg, #5BC8F5 0%, #FF7D4D 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.fh-sub {
  font-size: .95rem; color: rgba(255,255,255,.7);
  line-height: 1.75; margin-bottom: 36px; max-width: 420px;
}
.fh-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
/* loader */
.fh-loader {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 260px; text-align: center; z-index: 10;
  transition: opacity .6s;
}
.fh-loader--done { opacity: 0; pointer-events: none; }
.fh-loader-track {
  height: 2px; background: rgba(255,255,255,.12);
  border-radius: 2px; overflow: hidden; margin-bottom: 12px;
}
.fh-loader-track::after {
  content: ''; display: block; height: 100%;
  width: var(--pct, 0%);
  background: linear-gradient(90deg, #72D2F0, #3B8FD0);
  transition: width .1s linear;
}
#fh-loader-txt {
  font-family: 'DM Mono', monospace;
  font-size: .7rem; color: rgba(255,255,255,.4);
}
/* progress bar */
.fh-progress {
  position: absolute; right: 26px; top: 50%; transform: translateY(-50%);
  width: 2px; height: 120px;
  background: rgba(255,255,255,.12); border-radius: 2px; z-index: 3;
}
#fh-progress-fill {
  position: absolute; top: 0; left: 0; width: 100%; height: 0%;
  background: var(--orange); border-radius: 2px;
  transition: height .06s linear;
}
/* scroll hint */
.fh-scroll-hint {
  position: absolute; bottom: 36px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: rgba(255,255,255,.45); z-index: 3; animation: fhHint 2s ease-in-out infinite;
}
.fh-scroll-hint span { font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; }
.fh-scroll-hint svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; }
@keyframes fhHint { 0%,100% { opacity: .45; transform: translateX(-50%) translateY(0); } 50% { opacity: .85; transform: translateX(-50%) translateY(6px); } }
@media(max-width: 768px) {
  .fh-content { bottom: 72px; }
  .fh-title { font-size: clamp(3rem, 12vw, 5rem); }
  .fh-progress { display: none; }
}

@media(prefers-reduced-motion:reduce) { *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;} }

/* ════════════════════════════════════════════════════════════════════
   SCROLL MANIFESTO — "vous pouvez construire."
   Adapted from "you can scroll." by Jhey Tompkins (MIT)
   Placed between hero-v2 and urgency-banner
   ════════════════════════════════════════════════════════════════════ */

@property --sm-hue {
  initial-value: 0;
  syntax: '<number>';
  inherits: false;
}

.scroll-manifesto {
  --sm-start: 200;
  --sm-end: 262;
  --sm-lightness: 62%;
  --sm-base-chroma: 0.22;
  --sm-hue: var(--sm-start);
  /* fluid type scale */
  --sm-font-size-min: 14;
  --sm-font-size-max: 20;
  --sm-font-ratio-min: 1.1;
  --sm-font-ratio-max: 1.33;
  --sm-font-width-min: 375;
  --sm-font-width-max: 1500;
  width: 100%;
  font-family: 'DM Sans', sans-serif;
  position: relative;
  overflow-x: clip;
}

/* subtle grid texture */
.scroll-manifesto::before {
  --sm-size: 45px;
  --sm-line: color-mix(in hsl, canvasText, transparent 92%);
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, var(--sm-line) 1px, transparent 1px var(--sm-size))
      50% 50% / var(--sm-size) var(--sm-size),
    linear-gradient(var(--sm-line) 1px, transparent 1px var(--sm-size))
      50% 50% / var(--sm-size) var(--sm-size);
  mask: linear-gradient(-20deg, transparent 40%, white);
  pointer-events: none;
  z-index: 0;
}

/* fluid typography utility */
.scroll-manifesto .sm-fluid {
  --sm-fluid-min: calc(
    var(--sm-font-size-min) * pow(var(--sm-font-ratio-min), var(--sm-font-level, 0))
  );
  --sm-fluid-max: calc(
    var(--sm-font-size-max) * pow(var(--sm-font-ratio-max), var(--sm-font-level, 0))
  );
  --sm-fluid-preferred: calc(
    (var(--sm-fluid-max) - var(--sm-fluid-min)) /
    (var(--sm-font-width-max) - var(--sm-font-width-min))
  );
  font-size: clamp(
    calc((var(--sm-fluid-min) / 16) * 1rem),
    calc(
      ((var(--sm-fluid-min) / 16) * 1rem) -
      (((var(--sm-fluid-preferred) * var(--sm-font-width-min)) / 16) * 1rem) +
      (var(--sm-fluid-preferred) * 100vi)
    ),
    calc((var(--sm-fluid-max) / 16) * 1rem)
  );
}

/* scroll area */
.scroll-manifesto .sm-content {
  display: flex;
  line-height: 1.1;
  width: 100%;
  padding: 15vh 5rem;
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 0.02em;
  font-size: clamp(2.5rem, 7.6vw, 110px);
}

.scroll-manifesto .sm-sticky-text {
  position: sticky;
  top: calc(50vh - 0.5lh);
  flex-shrink: 0;
  font-size: inherit;
  margin: 0;
  padding-right: 0.2em;
  height: fit-content;
  font-weight: 600;
  white-space: nowrap;
  color: var(--text);
}

.scroll-manifesto .sm-year,
.scroll-manifesto .sm-nous {
  white-space: nowrap;
  background: linear-gradient(canvasText 50%, color-mix(in oklch, canvas, canvasText 25%));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
}

.scroll-manifesto ul {
  --sm-step: calc((var(--sm-end) - var(--sm-start)) / (var(--count) - 1));
  font-weight: 600;
  padding-inline: 0;
  margin: 0;
  list-style-type: none;
  font-size: inherit;
}

.scroll-manifesto ul li {
  font-size: inherit;
}

.scroll-manifesto ul li:not(:last-of-type) {
  color: oklch(
    var(--sm-lightness) var(--sm-base-chroma)
    calc(var(--sm-start) + (var(--sm-step) * var(--i)))
  );
}

.scroll-manifesto ul li:last-of-type {
  background: linear-gradient(canvasText 50%, color-mix(in oklch, canvas, canvasText 25%));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* screen-reader only helper */
.sm-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* snap mode */
.scroll-manifesto[data-snap='true'] ul li { scroll-snap-align: center; }

/* debug mode */
.scroll-manifesto[data-debug='true'] ul li { outline: 0.05em dashed currentColor; }
.scroll-manifesto[data-debug='true'] :is(.sm-sticky-text, ul li:last-of-type) { outline: 0.05em dashed canvasText; }

/* CSS scroll-driven animation — Chrome 115+ / Edge 115+ */
@supports (animation-timeline: scroll()) and (animation-range: 0% 100%) {
  .scroll-manifesto[data-animate='true'] ul li {
    opacity: 0.2;
    animation-name: sm-brighten;
    animation-fill-mode: both;
    animation-timing-function: linear;
    animation-range: cover calc(50% - 1lh) calc(50% + 1lh);
    animation-timeline: view();
  }
  .scroll-manifesto[data-animate='true'] ul li:first-of-type { --sm-start-opacity: 1; }
  .scroll-manifesto[data-animate='true'] ul li:last-of-type  { --sm-brightness: 1; --sm-end-opacity: 1; }
}

@keyframes sm-brighten {
  0%   { opacity: var(--sm-start-opacity, 0.2); }
  50%  { opacity: 1; filter: brightness(var(--sm-brightness, 1.2)); }
  100% { opacity: var(--sm-end-opacity, 0.2); }
}

@media (max-width: 768px) {
  .scroll-manifesto .sm-content { padding: 8vh 1.5rem; flex-wrap: wrap; }
  .scroll-manifesto .sm-sticky-text { position: static; width: 100%; padding-bottom: 0.25rem; }
}
