@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root{
  --bg:#0A1730; --bg2:#071123; --txt:#ffffff;
  --muted:rgba(255,255,255,.72); --border:rgba(255,255,255,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;height:100%}
body{
  margin:0; min-height:100vh; height:100%; display:flex; flex-direction:column;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji';
  color:var(--txt);
  background:#0A1730;
}
main{flex:1}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.header{position:sticky;top:0;z-index:30;background:rgba(10,23,48,.65);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:flex-start;gap:24px;height:80px}
.nav a{color:rgba(255,255,255,.92);text-decoration:none;margin:0 10px;font-size:14px}
.nav a:hover{color:#fff}
.nav nav{display:flex;align-items:center;gap:26px;flex:1}
.nav .cta{margin-left:auto}
img.logo{height:56px;vertical-align:middle}
.btn{display:inline-flex;align-items:center;gap:.5rem;background:#ffffff;color:#0A1730 !important;border:1px solid rgba(255,255,255,.35);padding:10px 16px;border-radius:12px;text-decoration:none;font-weight:600}
.btn:hover{background:rgba(255,255,255,.9)}
.btn.outline{background:transparent;color:#ffffff;border-color:rgba(255,255,255,.35)}
.btn.outline:hover{background:rgba(255,255,255,.06)}

.hero{
  /* tighter hero spacing on home */
  padding: clamp(12px, 2.5vh, 24px) 0 clamp(8px, 1.8vh, 16px);
  position:relative; overflow:hidden;
  border-bottom:1px solid var(--border);
  background-image:url('assets/hero-bg.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  min-height:240px;
}
/* Only apply fade where explicitly requested */
.hero--fade::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:142px;
  background:linear-gradient(180deg, rgba(10,23,48,0) 0%, #0A1730 100%); pointer-events:none;
}
.about-hero{ border-bottom:none !important; }

.brand-lockup{ display:block; margin:0 auto 2px; width:min(900px, 80vw); height:auto; opacity:.98; }
.home-hero .brand-home{ width:min(1350px, 90vw); } /* +50% */
.about-hero .brand-about{ width:min(842px, 80vw); } /* +30% */

.grid{display:grid;gap:24px}
.cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{border:1px solid var(--border);background:rgba(255,255,255,.04);border-radius:18px;padding:18px}
.card:hover{border-color:rgba(255,255,255,.22)}
.h2{font-size:28px;margin:0 0 8px}
.h3{font-size:18px;margin:0 0 6px}
.p{color:var(--muted);line-height:1.6}
.section{padding:56px 0}
.footer{border-top:1px solid var(--border);padding:32px 0;color:var(--muted)}
.tag{font-size:12px;color:var(--muted)}
.table{width:100%;border-collapse:collapse}
.table td,.table th{border-bottom:1px solid var(--border);padding:8px 0;color:var(--muted);text-align:left}
.active{color:#fff!important}

/* Orange feature cards -> liquid glass */
.cards--orange .card{
  border:1px solid rgba(255,255,255,.18) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  color:#ffffff !important;
}
.cards--orange .card .p, .cards--orange .card h3, .cards--orange .card strong{ color:#ffffff!important }

/* Pre-footer CTA band */
.prefooter{padding:48px 0;border-top:1px solid var(--border);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02))}
.prefooter .cta-card{ background:rgba(255,255,255,.92) !important; border:1px solid rgba(10,23,48,.18) !important; color:#0A1730 !important; border-radius:18px; padding:18px }
.prefooter .cta-card .p, .prefooter .cta-card h2, .prefooter .cta-card h3, .prefooter .cta-card li, .prefooter .cta-card strong{ color:#0A1730!important }
.prefooter .cta-card .btn{ border-color:rgba(10,23,48,.25) }

/* Links forced white (Resources) */
a.link-white{ color:#ffffff !important; text-decoration:underline }
a.link-white:visited{ color:#ffffff !important }
a.link-white:hover{ opacity:.9 }

/* A propos: profile + logo */
.profile-lockup{ display:flex; align-items:center; justify-content:center; gap:24px; margin:24px 0 8px; flex-wrap:wrap }
.profile-photo{
  width:180px; height:180px; object-fit:cover; border-radius:16px;
  border:1px solid rgba(255,255,255,.25);
  box-shadow:0 10px 30px rgba(0,0,0,.35), 0 0 0 6px rgba(255,255,255,.06) inset;
  background: radial-gradient(120px 80px at 30% 20%, rgba(255,255,255,.06), transparent);
}
.about-hero .profile-photo{ width:210px; height:210px } /* +30% */
@media (max-width:640px){ .profile-photo{ width:140px; height:140px } }

@media (min-width: 1020px){
  .profile-lockup{ flex-wrap:nowrap }
}

/* --- Section-level particle net (what-we-do) --- */
:root{ --net-color:#8ba3b1; }
.net-wrap{ position:relative; overflow:hidden; }
.net-wrap .net-canvas{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  width:100%; height:100%; display:block; background:transparent;
}
.net-wrap .net-content{ position:relative; z-index:1; }
@media (prefers-reduced-motion: reduce){
  .net-wrap .net-canvas{ display:none !important; }
}


@media (min-width: 1020px){
  .cards{ grid-template-columns: repeat(3, 1fr) !important; }
}
.card--ghost{ visibility:hidden; }
@media (max-width: 900px){
  .card--ghost{ display:none !important; }
}

.header.header--fade{opacity:0; pointer-events:none}

.header{will-change: opacity}


/* --- Accordion (Expertises) --- */
.accordion{ display:flex; flex-direction:column; gap:14px; margin-top:10px }
.acc-item{ border:1px solid var(--border); border-radius:16px; overflow:hidden;
  background:rgba(255,255,255,.04); backdrop-filter: saturate(140%) blur(4px) }
.acc-header{ width:100%; text-align:left; padding:18px 20px; display:flex; align-items:center; justify-content:space-between;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); color:#fff; font-weight:600; border:0; cursor:pointer }
.acc-header:hover{ background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)) }
.acc-title{ font-size:18px }
.acc-arrow{ transition: transform .25s ease }
.acc-item.open .acc-arrow{ transform: rotate(180deg) }
.acc-content{ max-height:0; overflow:hidden; transition:max-height .35s ease, opacity .35s ease; opacity:0; padding:0 20px }
.acc-item.open .acc-content{ opacity:1; padding:16px 20px 18px }
.acc-content p{ color:var(--muted); margin:0 0 12px }
.accordion ul{ margin:0; padding-left:18px; color:var(--muted) }
.accordion li{ margin:6px 0 }


/* --- Glassmorphism Accordion (Services) --- */
.glass-acc .acc-item{ 
  border:1px solid rgba(255,255,255,.18);
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: 0 20px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.18);
  overflow:hidden;
  backdrop-filter: blur(10px) saturate(140%);
}
.acc-header--glass{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  padding:22px 24px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.acc-header--glass:hover{ background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06)) }
.glass-acc .acc-title{ font-size:20px }
.glass-acc .acc-content{ transition:max-height .45s cubic-bezier(.25,.8,.25,1), opacity .35s ease; }


/* --- Light Glass variant for Services --- */
:root{ --ax-blue:#0B2A5B; --ax-blue-muted: rgba(11,42,91,.78); }
.glass-acc.light .acc-item{
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.88));
  border:1px solid rgba(10,23,48,.15);
  box-shadow: 0 16px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(10px) saturate(140%);
  color: var(--ax-blue);
  position: relative;
}
/* glossy reflection strip */
.glass-acc.light .acc-item::before{
  content:""; position:absolute; left:0; right:0; top:0; height:70px;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0));
  pointer-events:none;
}
.glass-acc.light .acc-header{ 
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.90)); 
  color: var(--ax-blue); 
  border-bottom:1px solid rgba(10,23,48,.10);
}
.glass-acc.light .acc-header:hover{ background: linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.92)) }
.glass-acc.light .acc-title{ color: var(--ax-blue); }
.glass-acc.light .acc-arrow{ color: var(--ax-blue-muted); }
.glass-acc.light .acc-content p,
.glass-acc.light .acc-content li{ color: var(--ax-blue-muted); }

/* Hide any accidental duplicate prefooter blocks */
.prefooter ~ .prefooter{ display:none !important; }


/* ===== Services: Apple-style liquid glass full-width ===== */
:root{
  --ax-deep:#0B2A5B;
  --ax-deep-muted: rgba(11,42,91,.80);
  --ax-glow: rgba(255,255,255,.9);
}
.section--services-bg{
  background-image: url('assets/services-bg.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  padding-top: 40px;
  padding-bottom: 60px;
}
/* Full-width stacked accordion */
.glass-acc.full{ gap:0; }
.glass-acc.full .acc-item{
  width:100%;
  border-radius: 28px;
  margin:0;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.86));
  border: 1px solid rgba(10,23,48,.12);
  box-shadow: 0 24px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.85);
  backdrop-filter: blur(14px) saturate(140%);
  color: var(--ax-deep);
}
/* Remove outer rounding when stacked, keep smooth edges */
.glass-acc.full .acc-item{ border-radius: 0; }
.glass-acc.full .acc-item:first-child{ border-top-left-radius: 24px; border-top-right-radius:24px; }
.glass-acc.full .acc-item:last-child{ border-bottom-left-radius: 24px; border-bottom-right-radius:24px; }

/* Divider between items to make them appear collés */
.glass-acc.full .acc-item + .acc-item{ border-top: 1px solid rgba(10,23,48,.10); }

/* Header typography & arrow centered at the bottom */
.glass-acc.full .acc-header{
  position: relative;
  padding: 28px 28px 48px; /* extra bottom padding for arrow */
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.90));
  border-bottom: 1px solid rgba(10,23,48,.10);
  color: var(--ax-deep);
}
.glass-acc.full .acc-title{ font-size: 22px; font-weight: 700; color: var(--ax-deep); }
.glass-acc.full .acc-arrow{
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 18px;
  color: var(--ax-deep-muted);
  transition: transform .25s ease, opacity .25s ease;
}
.glass-acc.full .acc-item.open .acc-arrow{ transform: translateX(-50%) rotate(180deg); }

/* Content colors */
.glass-acc.full .acc-content{
  color: var(--ax-deep-muted);
}
.glass-acc.full .acc-content p,
.glass-acc.full .acc-content li{ color: var(--ax-deep-muted); }
.glass-acc.full .acc-content a{ color: var(--ax-deep); }

/* Smooth open height */
.glass-acc.full .acc-content{ transition:max-height .48s cubic-bezier(.25,.8,.25,1), opacity .35s ease; }

/* Subtle glossy strip */
.glass-acc.full .acc-item::before{
  content:"";
  position:absolute; inset:0 0 auto 0; height:80px;
  background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,0));
  pointer-events:none;
  border-top-left-radius: inherit; border-top-right-radius: inherit;
}

/* Improve readability over white shapes */
.section--services-bg .container{ color: var(--ax-deep); }
.section--services-bg .h2, .section--services-bg .p{ color: var(--ax-deep); }


/* ===== Services: full-bleed + true glassmorphism ===== */
:root{
  --ax-deep:#0B2A5B;
  --ax-deep-70: rgba(11,42,91,.70);
  --ax-deep-60: rgba(11,42,91,.60);
  --ax-glass: rgba(255,255,255,.18); /* transparency */
  --ax-glass-strong: rgba(255,255,255,.30);
}
/* Kill top/bottom blue bands: bleed to viewport edges regardless of container */
.section--services-fullbleed.bleed-edge{
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  padding: 0; /* no vertical padding that reveals page bg */
  background-image: url('assets/services-bg.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
.section--services-fullbleed.bleed-edge .container{
  padding: 0;
  margin: 0;
  max-width: 100vw;
  width: 100vw;
}

/* Full-bleed accordion items */
.glass-acc.fullbleed{ gap:0; }
.glass-acc.fullbleed .acc-item{
  width: 100vw;
  margin: 0;
  border-radius: 0;
  /* real glass */
  background: var(--ax-glass);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 24px 60px rgba(0,0,0,.22);
  color: var(--ax-deep);
  position: relative;
  overflow: hidden;
}

/* Subtle colorful glow at the bottom like macOS */
.glass-acc.fullbleed .acc-item::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0; height:14%;
  background: radial-gradient(120% 140% at 50% 120%, rgba(123,31,162,.35), rgba(33,150,243,.28), rgba(0,0,0,0) 70%);
  pointer-events:none;
  mix-blend-mode: screen;
}

/* Divider between items */
.glass-acc.fullbleed .acc-item + .acc-item{ border-top: 1px solid rgba(255,255,255,.22); }

/* Header + arrow centered at the bottom */
.glass-acc.fullbleed .acc-header{
  position: relative;
  padding: 26px 28px 52px;
  background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.10));
  color: var(--ax-deep);
}
.glass-acc.fullbleed .acc-title{ font-size: 22px; font-weight: 700; color: var(--ax-deep); }
.glass-acc.fullbleed .acc-arrow{
  position: absolute;
  bottom: 14px; left: 50%; transform: translateX(-50%);
  font-size: 18px; opacity: .85; color: var(--ax-deep-70);
  transition: transform .25s ease, opacity .25s ease;
}
.glass-acc.fullbleed .acc-item.open .acc-arrow{ transform: translateX(-50%) rotate(180deg); }

/* Content text contrast */
.glass-acc.fullbleed .acc-content{ color: var(--ax-deep-70); }
.glass-acc.fullbleed .acc-content p,
.glass-acc.fullbleed .acc-content li{ color: var(--ax-deep-60); }

/* Remove margins around prefooter to avoid a residual band */
.prefooter{ margin-top: 0; }


/* ===== V41: Liquid Glass cards (Apple-like) ===== */
:root{
  --ax-deep:#0B2A5B;
  --ax-deep-70: rgba(11,42,91,.70);
  --ax-deep-60: rgba(11,42,91,.60);
  --ax-card-glass: rgba(255,255,255,.14);
}

/* Section not full-bleed; centered and airy */
.section--services-liquid{
  background: url('assets/services-bg.jpg') center/cover fixed;
  padding: 48px 0 64px;
}
.section--services-liquid .container{
  max-width: 1200px;
  padding: 0 24px;
  margin: 0 auto;
}

/* Stack with gaps */
.liquid-acc{ gap: 28px; }

/* Card style on accordion items */
.liquid-acc .acc-item{
  position: relative;
  border-radius: 28px;
  overflow: clip;
  border: 1px solid rgba(255,255,255,.35);
  box-shadow: 0 30px 80px rgba(3,16,38,.25), inset 0 1px 0 rgba(255,255,255,.5);
  background: var(--ax-card-glass);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  color: var(--ax-deep);
}

/* Copy of background behind card + refraction + frost */
.liquid-acc .acc-item::before{
  content: "";
  position: absolute; inset: 0;
  background: url('assets/services-bg.jpg') center/cover fixed;
  filter: url(#liquid-refract) blur(18px) saturate(160%) brightness(1.06);
  opacity: 0.95;
  z-index: 0;
}

/* Gloss & colorful underglow */
.liquid-acc .acc-item::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(120% 160% at 50% 115%, rgba(127,0,255,.28), rgba(0,153,255,.22), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,0) 40%),
    radial-gradient(120% 80% at 50% -20%, rgba(255,255,255,.35), rgba(255,255,255,0) 60%);
  pointer-events:none;
  z-index: 1;
}

/* Content layers above */
.liquid-acc .acc-header, .liquid-acc .acc-content{
  position: relative;
  z-index: 2;
}

.liquid-acc .acc-header{
  padding: 26px 28px 54px;
  color: var(--ax-deep);
  background: linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.08));
  border-bottom: 1px solid rgba(255,255,255,.25);
}
.liquid-acc .acc-title{ font-size:22px; font-weight:700; color:var(--ax-deep); }

/* Centered arrow at the bottom */
.liquid-acc .acc-arrow{
  position:absolute; left:50%; bottom:14px; transform:translateX(-50%);
  font-size:18px; color: var(--ax-deep-70);
  transition: transform .25s ease;
}
.liquid-acc .acc-item.open .acc-arrow{ transform:translateX(-50%) rotate(180deg); }

.liquid-acc .acc-content{ color: var(--ax-deep-70); }
.liquid-acc .acc-content p, .liquid-acc .acc-content li{ color: var(--ax-deep-60); }


/* === V42 Liquid Glass from user-provided recipe, adapted to cards === */
.section--services-liquid{
  background: url('assets/services-bg.jpg') center/cover fixed;
  padding: 56px 0 72px;
}
.section--services-liquid .container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.accordion.liquid-acc{ gap: 24px; }

.accordion.liquid-acc .acc-item{
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 6px 6px rgba(0,0,0,0.2), 0 0 20px rgba(0,0,0,0.1);
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,0.20);
  transition: all 0.4s cubic-bezier(0.175,0.885,0.32,2.2);
}

/* Layers */
.acc-item .liquidGlass-effect{
  position: absolute; inset: 0; z-index: 0;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  filter: url(#glass-distortion);
  pointer-events: none;
}
.acc-item .liquidGlass-tint{
  position:absolute; inset:0; z-index:1;
  background: rgba(255,255,255,0.50);
  pointer-events:none;
}
.acc-item .liquidGlass-shine{
  position:absolute; inset:0; z-index:2;
  box-shadow: inset 2px 2px 1px 0 rgba(255,255,255,0.5),
              inset -1px -1px 1px 1px rgba(255,255,255,0.5);
  pointer-events:none;
}

/* Content stays above layers */
.accordion.liquid-acc .acc-header,
.accordion.liquid-acc .acc-content{
  position: relative; z-index: 3;
}

.accordion.liquid-acc .acc-header{
  padding: 24px 24px 48px;
  border-bottom: 1px solid rgba(255,255,255,.35);
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04));
}
.accordion.liquid-acc .acc-title{ font-size: 22px; font-weight: 700; color: #0B2A5B; }
.accordion.liquid-acc .acc-arrow{
  position:absolute; left:50%; bottom:14px; transform:translateX(-50%);
  font-size:18px; color: rgba(11,42,91,.80);
  transition: transform .25s ease;
}
.accordion.liquid-acc .acc-item.open .acc-arrow{ transform:translateX(-50%) rotate(180deg); }
.accordion.liquid-acc .acc-content{ color: rgba(11,42,91,.75); }

/* Hover lift for card */
.accordion.liquid-acc .acc-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 46px rgba(3,16,38,.28), 0 0 24px rgba(0,0,0,0.12);
}

/* === V43: Exact Liquid Glass layering (user recipe) applied to service cards === */

/* keep section centered and airy */
.section--services-liquid{
  padding: 56px 0 72px;
  background: url('assets/services-bg.jpg') center/cover fixed;
  animation: moveBackground 60s linear infinite;
}
.section--services-liquid .container{ max-width:1200px; margin:0 auto; padding:0 24px; }
.accordion.liquid-acc{ gap:25px; }

/* Card wrapper */
.accordion.liquid-acc .acc-item{
  border-radius:2rem;
  overflow:hidden;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.1);
}
/* The liquid glass container + layers */
.accordion.liquid-acc .acc-item .liquidGlass-wrapper{
  position: relative;
  display:flex;
  font-weight:600;
  overflow:hidden;
  border-radius:2rem;
}
.accordion.liquid-acc .acc-item .liquidGlass-wrapper > div{ border-radius:2rem; }

.accordion.liquid-acc .acc-item .liquidGlass-effect{
  position:absolute; inset:0; z-index:0;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  filter: url(#glass-distortion);
  overflow:hidden;
}
.accordion.liquid-acc .acc-item .liquidGlass-tint{
  position:absolute; inset:0; z-index:1;
  background: rgba(255, 255, 255, 0.50);
}
.accordion.liquid-acc .acc-item .liquidGlass-shine{
  position:absolute; inset:0; z-index:2;
  overflow:hidden;
  box-shadow: inset 2px 2px 1px 0 rgba(255, 255, 255, 0.5),
              inset -1px -1px 1px 1px rgba(255, 255, 255, 0.5);
}
.accordion.liquid-acc .acc-item .liquidGlass-text{
  z-index:3;
  width:100%;
  color:black;
}

/* keep your existing header/content styling but ensure on top */
.accordion.liquid-acc .acc-header, 
.accordion.liquid-acc .acc-content{ position:relative; z-index:3; }

/* hover micro interaction */
.accordion.liquid-acc .acc-item:hover{ transform: translateY(-2px); }

@keyframes moveBackground {
  from { background-position: 0% 0%; }
  to   { background-position: 0% -1500%; }
}


/* ===== V44: Force transparency & remove legacy fills/overlays ===== */

/* Kill any legacy pseudo overlays from older versions */
.accordion.liquid-acc .acc-item::before,
.accordion.liquid-acc .acc-item::after { display:none !important; content:none !important; }

/* No background fill on cards or inner blocks */
.accordion.liquid-acc .acc-item,
.accordion.liquid-acc .acc-item .liquidGlass-wrapper,
.accordion.liquid-acc .acc-item .liquidGlass-text,
.accordion.liquid-acc .acc-header,
.accordion.liquid-acc .acc-content { 
  background: transparent !important;
}

/* Ensure the effect/tint/shine are the only visible layers */
.accordion.liquid-acc .acc-item .liquidGlass-effect{
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
  filter: url(#glass-distortion) !important;
}
/* Slightly lower tint to reveal backdrop more */
.accordion.liquid-acc .acc-item .liquidGlass-tint{ 
  background: rgba(255,255,255,0.35) !important; 
}

/* Keep rounded corners & shadow only on the wrapper to avoid solid fills */
.accordion.liquid-acc .acc-item{
  border-radius: 2rem !important;
  overflow: hidden !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.18), 0 0 20px rgba(0,0,0,.08) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
}

/* Make sure the service section background is not covered by a color */
.section--services-liquid{ 
  background: url('assets/services-bg.jpg') center/cover fixed !important;
}

/* Typography stays above */
.accordion.liquid-acc .acc-title{ color:#0B2A5B !important; }
.accordion.liquid-acc .acc-content{ color: rgba(11,42,91,.78) !important; }



/* ===== V45: Make cards clearly transparent (stronger overrides) ===== */

/* remove any left-over fills/gradients everywhere inside items */
.accordion.liquid-acc .acc-item,
.accordion.liquid-acc .acc-item * {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* keep only liquid layers visible */
.accordion.liquid-acc .liquidGlass-effect{
  backdrop-filter: blur(7px) !important;
  -webkit-backdrop-filter: blur(7px) !important;
  filter: url(#glass-distortion) !important;
}
.accordion.liquid-acc .liquidGlass-tint{
  background: rgba(255,255,255,0.22) !important;
}

/* tone down shadows so background reads through */
.accordion.liquid-acc .acc-item{
  box-shadow: 0 8px 22px rgba(3,16,38,.18) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 26px !important;
}

/* arrow & text colors */
.accordion.liquid-acc .acc-title{ color:#0B2A5B !important; }
.accordion.liquid-acc .acc-content{ color: rgba(11,42,91,.82) !important; }


/* ===== V46: de-superposition & single-layer glass ===== */
.accordion.liquid-acc .acc-item{
  position: relative !important;
  padding: 0 !important;
  background: transparent !important;
}
.accordion.liquid-acc .acc-item > .liquidGlass-wrapper{ width:100%; display:flex; border-radius:26px; overflow:hidden; }
.accordion.liquid-acc .acc-item > .liquidGlass-wrapper > .liquidGlass-text{ width:100%; }

/* nuke nested wrappers accidentally left */
.accordion.liquid-acc .acc-item .liquidGlass-wrapper .liquidGlass-wrapper{ display:none !important; }

/* ensure no other overlays */
.accordion.liquid-acc .acc-item > *:not(.liquidGlass-wrapper){
  position: relative;
  z-index: 3;
  background: transparent !important;
}

/* blur layer must paint */
.accordion.liquid-acc .liquidGlass-effect{
  background: rgba(255,255,255,0.001) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
}

/* light tint */
.accordion.liquid-acc .liquidGlass-tint{ background: rgba(255,255,255,0.12) !important; }
.accordion.liquid-acc .liquidGlass-shine{ box-shadow: inset 1px 1px 0 rgba(255,255,255,.60), inset -1px -1px 0 rgba(255,255,255,.35); }



/* ===== V47: Separate blur + distort layers, nuke overlays ===== */

/* Disable any section-level overlays/filters that can break backdrop */
.section--services-liquid,
.section--services-liquid * {
  filter: none !important;
  transform: none !important;
}
.section--services-liquid::before,
.section--services-liquid::after { display:none !important; }

/* Generic reset to avoid opaque fills */
.accordion.liquid-acc .acc-item,
.accordion.liquid-acc .acc-item * {
  background: transparent !important;
  background-image: none !important;
}

/* Blur layer: needs a tiny alpha background to "paint" */
.liquidGlass-effect{
  position:absolute; inset:0; z-index:0;
  background: rgba(255,255,255,0.001) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  pointer-events:none;
}

/* Distortion layer: only the SVG filter */
.liquidGlass-distort{
  position:absolute; inset:0; z-index:1;
  filter: url(#glass-distortion) !important;
  pointer-events:none;
}

/* Light tint so the bg shows through */
.liquidGlass-tint{
  position:absolute; inset:0; z-index:2;
  background: rgba(255,255,255,0.12) !important;
  pointer-events:none;
}

/* Subtle inner highlights */
.liquidGlass-shine{
  position:absolute; inset:0; z-index:3;
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.60),
    inset -1px -1px 0 rgba(255,255,255,.35);
  pointer-events:none;
}

/* Put the text/content above */
.liquidGlass-text{ position:relative; z-index:4; }

/* Ensure wrapper is clipping and rounded */
.accordion.liquid-acc .acc-item > .liquidGlass-wrapper{
  border-radius:26px; overflow:hidden;
  position:relative;
}


/* ===== V48: Full transparent test + hover; remove distortion ===== */

/* Kill any overlays/filters that could cancel backdrop */
.section--services-liquid,
.section--services-liquid *{
  filter: none !important;
  transform: none !important;
  opacity: inherit !important;
}
.section--services-liquid::before,
.section--services-liquid::after{ display:none !important; }

/* No opaque background anywhere inside the accordion */
.accordion.liquid-acc .acc-item,
.accordion.liquid-acc .acc-item *{
  background: transparent !important;
  background-image: none !important;
}

/* Wrapper visuals + hover */
.accordion.liquid-acc .acc-item > .liquidGlass-wrapper{
  position:relative; border-radius:26px; overflow:hidden;
  transition: transform .35s ease, box-shadow .35s ease, border-radius .35s ease;
  will-change: transform;
}
.accordion.liquid-acc .acc-item > .liquidGlass-wrapper:hover{
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 8px 24px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.10);
  border-radius:30px;
}

/* BLUR layer: micro-alpha to paint backdrop, visually transparent */
.liquidGlass-effect{
  position:absolute; inset:0; z-index:0;
  background: rgba(255,255,255,0.001) !important;
  backdrop-filter: blur(14px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
  pointer-events:none;
}

/* Distortion OFF for this test build */
.liquidGlass-distort{ display:none !important; }

/* No tint/shine for full transparency test */
.liquidGlass-tint{ background: transparent !important; pointer-events:none; }
.liquidGlass-shine{ box-shadow:none !important; pointer-events:none; }

/* Content above */
.liquidGlass-text{ position:relative; z-index:4; }


/* ===== V49: Glass fallback when backdrop-filter is blocked ===== */
/* Set the same background image on the section AND expose it as a var */
.section--services-liquid{
  /* TODO: If your section already sets a background, keep it.
     Ensure the same value is also present in --services-bg so the fallback matches */
  /* --services-bg: url('/assets/bg/liquid-waves.jpg'); */
  background-attachment: fixed;
}

/* Keep the real glass when browser/context allows it (from V48) */

/* Fallback: synthesize blur using a pseudo-element that copies the section bg */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .glass-fallback{ position:relative; overflow:hidden; }
  .glass-fallback::before{
    content:"";
    position:absolute; inset:-24px;
    /* inherit section background via CSS var; if not set, inherit parent computed bg */
    background: var(--services-bg, inherit);
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    filter: blur(16px) saturate(140%);
    transform: scale(1.03);
    z-index:0;
  }
  .glass-fallback > .liquidGlass-text{ position:relative; z-index:1; }
}

/* Force fallback even if feature query passes but context still blocks backdrop-filter */
.glass-fallback.force-fallback::before{
  content:""; position:absolute; inset:-24px;
  background: var(--services-bg, inherit);
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  filter: blur(16px) saturate(140%);
  transform: scale(1.03);
  z-index:0;
}


/* ===== V50 FIX: ensure visible liquid glass under headers ===== */
.accordion.liquid-acc .acc-header,
.accordion.liquid-acc .acc-header--glass {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.accordion.liquid-acc .acc-item{
  position: relative;
}

.accordion.liquid-acc .acc-item .liquidGlass-effect,
.accordion.liquid-acc .acc-item .liquidGlass-tint,
.accordion.liquid-acc .acc-item .liquidGlass-shine{
  position: absolute; inset: 0;
}



/* ===== V51: Fully transparent service cards (no glass) ===== */
.accordion.liquid-acc .liquidGlass-effect{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: transparent !important;
  pointer-events: none !important;
}
.accordion.liquid-acc .liquidGlass-tint{ background: transparent !important; }
.accordion.liquid-acc .liquidGlass-shine{ box-shadow: none !important; }

/* Keep headers/content transparent and on top */
.accordion.liquid-acc .acc-header,
.accordion.liquid-acc .acc-header--glass{
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  position: relative; z-index: 3;
}

/* Card container minimal styling only (border + radius) */
.accordion.liquid-acc .acc-item{
  position: relative;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* Ensure the section background remains visible */
.section--services-liquid{ 
  background: url('assets/services-bg.jpg') center/cover fixed !important;
}

/* Keep text readable on light bg */
.accordion.liquid-acc .acc-title{ color:#0B2A5B !important; }
.accordion.liquid-acc .acc-content{ color: rgba(11,42,91,.78) !important; }


/* ===== V51-bis: Nuclear transparency reset for service cards ===== */
.accordion.liquid-acc .acc-item,
.accordion.liquid-acc .acc-item *,
.accordion.liquid-acc .acc-item::before,
.accordion.liquid-acc .acc-item::after{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

.accordion.liquid-acc .acc-header,
.accordion.liquid-acc .acc-header--glass{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.accordion.liquid-acc *{
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.accordion.liquid-acc .liquidGlass-effect,
.accordion.liquid-acc .liquidGlass-tint,
.accordion.liquid-acc .liquidGlass-shine{
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

/* Keep layout (spacing/radius) only */
.accordion.liquid-acc .acc-item{ 
  border-radius: 16px !important; 
  overflow: hidden !important;
}


/* ===== V53-bis: typography & arrow polish (no glass changes) ===== */

/* 1) Title hierarchy */
.section--services-liquid .h2{
  margin-bottom: 18px;
  letter-spacing: .2px;
  font-size: clamp(26px, 3.2vw, 32px);
  font-weight: 800;
  color: #0B2A5B;
}

/* 2) Card title style */
.accordion.liquid-acc .acc-title{
  font-size: 20px;
  font-weight: 700;
  color: #0B2A5B;
}

/* 3) Header layout: left title, right arrow, vertically centered */
.accordion.liquid-acc .acc-header{
  min-height: 72px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 18px 22px;
  background: transparent !important;
  position: relative; z-index: 3;
}
/* If a decorative dot exists, keep it centered vertically */
.accordion.liquid-acc .acc-header::before{ top: 50%; transform: translateY(-50%); }

/* Arrow on right; rotate only when open */
.accordion.liquid-acc .acc-arrow{
  position: static;
  transform: none;
  font-size: 16px;
  color: rgba(11,42,91,.80);
}
.accordion.liquid-acc .acc-item.open .acc-arrow{ transform: rotate(180deg); }

/* 4) Hide details when closed (no preview) */
.accordion.liquid-acc .acc-content{
  max-height: 0;
  opacity: 0;
  padding: 0 22px;
  transition: max-height .35s ease, opacity .25s ease, padding .25s ease;
}
.accordion.liquid-acc .acc-item.open .acc-content{
  max-height: 1600px;
  opacity: 1;
  padding: 6px 22px 16px;
}

/* 5) Content text rhythm */
.accordion.liquid-acc .acc-content{ color: rgba(11,42,91,.78); line-height: 1.55; }
.accordion.liquid-acc .acc-content p{ margin: 0 0 10px; }
.accordion.liquid-acc .acc-content ul{ padding-left: 20px; margin: 8px 0 0; list-style: disc; }
.accordion.liquid-acc .acc-content li{ margin: 6px 0; }
.accordion.liquid-acc .acc-content li::marker{ color: rgba(11,42,91,.80); }


/* V54-home: bigger homepage "what we do" title and card titles */
#what-we-do .h2{
  font-size: clamp(32px, 4.2vw, 44px);
  font-weight: 900;
  letter-spacing: .2px;
  margin-bottom: 18px;
}
#what-we-do .cards .h3{
  font-size: 20px;
  font-weight: 700;
}


/* V54-home-bis: force 3x2 grid packing for the orange cards */
#what-we-do .cards.cards--orange{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(280px, 1fr)) !important;
  gap: 24px !important;
  grid-auto-flow: row dense !important; /* backfill gaps */
}
#what-we-do .cards.cards--orange .card{
  height: 220px; /* unify heights so rows align */
  display: flex; flex-direction: column; justify-content: flex-start;
}
#what-we-do .cards.cards--orange .h3{ margin: 0 0 8px; }
#what-we-do .cards.cards--orange .p{ margin: 0; }

@media (max-width: 1100px){
  #what-we-do .cards.cards--orange{
    grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
  }
}
@media (max-width: 680px){
  #what-we-do .cards.cards--orange{
    grid-template-columns: 1fr !important;
  }
  #what-we-do .cards.cards--orange .card{ height: auto; }
}


/* V55-pos3: hard 3x2 grid and reset flex for homepage cards */
#what-we-do .grid.cards.cards--orange{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}
#what-we-do .grid.cards.cards--orange .card{
  margin: 0 !important;
  width: auto !important;
  flex: initial !important;
  min-height: 240px !important;
  display: flex !important; flex-direction: column !important; justify-content: flex-start !important;
}
#what-we-do .grid.cards.cards--orange .h3{ margin: 0 0 8px !important; }
#what-we-do .grid.cards.cards--orange .p{ margin: 0 !important; }

/* Explicit final placement 1..6 => (row1 col1..3, row2 col1..3) */
#what-we-do .grid.cards.cards--orange .card:nth-child(1){ grid-column:1; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(2){ grid-column:2; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(3){ grid-column:3; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(4){ grid-column:1; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(5){ grid-column:2; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(6){ grid-column:3; grid-row:2; }

@media (max-width: 1100px){
  #what-we-do .grid.cards.cards--orange{
    grid-template-columns: repeat(2, 1fr) !important;
  }
  #what-we-do .grid.cards.cards--orange .card{ grid-column:auto; grid-row:auto; min-height:auto !important; }
}
@media (max-width: 680px){
  #what-we-do .grid.cards.cards--orange{ grid-template-columns: 1fr !important; }
}


/* V56: final hard 3x2 layout */
#what-we-do .grid.cards.cards--orange{
  display:grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap:24px !important;
}
#what-we-do .grid.cards.cards--orange .card{ margin:0 !important; min-height:240px !important; }
#what-we-do .grid.cards.cards--orange .card:nth-child(1){ grid-column:1; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(2){ grid-column:2; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(3){ grid-column:3; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(4){ grid-column:1; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(5){ grid-column:2; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(6){ grid-column:3; grid-row:2; }


/* V56-bis: Harmonize homepage cards (denser, balanced) */
#what-we-do .grid.cards.cards--orange{
  gap: 20px !important; /* tighter spacing */
}

#what-we-do .grid.cards.cards--orange .card{
  padding: 16px 20px !important;          /* less padding for less empty space */
  min-height: 200px !important;           /* shorter cards so rows look fuller */
  border-radius: 18px !important;         /* slightly tighter radius */
  box-shadow: 0 6px 14px rgba(0,0,0,.12);
}

/* Titles a bit stronger */
#what-we-do .grid.cards.cards--orange .h3{
  font-size: 22px !important;
  line-height: 1.2;
  margin: 0 0 10px !important;
}

/* Text readability */
#what-we-do .grid.cards.cards--orange .p{
  line-height: 1.5 !important;
  max-width: 52ch;                        /* avoid overly long lines */
}

/* Keep the 3x2 layout */
#what-we-do .grid.cards.cards--orange{
  display:grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
}
#what-we-do .grid.cards.cards--orange .card:nth-child(1){ grid-column:1; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(2){ grid-column:2; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(3){ grid-column:3; grid-row:1; }
#what-we-do .grid.cards.cards--orange .card:nth-child(4){ grid-column:1; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(5){ grid-column:2; grid-row:2; }
#what-we-do .grid.cards.cards--orange .card:nth-child(6){ grid-column:3; grid-row:2; }

/* Responsive refinements */
@media (max-width: 1100px){
  #what-we-do .grid.cards.cards--orange{ grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 680px){
  #what-we-do .grid.cards.cards--orange{ grid-template-columns: 1fr !important; }
  #what-we-do .grid.cards.cards--orange .card{ min-height: auto !important; }
}

/* ===== V58: Expertises alignées ===== */
.expertise-grid{ display:grid; grid-template-columns:repeat(3, minmax(280px,1fr)); gap:24px; }
.expertise-card{ background:#ee7600; color:#fff; border-radius:18px; padding:20px 22px; display:flex; flex-direction:column; min-height:240px; box-shadow:0 10px 22px rgba(0,0,0,.18); }
.expertise-card .h3{ font-size:22px; margin:0 0 10px; line-height:1.25; }
.expertise-card .p{ line-height:1.55; }
.expertise-card .tags{ margin-top:auto; display:flex; flex-wrap:wrap; gap:10px; }
.expertise-card .tag{ display:inline-block; font-size:13.5px; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); }
@media (max-width:1100px){ .expertise-grid{ grid-template-columns:repeat(2,minmax(260px,1fr)); } }
@media (max-width:680px){ .expertise-grid{ grid-template-columns:1fr; } .expertise-card{ min-height:auto; } }

/* ===== V58: Standards & méthodologies visibles ===== */
#standards{ margin-top:18px; }
#standards .h2{ font-size:28px; font-weight:800; letter-spacing:.2px; margin-bottom:14px; color:#fff; }
.standards-badges{ background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03)); border:1px solid rgba(255,255,255,.10); border-radius:16px; padding:14px; display:flex; flex-wrap:wrap; gap:12px; }
.standards-badges .std{ display:inline-flex; align-items:center; gap:8px; font-size:15.5px; font-weight:700; padding:10px 16px; border-radius:999px; color:#0b1322; background:#fff; box-shadow:0 4px 10px rgba(0,0,0,.15); }

/* ===== V58: Secteurs (2 par ligne) ===== */
.section--sectors .h2{ font-size:clamp(28px,3vw,36px); font-weight:800; margin-bottom:18px; color:#fff; }
.sector-grid{ display:grid; grid-template-columns:repeat(2,minmax(320px,1fr)); gap:22px; }
.sector-card{ position:relative; aspect-ratio:16/9; border-radius:16px; overflow:hidden; display:grid; place-items:center; text-decoration:none; color:#fff; isolation:isolate; box-shadow:0 12px 24px rgba(0,0,0,.28); }
.sector-card::before{ content:""; position:absolute; inset:0; background-image:var(--img); background-size:cover; background-position:center; z-index:-2; transform:scale(1.03); filter:saturate(1.08) contrast(1.05); }
.sector-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.48)); z-index:-1; }
.sector-card span{ font-size:clamp(22px,2.6vw,30px); font-weight:800; letter-spacing:.2px; text-shadow:0 3px 10px rgba(0,0,0,.5); }
@media (hover:hover){ .sector-card{ transition:transform .25s ease, box-shadow .25s ease; } .sector-card:hover{ transform:translateY(-4px); box-shadow:0 18px 32px rgba(0,0,0,.35); } }
@media (max-width:760px){ .sector-grid{ grid-template-columns:1fr; } .sector-card{ aspect-ratio:16/10; } }

/* === V61: rendre visibles les images des tuiles Secteurs partout (home + secteurs) === */
.sector-card{ position:relative; }
.sector-card::before{
  content:"";
  position:absolute; inset:0;
  background-image: var(--img);
  background-size: cover; background-position: center;
  z-index:-2; transform: scale(1.03);
}
.sector-card::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.48));
  z-index:-1;
}

/* removed */
/* removed home sectors id rule */
/* removed home sectors id rule */
/* removed home sectors id rule */
/* removed home sectors id rule */

/* removed */
/* removed home sectors id rule */
/* removed home sectors id rule */
/* removed home sectors id rule */
/* removed home sectors id rule */

/* removed */
.sectors-home-block .sector-grid{ display:grid; grid-template-columns:repeat(2,minmax(320px,1fr)); gap:22px; }
.sectors-home-block .sector-card{
  display:block;
  width:100%;
  height:240px; /* hard fallback to ensure visible area */
  border-radius:16px;
  position:relative;
  overflow:hidden;
  text-decoration:none;
  color:#fff;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  box-shadow:0 12px 24px rgba(0,0,0,.28);
}
.sectors-home-block .sector-card::before{ display:none !important; }
.sectors-home-block .sector-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.48));
  z-index:1;
}
.sectors-home-block .sector-card span{ position:relative; z-index:2; font-weight:800; font-size:clamp(22px,2.6vw,30px); text-shadow:0 3px 10px rgba(0,0,0,.5); }
@media (max-width:760px){
  .sectors-home-block .sector-grid{ grid-template-columns:1fr; }
  .sectors-home-block .sector-card{ height:220px; }
}

/* removed */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
@media (max-width:760px){ /* removed home reset rule */ }

/* removed */
/* removed home reset rule */
/* removed home reset rule */

/* Centrer le titre au MILIEU comme la page Secteurs */
/* removed home reset rule */

/* Conserver l'overlay sous le texte */
/* removed home reset rule */

/* removed */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */

/* removed */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */

/* removed */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */
/* removed home reset rule */

/* === V70-bis: styles secteurs applicables aussi sur la home === */
.sector-grid{display:grid;grid-template-columns:repeat(2,minmax(320px,1fr));gap:22px}
@media (max-width:760px){.sector-grid{grid-template-columns:1fr}}
.sector-card{position:relative;display:grid;place-items:center;border-radius:16px;overflow:hidden;text-decoration:none;color:#fff;box-shadow:0 12px 24px rgba(0,0,0,.28);transition:transform .25s ease, box-shadow .25s ease}
.sector-card::before{content:"";position:absolute;inset:0;background:var(--img) center/cover no-repeat;z-index:0}
.sector-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.48));z-index:1}
.sector-card>span{position:relative;z-index:2;font-weight:800;font-size:clamp(22px,2.6vw,30px);text-shadow:0 3px 10px rgba(0,0,0,.55);text-align:center}
.sector-card:hover{transform:translateY(-4px);box-shadow:0 18px 32px rgba(0,0,0,.35)}



/* ===== Waves background for Expertises page (no dark overlay) ===== */
.waves{
  --waves: url('assets/waves-bg.png');
  background-image: var(--waves);
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  border-radius: 16px;
  padding-top: 24px;
  padding-bottom: 40px;
}

/* ===== Bigger 'Secteurs' heading on home ===== */
.h2.jumbo{
  font-size: clamp(34px, 4.5vw, 56px);
  line-height: 1.15;
}

/* ===== Liquid glass effect for expertise cards ===== */
.expertise-card{
  position: relative;
  background: rgba(14,22,35,0.55);
  border: 1px solid rgba(255,255,255,0.12);
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .25s ease, box-shadow .25s ease;
  box-shadow: 0 14px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.15);
}
.expertise-card::before{
  content:'';
  position:absolute; inset:0;
  border-radius: inherit;
  background:
     radial-gradient(400px 120px at var(--mx,35%) var(--my,25%), rgba(255,255,255,.32), transparent 50%),
     radial-gradient(800px 300px at 120% -20%, rgba(255,255,255,0.08), transparent 60%);
  pointer-events:none;
  transition: opacity .25s ease;
  opacity:.6;
}
.expertise-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.18);
}
.expertise-card:hover::before{ opacity:.85; }

/* ===== Standards & méthodologies: bigger, more uniform pills ===== */
#standards .standards-badges{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px;
  padding: 18px;
  background: rgba(7,15,28,0.35);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  backdrop-filter: blur(6px);
}
#standards .standards-badges .badge{
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .2px;
  padding: 12px 16px;
  text-align: center;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
#standards .standards-badges .badge:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.3);
}


/* ===== Standards & méthodologies — professional tiles ===== */
.std-grid{
  display:grid;
  grid-template-columns: repeat( auto-fit, minmax(260px,1fr) );
  gap: 20px;
  margin-top: 18px;
}
.std-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  min-height:78px;
  border-radius:14px;
  background: rgba(14,22,35,0.55);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 8px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.std-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.2);
  box-shadow: 0 12px 24px rgba(0,0,0,.28);
}
.std-icon{
  width:16px; height:16px; flex:0 0 16px;
  border-radius:50%;
  background: linear-gradient(180deg, #ffbb66, #ff7a00);
  box-shadow: 0 0 0 6px rgba(255,122,0,0.15);
}
.std-text{ line-height:1.15; }
.std-title{
  font-weight:700;
  font-size:16px;
}
.std-sub{
  font-size:13px;
  opacity:.80;
  margin-top:3px;
}


/* Blue headings for Expertises and Standards */
#expertises-title.h2,
#standards .h2,
.section .h2.section--blue{
  color: #4da3ff;
}

/* === Color updates requested === */
#expertises-title,
#standards-title{
  color:#0A1730 !important; /* deep blue */
}

/* Expertise card titles in orange */
.expertise-card h3,
.expertise-card .card-title{
  color:#FF7901 !important;
}



/* === v74 additions: subtle liquid-glass for home 'Ce que nous faisons' cards === */
#what-we-do .card{
  position: relative;
  background: rgba(255, 121, 1, 0.88);
  border: 1px solid rgba(255,255,255,0.14);
  -webkit-backdrop-filter: blur(8px) saturate(135%);
  backdrop-filter: blur(8px) saturate(135%);
  box-shadow: 0 12px 30px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.08);
  overflow: hidden;
}
#what-we-do .card::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 500px at -20% -10%, rgba(255,255,255,.22), transparent 55%),
    linear-gradient(120deg, rgba(255,255,255,.20), transparent 40%),
    linear-gradient(0deg, rgba(255,255,255,.06), rgba(255,255,255,0));
  pointer-events:none;
  mix-blend-mode:soft-light;
}
#what-we-do .card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.12);
}

/* === v74 additions: Expertises page heading colors & sizes === */
.page-expertises .h2{
  color:#0A1730 !important;
  font-size: clamp(28px, 2.6vw, 48px);
  line-height:1.2;
}
.page-expertises .expertise-card .h3{
  color:#FF7901;
}
.page-expertises section#standards .h2{ font-size:28px; font-weight:800; letter-spacing:.2px; margin-bottom:14px; color:#fff; }

/* Make sure the standards chip title bar matches size/color consistency */
#standards .chip-title{
  color:#0A1730;
  font-weight:600;
}

/* V79: Harmonize orange cards spacing & typography */
#what-we-do .cards.cards--orange{ gap:20px; }
#what-we-do .cards.cards--orange .card{
  padding:16px 20px !important;
  display:flex; flex-direction:column; gap:10px;
  height:auto !important; min-height:auto !important;
  border-radius:16px !important;
}
#what-we-do .cards.cards--orange .h3{ margin:0 0 6px !important; line-height:1.25; }
#what-we-do .cards.cards--orange .p{ margin:0 !important; line-height:1.55; }

/* V79: Remove 1px seam on home hero and elevate content */
.home-hero{ border-bottom:none !important; }
.hero .container{ position:relative; z-index:2; }
.hero .brand-lockup, .hero h1, .hero .btn{ position:relative; z-index:2; }
.hero--fade::after{ z-index:1; }

/* ===== V79: Atouts (Accueil) ===== */
.atouts .h2{ color:#fff; }
.atout-row{ padding:42px 0; }
.atout-row--light{ background:rgba(255,255,255,.06); }
.atout-row--dark{ background:#0A1730; border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); }
.atout-grid{ display:grid; grid-template-columns: 200px 1fr; gap:24px; align-items:center; }
.atout-row--flip .atout-grid{ grid-template-columns: 1fr 200px; }
.atout-row--flip .atout-icon{ order:2; }
.atout-row--flip .atout-text{ order:1; }
.atout-icon img{ width:150px; height:auto; display:block; margin:0 auto; }
.atout-row--dark .atout-text .h3, .atout-row--dark .atout-text .p{ color:#fff; }
@media (max-width:860px){
  .atout-grid{ grid-template-columns: 120px 1fr; gap:16px; }
  .atout-row--flip .atout-grid{ grid-template-columns: 1fr 120px; }
  .atout-icon img{ width:110px; }
}
@media (max-width:640px){
  .atout-grid{ grid-template-columns: 1fr; text-align:left; }
  .atout-row--flip .atout-grid{ grid-template-columns: 1fr; }
  .atout-icon{ order:1 !important; }
  .atout-text{ order:2 !important; }
  .atout-icon img{ margin-left:0; }
}

/* V80: Light bands are full white + dark text */
.atout-row--light{ background:#ffffff !important; }
.atout-row--light .atout-text .h3, 
.atout-row--light .atout-text .p{ color:#0A1730 !important; }

/* V80: Title size alignment with 'Ce que nous faisons' */
.atouts .h2{ font-size:28px !important; font-weight:800; }

/* ===== V82: Réalisations (Cases) ===== */
.cases-intro .case-kpis{
  margin-top:16px; display:grid; grid-template-columns:repeat(4, minmax(120px,1fr)); gap:14px;
}
.kpi{ border:1px solid rgba(255,255,255,.18); border-radius:14px;
     background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
     backdrop-filter: blur(8px) saturate(140%); padding:14px; text-align:center; }
.kpi-num{ font-size:22px; font-weight:800; color:#fff; }
.kpi-label{ font-size:12px; color:var(--muted); }

.case-cta{ margin-top:14px }

.case-filters{ display:flex; flex-wrap:wrap; gap:10px; margin:8px 0 18px }
.chip{ font-size:13px; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.18); color:#fff; text-decoration:none }
.chip:hover{ border-color:rgba(255,255,255,.28) }
.chip.active{ background:#FF7901; border-color:#FF7901 }

.case-grid{ display:grid; grid-template-columns:repeat(3, minmax(260px,1fr)); gap:24px }
.case-card{ border:1px solid rgba(255,255,255,.18); border-radius:18px;
            background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
            box-shadow: 0 20px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.18);
            backdrop-filter: blur(10px) saturate(140%);
            padding:18px; display:flex; flex-direction:column; gap:10px; }
.case-head .tag{ display:inline-block; font-size:12px; background:rgba(255,255,255,.10);
                 border:1px solid rgba(255,255,255,.18); border-radius:12px; padding:4px 8px; margin-bottom:6px }
.case-bullets{ margin:6px 0 0 16px; color:var(--muted) }
.case-bullets li{ margin-bottom:6px }
.case-more summary{ cursor:pointer; list-style:none; color:#fff; font-weight:600; margin-top:2px }
.case-more summary::-webkit-details-marker{ display:none }
.case-more__content{ border-top:1px dashed rgba(255,255,255,.18); margin-top:10px; padding-top:10px }
.case-meta{ color:var(--muted); margin:4px 0 }
@media (max-width:1100px){ .case-grid{ grid-template-columns:repeat(2, minmax(260px,1fr)); } }
@media (max-width:680px){ .case-grid{ grid-template-columns:1fr; } }

/* ===== V84: Home 'À propos' preview ===== */
.about-preview .about-row{
  display:grid; grid-template-columns: 1fr 1fr; align-items:center; gap:24px;
  margin-bottom:16px;
}
.about-preview .about-row .profile-photo{ width:160px; height:auto; border-radius:16px; display:block; }
.about-preview .about-row .brand-about{ width:min(560px, 80%); height:auto; justify-self:end; opacity:.95; }
.about-preview .about-copy .h2{ margin-top:8px; }
.about-preview .card-grid{ display:grid; grid-template-columns:repeat(3, minmax(220px,1fr)); gap:16px; }
.about-preview .info-card{ border:1px solid rgba(255,255,255,.18); border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  backdrop-filter: blur(8px) saturate(140%); padding:16px; }
.about-preview .info-card .h3{ margin:0 0 6px; }
@media (max-width:1000px){
  .about-preview .about-row{ grid-template-columns:1fr; }
  .about-preview .about-row .brand-about{ justify-self:start; width:min(420px, 70%); }
  .about-preview .card-grid{ grid-template-columns:repeat(2, minmax(200px,1fr)); }
}
@media (max-width:620px){
  .about-preview .card-grid{ grid-template-columns:1fr; }
}

/* V85: About preview header — larger photo, shield-only logo, tighter spacing */
.about-preview .about-row{
  display:grid; grid-template-columns: auto auto; align-items:center;
  justify-content:center; gap:16px; margin-bottom:14px;
}
.about-preview .about-row .profile-photo{ width:230px; height:auto; border-radius:18px; display:block; }
.about-preview .about-row .brand-about{ width:230px; height:auto; justify-self:center; opacity:.98; }
@media (max-width:1000px){
  .about-preview .about-row{ grid-template-columns:1fr; gap:12px; }
  .about-preview .about-row .brand-about, .about-preview .about-row .profile-photo{ justify-self:start; }
}

/* V86: Fix about-preview duplicates, spacing, sizes */
.about-preview .about-row{
  display:grid; grid-template-columns: auto auto; align-items:center;
  justify-content:center; gap:12px; margin-bottom:14px;
}
.about-preview .about-row .profile-photo{ width:280px; height:auto; border-radius:18px; display:block; }
.about-preview .about-row .brand-about{ width:220px; height:auto; justify-self:center; opacity:.98; }

/* V87: Ensure only the main photo + shield logo appear in the home about preview */
.about-preview img:not(.profile-photo):not(.brand-about){ display:none !important; }
.about-preview .about-row{ gap:10px; }
.about-preview .about-row .brand-about{ width:240px; }

/* V88: Rebuild home about-preview (only photo + shield logo) */
.about-preview .about-row.clean{
  display:grid; grid-template-columns:auto auto; justify-content:center; align-items:center; gap:12px;
}
.about-preview .about-row.clean .profile-photo{ width:320px; height:auto; border-radius:18px; display:block; }
.about-preview .about-row.clean .brand-about{ width:240px; height:auto; display:block; opacity:.98; }
@media (max-width:900px){
  .about-preview .about-row.clean{ grid-template-columns:1fr; gap:10px; }
  .about-preview .about-row.clean .profile-photo, 
  .about-preview .about-row.clean .brand-about{ justify-self:start; }
}

/* V89: Home — About preview with proper content */
.about-preview img{ display:none !important; }
.about-preview .profile-photo,
.about-preview .brand-about{ display:block !important; }
.about-preview .about-row.clean{
  display:grid; grid-template-columns:auto auto; justify-content:center; align-items:center; gap:10px; margin-bottom:16px;
}
.about-preview .about-row.clean .profile-photo{ width:320px; height:auto; border-radius:18px; box-shadow: 0 10px 24px rgba(0,0,0,.35); }
.about-preview .about-row.clean .brand-about{ width:240px; height:auto; opacity:.98; }
.about-preview .about-copy .card-grid{ display:grid; grid-template-columns:repeat(3, minmax(220px,1fr)); gap:16px; }
.about-preview .about-copy .info-card{
  border:1px solid rgba(255,255,255,.18); border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  backdrop-filter: blur(8px) saturate(140%); padding:16px;
}
@media (max-width:1000px){
  .about-preview .about-row.clean{ grid-template-columns:1fr; }
  .about-preview .about-row.clean .profile-photo,
  .about-preview .about-row.clean .brand-about{ justify-self:start; }
  .about-preview .about-copy .card-grid{ grid-template-columns:repeat(2, minmax(220px,1fr)); }
}
@media (max-width:640px){
  .about-preview .about-copy .card-grid{ grid-template-columns:1fr; }
}

/* V90: About preview — force only photo + shield, kill strays & pseudo-elements */
.about-preview .about-head{ display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:16px; }
.about-preview img, .about-preview svg, .about-preview picture{ display:none !important; }
.about-preview .profile-photo, .about-preview .shield-logo{ display:block !important; }
.about-preview .about-head *::before, .about-preview .about-head *::after{ content:none !important; }
.about-preview .profile-photo{ width:320px; height:auto; border-radius:18px; box-shadow:0 10px 24px rgba(0,0,0,.35); }
.about-preview .shield-logo{ width:240px; height:auto; opacity:.98; }
.about-preview .about-copy .card-grid{ display:grid; grid-template-columns:repeat(3, minmax(220px,1fr)); gap:16px; }
.about-preview .about-copy .info-card{
  border:1px solid rgba(255,255,255,.18); border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  backdrop-filter: blur(8px) saturate(140%); padding:16px;
}
@media (max-width:1000px){
  .about-preview .about-head{ flex-direction:column; align-items:flex-start; gap:10px; }
  .about-preview .shield-logo{ width:220px; }
  .about-preview .about-copy .card-grid{ grid-template-columns:repeat(2, minmax(220px,1fr)); }
}
@media (max-width:640px){
  .about-preview .about-copy .card-grid{ grid-template-columns:1fr; }
}

/* V94: Home about row — photo + shield logo sizing */
.about-preview .about-row{ gap:12px; }
.about-preview .about-row .profile-photo{ width:320px; height:auto; border-radius:18px; }
.about-preview .about-row .brand-about{ width:240px; height:auto; opacity:.98; }

/* V95: Increase logo size by 10% */
.about-preview .about-row .brand-about{ width:264px !important; height:auto; }

/* V96: Double logo size (x2) with responsive cap */
.about-preview .about-row .brand-about{ width:480px !important; height:auto; }
@media (max-width:1024px){
  .about-preview .about-row .brand-about{ width:360px !important; }
}
@media (max-width:700px){
  .about-preview .about-row .brand-about{ width:240px !important; }
}

/* V97: Increase logo size by additional 20% */
.about-preview .about-row .brand-about{ width:576px !important; height:auto; }
@media (max-width:1024px){
  .about-preview .about-row .brand-about{ width:432px !important; }
}
@media (max-width:700px){
  .about-preview .about-row .brand-about{ width:288px !important; }
}
/* Optional: spacing tweak for heading */
.about-preview .about-copy .h2{ margin-bottom:10px; }

/* V98: 4 cards on one row in Home > About preview */
.about-preview .about-copy .card-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr)) !important;
  gap:16px;
}
@media (max-width:1100px){
  .about-preview .about-copy .card-grid{
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  }
}
@media (max-width:640px){
  .about-preview .about-copy .card-grid{
    grid-template-columns: 1fr !important;
  }
}

/* V99: Remove "Langues" card and layout 3 columns on one row */
.about-preview .about-copy .card-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(260px, 1fr)) !important;
  gap:16px;
}
@media (max-width:1100px){
  .about-preview .about-copy .card-grid{
    grid-template-columns: repeat(2, minmax(240px, 1fr)) !important;
  }
}
@media (max-width:640px){
  .about-preview .about-copy .card-grid{
    grid-template-columns: 1fr !important;
  }
}

/* V112: Optical centering for the home 'about' row (photo + logo) */
:root{
  --about-nudge-desktop: 28px;
  --about-gap-desktop: 20px;
}
.section.about-preview .container{ margin-left:auto; margin-right:auto; }
.about-preview .about-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: var(--about-gap-desktop);
  position:relative;
  left: var(--about-nudge-desktop);
}
.about-preview .about-row .brand-about{ margin:0; }
@media (max-width:1100px){
  .about-preview .about-row{
    left:0;
    gap:16px;
    flex-direction:column;
  }
}