/* ============================================================
   EOLIOS — Design System (refonte premium blanc & bleu)
   Type:  Space Grotesk · IBM Plex Sans · IBM Plex Mono
   ============================================================ */

:root {
  /* Neutrals — subtly cool whites */
  --white:      #ffffff;
  --paper:      #f7f9fc;
  --paper-2:    #eef3fa;
  --line:       #e2e8f2;
  --line-soft:  #edf1f8;

  /* Ink — deep navy family */
  --navy:       #071a33;
  --ink:        #0d2444;
  --ink-2:      #34507a;
  --muted:      #6c7f9c;
  --faint:      #9fb0c8;

  /* EOLIOS blue */
  --blue:       #1657e0;
  --blue-700:   #1140ac;
  --blue-bright:#2e7dff;
  --sky:        #e9f1ff;
  --sky-2:      #d7e6ff;

  /* Thermal CFD colormap (jet-like) */
  --t-0:  #181f6e;
  --t-1:  #1f4bd8;
  --t-2:  #2e86ff;
  --t-3:  #19c4c4;
  --t-4:  #8fe34a;
  --t-5:  #f7d13b;
  --t-6:  #f4831f;
  --t-7:  #e8392b;

  --grad-thermal: linear-gradient(120deg,
    var(--t-0) 0%, var(--t-1) 16%, var(--t-2) 32%,
    var(--t-3) 50%, var(--t-4) 64%, var(--t-5) 78%,
    var(--t-6) 90%, var(--t-7) 100%);

  /* Shadows */
  --sh-sm: 0 1px 2px rgba(7,26,51,.06), 0 1px 1px rgba(7,26,51,.04);
  --sh-md: 0 8px 24px -10px rgba(13,36,68,.16), 0 2px 6px rgba(13,36,68,.06);
  --sh-lg: 0 30px 60px -24px rgba(13,36,68,.28), 0 8px 24px -12px rgba(13,36,68,.12);
  --sh-blue: 0 14px 30px -10px rgba(22,87,224,.40);

  /* Geometry */
  --r-sm: 8px;
  --r:    14px;
  --r-lg: 22px;
  --r-xl: 30px;

  --maxw: 1200px;

  --ff-display: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif;
  --ff-body:    "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --ff-mono:    "IBM Plex Mono", ui-monospace, "SF Mono", monospace;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--ff-body);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: 17px;
  line-height: 1.6;
}

h1, h2, h3, h4 {
  font-family: var(--ff-display);
  color: var(--navy);
  letter-spacing: -.02em;
  line-height: 1.05;
  margin: 0;
  font-weight: 600;
  text-wrap: balance;
}

p { margin: 0; text-wrap: pretty; }
a { color: inherit; text-decoration: none; }

img { display: block; max-width: 100%; }

.wrap { max-width: var(--maxw); margin-inline: auto; padding-inline: 28px; }

/* ---------- Mono / eyebrow labels ---------- */
.kicker {
  font-family: var(--ff-mono);
  font-size: 12.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--blue);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.kicker::before {
  content: "";
  width: 26px; height: 1px;
  background: var(--blue);
  opacity: .55;
}
.kicker.center::before { display: none; }

/* ---------- Buttons ---------- */
.btn {
  --b: var(--blue);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: var(--ff-body);
  font-weight: 600;
  font-size: 15.5px;
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .25s ease, background .2s ease, color .2s ease, border-color .2s ease;
  white-space: nowrap;
}
.btn svg { width: 17px; height: 17px; }
.btn-primary {
  background: var(--blue);
  color: #fff;
  box-shadow: var(--sh-blue);
}
.btn-primary:hover { background: var(--blue-700); transform: translateY(-2px); }
.btn-ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line);
}
.btn-ghost:hover { border-color: var(--ink-2); background: var(--paper); }
.btn-dark { background: var(--navy); color: #fff; }
.btn-dark:hover { background: #0c2848; transform: translateY(-2px); }
.btn-white { background: #fff; color: var(--navy); }
.btn-white:hover { transform: translateY(-2px); box-shadow: var(--sh-md); }
/* ghost button for use on dark / blue backgrounds : keeps white text on hover */
.btn-ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); }
.btn-ghost-light:hover { background: rgba(255,255,255,.12); border-color: #fff; color: #fff; }

.arrow { transition: transform .2s ease; }
.btn:hover .arrow,
.txtlink:hover .arrow { transform: translateX(3px); }

.txtlink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  color: var(--blue);
  font-size: 15.5px;
}
.txtlink svg { width: 16px; height: 16px; }

/* ---------- Header / Nav ---------- */
/* ===== Two-tier header ===== */
.nav-row { max-width: var(--maxw); margin-inline: auto; padding-inline: 28px; display: flex; align-items: center; }
.nav-row-top { padding-block: 8px; gap: 22px; }
.nav-row-top .brand .logo-slot { width: 128px; height: 32px; }
.nav-util { margin-left: auto; display: flex; align-items: center; gap: 20px; }
.nav-util .btn { padding: 9px 18px; font-size: 13.5px; }
.nav-util .btn-primary { border-radius: 0; padding: 8px 16px; font-size: 13px; box-shadow: none; background: #0043AF; color: #fff; border-color: #0043AF; }
.nav-util .btn-primary:hover { background: #fff; color: #0043AF; border-color: #0043AF; transform: none; }
.nav-util .btn-primary svg { stroke: currentColor; }
.nav-util .btn svg { width: 15px; height: 15px; }
.nav-util > a { font-size: 13.5px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.nav-util > a:hover { color: var(--navy); }
.lang-sel { position: relative; }
.lang-btn { background: none; border: 0; cursor: pointer; font-family: var(--ff-mono); font-size: 12.5px; letter-spacing: .06em; color: var(--ink-2); display: inline-flex; align-items: center; gap: 6px; }
.lang-btn .fl, .lang-menu a .fl { font-size: 14px; line-height: 1; margin-right: 7px; font-family: "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; }
.lang-menu a .fl { display: inline-block; width: 18px; text-align: center; }
.lang-btn svg { width: 12px; height: 12px; }
.lang-btn:hover { color: var(--navy); }
.lang-menu { position: absolute; top: calc(100% + 10px); right: 0; background: #fff; border: 1px solid var(--line); box-shadow: var(--sh-lg); min-width: 180px; padding: 7px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease, visibility .2s; z-index: 90; }
.lang-sel:hover .lang-menu { opacity: 1; visibility: visible; transform: none; }
.lang-menu a { display: block; padding: 9px 12px; font-size: 13.5px; color: var(--ink); border-radius: 6px; }
.lang-menu a:hover { background: var(--paper); color: var(--blue); }
.lang-menu a b { font-family: var(--ff-mono); font-size: 11px; color: var(--muted); margin-right: 8px; }

.nav-bottom { border-top: 1px solid var(--line-soft); }
.nav-bottom .nav-row { position: relative; padding-block: 2px; }
.nav-bottom .nav-links { position: static; display: flex; justify-content: space-between; gap: 8px; width: 100%; margin: 0; }
.nav-bottom .nav-item { position: static !important; }
.nav-bottom .nav-trigger { font-size: 14px; font-weight: 600; letter-spacing: .01em; padding: 9px 0; white-space: nowrap; }

/* full-width mega centered on the page (independent of which domain is hovered) */
.mega.wide { left: 50%; right: auto; width: min(1160px, calc(100vw - 36px)); top: 100%; transform: translateX(-50%) translateY(8px); }
.nav-item.open .mega.wide { transform: translateX(-50%) translateY(0); }
.mega.wide::before { display: none; }

.nav {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.nav.scrolled { border-color: var(--line); box-shadow: 0 1px 0 rgba(7,26,51,.03); }

/* Overlay variant — nav floats over a dark hero (transparent, light text) */
.nav.over {
  position: fixed; left: 0; right: 0; top: 0;
  background: transparent; backdrop-filter: none; border-color: transparent;
}
.nav.over:not(.scrolled) .brand-name,
.nav.over:not(.scrolled) .nav-trigger,
.nav.over:not(.scrolled) .nav-links > a { color: #fff !important; }
.nav.over:not(.scrolled) .nav-util > a,
.nav.over:not(.scrolled) .lang-btn { color: rgba(255,255,255,.85); }
.nav.over:not(.scrolled) .nav-util > a:hover,
.nav.over:not(.scrolled) .lang-btn:hover { color: #fff; }
.nav.over:not(.scrolled) .nav-bottom { border-top-color: rgba(255,255,255,.16); }
.nav.over:not(.scrolled) .nav-trigger .chev { color: rgba(255,255,255,.7); }
.nav.over:not(.scrolled) .nav-links > a:hover,
.nav.over:not(.scrolled) .nav-trigger:hover { color: #cfe0ff; }
.nav.over:not(.scrolled) .lang { color: rgba(255,255,255,.75); }
.nav.over:not(.scrolled) .lang b { color: #fff; }
.nav.over:not(.scrolled) .logo-slot { border-color: rgba(255,255,255,.4); }
.nav.over:not(.scrolled) .logo-slot::part(placeholder) { color: rgba(255,255,255,.7); }
/* once scrolled, fall back to the solid light bar */
.nav.over.scrolled { background: rgba(255,255,255,.86); backdrop-filter: blur(14px); }
.nav-in {
  max-width: var(--maxw);
  margin-inline: auto;
  padding: 16px 28px;
  display: flex;
  align-items: center;
  gap: 38px;
}
.brand { display: flex; align-items: center; gap: 11px; }
.brand-mark {
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--navy);
  display: grid; place-items: center;
  position: relative; overflow: hidden;
  flex: none;
}
.brand-mark::before {
  content: ""; position: absolute; inset: 0;
  background: var(--grad-thermal);
  opacity: .9;
  -webkit-mask: radial-gradient(circle at 50% 120%, #000 30%, transparent 62%);
          mask: radial-gradient(circle at 50% 120%, #000 30%, transparent 62%);
}
.brand-mark span {
  position: relative; z-index: 1;
  font-family: var(--ff-display); font-weight: 700;
  color: #fff; font-size: 18px;
}
.brand-name {
  font-family: var(--ff-display);
  font-weight: 600; font-size: 20px;
  letter-spacing: .01em; color: var(--navy);
}
.brand-name b { color: var(--blue); font-weight: 600; }
.nav-links { display: flex; gap: 28px; margin-left: 8px; }
.nav-links > a {
  font-size: 15px; font-weight: 500; color: var(--ink-2);
  padding: 6px 0; position: relative;
}
.nav-links > a:hover { color: var(--navy); }

/* ---------- Mega menu ---------- */
.nav-item { position: relative; }
.nav-trigger {
  font-family: var(--ff-body);
  font-size: 15px; font-weight: 500; color: var(--ink-2);
  background: none; border: 0; cursor: pointer;
  padding: 6px 0; display: inline-flex; align-items: center; gap: 6px;
}
.nav-trigger:hover, .nav-item.open .nav-trigger { color: var(--navy); }
.nav-trigger .chev { width: 14px; height: 14px; transition: transform .25s ease; color: var(--faint); }
.nav-item.open .nav-trigger .chev { transform: rotate(180deg); color: var(--blue); }

.mega {
  position: absolute; top: calc(100% + 14px); left: 0;
  transform: translateY(8px);
  width: min(940px, calc(100vw - 40px));
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-lg);
  padding: 14px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s ease, transform .26s cubic-bezier(.2,.7,.2,1), visibility .22s;
  z-index: 80;
}
.nav-item.open .mega { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
.mega::before {
  content: ""; position: absolute; top: -7px; left: 40px; transform: rotate(45deg);
  width: 13px; height: 13px; background: #fff;
  border-left: 1px solid var(--line); border-top: 1px solid var(--line);
  border-radius: 3px 0 0 0;
}
.mega-in { display: grid; grid-template-columns: 1fr 268px; gap: 14px; }

.mega-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.mega-card {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 14px 15px; border-radius: var(--r);
  transition: background .18s ease;
}
.mega-card:hover { background: var(--paper); }
.mega-card .mc-ic {
  flex: none; width: 42px; height: 42px; border-radius: 11px;
  background: var(--sky); color: var(--blue);
  display: grid; place-items: center; transition: background .18s ease, color .18s ease;
}
.mega-card .mc-ic svg { width: 22px; height: 22px; }
.mega-card:hover .mc-ic { background: var(--blue); color: #fff; }
.mega-card .mc-t {
  font-family: var(--ff-display); font-weight: 600; font-size: 15.5px;
  color: var(--navy); display: flex; align-items: center; gap: 7px;
}
.mega-card .mc-t .badge {
  font-family: var(--ff-mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--blue); background: var(--sky); padding: 2px 6px; border-radius: 5px;
}
.mega-card .mc-d { font-size: 13px; color: var(--muted); margin-top: 3px; line-height: 1.45; }

.mega-rail {
  position: relative; overflow: hidden;
  border-radius: var(--r); padding: 22px;
  display: flex; flex-direction: column;
  background: var(--navy); color: #fff; min-height: 230px;
}
.mega-rail .thermal { position: absolute; inset: 0; opacity: .5; }
.mega-rail .rail-in { position: relative; z-index: 2; display: flex; flex-direction: column; height: 100%; }
.mega-rail .rk {
  font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  color: #9fc0ff;
}
.mega-rail h4 { color: #fff; font-size: 20px; margin-top: 12px; line-height: 1.1; }
.mega-rail p { color: #c4d4ee; font-size: 13px; margin-top: 8px; }
.mega-rail .rail-cta {
  margin-top: auto; display: inline-flex; align-items: center; gap: 8px;
  font-weight: 600; font-size: 14px; color: #fff;
  padding-top: 16px;
}
.mega-rail .rail-cta svg { width: 15px; height: 15px; transition: transform .2s ease; }
.mega-rail .rail-cta:hover svg { transform: translateX(3px); }

.mega-foot {
  margin-top: 8px; padding: 12px 15px 6px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  border-top: 1px solid var(--line-soft);
}
.mega-foot span { font-family: var(--ff-mono); font-size: 11.5px; color: var(--muted); letter-spacing: .04em; }
.mega-foot .txtlink { font-size: 14px; }

@media (max-width: 1040px) { .mega { width: min(760px, calc(100vw - 32px)); } }

/* ============ eolios-style domain mega menu ============ */
.nav-bottom .nav-trigger { text-decoration: none; }
.nav-bottom .nav-trigger .lbl { transition: color .2s ease; }
.nav-bottom .nav-trigger:hover .lbl,
.nav-item.open > .nav-trigger .lbl {
  background: var(--grad-thermal); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.nav-item.open > .nav-trigger .chev { color: var(--blue); }
.mega.wide { width: min(1160px, calc(100vw - 36px)); padding: 0; overflow: hidden; }
.mega.wide::before { left: 60px; }
.mega-cols { display: grid; grid-template-columns: 1fr 308px; }
.mega-main { padding: 24px 28px 26px; }
.msec-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); padding-bottom: 11px; }
.msec-head .t { font-family: var(--ff-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.msec-head a { font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); display: inline-flex; gap: 7px; align-items: center; }
.msec-head a:hover { color: var(--blue); }
.msec-head [data-nolink] { font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); display: inline-flex; gap: 7px; align-items: center; cursor: default; }
.msec-head [data-nolink] .t { color: var(--faint); }
.exp-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 34px; margin-bottom: 8px; }
.exp-list a { display: flex; gap: 11px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--line-soft); font-size: 13.5px; color: var(--ink); font-weight: 500; line-height: 1.3; }
.exp-list a .ar { color: var(--blue); flex: none; margin-top: 1px; transition: transform .18s ease; }
.exp-list a:hover { color: var(--blue); }
.exp-list a:hover .ar { transform: translate(2px,-2px); }
/* fallback (untranslated target) — match the link row layout but muted & non-clickable */
.exp-list > [data-nolink] { display: flex; gap: 11px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--line-soft); font-size: 13.5px; color: var(--muted); font-weight: 500; line-height: 1.3; cursor: default; }
.exp-list > [data-nolink] .ar { color: var(--faint); flex: none; margin-top: 1px; }
.mega-projwrap { margin-top: 22px; }
.mega-proj { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 14px; }
.mega-pc { position: relative; aspect-ratio: 2/1; overflow: hidden; background: var(--grad-thermal); display: block; }
.mega-pc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mega-pc:hover img { transform: scale(1.06); }
.mega-pc .g { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 42%, rgba(4,12,30,.82)); }
.mega-pc b { position: absolute; left: 12px; right: 12px; bottom: 10px; color: #fff; font-family: var(--ff-display); font-weight: 600; font-size: 12.5px; z-index: 1; line-height: 1.18; }
.mega-rail2 { background: var(--paper); border-left: 1px solid var(--line); padding: 22px; }
.mega-feat { display: block; position: relative; aspect-ratio: 16/9; overflow: hidden; background: var(--navy); }
.mega-feat img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mega-feat:hover img { transform: scale(1.05); }
.mega-feat .ov { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7,26,51,.15) 0%, rgba(7,26,51,.55) 55%, rgba(7,26,51,.92) 100%); z-index: 1; }
.mega-feat .thermal { position: absolute; inset: 0; opacity: .6; }
.mega-feat .fin { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; padding: 16px; }
.mega-feat .ek { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #8fb6ff; }
.mega-feat h5 { color: #fff; font-family: var(--ff-display); font-size: 17px; font-weight: 600; line-height: 1.15; margin-top: 5px; }
.mega-feat .fbtn { margin-top: 11px; align-self: flex-start; display: inline-flex; align-items: center; gap: 7px; background: #0043AF; color: #fff; font-weight: 600; font-size: 12px; padding: 9px 14px; transition: background .2s; }
.mega-feat .fbtn svg { width: 13px; height: 13px; }
.mega-feat:hover .fbtn { background: #00a3b4; }
.mega-ress { margin-top: 20px; }
.mega-ress a { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; color: var(--ink-2); line-height: 1.3; }
.mega-ress a .ar { color: var(--blue); flex: none; margin-top: 1px; }
.mega-ress a:hover { color: var(--blue); }
.mega-ress > [data-nolink] { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; color: var(--muted); line-height: 1.3; cursor: default; }
.mega-ress > [data-nolink] .ar, .mega-ress > [data-nolink] .rthumb { flex: none; }
@media (max-width: 1100px) { .mega.wide { width: min(820px, calc(100vw - 28px)); } .mega-cols { grid-template-columns: 1fr; } .mega-rail2 { border-left: 0; border-top: 1px solid var(--line); } }
.nav-cta { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.nav-cta .lang {
  font-family: var(--ff-mono); font-size: 12.5px; color: var(--muted);
  letter-spacing: .08em; cursor: pointer;
}
.nav-cta .lang b { color: var(--navy); }

/* ---------- Section scaffolding ---------- */
.section { padding: 110px 0; }
.section.tight { padding: 78px 0; }
.section-head { max-width: 720px; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head h2 {
  font-size: clamp(30px, 4vw, 46px);
  margin-top: 18px;
}
.section-head p {
  margin-top: 18px; color: var(--ink-2); font-size: 18px;
}

.eyebrow-row { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; }

/* ---------- CFD thermal field (decorative data-viz) ---------- */
.thermal {
  position: relative; overflow: hidden;
  background: #07112a;
}
.thermal::before {
  content: ""; position: absolute; inset: -20%;
  background:
    radial-gradient(40% 55% at 22% 38%, rgba(46,134,255,.95), transparent 60%),
    radial-gradient(34% 46% at 62% 30%, rgba(25,196,196,.85), transparent 62%),
    radial-gradient(30% 40% at 78% 62%, rgba(247,209,59,.85), transparent 60%),
    radial-gradient(26% 38% at 90% 50%, rgba(244,131,31,.9), transparent 58%),
    radial-gradient(22% 30% at 96% 46%, rgba(232,57,43,.85), transparent 60%),
    radial-gradient(50% 60% at 8% 70%, rgba(24,31,110,.95), transparent 65%);
  filter: blur(14px) saturate(1.15);
  animation: drift 24s ease-in-out infinite alternate;
}
.thermal::after {
  content: ""; position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,.05) 0 1px, transparent 1px 26px);
  mix-blend-mode: screen; opacity: .5;
}
@keyframes drift {
  0%   { transform: translate3d(0,0,0) scale(1.02); }
  100% { transform: translate3d(-3%,2%,0) scale(1.08); }
}
@media (prefers-reduced-motion: reduce) { .thermal::before { animation: none; } }

/* streamline overlay used on cards */
.streamlines {
  position: absolute; inset: 0; opacity: .5;
  background-image:
    repeating-radial-gradient(circle at 30% 120%, transparent 0 18px, rgba(255,255,255,.10) 18px 19px, transparent 19px 40px);
  -webkit-mask: linear-gradient(0deg, transparent, #000 40%);
          mask: linear-gradient(0deg, transparent, #000 40%);
}

/* ---------- Image slot base look ---------- */
image-slot {
  --slot-bg: #07112a;
  background: var(--grad-thermal);
  color: #eaf2ff;
  border-radius: 0 !important;
}
image-slot::part(placeholder) {
  font-family: var(--ff-mono);
  letter-spacing: .04em;
  font-size: 12.5px;
}

/* ---------- Cards ---------- */
.card.proj { border-radius: 0; }
.card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: transform .22s ease, box-shadow .3s ease, border-color .3s ease;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); border-color: var(--sky-2); }

/* ---------- Stats ---------- */
.stat-n {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: clamp(40px, 5vw, 58px);
  letter-spacing: -.03em;
  color: var(--navy);
  line-height: 1;
}
.stat-n .u { color: var(--blue); }
.stat-l {
  font-family: var(--ff-mono); font-size: 12.5px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
  margin-top: 12px;
}

/* ---------- Footer ---------- */
.footer { background: var(--navy); color: #cdd9ec; padding: 80px 0 40px; }
.footer a { color: #cdd9ec; }
.footer a:hover { color: #fff; }

/* ---------- Reveal on scroll (progressive enhancement) ---------- */
.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; } }

/* ---------- EOLIOS logo lockup ---------- */
.brand { gap: 12px; }
.logo-mark { width: 38px; height: 38px; flex: none; display: block; }
.logo-word {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 21px;
  letter-spacing: .005em;
  color: var(--navy);
  line-height: 1;
}
.logo-word i { color: var(--blue); font-style: normal; }
.foot-brand .logo-word { color: #fff; }
.foot-brand .logo-word i { color: #3fdada; }
/* real logo image */
.logo-img { height: 34px; width: auto; display: block; }
.nav-row-top .brand .logo-img { height: 30px; }
.foot-brand .logo-img-white { height: 40px; filter: none; background: #fff; padding: 8px 12px; border-radius: 8px; }
.nav.over:not(.scrolled) .logo-img { filter: brightness(0) invert(1); }

/* ---------- Logo drop slot (user-supplied) ---------- */
.brand .logo-slot {
  width: 158px; height: 42px;
  background: transparent;
  border: 1px dashed var(--line);
  border-radius: 8px;
  transition: border-color .2s ease;
}
.brand .logo-slot:hover { border-color: var(--sky-2); }
.brand .logo-slot::part(placeholder) {
  font-family: var(--ff-mono); font-size: 9px; letter-spacing: .1em;
  color: var(--muted); text-transform: uppercase;
}
.foot-brand .logo-slot { border-color: rgba(255,255,255,.2); }
.foot-brand .logo-slot::part(placeholder) { color: #7d92b4; }

/* ============================================================
   PAGE TEMPLATES — sub-expertise (niv.3) & project (niv.4)
   ============================================================ */

/* Breadcrumb bar */
.crumbbar { border-bottom: 1px solid var(--line-soft); background: #fff; }
.crumbbar .wrap { padding-block: 16px; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; font-family: var(--ff-mono); font-size: 12px; letter-spacing: .03em; color: var(--muted); }
.crumbs a { color: var(--ink-2); }
.crumbs a:hover { color: var(--blue); }
.crumbs .sep { color: var(--faint); }
.crumbs .here { color: var(--navy); }

/* ---- Sub-expertise hero (light) ---- */
.sx-hero { padding: 60px 0 58px; border-bottom: 1px solid var(--line-soft); }
.sx-hero .kicker { margin-bottom: 18px; }
.sx-hero h1 { font-size: clamp(34px, 4.6vw, 56px); max-width: 17ch; }
.sx-hero .lead { margin-top: 22px; font-size: 19px; color: var(--ink-2); max-width: 62ch; }
.sx-hero .hero-cta { margin-top: 30px; display: flex; gap: 14px; flex-wrap: wrap; }

/* model list (what we model) */
.model-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.model-list { columns: 2; column-gap: 30px; margin-top: 8px; }
.model-list li { list-style: none; display: flex; gap: 11px; align-items: flex-start; padding: 9px 0; break-inside: avoid; }
.model-list .ck { flex: none; width: 22px; height: 22px; border-radius: 6px; background: var(--sky); color: var(--blue); display: grid; place-items: center; margin-top: 1px; }
.model-list .ck svg { width: 13px; height: 13px; }
.model-list span.t { font-size: 15px; color: var(--ink); }
.model-visual { border-radius: 0; overflow: hidden; aspect-ratio: 4/3.4; box-shadow: var(--sh-lg); border: 1px solid var(--line); position: relative; }
.model-visual image-slot { width: 100%; height: 100%; }

/* scenarios matrix */
.scn-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 22px; margin-top: 46px; }
.scn { padding: 28px; }
.scn .h { display: flex; align-items: center; gap: 12px; }
.scn .h .ic { width: 44px; height: 44px; border-radius: 12px; background: var(--sky); color: var(--blue); display: grid; place-items: center; flex: none; }
.scn .h .ic svg { width: 22px; height: 22px; }
.scn h3 { font-size: 20px; }
.scn .tags { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.scn .tags span { font-family: var(--ff-mono); font-size: 11.5px; letter-spacing: .04em; color: var(--ink-2); background: var(--paper-2); border: 1px solid var(--line); padding: 6px 11px; border-radius: 8px; }

/* ---- Project page two-column ---- */
.section:has(> .wrap > .proj-layout) { background: var(--paper); }
.proj-layout { display: grid; grid-template-columns: 296px 1fr; gap: 40px; align-items: start; }
/* the text column floats as its own sheet */
/* the text column: summary sheet + article sheet, each floating */
.proj-main { background: transparent; box-shadow: none; padding: 0; }
.proj-main > * + * { margin-top: 26px; }
.proj-summary, .proj-article { background: #fff; padding: 44px 48px; box-shadow: 0 26px 64px -32px rgba(13,36,68,.22), 0 3px 12px rgba(13,36,68,.05); }
.proj-summary > * + *, .proj-article > * + * { margin-top: 40px; }
@media (max-width: 760px) { .proj-summary, .proj-article { padding: 26px 22px; } }
.proj-aside { position: static; align-self: start; display: flex; flex-direction: column; gap: 18px; }
.aside-head { background: #fff; border: 1px solid var(--line-soft); box-shadow: 0 16px 38px -24px rgba(13,36,68,.20), 0 2px 8px rgba(13,36,68,.04); padding: 24px 20px; text-align: center; }
.aside-head .ah-domain { font-family: var(--ff-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.aside-head .ah-domain:hover { text-decoration: underline; }
.aside-head .ah-type { display: block; font-family: var(--ff-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-top: 7px; }
.aside-head .ah-title { font-family: var(--ff-display); font-weight: 600; font-size: 20px; color: var(--navy); margin-top: 11px; line-height: 1.2; letter-spacing: -.01em; }
.aside-head .ah-rule { display: none; }
/* aside-head with project background image */
.aside-head.has-bg { position: relative; border: 0; padding: 28px 22px; overflow: hidden; color: #fff; }
.aside-head.has-bg::before { content: ""; position: absolute; inset: 0; background-size: cover; background-position: center; background-image: var(--ah-img); z-index: 0; }
.aside-head.has-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7,17,42,.55), rgba(7,17,42,.82)); z-index: 1; }
.aside-head.has-bg > * { position: relative; z-index: 2; }
.aside-head.has-bg .ah-domain { color: #8fc0ff; }
.aside-head.has-bg .ah-type { color: #c4d4ee; }
.aside-head.has-bg .ah-title { color: #fff; }
.aside-card { border: 1px solid var(--line-soft); border-radius: 3px; background: #fff; overflow: hidden; box-shadow: 0 16px 38px -24px rgba(13,36,68,.20), 0 2px 8px rgba(13,36,68,.04); }
.aside-card .ac-head { font-family: var(--ff-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 16px 20px 0; }
.fiche { padding: 8px 20px 18px; }
.fiche dl { margin: 0; display: grid; grid-template-columns: 1fr; gap: 0; }
.fiche .row { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
.fiche .row:last-child { border-bottom: 0; }
.fiche dt { font-family: var(--ff-mono); font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.fiche dd { margin: 0; font-weight: 600; color: var(--navy); font-size: 14.5px; text-align: right; }

.aside-links { padding: 6px 12px 12px; }
.aside-links a { display: flex; align-items: center; gap: 12px; padding: 12px 10px; border-radius: 10px; transition: background .16s ease; }
.aside-links a:hover { background: var(--paper); }
.aside-links a .mk { flex: none; width: 36px; height: 28px; border-radius: 6px; overflow: hidden; position: relative; background: var(--grad-thermal); }
.aside-links a .mk.topic { background: var(--sky); color: var(--blue); display: grid; place-items: center; }
.aside-links a .mk.topic svg { width: 16px; height: 16px; }
.aside-links a .tx { display: flex; flex-direction: column; }
.aside-links a .tx b { font-family: var(--ff-display); font-weight: 600; font-size: 14px; color: var(--navy); line-height: 1.2; }
.aside-links a .tx s { text-decoration: none; font-family: var(--ff-mono); font-size: 10.5px; color: var(--muted); letter-spacing: .03em; margin-top: 2px; }
.aside-links a .go { margin-left: auto; color: var(--faint); flex: none; transition: transform .18s ease, color .18s ease; }
.aside-links a:hover .go { color: var(--blue); transform: translateX(2px); }

.aside-cta { background: var(--navy); color: #fff; border-radius: 3px; padding: 22px; position: relative; overflow: hidden; }
.aside-cta .thermal { position: absolute; inset: 0; opacity: .45; }
.aside-cta .in { position: relative; z-index: 2; }
.aside-cta h4 { color: #fff; font-size: 18px; line-height: 1.15; }
.aside-cta p { color: #c4d4ee; font-size: 13px; margin-top: 8px; }
.aside-cta .btn { margin-top: 16px; width: 100%; justify-content: center; }

/* project main column */
.proj-main > * + * { margin-top: 40px; }
.proj-hero-visual { border-radius: 0; overflow: hidden; aspect-ratio: 16/9; position: relative; box-shadow: var(--sh-lg); border: 1px solid var(--line); }
.proj-hero-visual image-slot { width: 100%; height: 100%; }
.proj-block h2 { font-size: clamp(25px, 3vw, 34px); }
.proj-block h2 .num { font-family: var(--ff-mono); font-size: .5em; color: var(--blue); letter-spacing: .04em; vertical-align: middle; margin-right: 12px; }
.proj-block p { margin-top: 16px; color: var(--ink); font-size: 17px; text-align: justify; -webkit-hyphens: none; hyphens: none; }
.proj-block p + p { margin-top: 14px; }
.lede { font-size: 17px !important; color: var(--ink) !important; line-height: 1.72; text-align: justify; -webkit-hyphens: none; hyphens: none; }

.method-steps { margin-top: 22px; display: flex; flex-direction: column; gap: 2px; }
.method-steps .ms { display: flex; gap: 18px; padding: 18px 0; border-top: 1px solid var(--line-soft); }
.method-steps .ms:first-child { border-top: 0; }
.method-steps .ms .n { font-family: var(--ff-mono); font-size: 13px; color: var(--blue); flex: none; width: 30px; padding-top: 2px; }
.method-steps .ms b { font-family: var(--ff-display); font-weight: 600; color: var(--navy); font-size: 17px; }
.method-steps .ms p { margin-top: 5px; font-size: 15.5px; }

.res-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 24px; }
.res-cards .rc { padding: 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); }
.res-cards .rc .n { font-family: var(--ff-display); font-weight: 600; font-size: 34px; color: var(--navy); letter-spacing: -.02em; }
.res-cards .rc .n .u { color: var(--blue); }
.res-cards .rc .l { font-size: 13.5px; color: var(--ink-2); margin-top: 8px; }

.callout { border-left: 3px solid var(--blue); background: var(--sky); border-radius: 0 var(--r) var(--r) 0; padding: 22px 26px; }
.callout p { margin: 0; color: var(--ink); font-size: 17px; }
.callout .src { font-family: var(--ff-mono); font-size: 11.5px; color: var(--blue); letter-spacing: .06em; text-transform: uppercase; margin-top: 12px; }

/* ---- article reading-aerators (break up heavy text) ---- */
/* key figures strip */
.keyfacts { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.kf { border: 1px solid var(--line); background: var(--paper); padding: 20px; text-align: center; }
.kf .ic { width: 34px; height: 34px; color: var(--blue); display: grid; place-items: center; margin: 0 auto 12px; }
.kf .ic svg { width: 24px; height: 24px; }
.kf .n { font-family: var(--ff-display); font-weight: 600; font-size: 27px; color: var(--navy); letter-spacing: -.02em; line-height: 1; }
.kf .n .u { color: var(--blue); font-size: .7em; }
.kf .l { font-size: 13px; color: var(--ink); font-weight: 600; margin-top: 8px; line-height: 1.35; }
/* insight note with icon */
.art-note { display: flex; gap: 16px; background: var(--sky); border: 1px solid var(--sky-2); padding: 20px 22px; align-items: flex-start; margin: 24px 0; clear: both; }
.art-note .ic { flex: none; width: 30px; height: 30px; background: var(--blue); color: #fff; display: grid; place-items: center; }
.art-note .ic svg { width: 17px; height: 17px; }
.art-note p { margin: 0 !important; font-size: 15.5px; color: var(--ink); text-align: left !important; }
.art-note b { color: var(--navy); }
/* tools / method chips */
.art-tools { display: flex; flex-wrap: wrap; gap: 9px; }
.art-tools .chip { font-family: var(--ff-mono); font-size: 12px; letter-spacing: .03em; color: var(--ink-2); background: #fff; border: 1px solid var(--line); padding: 8px 13px; }
.art-tools .chip b { color: var(--navy); font-weight: 600; }
@media (max-width: 620px) { .keyfacts { grid-template-columns: 1fr; } }

/* bottom "other projects" rail */
.more-proj { border-top: 1px solid var(--line); }
.more-proj-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-top: 36px; }

@media (max-width: 1000px) {
  .model-grid { grid-template-columns: 1fr; }
  .scn-grid { grid-template-columns: 1fr; }
  /* Option B — la colonne de gauche se réorganise sur mobile/tablette :
     doublons masqués (fiche=meta-strip, projets liés=grille du bas, recherche=méga-menu, CTA=contact),
     on garde le sommaire (accordéon, en haut), la localisation et les dossiers techniques (en bas) */
  .proj-layout { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .proj-aside { display: contents; }
  .proj-aside > * { width: 100%; flex: none; }
  .proj-aside > [data-aside-kind="head"],
  .proj-aside > [data-aside-kind="fiche"],
  .proj-aside > [data-aside-kind="search"],
  .proj-aside > [data-aside-kind="cta"],
  .proj-aside > [data-aside-list="projets"] { display: none; }
  .proj-aside > [data-aside-kind="toc"] { order: -1; }
  .proj-main { order: 0; }
  .proj-aside > [data-aside-kind="map"] { order: 1; }
  .proj-aside > [data-aside-list="dossiers"] { order: 2; }
  /* sommaire repliable */
  .aside-acc .ac-head { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .aside-acc .ac-head::after { content: ""; flex: none; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; opacity: .55; }
  .aside-acc[data-open] .ac-head::after { transform: rotate(225deg); }
  .aside-acc .toc { display: none; }
  .aside-acc[data-open] .toc { display: block; margin-top: 12px; }
  .res-cards, .more-proj-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 620px) {
  .model-list { columns: 1; }
  .res-cards, .more-proj-grid { grid-template-columns: 1fr; }
}

/* ---------- Big video header (project hero) ---------- */
.video-hero {
  position: relative;
  min-height: 100vh;
  background: #040e22;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.video-hero.xl { min-height: 100vh; }
.video-hero .vbg {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
  pointer-events: none;
}
.video-hero .vbg iframe {
  position: absolute; top: 50%; left: 50%;
  width: 100vw; height: 56.25vw;          /* 16:9 by width */
  min-height: 100%; min-width: 177.78vh;  /* 16:9 by height — cover */
  transform: translate(-50%, -50%);
  border: 0;
}
.video-hero .vbg .vposter {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  filter: saturate(1.05) contrast(1.02);
  z-index: 0;
}
.video-hero .vbg .ytbg {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  opacity: 0; transition: opacity .8s ease; overflow: hidden;
}
.video-hero.playing .vbg .ytbg { opacity: 1; }
.video-hero .vbg .ytbg iframe {
  position: absolute; top: 50%; left: 50%;
  width: 100vw !important; height: 56.25vw !important;          /* 16:9 by width */
  min-height: 100% !important; min-width: 177.78vh !important;  /* 16:9 by height — cover */
  transform: translate(-50%, -50%); border: 0;
}
/* sound toggle */
.vsound {
  position: absolute; z-index: 4; right: 28px; bottom: 28px;
  display: inline-flex; align-items: center; gap: 10px;
  background: rgba(7,17,42,.55); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.22); border-radius: 999px;
  padding: 11px 18px 11px 13px; cursor: pointer; color: #fff;
  font-family: var(--ff-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  transition: background .2s ease, transform .2s ease;
}
.vsound:hover { background: rgba(22,87,224,.7); transform: translateY(-1px); }
.vsound .ic { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.15); display: grid; place-items: center; flex: none; }
.vsound .ic svg { width: 14px; height: 14px; }
.vsound .on { display: none; }
.vsound.unmuted .on { display: inline; }
.vsound.unmuted .off { display: none; }
@media (max-width: 760px) { .vsound { right: 16px; bottom: 16px; } }
.video-hero .vveil {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(4,12,30,.32) 0%, rgba(4,12,30,.05) 40%, rgba(4,12,30,.55) 82%, rgba(4,12,30,.9) 100%);
}
.video-hero .vgrid {
  position: absolute; inset: 0; z-index: 1; opacity: .5;
  background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.045) 0 1px, transparent 1px 30px);
  -webkit-mask: linear-gradient(0deg, #000, transparent 65%); mask: linear-gradient(0deg, #000, transparent 65%);
}
.video-hero .wrap { position: relative; z-index: 2; width: 100%; padding-block: 0 56px; }
.video-hero .crumbs { color: #a9c4ee; }
.video-hero .crumbs a { color: #c9dcf7; }
.video-hero .crumbs a:hover { color: #fff; }
.video-hero .crumbs .here { color: #fff; }
.video-hero .vkicker { margin-top: 28px; color: #8fb6ff; }
.video-hero .vkicker::before { background: #8fb6ff; opacity: .6; }
.video-hero h1 {
  color: #fff; font-size: clamp(32px, 4.4vw, 58px);
  max-width: 19ch; margin-top: 18px; line-height: 1.02;
}
.video-hero .vlead {
  color: #d3e1f6; font-size: 19px; margin-top: 20px; max-width: 60ch;
}
.video-hero .vmeta {
  margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px;
}
.video-hero .vmeta .chip {
  font-family: var(--ff-mono); font-size: 12px; letter-spacing: .04em;
  color: #e7f0ff; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18); padding: 9px 15px; border-radius: 999px;
  backdrop-filter: blur(4px);
}
.video-hero .vmeta .chip b { color: #fff; font-weight: 600; }
.vplay {
  position: absolute; z-index: 3; right: 28px; top: 50%; transform: translateY(-50%);
  display: flex; align-items: center; gap: 14px;
  background: rgba(7,17,42,.6); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.2); border-radius: 999px;
  padding: 12px 20px 12px 14px; cursor: pointer; color: #fff;
  font-family: var(--ff-body); font-weight: 600; font-size: 14.5px;
  transition: background .2s ease, transform .2s ease;
}
.vplay:hover { background: rgba(22,87,224,.7); transform: translateY(-50%) scale(1.03); }
.vplay .pp { width: 38px; height: 38px; border-radius: 50%; background: #fff; color: var(--blue); display: grid; place-items: center; flex: none; }
.vplay .pp svg { width: 16px; height: 16px; margin-left: 2px; }
@media (max-width: 760px) { .vplay { display: none; } .video-hero { min-height: 72vh; } }

/* Inline video block (in body, with sound + controls) */
.video-embed {
  position: relative; border-radius: 0; overflow: hidden;
  aspect-ratio: 16/9; box-shadow: var(--sh-lg); border: 1px solid var(--line);
  background: #040e22;
}
.video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-cap {
  margin-top: 14px; font-family: var(--ff-mono); font-size: 12.5px;
  color: var(--muted); letter-spacing: .03em;
  display: flex; align-items: center; gap: 9px;
}
.video-cap::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); flex: none; }

/* meta strip below hero */
.meta-strip { background: var(--navy); color: #fff; }
.meta-strip .wrap { display: flex; flex-wrap: wrap; gap: 14px 56px; padding-block: 26px; }
.meta-strip .mi { display: flex; flex-direction: column; gap: 5px; }
.meta-strip .mi dt { font-family: var(--ff-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #8fa3c2; }
.meta-strip .mi dd { margin: 0; font-family: var(--ff-display); font-weight: 600; font-size: 18px; color: #fff; }
.meta-strip .ms-cta { margin-left: auto; align-self: center; }

/* project content figures */
.fig { margin: 0; }
/* always keep clear breathing room around any media so it's never glued to text */
.proj-main .fig,
.proj-main .video-embed,
.proj-main .proj-hero-visual { margin-top: 14px; margin-bottom: 30px; }
.fig .ph {
  border-radius: 0; overflow: hidden; border: 1px solid var(--line);
  background: var(--paper-2); box-shadow: var(--sh-md);
}
.fig .ph img { width: 100%; height: auto; display: block; }
/* clickable figures — hover cue + zoom */
.fig .ph { cursor: zoom-in; position: relative; }
.fig .ph img { transition: transform .4s ease, filter .3s ease; }
.fig .ph:hover img { transform: scale(1.03); filter: saturate(1.05); }
.fig .ph::after { content: ""; position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border-radius: 50%; background: rgba(7,17,42,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23fff' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='M12.5 12.5 17 17M6 8h4M8 6v4'/%3E%3C/svg%3E") center/18px no-repeat; opacity: 0; transform: scale(.8); transition: opacity .25s ease, transform .25s ease; pointer-events: none; }
.fig .ph:hover::after { opacity: 1; transform: scale(1); }
/* lightbox overlay */
.lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(4,10,24,.92); display: flex; align-items: center; justify-content: center; padding: 4vw; opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s; cursor: zoom-out; }
.lightbox.open { opacity: 1; visibility: visible; }
.lightbox figure { margin: 0; max-width: 92vw; max-height: 90vh; display: flex; flex-direction: column; gap: 14px; align-items: center; transform: scale(.96); transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.lightbox.open figure { transform: scale(1); }
.lightbox img { max-width: 92vw; max-height: 80vh; object-fit: contain; box-shadow: 0 30px 80px -20px rgba(0,0,0,.7); }
.lightbox figcaption { font-family: var(--ff-mono); font-size: 13px; color: #cfe0ff; letter-spacing: .03em; text-align: center; }
.lightbox .lb-close { position: fixed; top: 22px; right: 26px; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.1); color: #fff; font-size: 22px; cursor: pointer; display: grid; place-items: center; transition: background .2s ease; }
.lightbox .lb-close:hover { background: rgba(255,255,255,.25); }
.fig figcaption {
  margin-top: 12px; font-family: var(--ff-mono); font-size: 12.5px;
  color: var(--muted); letter-spacing: .02em;
  display: flex; align-items: center; justify-content: center; text-align: center; gap: 9px;
}
.fig figcaption::before { content: "FIG"; font-size: 10px; letter-spacing: .1em; color: var(--blue); background: var(--sky); padding: 3px 7px; border-radius: 5px; flex: none; }
/* definition callout (expertise pages) */
.xp-def { margin-top: 24px; background: var(--sky); border-left: 3px solid var(--blue); padding: 18px 22px; }
.xp-def .t { display: block; font-family: var(--ff-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); margin-bottom: 8px; }
.xp-def p { margin: 0; color: #0d2444; font-size: 16px; line-height: 1.65; text-align: justify; -webkit-hyphens: none; hyphens: none; }
/* text + side image as a vertically-centred 2-col row (no float — balanced whitespace) */
.xp-figrow { display: grid; grid-template-columns: 1fr minmax(260px, 42%); gap: 36px; align-items: center; margin: 30px 0; }
.xp-figrow > .txt > :first-child { margin-top: 0; }
.xp-figrow > .txt > :last-child { margin-bottom: 0; }
.xp-figrow .fig { margin: 0; clear: none; }
@media (max-width: 760px) { .xp-figrow { grid-template-columns: 1fr; gap: 18px; } }
/* numbered/checked lists: number box optically aligned with the first text line */
.proj-list li { align-items: flex-start; }
.proj-list .ck { margin-top: 1px; }
.proj-list p { text-wrap: pretty; }
/* single in-body figures: centred block (not floated) */
.fig-side { float: none; clear: both; width: 100%; max-width: 640px; margin: 30px auto; }
.fig-side figcaption { justify-content: center; text-align: center; }
/* editorial rhythm: lead paragraph after a section title + alternating side images */
.proj-article .proj-section-title + p, .proj-article .proj-section-title + h3 + p { font-size: 17px; color: var(--ink); }
.proj-article .fig-side:nth-of-type(even) { float: none; margin: 30px auto; }
/* prevent floated side-images from rising beside titles/notes — keep clean two-column rhythm */
.proj-article .proj-section-title, .proj-article h3, .proj-article .art-note, .proj-article .keyfacts, .proj-article .proj-list, .proj-summary { clear: both; }
.fig:not(.fig-side) { clear: both; }
@media (max-width: 700px) { .fig-side { float: none; width: 100%; margin: 18px 0; } }
/* floated in-body figure that body text wraps around (expertise/dossier articles) */
.xp-article .fig-wrap { float: right; clear: none; width: min(42%, 360px); margin: 6px 0 20px 28px; }
@media (max-width: 700px) { .xp-article .fig-wrap { float: none; width: 100%; margin: 24px 0; } }
/* paired figures sit side-by-side as a clean 2-up row */
.fig-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; clear: both; }
.proj-main .fig-row { margin-top: 14px; margin-bottom: 30px; }
.fig-row .fig { margin: 0; min-width: 0; }
.fig-row .fig video, .fig-row .fig img { max-width: 100%; }
.fig-row .fig .ph video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fig-row .fig .ph { height: auto; aspect-ratio: 16 / 10; }
.fig-row .fig .ph img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 640px) { .fig-row { grid-template-columns: 1fr; } }
/* paires injectées (.proj-fig-row) : deux médias côte à côte alignés verticalement (même hauteur) — comme .fig-row */
.proj-fig-row { align-items: stretch; }
.proj-fig-row > .fig { margin: 0; min-width: 0; }
.proj-fig-row > .fig .ph { aspect-ratio: 16 / 10; position: relative; overflow: hidden; }
.proj-fig-row > .fig .ph video, .proj-fig-row > .fig .ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 640px) { .proj-fig-row { grid-template-columns: 1fr !important; } }
/* deux médias côte à côte : neutralise la marge d'empilement verticale (.section .fig + .fig) qui décalait la 2ᵉ figure → bords alignés */
.proj-main .fig-row > .fig + .fig, .proj-main .proj-fig-row > .fig + .fig,
.xp-article .fig-row > .fig + .fig, .dt-article .fig-row > .fig + .fig { margin-top: 0; }
/* vidéos pleine largeur dans l'article (figure.fig directe) : cadrage 16/9 cohérent (les vidéos sont en 1280×720) — évite que la figure prenne l'aspect du poster */
.proj-article > figure.fig > .ph:has(> video) { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--navy); }
.proj-article > figure.fig > .ph > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* breathing room under the "other projects" heading */
.more-proj .eyebrow-row { margin-bottom: 30px; }
.more-proj .proj-card-grid { margin-top: 6px; }

/* content sub-headings & lists in project main */
.proj-main h3 {
  font-family: var(--ff-display); font-weight: 600; color: var(--navy);
  font-size: 21px; margin: 0; line-height: 1.2; text-align: justify;
}
.proj-block > h3 { margin-top: 30px; }
.proj-block > h3:first-child { margin-top: 0; }
.proj-block h3 + p { margin-top: 14px; }
.proj-list { margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.proj-list li { list-style: none; display: flex; gap: 14px; align-items: flex-start; }
.proj-list .ck { flex: none; width: 26px; height: 26px; border-radius: 7px; background: var(--sky); color: var(--blue); display: grid; place-items: center; margin-top: 2px; font-family: var(--ff-mono); font-size: 12px; font-weight: 500; }
.proj-list p { margin: 0; font-size: 16px; color: var(--ink-2); text-align: left; -webkit-hyphens: none; hyphens: none; }
.proj-list b { color: var(--navy); font-family: var(--ff-display); font-weight: 600; }
.ref-link {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 6px;
  font-family: var(--ff-mono); font-size: 13px; letter-spacing: .02em;
  color: var(--blue); font-weight: 500;
}
.ref-link::before { content: "→"; }
.ref-link:hover { text-decoration: underline; }
/* end-of-article related links */
.art-related { margin-top: 14px; }
.proj-main > .art-related { background: #fff; padding: 34px 44px; box-shadow: 0 26px 64px -32px rgba(13,36,68,.22), 0 3px 12px rgba(13,36,68,.05); }
@media (max-width: 760px) { .proj-main > .art-related { padding: 24px 22px; } }
.art-sep { display: block; width: 110px; height: 2px; background: var(--line); margin: 0 auto 22px; }
.art-related-h { display: block; text-align: center; font-family: var(--ff-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 18px; }
.art-related-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.art-related-grid a { display: flex; flex-direction: column; gap: 5px; padding: 16px 18px; border: 1px solid var(--line); background: var(--paper); transition: border-color .2s ease, box-shadow .3s ease, background .2s ease; }
.art-related-grid a:hover { border-color: var(--sky-2); background: #fff; box-shadow: var(--sh-md); }
.art-related-grid a .k { font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.art-related-grid a .t { font-family: var(--ff-display); font-weight: 600; color: var(--navy); font-size: 15px; line-height: 1.25; }
.art-related-grid a[target] .t::after { content: " ↗"; color: var(--faint); }
@media (max-width: 620px) { .art-related-grid { grid-template-columns: 1fr; } }
.proj-section-title {
  position: relative;
  font-size: clamp(26px, 3.2vw, 36px); color: var(--navy);
  margin-top: 40px; padding-bottom: 16px;
  border-bottom: 2px solid var(--blue);
  scroll-margin-top: 96px;
}
.proj-summary .proj-block:first-child > .proj-section-title { margin-top: 0; }

/* sidebar — table des matières */
.toc { display: flex; flex-direction: column; padding: 4px 10px 12px; }
.toc a {
  display: flex; gap: 11px; align-items: baseline;
  padding: 9px 12px; border-radius: 9px;
  font-size: 13.5px; color: var(--ink-2); line-height: 1.3;
  transition: background .15s ease, color .15s ease;
}
.toc a:hover { background: var(--paper); color: var(--navy); }
.toc a.active { background: var(--sky); color: var(--blue); font-weight: 600; }
.toc a .n { font-family: var(--ff-mono); font-size: 11px; color: var(--faint); flex: none; }
.toc a.active .n { color: var(--blue); }

/* sidebar — project / dossier cards with big images */
.side-list { display: flex; flex-direction: column; gap: 4px; padding: 6px 12px 8px; }
.side-card { display: block; border-radius: 3px; padding: 7px; transition: background .16s ease; }
.side-card:hover { background: var(--paper); }
.side-card .thumb {
  display: block; border-radius: 0; overflow: hidden;
  aspect-ratio: 16/9; background: var(--grad-thermal); position: relative;
  box-shadow: var(--sh-sm);
}
.side-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.side-card .t { display: block; font-family: var(--ff-display); font-weight: 600; font-size: 14.5px; color: var(--navy); margin-top: 10px; line-height: 1.22; }
.side-card:hover .t { color: var(--blue); }
.side-card .s { display: block; font-family: var(--ff-mono); font-size: 10.5px; color: var(--muted); margin-top: 4px; letter-spacing: .03em; }
/* variant: text above, larger image below (maximize image) */
.side-list.stacked { gap: 2px; }
.side-list.stacked .side-card { display: flex; flex-direction: column; padding: 9px 7px 12px; }
.side-list.stacked .side-card .s { order: 1; margin-top: 0; }
.side-list.stacked .side-card .t { order: 2; margin-top: 2px; margin-bottom: 9px; }
.side-list.stacked .side-card .thumb { order: 3; aspect-ratio: 16/10; }
.side-all {
  display: flex; align-items: center; gap: 8px; margin: 2px 12px 4px; padding: 12px 8px 4px;
  font-family: var(--ff-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--blue); border-top: 1px solid var(--line-soft); font-weight: 500;
}
.side-all svg { width: 14px; height: 14px; flex: none; transition: transform .18s ease; }
.side-all:hover svg { transform: translateX(3px); }
/* sidebar equivalent-project vignettes — large cards (image top, title below) */
.aside-vignettes { display: flex; flex-direction: column; gap: 12px; padding: 10px 12px 14px; }
.side-vignette { display: block; border: 1px solid var(--line-soft); border-radius: 4px; overflow: hidden; background: #fff; transition: box-shadow .25s ease, border-color .25s ease, transform .2s ease; }
.side-vignette:hover { box-shadow: var(--sh-md); border-color: var(--sky-2); transform: translateY(-2px); }
.side-vignette .thumb { display: block; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--navy); position: relative; }
.side-vignette .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.side-vignette:hover .thumb img { transform: scale(1.06); }
.side-vignette .thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(7,17,42,.35)); }
.side-vignette .tx { display: block; padding: 11px 13px 13px; }
.side-vignette .vt { display: block; font-family: var(--ff-display); font-weight: 600; font-size: 14px; color: var(--navy); line-height: 1.22; }
.side-vignette:hover .vt { color: var(--blue); }
.side-vignette .vs { display: block; text-decoration: none; font-family: var(--ff-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); margin-top: 6px; }

/* sidebar — localisation map */
.side-map .map-frame { margin-top: 12px; aspect-ratio: 4/3; overflow: hidden; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: var(--paper-2); position: relative; }
.side-map .map-frame iframe { width: 100%; height: calc(100% + 42px); border: 0; display: block; }
.side-map .map-cap { display: flex; align-items: center; gap: 11px; padding: 14px 18px 16px; }
.side-map .map-cap .pin { width: 32px; height: 32px; background: var(--sky); color: var(--blue); display: grid; place-items: center; flex: none; }
.side-map .map-cap .pin svg { width: 17px; height: 17px; }
.side-map .map-cap .loc b { font-family: var(--ff-display); font-weight: 600; color: var(--navy); font-size: 15px; display: block; line-height: 1.2; }
.side-map .map-cap .loc s { text-decoration: none; font-family: var(--ff-mono); font-size: 10.5px; color: var(--muted); letter-spacing: .03em; }
.proj-section-title::before {
  content: none;
}

/* ============ Expertise page elements ============ */
.exp-cap-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px 34px; margin-top: 36px; }
.exp-cap { display: flex; gap: 13px; align-items: flex-start; }
.exp-cap .ck { flex: none; width: 26px; height: 26px; border-radius: 7px; background: var(--sky); color: var(--blue); display: grid; place-items: center; margin-top: 1px; }
.exp-cap .ck svg { width: 15px; height: 15px; }
.exp-cap p { margin: 0; font-size: 15.5px; color: var(--ink); font-weight: 500; }
.exp-quote { margin: 26px 0; padding: 22px 28px; border-left: 4px solid var(--t-3); font-family: var(--ff-display); font-weight: 500; font-size: clamp(20px,2.6vw,28px); color: #fff; line-height: 1.3; background: rgba(255,255,255,.04); }
.ilot-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 24px; }
@media (max-width: 760px) { .exp-cap-grid, .ilot-compare { grid-template-columns: 1fr; } }
/* expertise sticky sub-nav */
.exp-subnav { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
/* vertical breathing room around figures on full-width pages */
.section > .wrap > .fig:not(.fig-side), .dom-intro .fig:not(.fig-side) { margin: 26px 0; }
.section .fig + .fig { margin-top: 18px; }
/* expertise article (.xp-article) : les figures .fig / .fig-row doivent respirer comme .xp-media (jamais collées au texte) */
.xp-article .fig:not(.fig-side), .xp-article .fig-row { margin-top: 32px; }
.xp-article .fig + .fig { margin-top: 24px; }
.xp-article .fig-row .fig, .xp-article .xp-figrow .fig { margin-top: 0; }
.exp-reslinks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.exp-reslinks a { display: inline-flex; align-items: center; gap: 9px; padding: 11px 16px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 13.5px; font-weight: 500; color: var(--ink); transition: border-color .2s ease, color .2s ease, background .2s ease; }
.exp-reslinks a:hover { border-color: var(--sky-2); color: var(--blue); background: var(--paper); }
.exp-reslinks a .k { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.exp-subnav .wrap { display: flex; gap: 28px; overflow-x: auto; }
.exp-subnav a { padding: 16px 0; font-family: var(--ff-mono); font-size: 12.5px; letter-spacing: .04em; color: var(--ink-2); white-space: nowrap; border-bottom: 2px solid transparent; transition: color .18s ease, border-color .18s ease; }
.exp-subnav a:hover { color: var(--navy); }
.exp-subnav a.active { color: var(--blue); border-bottom-color: var(--blue); }
.exp-subnav .wrap::-webkit-scrollbar { display: none; }

/* ============ Full-width synthesis video ============ */
.video-synthesis { background: var(--navy); color: #fff; position: relative; overflow: hidden; }
.video-synthesis .thermal { position: absolute; inset: 0; opacity: .38; }
.video-synthesis .wrap { position: relative; z-index: 2; text-align: center; }
.video-synthesis .kicker { color: #8fb6ff; justify-content: center; }
.video-synthesis .kicker::before { background: #8fb6ff; opacity: .6; }
.video-synthesis h2 { color: #fff; font-size: clamp(28px, 3.8vw, 46px); margin-top: 16px; }
.video-synthesis .lead-sub { color: #c4d4ee; font-size: 18px; max-width: 780px; margin: 18px auto 0; text-align: center; }
.video-embed-lg {
  position: relative; max-width: 1140px; margin: 38px auto 0;
  aspect-ratio: 16/9; overflow: hidden; background: #040e22;
  border: 1px solid rgba(255,255,255,.14); box-shadow: var(--sh-lg);
}
.video-embed-lg iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-synthesis .video-cap { justify-content: center; color: #8fa3c2; margin-top: 16px; }

/* Vidéos en zone de texte (expertise · dossier · projet) : toujours à la largeur du texte */
.xp-article figure:has(video), .dt-article figure:has(video), .proj-article figure:has(video),
.xp-article .xp-media, .xp-article .xp-vidwrap, .dt-article .dt-vid,
.xp-article .video-embed, .dt-article .video-embed, .proj-article .video-embed {
  float: none; clear: both; width: 100%; max-width: 100%;
  margin-left: 0; margin-right: 0;
}
.xp-article figure:has(video) .fr, .dt-article figure:has(video) .fr,
.proj-article figure:has(video) .fr, .xp-media .fr, .dt-vid .fr, .xp-vidwrap > video {
  width: 100%; max-width: 100%;
}


/* synthesis video facade (poster + click-to-play) */
.video-embed-lg .sv-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.video-embed-lg .sv-shade { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(4,12,30,.25), rgba(4,12,30,.55)); transition: opacity .3s ease; }
.video-embed-lg .sv-play {
  position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%,-50%);
  display: inline-flex; flex-direction: column; align-items: center; gap: 14px;
  background: none; border: 0; cursor: pointer; color: #fff;
}
.video-embed-lg .sv-play .ring {
  width: 88px; height: 88px; border-radius: 50%;
  background: rgba(255,255,255,.14); backdrop-filter: blur(6px);
  border: 1.5px solid rgba(255,255,255,.75); display: grid; place-items: center;
  transition: transform .22s ease, background .22s ease, box-shadow .22s ease;
  box-shadow: 0 12px 44px -8px rgba(0,0,0,.55);
}
.video-embed-lg .sv-play .ring svg { width: 34px; height: 34px; margin-left: 4px; }
.video-embed-lg .sv-play:hover .ring { transform: scale(1.08); background: var(--blue); border-color: var(--blue); box-shadow: var(--sh-blue); }
.video-embed-lg .sv-play .lbl { font-family: var(--ff-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0,0,0,.5); }
.video-embed-lg.playing .sv-poster,
.video-embed-lg.playing .sv-shade,
.video-embed-lg.playing .sv-play { opacity: 0; pointer-events: none; transition: opacity .5s ease; }
.video-embed-lg .sv-yt { position: absolute; inset: 0; z-index: 3; }
.video-embed-lg .sv-yt iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0; }

/* ============ Image-first project cards ============ */
.proj-card-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 36px; }
.proj-card-grid.grid-4 { grid-template-columns: repeat(4,1fr); margin-top: 0; }
.proj-card-grid.grid-4 .proj-card { aspect-ratio: 4/3.4; }
@media (max-width: 1000px) { .proj-card-grid.grid-4 { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .proj-card-grid.grid-4 { grid-template-columns: 1fr; } }
/* project filter chips */
.proj-filter { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; }
.pf-btn { font-family: var(--ff-mono); font-size: 12px; letter-spacing: .03em; color: var(--ink-2); background: #fff; border: 1px solid var(--line); padding: 9px 15px; border-radius: 999px; cursor: pointer; transition: all .18s ease; }
.pf-btn:hover { border-color: var(--ink-2); }
.pf-btn.active { background: var(--navy); color: #fff; border-color: var(--navy); }
.proj-card {
  position: relative; display: block; aspect-ratio: 4/3.2; overflow: hidden;
  border: 1px solid var(--line); background: var(--navy);
}
.proj-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.proj-card:hover img { transform: scale(1.06); }
.proj-card .pc-grad { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(4,12,30,.05) 35%, rgba(4,12,30,.88)); }
.proj-card .pc-tag {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase;
  color: #fff; background: rgba(7,17,42,.55); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.22); padding: 6px 11px;
}
.proj-card .pc-title {
  position: absolute; left: 18px; right: 18px; bottom: 16px; z-index: 2;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 12px;
}
.proj-card .pc-title b { font-family: var(--ff-display); font-weight: 600; font-size: 18px; color: #fff; line-height: 1.16; }
.proj-card[data-domain="Data Center"]{--dom:#2a6fdb}
.proj-card[data-domain="Air & Vent"]{--dom:#1f8a5b}
.proj-card[data-domain="Génie climatique"]{--dom:#d97757}
.proj-card[data-domain="Désenfumage"]{--dom:#c0392b}
.proj-card[data-domain="Industries"]{--dom:#8a6d1f}
.proj-card[data-domain="Process Industriel"]{--dom:#6c4bb6}
.proj-card[data-domain="Laboratoires"]{--dom:#1f7a8a}
.proj-card .pc-title b::before { content:""; display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--dom,var(--blue)); margin-right:8px; vertical-align:middle; flex:none; box-shadow:0 0 0 2px rgba(255,255,255,.35); }
.proj-card .pc-title .go { flex: none; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.32); display: grid; place-items: center; color: #fff; transition: background .2s ease, transform .2s ease; }
.proj-card:hover .pc-title .go { background: var(--blue); border-color: var(--blue); transform: translateX(2px); }

/* ============ Optimized footer ============ */
.footer { background: var(--navy); color: #cdd9ec; padding: 76px 0 30px; }
.foot-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 44px; }
.foot-contact { margin-top: 22px; display: flex; flex-direction: column; gap: 11px; }
.foot-contact a, .foot-contact span { display: flex; gap: 11px; align-items: flex-start; font-size: 14.5px; color: #aebfd8; }
.foot-contact a:hover { color: #fff; }
.foot-contact svg { width: 16px; height: 16px; flex: none; color: var(--t-2); margin-top: 2px; }
.foot-social { display: flex; gap: 10px; margin-top: 24px; }
.foot-social a { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.16); display: grid; place-items: center; color: #cdd9ec; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.foot-social a:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.foot-social svg { width: 18px; height: 18px; }
.foot-locations {
  margin-top: 52px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.1);
  font-family: var(--ff-mono); font-size: 12px; letter-spacing: .08em; color: #7d92b4;
  display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
}
.foot-locations .lbl { color: var(--t-2); }
.foot-bottom {
  margin-top: 22px; display: flex; gap: 16px; flex-wrap: wrap; align-items: center; justify-content: space-between;
  font-family: var(--ff-mono); font-size: 12px; letter-spacing: .04em; color: #7d92b4;
}
.foot-bottom a { color: #7d92b4; text-decoration: none; transition: color .15s; }
.foot-bottom a:hover { color: #fff; }
@media (max-width: 900px) { .foot-top { grid-template-columns: 1fr 1fr; } .proj-card-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .foot-top { grid-template-columns: 1fr; } .proj-card-grid { grid-template-columns: 1fr; } }

/* ============ Clean contact panel ============ */
.cta-panel {
  position: relative; overflow: hidden;
  background: var(--navy); color: #fff;
  border: 1px solid rgba(255,255,255,.08);
  display: grid; grid-template-columns: 1.6fr 1fr; gap: 44px; align-items: center;
  padding: 56px 56px;
}
.cta-panel .colormap-bar { position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--grad-thermal); }
.cta-panel .glow { position: absolute; right: -10%; top: -40%; width: 50%; height: 180%; z-index: 0;
  background: radial-gradient(closest-side, rgba(46,134,255,.30), transparent 70%); pointer-events: none; }
.cta-panel-in, .cta-panel-action { position: relative; z-index: 1; }
.cta-panel .kicker { color: #8fb6ff; }
.cta-panel .kicker::before { background: #8fb6ff; opacity: .6; }
.cta-panel h2 { color: #fff; font-size: clamp(26px, 3.2vw, 40px); margin-top: 14px; }
.cta-panel p { color: #cddcf2; margin-top: 14px; font-size: 17px; max-width: 50ch; }
.cta-panel-action { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.cta-panel-action .btn { font-size: 16px; }
.cta-panel-action .cta-phone { font-family: var(--ff-mono); color: #9fc0ff; font-size: 14.5px; letter-spacing: .03em; }
.cta-panel-action .cta-phone:hover { color: #fff; }
@media (max-width: 820px) { .cta-panel { grid-template-columns: 1fr; gap: 28px; padding: 40px 28px; } }

/* projects map (Leaflet) */
.projmap-head { max-width: 640px; }
.proj-map { margin-top: 26px; height: 460px; border: 1px solid var(--line); background: var(--paper-2); }
.proj-map .leaflet-container { font-family: var(--ff-body); }
.proj-map .leaflet-popup-content-wrapper { border-radius: 4px; }
.pmk { background: var(--blue); width: 18px; height: 18px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); border: 2px solid #fff; box-shadow: 0 3px 10px rgba(13,36,68,.35); }
.pmk i { display: block; width: 6px; height: 6px; background: #fff; border-radius: 50%; margin: 4px auto 0; transform: rotate(45deg); }
.pmk.dark { background: var(--navy); }
.pmk--dc { background: #2a6fdb; }
.pmk--av { background: #1f8a5b; }
.pmk--gc { background: #d97757; }
.pmk--df { background: #c0392b; }
.pmk--in { background: #8a6d1f; }
.pmk--pi { background: #6c4bb6; }
.pmk--lab { background: #1f7a8a; }
.map-legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; font-family: var(--ff-mono); font-size: 12px; color: var(--ink-2); }
.map-legend span { display: inline-flex; align-items: center; gap: 7px; }
.map-legend i { width: 12px; height: 12px; border-radius: 50%; display: inline-block; flex: none; }
.pm-pop b { font-family: var(--ff-display); color: var(--navy); font-size: 14px; display: block; }
.pm-pop s { text-decoration: none; font-family: var(--ff-mono); font-size: 10.5px; color: var(--muted); letter-spacing: .04em; display: block; margin-top: 2px; }
.pm-pop .pm-thumb { display: block; width: 100%; aspect-ratio: 16/9; overflow: hidden; margin-bottom: 10px; background: var(--navy); }
.pm-pop .pm-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pm-pop .pm-go { display: inline-flex; gap: 5px; margin-top: 12px; font-family: var(--ff-mono); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--blue); font-weight: 500; }
.pm-pop.pm-link { display: block; text-decoration: none; cursor: pointer; }
.pm-pop.pm-link b { transition: color .15s; }
.pm-pop.pm-link:hover b { color: var(--blue); }
.pm-pop.pm-link:hover .pm-go { text-decoration: underline; }
.proj-map .leaflet-popup-content { margin: 0; width: 200px !important; }
.proj-map .leaflet-popup-content .pm-pop { padding: 0 0 4px; }
.proj-map .leaflet-popup-content b, .proj-map .leaflet-popup-content s, .proj-map .leaflet-popup-content .pm-go { padding-inline: 12px; }

/* ============ Domain (level-2) page ============ */
.exp-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 44px; }
.exp-card { display: block; padding: 28px; background: #fff; border: 1px solid var(--line); transition: transform .2s ease, box-shadow .3s ease, border-color .3s ease; }
.exp-card:hover { transform: translateY(-3px); box-shadow: var(--sh-lg); border-color: var(--sky-2); }
.exp-card .ic { width: 50px; height: 50px; background: var(--sky); color: var(--blue); display: grid; place-items: center; margin-bottom: 18px; }
.exp-card .ic svg { width: 25px; height: 25px; }
.exp-card h3 { font-size: 19px; }
.exp-card p { margin-top: 9px; color: var(--ink-2); font-size: 15px; }
.exp-card .more { margin-top: 14px; font-family: var(--ff-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); display: inline-flex; gap: 7px; opacity: 0; transform: translateY(3px); transition: .22s ease; }
.exp-card:hover .more { opacity: 1; transform: none; }
.dom-hero-media { margin-top: 40px; aspect-ratio: 21/8; overflow: hidden; border: 1px solid var(--line); position: relative; }
.dom-hero-media image-slot { width: 100%; height: 100%; }
@media (max-width: 900px) { .exp-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .exp-grid { grid-template-columns: 1fr; } }

/* ============ Domain page — native video header + rich sections ============ */
.video-hero .vbg .vbg-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }

/* multicolor thermal text accent */
.grad { background: var(--grad-thermal); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* stats credibility band */
.stats-band { background: var(--navy); position: relative; overflow: hidden; }
.stats-band .thermal { position: absolute; inset: 0; opacity: .42; }
.stats-band .wrap { position: relative; z-index: 2; }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 30px; }
.stat-b .n { font-family: var(--ff-display); font-weight: 600; font-size: clamp(36px,5vw,54px); color: #fff; letter-spacing: -.03em; line-height: 1; }
.stat-b .n .u { color: var(--t-2); }
.stat-b .l { font-family: var(--ff-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #8fa3c2; margin-top: 12px; }
@media (max-width: 760px) { .stats-grid { grid-template-columns: 1fr 1fr; gap: 26px; } }

/* notre démarche — process steps */
.demarche { display: grid; grid-template-columns: repeat(5,1fr); gap: 24px; margin-top: 46px; }
.dstep { position: relative; padding-top: 20px; }
.dstep::before { content: ""; position: absolute; top: 0; left: 0; width: 42px; height: 4px; background: var(--grad-thermal); }
.dstep .num { font-family: var(--ff-mono); font-size: 12px; color: var(--blue); letter-spacing: .08em; }
.dstep h4 { font-size: 16.5px; margin-top: 11px; }
.dstep p { font-size: 14px; color: var(--ink-2); margin-top: 8px; }
@media (max-width: 900px) { .demarche { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .demarche { grid-template-columns: 1fr; } }

/* intro lead */
.dom-intro p { font-size: 18px; color: var(--ink-2); max-width: 70ch; margin-top: 16px; text-align: justify; }
.dom-intro p strong { color: var(--navy); font-weight: 600; }

/* besoin grid */
.besoin-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 44px; }
.besoin { padding: 26px; border: 1px solid var(--line); background: #fff; }
.besoin .n { font-family: var(--ff-mono); font-size: 12px; color: var(--blue); letter-spacing: .06em; }
.besoin h3 { font-size: 18px; margin-top: 12px; }
.besoin p { margin-top: 9px; color: var(--ink-2); font-size: 14.5px; }
/* besoin — étiquettes dépliables */
.besoin.expandable { cursor: pointer; transition: border-color .2s, box-shadow .25s, background .2s; }
.besoin.expandable:hover { border-color: var(--blue); }
.besoin.expandable:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.besoin.open { border-color: var(--blue); box-shadow: var(--sh-md); }
.besoin .b-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.besoin .b-toggle { flex: none; width: 27px; height: 27px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; color: var(--blue); transition: transform .28s ease, background .2s, border-color .2s; }
.besoin .b-toggle svg { width: 15px; height: 15px; }
.besoin.expandable:hover .b-toggle { border-color: var(--blue); background: var(--sky); }
.besoin.open .b-toggle { transform: rotate(180deg); background: var(--blue); border-color: var(--blue); color: #fff; }
.besoin-more { overflow: hidden; max-height: 0; transition: max-height .4s ease; }
.besoin.open .besoin-more { max-height: 560px; }
.besoin.open .besoin-more > .bm { margin-top: 15px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
.bm-lead { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.62; text-align: justify; text-wrap: pretty; -webkit-hyphens: none; hyphens: none; }
.bm-lead strong { color: var(--navy); font-weight: 600; }
.bm-deliv { margin-top: 16px; font-family: var(--ff-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); }
.bm-list { margin-top: 11px; display: flex; flex-direction: column; gap: 9px; list-style: none; padding: 0; }
.bm-list li { display: flex; gap: 9px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; color: var(--ink); }
.bm-list li svg { flex: none; width: 15px; height: 15px; color: var(--blue); margin-top: 2px; }
.bm-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 16px; font-family: var(--ff-mono); font-size: 11.5px; letter-spacing: .03em; color: var(--blue); font-weight: 500; }
.bm-link svg { width: 14px; height: 14px; transition: transform .2s; }
.bm-link:hover svg { transform: translateX(3px); }

/* clients band */
.clients-band { background: var(--paper); border-block: 1px solid var(--line-soft); }
.clients-row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 22px 52px; margin-top: 26px; }
.clients-row .logo { font-family: var(--ff-display); font-weight: 600; font-size: 23px; color: var(--ink-2); opacity: .5; filter: grayscale(1); transition: opacity .2s ease; letter-spacing: -.01em; }
.clients-row .logo:hover { opacity: .92; }
/* scrolling marquee */
.clients-marquee { margin-top: 30px; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.clients-track { display: flex; align-items: center; gap: 64px; width: max-content; animation: client-scroll 38s linear infinite; }
.clients-marquee:hover .clients-track { animation-play-state: paused; }
.clients-track .logo { font-family: var(--ff-display); font-weight: 600; font-size: 24px; color: var(--ink-2); opacity: .5; filter: grayscale(1); letter-spacing: -.01em; white-space: nowrap; transition: opacity .2s ease, filter .2s ease, color .2s ease; }
.clients-track .logo:hover { opacity: 1; filter: none; color: var(--navy); }
@keyframes client-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .clients-track { animation: none; } }

/* dossiers — horizontal editorial cards */
.doss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 40px; }
.doss { display: grid; grid-template-columns: 150px 1fr; background: #fff; border: 1px solid var(--line); overflow: hidden; transition: box-shadow .3s ease, border-color .3s ease; }
.doss:hover { box-shadow: var(--sh-lg); border-color: var(--sky-2); }
.doss .img { position: relative; overflow: hidden; background: var(--navy); }
.doss .img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 60%, rgba(255,255,255,.06)); }
.doss .img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.doss:hover .img img { transform: scale(1.06); }
.doss .b { padding: 20px 22px; align-self: center; }
.doss .tagx { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); }
.doss h4 { font-size: 16px; color: var(--navy); line-height: 1.25; margin-top: 8px; }
.doss p { margin-top: 8px; font-size: 13px; color: var(--ink-2); }
.doss .more { margin-top: 13px; font-family: var(--ff-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--blue); display: inline-flex; gap: 6px; }
@media (max-width: 520px) { .doss { grid-template-columns: 110px 1fr; } }

/* video gallery */
.vid-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 40px; }
.vid-card { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; border: 0; background: #07112a; cursor: pointer; box-shadow: 0 12px 30px -16px rgba(0,0,0,.6); }
.vid-card video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vid-card .vc-grad { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(4,12,30,.1) 38%, rgba(4,12,30,.85)); transition: opacity .3s ease; }
.vid-card.playing .vc-grad, .vid-card.playing .vc-play { opacity: 0; pointer-events: none; }
.vid-card .vc-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2; width: 58px; height: 58px; border-radius: 50%; background: rgba(255,255,255,.18); backdrop-filter: blur(6px); border: 1.5px solid rgba(255,255,255,.75); display: grid; place-items: center; color: #fff; transition: background .2s ease, transform .2s ease; }
.vid-card:hover .vc-play { background: var(--blue); border-color: var(--blue); transform: translate(-50%,-50%) scale(1.08); }
.vid-card .vc-play svg { width: 22px; height: 22px; margin-left: 3px; }
.vid-card .vc-title { position: absolute; left: 16px; right: 16px; bottom: 14px; z-index: 2; color: #fff; font-family: var(--ff-display); font-weight: 600; font-size: 15px; line-height: 1.2; }

/* load more + section link */
.load-more-wrap { display: flex; justify-content: center; margin-top: 34px; }
.sec-link { display: flex; justify-content: flex-end; margin-top: 18px; }
@media (max-width: 1000px) { .doss-grid { grid-template-columns: 1fr 1fr; } .vid-grid, .besoin-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .doss-grid, .vid-grid, .besoin-grid { grid-template-columns: 1fr; } }

/* ============================================================
   Recherche site · drapeaux · loupe (partagé toutes pages)
   ============================================================ */
/* Drapeaux du sélecteur de langue */
.lang-btn .flag, .lang-menu .flag { width:20px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(7,26,51,.10); flex:none; }
.lang-btn { gap:7px; }
.lang-menu a { display:flex; align-items:center; gap:10px; }
/* Bouton loupe (nav) */
.nav-search-btn { display:grid; place-items:center; width:34px; height:34px; background:none; border:0; cursor:pointer; color:var(--ink-2); border-radius:3px; transition:color .18s ease, background .18s ease; }
.nav-search-btn svg { width:18px; height:18px; }
.nav-search-btn:hover { color:var(--navy); background:var(--paper); }
.nav.over:not(.scrolled) .nav-search-btn { color:rgba(255,255,255,.85); }
.nav.over:not(.scrolled) .nav-search-btn:hover { color:#fff; background:rgba(255,255,255,.12); }
/* Recherche du rail (aside) */
.aside-search { position:relative; }
.aside-search .search-label { font-family:var(--ff-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.site-search { display:flex; align-items:center; gap:10px; padding:0 14px; height:48px; background:#fff; border:1px solid var(--line); box-shadow:0 16px 38px -24px rgba(13,36,68,.20), 0 2px 8px rgba(13,36,68,.04); transition:border-color .18s ease, box-shadow .18s ease; }
.site-search:focus-within { border-color:var(--sky-2); box-shadow:0 0 0 4px var(--sky); }
.site-search > svg { width:18px; height:18px; color:var(--muted); flex:none; }
.site-search input { flex:1 1 auto; min-width:0; border:0; outline:0; background:transparent; font-family:var(--ff-body); font-size:14.5px; color:var(--ink); }
.site-search input::placeholder { color:var(--faint); }
.search-results { position:absolute; left:0; right:0; top:calc(100% + 8px); z-index:40; background:#fff; border:1px solid var(--line); box-shadow:var(--sh-lg); max-height:360px; overflow-y:auto; }
.search-results a { display:flex; flex-direction:column; gap:3px; padding:11px 15px; border-bottom:1px solid var(--line-soft); }
.search-results a:last-child { border-bottom:0; }
.search-results a:hover { background:var(--paper); }
.search-results a b { font-family:var(--ff-display); font-weight:600; font-size:14px; color:var(--navy); line-height:1.2; }
.search-results a:hover b { color:var(--blue); }
.search-results a s { text-decoration:none; font-family:var(--ff-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.search-empty { padding:14px 15px; font-size:13.5px; color:var(--muted); }
/* Modale de recherche (loupe nav) */
.search-modal { position:fixed; inset:0; z-index:200; display:grid; }
.search-modal[hidden] { display:none; }
.sm-backdrop { position:absolute; inset:0; background:rgba(7,17,42,.55); backdrop-filter:blur(4px); animation:smFade .2s ease; }
.sm-panel { position:relative; z-index:1; width:min(640px,92vw); margin:12vh auto auto; background:#fff; border:1px solid var(--line); box-shadow:var(--sh-lg); animation:smPop .22s cubic-bezier(.2,.7,.3,1); max-height:72vh; display:flex; flex-direction:column; }
@keyframes smFade { from { opacity:0; } }
@keyframes smPop { from { opacity:0; transform:translateY(-10px); } }
.sm-form { display:flex; align-items:center; gap:13px; padding:18px 20px; border-bottom:1px solid var(--line-soft); }
.sm-form > svg { width:22px; height:22px; color:var(--blue); flex:none; }
.sm-form input { flex:1 1 auto; min-width:0; border:0; outline:0; background:transparent; font-family:var(--ff-display); font-weight:500; font-size:21px; color:var(--navy); }
.sm-form input::placeholder { color:var(--faint); }
.sm-close { flex:none; width:30px; height:30px; border:0; background:var(--paper); color:var(--muted); cursor:pointer; display:grid; place-items:center; border-radius:3px; }
.sm-close:hover { background:var(--sky); color:var(--blue); }
.sm-close svg { width:16px; height:16px; }
.sm-results { overflow-y:auto; }
.sm-results a { display:flex; align-items:center; gap:14px; padding:14px 20px; border-bottom:1px solid var(--line-soft); }
.sm-results a:last-child { border-bottom:0; }
.sm-results a:hover { background:var(--paper); }
.sm-results a .cat { font-family:var(--ff-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--blue); background:var(--sky); padding:4px 9px; flex:none; }
.sm-results a b { font-family:var(--ff-display); font-weight:600; font-size:16px; color:var(--navy); }
.sm-results a:hover b { color:var(--blue); }
.sm-hint, .sm-empty { padding:18px 20px; font-size:14px; color:var(--muted); }
/* --- Recherche riche (palette) --- */
.sm-panel { display:flex; flex-direction:column; width:min(720px,94vw); max-height:78vh; }
.search-modal mark { background:linear-gradient(transparent 55%, rgba(247,209,59,.55) 55%); color:inherit; padding:0; }
.search-modal kbd { font-family:var(--ff-mono); font-size:10.5px; background:#fff; border:1px solid var(--line); border-bottom-width:2px; border-radius:5px; padding:1px 5px; color:var(--ink-2); }
.sm-chips { display:flex; gap:7px; flex-wrap:wrap; padding:12px 20px 4px; }
.sm-chips[hidden] { display:none; }
.sm-chip { border:1px solid var(--line); background:#fff; border-radius:999px; padding:6px 13px; font-family:var(--ff-body); font-weight:500; font-size:13px; color:var(--ink-2); cursor:pointer; display:inline-flex; gap:7px; align-items:center; transition:border-color .15s ease, color .15s ease, background .15s ease; }
.sm-chip .n { font-family:var(--ff-mono); font-size:10.5px; color:var(--faint); }
.sm-chip:hover { border-color:var(--blue); color:var(--blue); }
.sm-chip.on { background:var(--navy); border-color:var(--navy); color:#fff; }
.sm-chip.on .n { color:#9dc0ff; }
.sm-ghead { display:flex; align-items:baseline; gap:8px; font-family:var(--ff-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); padding:16px 20px 6px; }
.sm-ghead b { color:var(--blue); font-weight:500; }
.sm-results a.sm-row { display:flex; align-items:center; gap:13px; padding:9px 20px; border-bottom:0; }
.sm-results a.sm-row.sel { background:var(--paper); box-shadow:inset 3px 0 0 var(--blue); }
.sm-th { flex:none; width:60px; height:40px; object-fit:cover; background:var(--paper-2); border:1px solid var(--line-soft); }
.sm-rmain { flex:1 1 auto; min-width:0; }
.sm-rmain b { display:block; font-family:var(--ff-body); font-weight:600; font-size:15px; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sm-results a.sm-row:hover .sm-rmain b { color:var(--blue); }
.sm-rmain .sm-d { display:block; font-size:12.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.sm-side { display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex:none; }
.sm-tag { font-family:var(--ff-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; padding:3px 7px; border-radius:4px; }
.sm-tag.t-expertise { background:var(--sky); color:var(--blue-700); }
.sm-tag.t-projet { background:#e6f7f0; color:#0f7a4d; }
.sm-tag.t-dossier { background:#fdf3e0; color:#a05a10; }
.sm-tag.t-video { background:#fdeaea; color:#b3271b; }
.sm-tag.t-domaine { background:var(--navy); color:#fff; }
.sm-tag.t-actualite { background:#f1e9fd; color:#6a3bbf; }
.sm-tag.t-listing, .sm-tag.t-ressource, .sm-tag.t-societe, .sm-tag.t-page { background:var(--paper-2); color:var(--ink-2); }
.sm-dm { display:inline-flex; align-items:center; gap:5px; font-family:var(--ff-mono); font-size:10.5px; color:var(--muted); white-space:nowrap; }
.sm-dm i { width:7px; height:7px; border-radius:50%; flex:none; }
.sm-vrail { display:flex; gap:10px; overflow-x:auto; padding:6px 20px 12px; scrollbar-width:thin; }
.sm-results a.sm-vcard { flex:none; width:180px; display:block; padding:0; border-bottom:0; }
.sm-vcard .vi { position:relative; display:block; width:180px; height:101px; background:var(--paper-2); overflow:hidden; border:1px solid var(--line-soft); }
.sm-vcard .vi img, .sm-vcard .vi video { width:100%; height:100%; object-fit:cover; display:block; }
.sm-vcard .vi video { position:absolute; inset:0; }
.sm-vcard .vp { position:absolute; right:8px; bottom:8px; width:28px; height:28px; border-radius:50%; background:rgba(7,26,51,.65); display:grid; place-items:center; color:#fff; transition:opacity .15s ease, transform .15s ease; }
.sm-vcard .vp svg { width:11px; height:11px; margin-left:2px; }
.sm-vcard:hover .vp { opacity:0; transform:scale(.8); }
.sm-vcard .vt { display:block; margin-top:6px; font-family:var(--ff-body); font-weight:500; font-size:12.5px; line-height:1.3; color:var(--navy); white-space:normal; }
.sm-results a.sm-vcard.sel .vi { outline:2px solid var(--blue); }
.sm-foot { border-top:1px solid var(--line-soft); padding:8px 20px; display:flex; gap:16px; align-items:center; font-size:11.5px; color:var(--muted); background:var(--paper); }
.sm-foot[hidden] { display:none; }
.sm-foot span { display:inline-flex; gap:5px; align-items:center; }
.sm-count { margin-left:auto; font-family:var(--ff-mono); font-size:11px; }
.sm-sug { padding:16px 20px 6px; }
.sm-sug .lbl { font-family:var(--ff-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:9px; }
.sm-sugchips { display:flex; flex-wrap:wrap; gap:8px; }
.sm-domgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; padding:6px 20px 18px; }
.sm-results a.sm-domc { display:flex; align-items:center; gap:9px; border:1px solid var(--line); padding:9px 12px; font-family:var(--ff-body); font-weight:500; font-size:13px; color:var(--navy); border-bottom:1px solid var(--line); }
.sm-results a.sm-domc:hover { border-color:var(--blue); background:var(--sky); }
.sm-domc i { width:8px; height:8px; border-radius:50%; flex:none; }
@media (max-width:560px) {
  .sm-th { display:none; }
  .sm-side .sm-dm { display:none; }
  .sm-panel { max-height:86vh; margin-top:6vh; }
}

/* ============================================================
   Titres de section (code couleur eolios.fr)
   titre bleu · sous-titre gris · barre grise plus épaisse
   ============================================================ */
.proj-section-title { color: var(--blue-700); border-bottom: 3px solid var(--line); padding-bottom: 18px; }
/* Premier titre (bloc résumé) centré comme sur eolios.fr ; les suivants à gauche */
.proj-summary .proj-section-title { text-align: center; }
/* Titres de colonne (aside) un peu plus grands */
.aside-card .ac-head { font-size: 12.5px; }

/* mobile-typo-leftalign — justifié sur desktop, ferré à gauche sur petit écran (pas de césure -> évite les rivières) */
@media (max-width: 600px){
  .proj-block p, .lede, .proj-list p, .proj-main h3 { text-align: left; }
}
/* légendes centrées sous les images (expertise + dossier) */
.xp-article .xp-media figcaption, .xp-article figure.fig figcaption, .xp-article .xp-diagram .cap,
.dt-article .dt-fig figcaption, .dt-article .dt-vid figcaption {
  text-align: center; justify-content: center; align-items: center;
}


/* === EOLIOS responsive pack v2 === */
/* `overflow-x: clip` (PAS `hidden`) : clippe l'horizontal sans créer de conteneur
   de défilement sur <body>, sinon `overflow-y` passe en `auto` et casse le
   `position: sticky` du header (le bandeau méga-menu « remonte »). */
html, body { max-width: 100%; overflow-x: clip; }
img, video, iframe { max-width: 100%; }

/* --- Header: tablette --- */
@media (max-width: 1000px){
  .nav-row { padding-inline: 18px; }
  .nav-util { gap: 12px; }
  .nav-bottom .nav-links { justify-content: flex-start; gap: 18px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 2px; }
  .nav-bottom .nav-links::-webkit-scrollbar { display: none; }
  .nav-bottom .nav-trigger { font-size: 13.5px; }
}
/* --- Header: mobile --- */
@media (max-width: 720px){
  .nav-row-top { gap: 12px; padding-block: 7px; }
  /* on masque les liens secondaires + langue, on garde logo + loupe + Contact */
  .nav-util > a:not(.btn), .nav-util .lang-sel { display: none; }
  .nav-util .btn-primary { padding: 8px 14px; font-size: 12.5px; }
  .logo-img, .nav-row-top .brand .logo-img { height: 26px; }
  .nav-bottom .nav-links { gap: 15px; }
  .nav-bottom .nav-trigger { padding: 8px 0; font-size: 13px; }
  .nav-bottom .nav-trigger .chev { display: none; }
}

/* --- Hero (full-bleed video) sur mobile --- */
@media (max-width: 720px){
  .home-hero, .video-hero.xl { min-height: 86vh; }
  .home-hero .wrap { padding-block: 96px 64px; }
  .home-hero .hero-meta { gap: 0; }
  .home-hero .hero-meta > div { padding-right: 20px; margin-right: 20px; }
}
@media (max-width: 480px){
  .home-hero .hero-meta { flex-direction: column; gap: 16px; align-items: flex-start; }
  .home-hero .hero-meta > div { border-right: 0; padding-right: 0; margin-right: 0; }
  .video-hero .wrap h1 { font-size: clamp(28px,8vw,40px); }
}

/* --- Méta-strip projet : empile proprement --- */
@media (max-width: 760px){
  .meta-strip .wrap { flex-wrap: wrap; gap: 16px 26px; }
  .meta-strip .ms-cta { width: 100%; justify-content: center; }
}

/* --- Sections : padding latéral resserré --- */
@media (max-width: 600px){
  .wrap { padding-inline: 18px; }
  .section { padding-block: 48px; }
}

/* --- Showcase vidéo (médiathèque) : featured + rail empilés --- */
@media (max-width: 860px){
  .xv-grid, .xv-feat-row { grid-template-columns: 1fr !important; }
}

/* --- Société v2 : grilles serrées sur très petit écran --- */
@media (max-width: 480px){
  .so-hero-in { padding: 26px 18px 40px; }
  .so-vals { grid-template-columns: 1fr 1fr; }
}

/* --- Contact : formulaire 1 colonne --- */
@media (max-width: 640px){
  .ct-form-grid, .contact-grid { grid-template-columns: 1fr !important; }
}
/* === fin responsive pack v2 === */


/* === responsive pack v3 (dossiers / expertise components) === */
@media (max-width: 820px){
  .dt-trip, .dt-trip.three, .xp-trip { grid-template-columns: 1fr !important; }
  .dt-rel-grid, .dt-apps { grid-template-columns: 1fr 1fr !important; }
  .dt-hgrid { grid-template-columns: 1fr !important; }
  .xp-shell, .dt-body { grid-template-columns: 1fr !important; }
}
@media (max-width: 540px){
  .dt-rel-grid, .dt-apps { grid-template-columns: 1fr !important; }
  .dt-fig.two { grid-template-columns: 1fr !important; }
  .dt-formula .eq { font-size: 18px; }
}
/* tableaux : scroll horizontal plutôt que débordement */
.dt-table, .xp-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* sommaire latéral dossiers : passe au-dessus de l'article sur mobile */
@media (max-width: 820px){
  .dt-index, .xp-index { position: static !important; max-width: 100%; }
}
/* === fin v3 === */


/* === no mega on mobile === */
@media (max-width: 820px){
  .nav-bottom .mega, .nav-item .mega { display: none !important; }
  /* le tap sur un domaine va directement à sa page (href du .nav-trigger) */
  .nav-bottom .nav-trigger .chev, .nav-bottom .nav-trigger .cev { display: none; }
}


/* === hero top scrim (logo legibility over light posters) === */
.video-hero { position: relative; }
.video-hero > .top-scrim, .video-hero::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 180px;
  background: linear-gradient(180deg, rgba(7,17,42,.62), rgba(7,17,42,0));
  z-index: 1; pointer-events: none;
}


/* === side-map locator === */
.aside-card.side-map{padding:0;overflow:hidden;width:100%}
.aside-card.side-map .ac-head{padding:16px 18px 0}
.side-map .map-frame{position:relative;width:100%;height:140px;margin-top:12px;overflow:hidden;background:var(--paper);border-top:1px solid var(--line-soft)}
.side-map .map-frame iframe{position:absolute!important;top:-1px!important;left:0!important;width:100%!important;height:210px!important;max-width:none!important;border:0!important;filter:grayscale(.15);pointer-events:none}
.side-map .map-cap{display:flex;align-items:center;gap:8px;padding:12px 18px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.02em;color:var(--ink-2)}
.side-map .map-cap .pin{flex:none;color:var(--blue)}
.side-map .map-cap .pin svg{width:16px;height:16px;display:block}


/* === liens éditoriaux in-body (maillage interne) === */
.xp-article a[data-inlink], .dt-article a[data-inlink], .proj-article a[data-inlink] {
  color: var(--blue);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(31,108,209,.35);
  transition: color .15s ease, text-decoration-color .15s ease;
}
.xp-article a[data-inlink]:hover, .dt-article a[data-inlink]:hover, .proj-article a[data-inlink]:hover {
  color: var(--navy);
  text-decoration-color: currentColor;
}
.xp-break a[data-inlink] { color: #bcd4ff; text-decoration-color: rgba(188,212,255,.4); }
.xp-break a[data-inlink]:hover { color: #fff; }

/* === global img zoom cursor === */
.proj-article img, .dt-article img, .xp-article img, .fig img, figure img:not(.logo-img){cursor:zoom-in}
.side-map img, .logo-img, a img{cursor:inherit}


/* ============================================================
   Menu mobile (burger)  —  remplace la barre de domaines sous 820px
   ============================================================ */
.nav-burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;color:var(--navy);flex:none}
.nav-burger span{display:block;width:24px;height:2px;border-radius:2px;background:currentColor;
  transition:transform .28s ease,opacity .2s ease}
.nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav.over:not(.scrolled) .nav-burger{color:#fff}

.m-nav{position:fixed;inset:0;z-index:2000;visibility:hidden}
.m-nav.open{visibility:visible}
.m-nav-scrim{position:absolute;inset:0;background:rgba(7,17,42,.52);opacity:0;transition:opacity .3s ease}
.m-nav.open .m-nav-scrim{opacity:1}
.m-nav-panel{position:absolute;top:0;right:0;height:100%;width:min(392px,88vw);background:var(--white);
  display:flex;flex-direction:column;box-shadow:-24px 0 70px -24px rgba(7,26,51,.45);
  transform:translateX(100%);transition:transform .34s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.m-nav.open .m-nav-panel{transform:none}
.m-nav-top{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;background:var(--white);border-bottom:1px solid var(--line)}
.m-nav-ttl{font-family:var(--ff-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.m-nav-close{width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--paper);
  color:var(--ink);font-size:16px;line-height:1;cursor:pointer}
.m-nav-close:hover{color:var(--blue);border-color:var(--sky-2)}
.m-nav-body{padding:10px 14px 44px}
.m-nav-lbl{font-family:var(--ff-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--blue);margin:20px 8px 6px}
.m-nav-body > .m-nav-lbl:first-child{margin-top:8px}

.m-dom{list-style:none;margin:0;padding:0}
.m-search{display:flex;align-items:center;gap:10px;width:100%;margin:6px 0 2px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--muted);font-family:var(--ff-body);font-size:14px;text-align:left;cursor:pointer}
.m-search svg{flex:none;color:var(--faint)}
.m-search:hover,.m-search:active{border-color:var(--sky-2);color:var(--ink-2)}
.m-dom-item.m-dom-cur{background:var(--paper);border-radius:12px;border-bottom-color:transparent;padding:0 4px;box-shadow:inset 0 0 0 1px var(--line-soft)}
.m-dom-cur .m-dom-link{color:var(--blue)}
.m-nav-cta{position:sticky;bottom:0;margin-top:auto;padding:12px 14px calc(12px + env(safe-area-inset-bottom));background:var(--white);border-top:1px solid var(--line)}
.m-cta{display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;border-radius:12px;background:var(--navy);color:#fff;font-weight:600;font-size:15px}
.m-cta:hover{background:var(--ink);color:#fff}
.m-cta .ar{color:#8fb6ff}
.m-dom-item{border-bottom:1px solid var(--line-soft)}
.m-dom-row{display:flex;align-items:stretch}
.m-dom-link{flex:1;display:flex;align-items:center;min-height:54px;padding:0 10px;
  font-family:var(--ff-display);font-weight:600;font-size:17px;color:var(--navy)}
.m-dom-link[data-nolink]{color:var(--faint)}
.m-dom-exp{flex:none;width:54px;min-height:54px;border:0;background:transparent;color:var(--ink-2);
  cursor:pointer;display:grid;place-items:center}
.m-dom-exp .chev{width:20px;height:20px;transition:transform .25s ease}
.m-dom-item.exp-open .m-dom-exp{color:var(--blue)}
.m-dom-item.exp-open .m-dom-exp .chev{transform:rotate(180deg)}
.m-dom-sub{padding:0 8px 12px}
.m-sub-link,.m-sub-all{display:flex;align-items:center;gap:12px;min-height:44px;padding:4px 10px;
  font-size:14.5px;line-height:1.35;font-weight:500;color:var(--ink-2)}
.m-sub-link .xic{flex:none;width:18px;height:18px;color:var(--muted)}
.m-sub-link:hover .xic,.m-sub-link:active .xic{color:var(--blue)}
.exp-list .xic{flex:none;width:16px;height:16px;color:var(--blue);margin-top:1px}
.exp-list > [data-nolink] .xic{color:var(--faint)}
.xic svg{width:100%;height:100%;display:block}
.m-sub-link .ar{display:none}
.m-sub-link[data-nolink]{color:var(--faint)}
.m-sub-link:hover{color:var(--blue)}
.m-sub-all{font-family:var(--ff-mono);font-size:12px;letter-spacing:.04em;color:var(--blue);gap:6px}
.m-sub-all .ar{width:13px;height:13px}

.m-sec{display:flex;flex-direction:column}
.m-sec-link{display:flex;align-items:center;min-height:50px;padding:0 10px;border-bottom:1px solid var(--line-soft);
  font-family:var(--ff-display);font-weight:500;font-size:16px;color:var(--ink)}
.m-sec-link:hover{color:var(--blue)}

.m-lang{display:flex;flex-wrap:wrap;gap:8px;padding:8px 8px 0}
.m-lang-link{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 12px;
  border:1px solid var(--line);border-radius:10px;font-size:13.5px;color:var(--ink-2)}
.m-lang-link .fl{font-size:15px}
.m-lang-link:hover{border-color:var(--sky-2);color:var(--blue)}

@media (max-width:820px){
  .nav-burger{display:flex}
  .nav-bottom{display:none}
  .nav-row-top .nav-util > a:not(.btn), .nav-row-top .nav-util .lang-sel{display:none}
}
@media (prefers-reduced-motion: reduce){
  .m-nav-panel,.m-nav-scrim,.nav-burger span,.m-dom-exp .chev{transition:none}
}


/* ===== Domain explorer (bloc de fin de page) ===== */
/* ============ V4 — Panorama clair (version retenue) ============ */
  .v4 { margin-top: 0; background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); position: relative; content-visibility: auto; contain-intrinsic-size: auto 1000px; }
  .v4::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 3px; background: var(--grad-thermal); background-size: 200% 100%; animation: v4sweep 14s linear infinite; z-index: 2; }
  @keyframes v4sweep { from { background-position: 0% 0; } to { background-position: 200% 0; } }
  .v4 .bggrid { position: absolute; inset: 0; background-image: linear-gradient(rgba(31,90,214,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(31,90,214,.05) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(ellipse at 18% 0%, #000 25%, transparent 70%); pointer-events: none; }
  .v4 .wrap { max-width: 1200px; margin: 0 auto; padding: 42px 18px 0; position: relative; }
  .v4 .kicker { font-family: var(--ff-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--blue); }
  .v4 .kicker::before { content: ""; display: inline-block; width: 22px; height: 2px; background: var(--grad-thermal); margin-right: 9px; vertical-align: middle; }
  .v4 h2 { font-family: var(--ff-display); font-size: clamp(26px, 3.2vw, 40px); font-weight: 700; letter-spacing: -.01em; line-height: 1.06; margin-top: 10px; color: var(--navy); max-width: 22ch; }
  .v4 .lede { margin-top: 10px; font-size: 15.5px; line-height: 1.6; color: var(--ink-2); max-width: 52ch; text-wrap: pretty; }
  .v4 .head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
  .v4 .stats { display: flex; gap: 0; flex-wrap: wrap; border: 1px solid var(--line); background: var(--paper); margin-left: auto; }
  .v4 .stats .st { padding: 12px 16px 13px; border-right: 1px solid var(--line); position: relative; overflow: hidden; }
  .v4 .stats .st::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--grad-thermal); transform: scaleX(0); transform-origin: left; transition: transform .35s ease; }
  .v4 .stats:hover .st::before { transform: scaleX(1); }
  .v4 .stats .st:last-child { border-right: 0; }
  .v4 .stats .st b { display: block; font-family: var(--ff-display); font-size: 24px; font-weight: 700; color: var(--navy); line-height: 1; }
  .v4 .stats .st span { font-family: var(--ff-mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); display: block; margin-top: 6px; }
  .v4 .grid { display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 0; margin-top: 28px; border: 1px solid var(--line); border-bottom: 0; background: #fff; box-shadow: var(--sh-md); }
  .v4 .col { padding: 20px 20px 18px; border-right: 1px solid var(--line-soft); min-width: 0; display: flex; flex-direction: column; }
  .v4 .col:last-child { border-right: 0; }
  .v4 .ct { font-family: var(--ff-mono); font-size: 11px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase; color: var(--navy); display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 2px solid var(--navy); }
  .v4 .ct .n { color: var(--blue); }
  .v4 ol { list-style: none; margin: 8px 0 0; padding: 0; }
  .v4 ol li { border-bottom: 1px solid var(--line-soft); }
  .v4 ol a { display: flex; gap: 11px; align-items: center; padding: 10px 2px; font-size: 14px; font-weight: 500; line-height: 1.4; color: var(--ink-2); transition: padding-left .18s ease, color .15s ease; }
  .v4 ol a .ic { flex: none; width: 19px; height: 19px; color: var(--muted); transition: color .12s ease; }
  .v4 ol a .ic svg { width: 100%; height: 100%; display: block; }
  .v4 ol a:hover { color: var(--navy); background: linear-gradient(90deg, var(--sky), transparent 75%); padding-left: 8px; }
  .v4 ol a:hover .ic { color: var(--blue); }
  .v4 ol a::after { content: "\2192"; font-family: var(--ff-mono); font-size: 11px; color: var(--blue); margin-left: auto; opacity: 0; transform: translateX(-5px); transition: opacity .15s ease, transform .15s ease; }
  .v4 ol a:hover::after { opacity: 1; transform: none; }
  .v4 .dosr { display: flex; gap: 11px; align-items: center; padding: 9px 2px; border-bottom: 1px solid var(--line-soft); font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--ink-2); }
  .v4 .dosr .th { flex: none; width: 58px; height: 36px; overflow: hidden; background: linear-gradient(120deg, var(--sky), var(--paper-2)); }
  .v4 .dosr .th img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
  .v4 .dosr:hover { color: var(--navy); } .v4 .dosr:hover .th img { transform: scale(1.07); }
  .v4 .dosr::after { content: "\2192"; font-family: var(--ff-mono); font-size: 11px; color: var(--blue); margin-left: auto; opacity: 0; transform: translateX(-5px); transition: opacity .15s ease, transform .15s ease; flex: none; }
  .v4 .dosr:hover::after { opacity: 1; transform: none; }
  .v4 .pgrid { columns: 2; column-gap: 10px; margin-top: 14px; }
  .v4 .pc { position: relative; display: block; aspect-ratio: 16/11; overflow: hidden; background: var(--navy); break-inside: avoid; margin-bottom: 10px; box-shadow: 0 1px 2px rgba(7,26,51,.14); transition: transform .3s ease, box-shadow .3s ease; }
  .v4 .pc:nth-child(1), .v4 .pc:nth-child(4) { aspect-ratio: 3/4; }
  .v4 .pc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: transform .45s ease, opacity .3s ease; }
  .v4 .pc::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(7,26,51,.92) 0%, rgba(7,26,51,.18) 55%, transparent 100%); }
  .v4 .pc::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--grad-thermal); z-index: 2; transform: scaleX(0); transform-origin: left; transition: transform .4s ease; }
  .v4 .pc b { position: absolute; left: 12px; right: 12px; bottom: 11px; z-index: 1; font-family: var(--ff-display); font-size: 14.5px; font-weight: 600; line-height: 1.22; color: #fff; text-shadow: 0 1px 8px rgba(7,26,51,.4); }
  .v4 .pc .pk { position: absolute; left: 12px; top: 11px; z-index: 1; font-family: var(--ff-mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: #9fc0ff; opacity: 0; transform: translateY(-3px); transition: opacity .2s ease, transform .2s ease; }
  .v4 .pc:hover { transform: translateY(-4px); box-shadow: 0 20px 38px -16px rgba(7,26,51,.55); }
  .v4 .pc:hover img { transform: scale(1.06); opacity: 1; filter: saturate(1.12); }
  .v4 .pc:hover .pk { opacity: 1; transform: none; }
  .v4 .pc:hover::before { transform: scaleX(1); }
  .v4 .more { margin-top: auto; padding-top: 14px; }
  .v4 .more a { font-family: var(--ff-mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); display: inline-flex; align-items: center; gap: 7px; }
  .v4 .more a svg { transition: transform .2s ease; }
  .v4 .more a:hover { color: var(--navy); }
  .v4 .more a:hover svg { transform: translateX(3px); }
  .v4 .foot { display: flex; flex-wrap: wrap; align-items: center; border: 1px solid var(--line); background: var(--paper); margin-bottom: 46px; }
  .v4 .foot .dlbl { font-family: var(--ff-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); padding: 13px 16px; border-right: 1px solid var(--line); }
  .v4 .foot a { font-family: var(--ff-display); font-size: 13.5px; font-weight: 600; color: var(--ink-2); padding: 13px 16px; box-shadow: inset 0 0 0 transparent; transition: color .15s ease, background .15s ease, box-shadow .25s ease; }
  .v4 .foot a:hover { color: var(--blue); background: #fff; box-shadow: inset 0 -2px 0 var(--blue); }
  .v4 .foot a[aria-current] { color: var(--navy); background: var(--sky); box-shadow: inset 0 -2px 0 var(--blue), 0 0 20px rgba(31,90,214,.35); pointer-events: none; position: relative; z-index: 1; }
  .v4 .rv { opacity: 0; transform: translateY(12px); transition: opacity .55s ease var(--rd, 0s), transform .55s ease var(--rd, 0s); }
  .v4.in .rv { opacity: 1; transform: translateY(0); }
  .v4 a:focus-visible, .v4 .ct:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
  @media (prefers-reduced-motion: reduce) { .v4::before { animation: none; } }
  @media (max-width: 980px) {
    .v4 .grid { grid-template-columns: 1fr; }
    .v4 .col { border-right: 0; border-bottom: 1px solid var(--line-soft); padding: 0 16px; }
    .v4 .ct { padding: 15px 0 13px; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; border-bottom-color: var(--line); }
    .v4 .col.open .ct { border-bottom-color: var(--navy); }
    .v4 .ct::after { content: "+"; font-family: var(--ff-mono); font-size: 15px; line-height: 1; color: var(--blue); margin-left: 12px; }
    .v4 .col.open .ct::after { content: "\2212"; }
    .v4 .ct .n { margin-left: auto; }
    .v4 .col:not(.open) > :not(.ct) { display: none; }
    .v4 .col.open { padding-bottom: 16px; }
    .v4 ol a { padding: 12px 2px; }
    .v4 .more a { padding: 10px 0; }
  }

  /* ---- Option D1 · Parallax images ---- */
  .v4.d1 .pc img { transform: translateY(var(--py, 0px)) scale(1.14); }
  .v4.d1 .pc:hover img { transform: translateY(var(--py, 0px)) scale(1.2); }

  /* ---- Option D2 · Spotlight curseur ---- */
  .v4.d2 .grid { position: relative; }
  .v4.d2 .grid::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1; opacity: 0; transition: opacity .3s ease; background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(31,90,214,.09), transparent 70%); }
  .v4.d2 .grid:hover::after { opacity: 1; }

  /* ---- Option D3 · Tilt 3D ---- */
  .v4.d3 .pgrid { perspective: 900px; }


/* ============================================================
   EXPERTISE V2 — SHARED TEMPLATE (xp-* / dt-* / xv-* / xpf- / refz)
   Factored out of data-center/ingenierie-data-center (gabarit d'or).
   Author here once; every expertise page inherits it.
   ============================================================ */
:root{ --xp-line:#e7ecf3; }
/* ---------- HERO ---------- */
.xp-hero{position:relative;min-height:94vh;display:flex;align-items:flex-end;overflow:hidden;background:#071a33}
.xp-hero video,.xp-hero .xp-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xp-hero .xp-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,26,51,.55) 0%,rgba(7,26,51,.30) 40%,rgba(7,26,51,.88) 100%);z-index:1}
.xp-hero .cmap{position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--grad-thermal);z-index:3}
.xp-hero .wrap{position:relative;z-index:2;padding-block:0 70px}
.xp-eyebrow{display:inline-flex;align-items:center;gap:11px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8fb6ff}
.xp-eyebrow::before{content:"";width:26px;height:2px;background:var(--grad-thermal)}
.xp-hero h1{color:#fff;font-size:clamp(36px,5.6vw,72px);line-height:1.0;letter-spacing:-.03em;margin-top:20px;max-width:20ch;font-weight:600}
.xp-hero .sub{color:#cfe0f7;font-size:clamp(17px,1.7vw,21px);line-height:1.55;margin-top:22px;max-width:60ch}
.xp-hmeta{display:flex;gap:26px;margin-top:30px;flex-wrap:wrap;align-items:center}
.xp-chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.04em;color:#bcd0ee;border:1px solid rgba(255,255,255,.22);padding:8px 13px}
.xp-chip b{color:#fff;font-weight:600}
.xp-scroll{position:absolute;right:40px;bottom:34px;z-index:3;color:#fff;display:flex;flex-direction:column;align-items:center;gap:9px;font-family:var(--ff-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;writing-mode:vertical-rl}
.xp-scroll i{width:1px;height:46px;background:linear-gradient(#fff,transparent);animation:xpln 1.8s ease-in-out infinite}
@keyframes xpln{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}
/* ---------- LAYOUT ---------- */
.xp-body{position:relative;background:#fff}
.xp-shell{max-width:1180px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:288px 1fr;gap:48px}
@media(max-width:980px){.xp-shell{grid-template-columns:1fr;gap:0}}
/* sticky index */
.xp-index{align-self:start;padding-top:84px;padding-bottom:48px;display:flex;flex-direction:column;gap:18px}
@media(max-width:980px){.xp-index{display:none}}
.xp-index .xp-toc{display:flex;flex-direction:column;padding:4px 10px 10px}
.xp-index .xp-toc a{display:flex;gap:11px;align-items:baseline;padding:8px 10px;border-radius:8px;color:var(--ink-2);font-size:13px;line-height:1.3;transition:background .15s,color .15s}
.xp-index .xp-toc a .nn{font-family:var(--ff-mono);font-size:11px;color:var(--faint);flex:none}
.xp-index .xp-toc a:hover{background:var(--paper);color:var(--navy)}
.xp-index .xp-toc a.active{background:var(--sky);color:var(--blue);font-weight:600}
.xp-index .xp-toc a.active .nn{color:var(--blue)}
.xp-index .xp-keys{padding:6px 20px 18px}
.xp-index .aside-cta{margin-top:2px}
.xp-keys{display:flex;flex-direction:column;gap:12px}
.xp-keys li{display:flex;gap:10px;font-size:12.5px;line-height:1.4;color:var(--ink-2)}
.xp-keys li svg{flex:none;width:15px;height:15px;color:var(--blue);margin-top:1px}
/* article */
.xp-article{padding:90px 0 40px;min-width:0}
.xp-sec{padding-block:46px;border-top:1px solid var(--xp-line)}
.xp-sec:first-child{border-top:0;padding-top:0}
.xp-num{font-family:var(--ff-display);font-size:13px;font-weight:600;color:var(--blue);letter-spacing:.04em}
.xp-sec h2{font-size:clamp(26px,3.4vw,40px);line-height:1.08;letter-spacing:-.02em;margin-top:12px;color:var(--navy)}
.xp-sec h3{font-size:19px;color:var(--navy);margin-top:30px;font-weight:600}
.xp-sec p{margin-top:16px;color:#0d2444;font-size:17px;line-height:1.72;text-wrap:pretty;text-align:justify;-webkit-hyphens:none;hyphens:none}
.xp-sec p .lead,.xp-lead{font-size:19px;line-height:1.6;color:var(--ink)}
.xp-quote{margin:26px 0;padding:18px 24px;border-left:3px solid var(--blue);background:var(--paper);color:var(--navy);font-size:17px;line-height:1.6;font-style:italic;-webkit-hyphens:none;hyphens:none}
.xp-sec strong{font-weight:600;color:var(--navy)}
.xp-kicker{font-family:var(--ff-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
/* ----- blocs de contenu (encadrés, définitions, tableau) ----- */
.dt-trip{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}
@media(max-width:680px){.dt-trip{grid-template-columns:1fr}}
.dt-box{border:1px solid var(--xp-line);background:var(--paper);padding:20px 22px;position:relative;overflow:hidden}
.xp-sec > .dt-box{margin-top:24px}
.dt-box::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal);opacity:.85}
.dt-box h4{font-family:var(--ff-mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--navy);font-weight:600;margin:0;line-height:1.3}
.dt-box ul{margin:13px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.dt-box li{list-style:none;display:block;position:relative;padding-left:17px;font-size:14px;line-height:1.5;color:var(--ink-2)}
.dt-box li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.dt-box li b{color:var(--navy);font-weight:600}
.dt-box.neg::before{background:var(--t-7)}
.dt-def{margin-top:24px;border-left:3px solid var(--blue);background:var(--sky);padding:20px 24px}
.dt-def .t{display:block;font-family:var(--ff-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:8px}
.dt-def p{margin-top:0;font-size:16.5px;line-height:1.66;color:var(--ink);text-align:justify;-webkit-hyphens:none;hyphens:none}
.dt-def strong{color:var(--navy)}
.dt-know{margin-top:28px;display:flex;gap:16px;background:var(--navy);color:#fff;padding:22px 24px;position:relative;overflow:hidden}
.dt-know .thermal{position:absolute;inset:0;opacity:.3}
.dt-know .ic{position:relative;z-index:1;flex:none;width:34px;height:34px;background:rgba(255,255,255,.12);display:grid;place-items:center}
.dt-know .ic svg{width:19px;height:19px;color:#8fb6ff}
.dt-know .in{position:relative;z-index:1}
.dt-know .k{font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8fb6ff}
.dt-know h4{color:#fff;margin-top:6px;font-size:17px;font-weight:600}
.dt-know p{color:#c8d6ee;margin-top:8px;font-size:15px;line-height:1.62;text-align:left}
.dt-know p strong{color:#fff}
.dt-reflink{display:inline-flex;align-items:center;gap:9px;margin-top:22px;font-family:var(--ff-mono);font-size:13px;letter-spacing:.02em;color:var(--blue);font-weight:500}
.dt-reflink::before{content:"→"}
.dt-reflink:hover{text-decoration:underline}
.dt-cmp{margin-top:24px}
.dt-cmp .dt-table{width:100%;border-collapse:collapse;font-size:14.5px;border:1px solid var(--xp-line);background:#fff}
.dt-cmp caption{caption-side:bottom;margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em;text-align:left;line-height:1.5}
.dt-cmp thead th{background:var(--navy);color:#fff;font-family:var(--ff-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;font-weight:500;text-align:left;padding:13px 14px;vertical-align:bottom;line-height:1.3}
.dt-cmp thead th:first-child{background:#0a1f3d}
.dt-cmp tbody th{text-align:left;font-weight:600;color:var(--navy);background:var(--paper);padding:13px 14px;border-top:1px solid var(--xp-line);line-height:1.3;font-size:14px}
.dt-cmp tbody td{padding:13px 14px;border-top:1px solid var(--xp-line);color:#22374f;line-height:1.5;vertical-align:top}
.dt-cmp tbody tr:hover th,.dt-cmp tbody tr:hover td{background:var(--sky)}
.dt-cmp .rate{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--navy);white-space:nowrap}
.dt-cmp .dot{width:9px;height:9px;border-radius:50%;flex:none}
.dt-cmp .dot.g{background:var(--t-4)}.dt-cmp .dot.o{background:#e0972f}.dt-cmp .dot.r{background:var(--t-7)}
/* media */
.xp-media{margin-top:32px}
.xp-media .fr{position:relative;overflow:hidden;background:var(--navy);border:1px solid var(--xp-line)}
.xp-media img,.xp-media video{display:block;width:100%;height:auto}
.xp-media figcaption{margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em}
.xp-vidwrap{position:relative;aspect-ratio:16/9;background:var(--navy)}
.xp-vidwrap video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* image carousel (expertise / dossier articles) — driven by expertise.js [data-carousel] */
.xp-carousel .xpc-frame{position:relative;overflow:hidden;border:1px solid var(--xp-line);background:var(--navy);aspect-ratio:16/9}
.xp-carousel .xpc-track{display:flex;height:100%;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.xp-carousel .xpc-slide{flex:0 0 100%;height:100%;position:relative}
.xp-carousel .xpc-slide .fr{width:100%;height:100%;background:var(--navy);border:none}
.xp-carousel .xpc-slide img,.xp-carousel .xpc-slide video{width:100%;height:100%;object-fit:contain;display:block}
.xp-carousel .xpc-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(7,26,51,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;display:grid;place-items:center;cursor:pointer;z-index:2;transition:background .2s ease,border-color .2s ease}
.xp-carousel .xpc-nav:hover{background:rgba(7,26,51,.85);border-color:rgba(255,255,255,.5)}
.xp-carousel .xpc-nav svg{width:20px;height:20px}
.xp-carousel .xpc-nav.prev{left:14px}
.xp-carousel .xpc-nav.next{right:14px}
.xp-carousel .xpc-count{position:absolute;top:14px;right:14px;z-index:2;font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.06em;color:#fff;background:rgba(7,26,51,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:5px 10px;border:1px solid rgba(255,255,255,.2)}
.xp-carousel .xpc-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
.xp-carousel .xpc-dots button{width:8px;height:8px;border-radius:50%;border:none;background:var(--line);cursor:pointer;padding:0;transition:background .2s ease,transform .2s ease}
.xp-carousel .xpc-dots button.active{background:var(--blue);transform:scale(1.35)}
@media(max-width:600px){.xp-carousel .xpc-nav{width:40px;height:40px}}
/* related */
.xp-rel{background:var(--paper);border-top:1px solid var(--xp-line)}
.xp-rel-in{max-width:1180px;margin:0 auto;padding:64px 28px}
.xp-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
@media(max-width:860px){.xp-rel-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.xp-rel-grid{grid-template-columns:1fr}}
.xp-rc{display:block;border:1px solid var(--xp-line);background:#fff;overflow:hidden;transition:transform .2s,box-shadow .2s}
.xp-rc:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.xp-rc .im{aspect-ratio:16/10;overflow:hidden;background:var(--navy)}
.xp-rc .im img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.xp-rc:hover .im img{transform:scale(1.05)}
.xp-rc .bd{padding:16px 17px 18px}
.xp-rc .bd .k{font-family:var(--ff-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.xp-rc .bd h4{font-size:15.5px;color:var(--navy);margin-top:7px;line-height:1.25;font-weight:600}
.xp-rc .bd .m{margin-top:11px;font-size:12.5px;color:var(--blue);font-weight:600;display:inline-flex;align-items:center;gap:6px}
/* conversion: benefits band */
.xp-bene{background:var(--paper);border-top:1px solid var(--xp-line);border-bottom:1px solid var(--xp-line)}
.xp-bene-in{max-width:1180px;margin:0 auto;padding:30px 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:760px){.xp-bene-in{grid-template-columns:1fr;gap:18px}}
.xp-bene .bi{display:flex;gap:15px;align-items:flex-start}
.xp-bene .bi .ic{flex:none;width:44px;height:44px;display:grid;place-items:center;background:var(--sky);color:var(--blue);position:relative;overflow:hidden}
.xp-bene .bi .ic::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.xp-bene .bi .ic svg{width:21px;height:21px}
.xp-bene .bi b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:15.5px;letter-spacing:.01em}
.xp-bene .bi p{margin-top:5px;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
/* conversion: sectors / use-cases */
.xp-sectors{background:#fff;border-top:1px solid var(--xp-line)}
.xp-sectors-in{max-width:1180px;margin:0 auto;padding:72px 28px}
.xp-sectors-in h2{font-size:clamp(25px,3.3vw,38px);line-height:1.1;letter-spacing:-.02em;color:var(--navy);margin-top:12px}
.xp-sectors-in .sx-sub{margin-top:14px;max-width:66ch;color:#0d2444;font-size:17px;line-height:1.7;text-align:justify}
.sx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}
@media(max-width:860px){.sx-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.sx-grid{grid-template-columns:1fr}}
.sx-card{display:flex;flex-direction:column;border:1px solid var(--xp-line);background:var(--paper);padding:22px 22px 18px;transition:transform .2s,box-shadow .25s,border-color .2s}
.sx-card:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--sky-2);background:#fff}
.sx-card .ic{width:42px;height:42px;display:grid;place-items:center;background:var(--sky);color:var(--blue)}
.sx-card .ic svg{width:22px;height:22px}
.sx-card h4{font-size:16.5px;color:var(--navy);margin-top:16px;font-weight:600;line-height:1.2}
.sx-card p{margin-top:9px;font-size:14px;line-height:1.5;color:var(--ink-2);flex:1}
.sx-card .ex{margin-top:16px;font-family:var(--ff-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--blue);font-weight:500;display:inline-flex;align-items:center;gap:7px}
.sx-card .ex svg{width:13px;height:13px;transition:transform .18s}
.sx-card:hover .ex svg{transform:translateX(3px)}
/* hero CTA */
.xp-hcta{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.xp-hlink{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;font-size:15px;padding:13px 4px}
.xp-hlink svg{width:16px;height:16px;transition:transform .2s}
.xp-hlink:hover{color:#cfe0ff}
.xp-hlink:hover svg{transform:translateX(3px)}
/* figure zoom cues */
.xp-media .fr{cursor:zoom-in}
/* mobile typo — ferré à gauche */
@media(max-width:600px){.xp-sec p,.dt-def p{text-align:left}}
/* ===== FAQ ===== */
.xp-faq{background:#fff;border-top:1px solid var(--xp-line)}
.xp-faq-in{max-width:1180px;margin:0 auto;padding:72px 28px}
.xp-faq h2{font-size:clamp(25px,3.3vw,38px);color:var(--navy);margin-top:12px;letter-spacing:-.02em;line-height:1.1}
.xp-faq .sub{margin-top:14px;max-width:64ch;color:#0d2444;font-size:16px;line-height:1.6}
.xpf-grid{display:grid;grid-template-columns:1.55fr .9fr;gap:28px;margin-top:34px;align-items:start}
@media(max-width:860px){.xpf-grid{grid-template-columns:1fr}}
.xpf-list{display:flex;flex-direction:column;gap:12px}
.xpf-item{border:1px solid var(--xp-line);background:var(--paper)}
.xpf-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 20px;font-family:var(--ff-display);font-weight:600;font-size:16px;color:var(--navy);line-height:1.3}
.xpf-item summary::-webkit-details-marker{display:none}
.xpf-x{position:relative;flex:none;width:18px;height:18px}
.xpf-x::before,.xpf-x::after{content:"";position:absolute;background:var(--blue);transition:transform .2s}
.xpf-x::before{top:8px;left:0;width:18px;height:2px}
.xpf-x::after{left:8px;top:0;width:2px;height:18px}
.xpf-item[open] .xpf-x::after{transform:scaleY(0)}
.xpf-a{padding:0 20px 18px}
.xpf-a p{margin:0;color:#0d2444;font-size:15.5px;line-height:1.65;text-align:justify;-webkit-hyphens:none;hyphens:none}
.xpf-a a{color:var(--blue);font-weight:600;text-decoration:underline}
.xpf-cta{background:var(--navy);color:#fff;padding:28px 26px;position:relative;overflow:hidden}
.xpf-cta::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.xpf-cta .k{font-family:var(--ff-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8fb6ff}
.xpf-cta h3{color:#fff;font-size:21px;margin-top:10px;font-weight:600;line-height:1.2}
.xpf-cta p{color:#c8d6ee;font-size:14.5px;line-height:1.6;margin-top:12px}
.xpf-cta .btn{margin-top:18px}
@media(max-width:600px){.xpf-a p{text-align:left}}
/* ===== video showcase ===== */
.xv-show{position:relative;background:radial-gradient(120% 130% at 80% -10%,#143a6b 0%,#0d2444 48%,#071a33 100%);overflow:hidden;border-top:1px solid rgba(255,255,255,.06)}
.xv-bgmap{position:absolute;inset:0;opacity:.5;pointer-events:none;background:radial-gradient(50% 80% at 86% 12%,rgba(45,111,219,.26),transparent 62%),radial-gradient(55% 90% at 8% 108%,rgba(31,138,90,.17),transparent 60%),radial-gradient(40% 60% at 98% 62%,rgba(232,57,43,.13),transparent 58%)}
.xv-in{position:relative;max-width:1180px;margin:0 auto;padding:74px 28px 80px}
.xv-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.xv-head .xp-kicker{color:#8fb6ff}
.xv-head h2{color:#fff;font-size:clamp(26px,3.4vw,40px);line-height:1.08;letter-spacing:-.02em;margin-top:12px}
.xv-head p{color:#bcd0ee;font-size:16px;line-height:1.6;margin-top:12px;max-width:56ch}
.xv-all{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;font-size:14px;border:1px solid rgba(255,255,255,.28);padding:11px 18px;transition:background .18s,color .18s}
.xv-all:hover{background:#fff;color:var(--navy)}
.xv-all svg{width:15px;height:15px}
.xv-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;margin-top:34px;align-items:stretch}
@media(max-width:880px){.xv-grid{grid-template-columns:1fr}}
.xv-feat{position:relative;overflow:hidden;background:#000;aspect-ratio:16/9;width:100%;display:block;cursor:pointer;border:1px solid rgba(255,255,255,.08)}
.xv-feat video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xv-feat .xv-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(7,17,42,.8))}
.xv-feat .xv-cap{position:absolute;left:22px;right:22px;bottom:18px;text-align:left;z-index:2}
.xv-feat .xv-cap b{display:block;color:#fff;font-family:var(--ff-display);font-weight:600;font-size:clamp(17px,2vw,21px);line-height:1.15}
.xv-feat .xv-cap span{display:block;font-family:var(--ff-mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#9fc0ff;margin-top:6px}
.xv-expand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:66px;height:66px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--navy);z-index:2;transition:transform .25s ease,opacity .25s ease;box-shadow:0 12px 34px -10px rgba(0,0,0,.6)}
.xv-expand svg{width:28px;height:28px;margin-left:4px}
.xv-feat:hover .xv-expand{opacity:0;transform:translate(-50%,-50%) scale(.9)}
.xv-sound{position:absolute;right:14px;top:14px;z-index:3;display:inline-flex;align-items:center;gap:8px;background:rgba(7,17,42,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.22);color:#fff;font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;padding:8px 12px;cursor:pointer}
.xv-sound svg{width:15px;height:15px}
.xv-sound .on{display:none}.xv-sound.unmuted .on{display:inline}.xv-sound.unmuted .off{display:none}
.xv-rail{display:grid;grid-template-rows:repeat(3,1fr);gap:18px;min-height:0}
@media(max-width:880px){.xv-rail{grid-template-rows:none;grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.xv-rail{grid-template-columns:1fr}}
.xv-card{position:relative;overflow:hidden;background:#000;display:block;aspect-ratio:16/9;cursor:pointer;border:1px solid rgba(255,255,255,.08);padding:0;width:100%;font-family:inherit}
.xv-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s}
.xv-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xv-card.playing video{opacity:1}
.xv-card .xc-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(7,17,42,.82))}
.xv-card .pp{position:absolute;left:13px;bottom:11px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--navy);z-index:2;transition:transform .2s ease,opacity .25s ease}
.xv-card .pp svg{width:14px;height:14px;margin-left:2px}
.xv-card:hover .pp{transform:scale(1.1)}
.xv-card.playing .pp{opacity:0}
.xv-card .xc-t{position:absolute;left:54px;right:12px;bottom:11px;z-index:2;color:#fff;font-family:var(--ff-display);font-weight:600;font-size:13px;line-height:1.18;text-align:left}
.xv-grid.xv-grid-3{grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:760px){.xv-grid.xv-grid-3{grid-template-columns:1fr}}
.xv-card.xv-vert{aspect-ratio:9/16}
.xv-card.xv-vert .xc-t{font-size:14px}
/* video lightbox */
.xv-lb{position:fixed;inset:0;z-index:200;background:rgba(7,18,33,.93);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:30px}
.xv-lb.open{display:flex}
.xv-lb-inner{width:min(1080px,94vw);max-height:90vh;display:flex;flex-direction:column;gap:14px}
.xv-lb-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.xv-lb-frame video{width:100%;height:100%;object-fit:contain;background:#000}
.xv-lb-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#fff}
.xv-lb-bar .d{font-family:var(--ff-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8fb6ff}
.xv-lb-bar .t{font-weight:600;font-size:17px;margin-top:3px}
.xv-lb-bar a{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.25);padding:9px 16px;font-size:13.5px;font-weight:500;transition:background .18s,color .18s}
.xv-lb-bar a:hover{background:#fff;color:var(--navy)}
.xv-lb-bar a svg{width:15px;height:15px}
.xv-lb-close{position:absolute;top:-46px;right:0;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;cursor:pointer;display:grid;place-items:center;font-size:18px}
.xv-lb-close:hover{background:rgba(255,255,255,.12)}
/* sidebar expertises list (style méga-menu) */
.xp-index .explist{display:flex;flex-direction:column;padding:6px 16px 12px}
.xp-index .explist a{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line-soft);font-size:13px;color:var(--ink);line-height:1.3;transition:color .15s}
.xp-index .explist a:last-child{border-bottom:0}
.xp-index .explist a .ar{color:var(--blue);flex:none;margin-top:1px;transition:transform .15s}
.xp-index .explist a:hover{color:var(--blue)}
.xp-index .explist a:hover .ar{transform:translate(2px,-2px)}
.xp-index .explist a.cur{color:var(--blue);font-weight:600;pointer-events:none}
.xp-index .aside-search{padding:0 4px 4px}
.xp-topprog{position:fixed;top:0;left:0;right:0;height:2px;z-index:80;background:transparent;pointer-events:none}
.xp-topprog i{display:block;height:100%;width:0;background:var(--grad-thermal);background-size:100vw 100%;background-repeat:no-repeat}

/* ===== TEST — ombres / étiquette / animations ===== */
.xi-meta{display:none;gap:7px;flex-wrap:wrap;margin-top:14px}
.xi-meta span{font-family:var(--ff-mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;padding:5px 9px;border:1px solid rgba(255,255,255,.28);color:#c4d4ee}
.xi-meta span b{color:#fff;font-weight:600}
.xi-tick{display:none}
/* --- ombres --- */
.o-filet .aside-card,.o-filet .aside-head{box-shadow:none}
.o-douce .aside-card,.o-douce .aside-head{box-shadow:0 2px 6px rgba(13,36,68,.08)}
.o-bleu .aside-card,.o-bleu .aside-head{box-shadow:0 10px 26px -14px rgba(22,87,224,.35),0 1px 3px rgba(13,36,68,.06);transition:box-shadow .3s ease,transform .3s ease}
.o-bleu .aside-card:hover{transform:translateY(-2px);box-shadow:0 18px 38px -16px rgba(22,87,224,.45),0 2px 6px rgba(13,36,68,.08)}
/* --- effets « livre blanc » propagés (hors barre thermique, typo inchangée) --- */
.aside-card,.aside-head{transition:border-color .2s ease,box-shadow .3s ease,transform .3s ease}
.aside-card:hover{border-color:var(--blue)}
.aside-card .ac-head{transition:color .2s ease}
.aside-card:hover .ac-head{color:var(--blue)}
.side-all{transition:color .18s ease}
.side-all:hover{color:var(--navy)}
/* --- étiquette de tête : version retenue (carré · texte centré · signal · ombre forte au survol) --- */
.xi-hic{display:none}
.xi-frame{display:none}
.xi-plate{display:contents}
.aside-head.has-bg .xi-plate > *{position:relative;z-index:2}
.aside-head.has-bg{display:flex;flex-direction:column;justify-content:center;text-align:center;padding:22px;border-left:3px solid var(--blue);transition:box-shadow .35s ease,transform .35s ease,border-left-width .3s ease}
.aside-head.has-bg::before{transition:transform .8s ease}
.aside-head.has-bg::after{background:linear-gradient(180deg,rgba(7,17,42,.5),rgba(7,17,42,.72))}
.aside-head.has-bg:hover{border-left-width:7px;transform:translateY(-3px);box-shadow:0 0 0 1px rgba(22,87,224,.3),0 30px 65px -18px rgba(22,87,224,.65),0 0 40px rgba(22,87,224,.18)}
.aside-head.has-bg:hover::before{transform:scale(1.07)}
.aside-head .ah-title{font-size:21px}
.xi-har{display:grid;place-items:center;position:absolute;right:12px;top:50%;margin-top:-15px;z-index:3;width:30px;height:30px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);color:#fff;transition:background .2s ease,border-color .2s ease,transform .25s ease}
.xi-har svg{width:14px;height:14px}
.aside-head.has-bg:hover .xi-har{background:var(--blue);border-color:var(--blue);transform:translateX(2px)}
/* --- taille validée --- */
.aside-head.has-bg{aspect-ratio:4/3}
/* --- CTA : animation validée (balayage, cycle 11s) --- */
.aside-cta .xi-sheen{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.aside-cta .xi-sheen::before{content:"";position:absolute;top:-30%;bottom:-30%;left:-40%;width:36%;background:linear-gradient(100deg,transparent,rgba(143,182,255,.24),rgba(255,255,255,.16),transparent);transform:skewX(-18deg);animation:xiSheen 11s ease-in-out infinite}
@keyframes xiSheen{0%,78%{left:-45%}95%,100%{left:130%}}
@media(prefers-reduced-motion:reduce){.aside-cta .xi-sheen::before{animation:none}}
/* --- FAQ : micro-interactions au survol --- */
.xpf-item{transition:border-color .2s ease,box-shadow .25s ease,transform .25s ease}
.xpf-item:hover{border-color:var(--blue);box-shadow:0 10px 26px -14px rgba(22,87,224,.35);transform:translateY(-2px)}
.xpf-item summary{transition:color .18s ease}
.xpf-item:hover summary{color:var(--blue)}
.xpf-item .xpf-x::before,.xpf-item .xpf-x::after{transition:transform .2s ease,background .18s ease}
.xpf-item:hover .xpf-x::before,.xpf-item:hover .xpf-x::after{background:var(--navy)}
.xpf-cta{box-shadow:0 2px 6px -4px rgba(22,87,224,.12);transition:box-shadow .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.xpf-cta:hover{transform:translateY(-3px);box-shadow:0 4px 10px -6px rgba(22,87,224,.2),0 14px 30px -14px rgba(22,87,224,.35),0 30px 60px -22px rgba(22,87,224,.5)}
.xpf-cta .btn{display:flex;width:100%;justify-content:center}
.xpf-cta .btn .arrow{transition:transform .18s ease}
.xpf-cta .btn:hover .arrow{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.xpf-item,.xpf-cta{transition:none}}
/* --- CTA contact optimisé --- */
.aside-cta{position:relative;overflow:hidden;box-shadow:0 0 0 1px rgba(13,36,68,.08),0 18px 42px -16px rgba(22,87,224,.5);transition:box-shadow .35s ease,transform .35s ease}
.aside-cta:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(22,87,224,.3),0 26px 60px -18px rgba(22,87,224,.65)}
.xi-glow{position:absolute;width:190px;height:190px;right:-60px;top:-60px;border-radius:50%;background:radial-gradient(circle,rgba(45,111,219,.4),transparent 70%);opacity:.5;pointer-events:none}
@keyframes xiGlow{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:.75;transform:scale(1.22)}}
.aside-cta .btn{position:relative;z-index:2}
.aside-cta .btn .arrow{transition:transform .18s ease}
.aside-cta .btn:hover .arrow{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.xi-glow{animation:none}}
/* --- animations (CSS only) --- */
.anim > *{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.anim > *.xin{opacity:1;transform:none}

.anim .side-card .thumb{overflow:hidden}
.anim .side-card .thumb img{transition:transform .45s ease}
.anim .side-card:hover .thumb img{transform:scale(1.06)}
.anim .xp-toc a{transition:background .18s,color .18s,padding-left .18s}
.anim .xp-toc a:hover{padding-left:14px}
.anim .side-all svg{transition:transform .18s ease}
@media(prefers-reduced-motion:reduce){.anim > *{opacity:1;transform:none;transition:none}.anim .side-card .thumb img{transition:none!important}}

/* --- modules ajoutés --- */
.xi-new{display:inline-grid;place-items:center;margin-left:8px;width:14px;height:14px;background:var(--sky);color:var(--blue);font-family:var(--ff-mono);font-size:10px;font-weight:600;vertical-align:1px}
.xi-hide{display:none!important}
.xi-fiche{padding:10px 20px 16px}
.xi-fiche .r{display:flex;gap:12px;justify-content:space-between;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--xp-line)}
.xi-fiche .r:last-child{border-bottom:0}
.xi-fiche .k{font-family:var(--ff-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);flex:none}
.xi-fiche .v{font-size:12.5px;color:var(--navy);font-weight:500;text-align:right;line-height:1.35}
.xi-vidbtn{position:relative;display:block;width:calc(100% - 24px);margin:12px auto 14px;aspect-ratio:16/9;border:0;overflow:hidden;background:#000;cursor:pointer;padding:0}
.xi-vidbtn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xi-glos{padding:8px 14px 14px;display:flex;flex-direction:column;gap:6px}
.xi-glos details{border:1px solid var(--xp-line);background:var(--paper)}
.xi-glos summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;font-size:12.5px;font-weight:600;color:var(--navy)}
.xi-glos summary::-webkit-details-marker{display:none}
.xi-glos .gx{position:relative;flex:none;width:12px;height:12px}
.xi-glos .gx::before,.xi-glos .gx::after{content:"";position:absolute;background:var(--blue)}
.xi-glos .gx::before{top:5px;left:0;width:12px;height:2px}
.xi-glos .gx::after{left:5px;top:0;width:2px;height:12px;transition:transform .2s}
.xi-glos details[open] .gx::after{transform:scaleY(0)}
.xi-glos p{margin:0;padding:0 12px 11px;font-size:12px;line-height:1.55;color:var(--ink-2)}
.xi-stats{padding:10px 20px 16px}
.xi-stats .s{display:flex;align-items:baseline;gap:12px;padding:8px 0;border-bottom:1px solid var(--xp-line)}
.xi-stats .s:last-child{border-bottom:0}
.xi-stats .s b{font-family:var(--ff-display);font-size:22px;font-weight:600;color:var(--navy);flex:none;min-width:64px}
.xi-stats .s span{font-size:12px;color:var(--ink-2);line-height:1.35}
.xi-livre{display:flex;align-items:center;gap:13px;padding:16px 18px;text-decoration:none;position:relative;transition:border-color .2s}
.xi-livre::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.xi-livre .ic{flex:none;width:40px;height:40px;display:grid;place-items:center;background:var(--sky);color:var(--blue)}
.xi-livre .ic svg{width:20px;height:20px}
.xi-livre .in{flex:1;min-width:0}
.xi-livre .in .k{display:block;font-family:var(--ff-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.xi-livre .in b{display:block;font-family:var(--ff-display);font-size:13.5px;font-weight:600;color:var(--navy);margin-top:4px;line-height:1.25}
.xi-livre .in .m{display:block;font-size:11px;color:var(--blue);font-weight:600;margin-top:5px}
.xi-livre .ar{flex:none;width:15px;height:15px;color:var(--blue);transition:transform .18s}
.xi-livre:hover .ar{transform:translateX(3px)}
.xi-livre:hover{border-color:var(--blue)}

/* expertises façon explorateur (icônes + surlignage bleu) */
.xe2{padding:6px 12px 12px}
.xe2 a{display:flex;gap:11px;align-items:center;padding:10px 8px;border-bottom:1px solid var(--line-soft);font-size:13px;font-weight:500;color:var(--ink-2);line-height:1.35;transition:padding-left .18s ease,color .15s ease,background .15s ease}
.xe2 a:last-child{border-bottom:0}
.xe2 a .ic{flex:none;width:19px;height:19px;color:var(--muted);transition:color .12s ease}
.xe2 a .ic svg{width:100%;height:100%;display:block}
.xe2 a:hover{color:var(--navy);background:linear-gradient(90deg,var(--sky),transparent 75%);padding-left:14px}
.xe2 a:hover .ic{color:var(--blue)}
.xe2 a::after{content:"\2192";font-family:var(--ff-mono);font-size:11px;color:var(--blue);margin-left:auto;opacity:0;transform:translateX(-5px);transition:opacity .15s ease,transform .15s ease}
.xe2 a:hover::after{opacity:1;transform:none}
.xe2 a.cur{color:var(--blue);font-weight:600;background:linear-gradient(90deg,var(--sky),transparent 85%);box-shadow:inset 2px 0 0 var(--blue);padding-left:10px;pointer-events:none}
.xe2 a.cur .ic{color:var(--blue)}
.xe2 a.cur::after{content:"\25CF";opacity:1;transform:none;font-size:8px}

.refz{position:relative;overflow:hidden;background:radial-gradient(120% 150% at 80% -20%,#164079 0%,#0d2444 52%,#071a33 100%)}
.refz::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad-thermal);z-index:3}
.refz-fx{position:absolute;inset:0;z-index:1;pointer-events:none;background:repeating-radial-gradient(120% 90% at 90% -10%,transparent 0 26px,rgba(143,182,255,.07) 26px 27px)}
.refz-in{max-width:1180px;margin:0 auto;padding:44px 28px;position:relative;z-index:2}
.refz-k{font-family:var(--ff-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;display:inline-block;color:#8fb6ff}
.refz-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
@media(max-width:700px){.refz-stats{grid-template-columns:1fr 1fr;gap:18px}}
.refz-item{padding:0 30px;position:relative}
.refz-item:first-child{padding-left:0}
.refz-item + .refz-item::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;background:var(--grad-thermal)}
.refz-item b{font-family:var(--ff-display);font-size:clamp(30px,3.6vw,44px);font-weight:600;line-height:1;letter-spacing:-.01em;color:#fff}
.refz-item span{font-size:13px;margin-top:9px;display:block;line-height:1.4;color:#9fc0ff}
.refz-item b span{font-size:inherit;margin-top:0;display:inline;line-height:inherit;color:inherit}
.refz-cli{margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);display:flex;align-items:center;gap:24px}
@media(max-width:700px){.refz-cli{flex-direction:column;align-items:flex-start;gap:14px}}
.refz-h{flex:none;font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8fb6ff;max-width:120px;line-height:1.4}
.refz-track{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.refz-row{display:flex;gap:36px;width:max-content;animation:refzscroll 46s linear infinite}
.refz:hover .refz-row{animation-play-state:paused}
.refz-logo{flex:none;display:flex;align-items:center;height:34px;color:#dce8fb;font-family:var(--ff-display);font-weight:600;font-size:16px;opacity:.72;white-space:nowrap;transition:opacity .2s}
.refz-logo:hover{opacity:1}
@keyframes refzscroll{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 18px))}}
@media(prefers-reduced-motion:reduce){.refz-row{animation:none}}

/* ---- EXPERTISE V2 — extra components (xp-trip/tcard, xp-break, xp-diagram, xpd-*, xp-aside-*)
   merged from air-vent/etude-du-confort-au-vent during pilot ---- */
@keyframes xpln{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}
.xp-aside-card{margin-top:26px;border:1px solid var(--xp-line);background:var(--paper);padding:18px}
.xp-aside-card .h{font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:13px}
.xp-aside-cta{margin-top:18px;border:0;background:var(--navy);color:#fff;padding:20px;position:relative;overflow:hidden}
.xp-aside-cta .thermal{position:absolute;inset:0;opacity:.4}
.xp-aside-cta .in{position:relative}
.xp-aside-cta h4{color:#fff;font-size:15px;font-weight:600}
.xp-aside-cta p{color:#c4d4ee;font-size:12.5px;line-height:1.5;margin-top:8px}
.xp-aside-cta .b{display:inline-flex;align-items:center;gap:8px;margin-top:14px;background:#0043AF;color:#fff;font-size:12.5px;font-weight:600;padding:9px 14px}
.xp-aside-cta .b:hover{background:#00a3b4}
.xp-break p{color:#dfe7d8;margin-top:14px;font-size:16.5px;line-height:1.7;text-align:justify;-webkit-hyphens:none;hyphens:none}
.xp-diagram p{text-align:justify;-webkit-hyphens:none;hyphens:none}
.xp-trip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
@media(max-width:760px){.xp-trip{grid-template-columns:1fr}}
.xp-tcard{border:1px solid var(--xp-line);padding:22px;background:var(--paper);position:relative;overflow:hidden}
.xp-tcard::before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:var(--grad-thermal);opacity:.85}
.xp-tcard h4{font-size:14px;color:var(--navy);font-weight:600;letter-spacing:.02em;text-transform:uppercase;font-family:var(--ff-mono)}
.xp-tcard ul{margin-top:14px;display:flex;flex-direction:column;gap:11px}
.xp-tcard li{display:flex;gap:10px;font-size:14.5px;line-height:1.4;color:var(--ink-2)}
.xp-tcard li svg{flex:none;width:16px;height:16px;color:var(--blue);margin-top:2px}
.xp-tcard a{color:var(--ink-2)}
.xp-tcard a:hover{color:var(--blue)}
.xp-play{position:absolute;left:16px;bottom:16px;z-index:2;display:inline-flex;align-items:center;gap:9px;background:rgba(7,26,51,.7);backdrop-filter:blur(4px);color:#fff;font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:9px 14px;pointer-events:none}
.xp-break{margin-top:0;background:radial-gradient(120% 130% at 85% 0%,#1a2c12 0%,#0d1f0a 45%,#071a33 100%);color:#fff;position:relative;overflow:hidden}
.xp-break .thermal{position:absolute;inset:0;opacity:.3}
.xp-break>.in{position:relative;max-width:1180px;margin:0 auto;padding:74px 28px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
@media(max-width:860px){.xp-break>.in{grid-template-columns:1fr;gap:30px}}
.xp-break .xp-kicker{color:#ffd9a0}
.xp-break h2{color:#fff;font-size:clamp(26px,3.4vw,40px);line-height:1.1;letter-spacing:-.02em;margin-top:12px}
.xp-break h3{color:#fff;margin-top:26px;font-size:18px}
.xp-break p{color:#dfe7d8;margin-top:14px;font-size:16.5px;line-height:1.7}
.xp-break strong{color:#fff}
.xp-break .fr{border:1px solid rgba(255,255,255,.16);overflow:hidden}
.xp-break .fr img{display:block;width:100%;height:auto}
.xp-diagram{display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:center;margin-top:32px;background:var(--paper);border:1px solid var(--xp-line);padding:24px}
@media(max-width:680px){.xp-diagram{grid-template-columns:1fr}}
.xp-diagram .ph{width:230px;max-width:100%;border:1px solid var(--xp-line);background:#fff}
.xp-diagram .ph img{display:block;width:100%;height:auto}
.xp-diagram .cap{font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);margin-top:10px}
.xp-dossiers{background:var(--paper);border-top:1px solid var(--xp-line)}
.xp-dossiers-in{max-width:1180px;margin:0 auto;padding:64px 28px}
.xpd-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.xpd-head h2{font-size:clamp(24px,3vw,34px);color:var(--navy);margin-top:10px;line-height:1.12;letter-spacing:-.02em}
.xpd-head .lead{margin-top:12px;max-width:62ch;color:#22374f;font-size:16px;line-height:1.62}
.xpd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
@media(max-width:860px){.xpd-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.xpd-grid{grid-template-columns:1fr}}
.xpd-card{display:flex;flex-direction:column;border:1px solid var(--xp-line);background:#fff;overflow:hidden;transition:transform .2s,box-shadow .25s,border-color .2s}
.xpd-card:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--sky-2)}
.xpd-card.feat{border-color:var(--sky-2);box-shadow:0 14px 34px -20px rgba(22,87,224,.4)}
.xpd-card .im{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--grad-thermal)}
.xpd-card .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.xpd-card:hover .im img{transform:scale(1.05)}
.xpd-card .im .tag{position:absolute;left:12px;top:12px;z-index:2;font-family:var(--ff-mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#fff;background:rgba(7,17,42,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:5px 10px;display:inline-flex;align-items:center;gap:6px}
.xpd-card .im .tag svg{width:12px;height:12px}
.xpd-card .bd{padding:18px 18px 18px;display:flex;flex-direction:column;flex:1}
.xpd-card .bd b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:16.5px;line-height:1.22;display:block}
.xpd-card .bd .d{display:block;margin-top:8px;font-size:13.5px;color:var(--ink-2);line-height:1.5;flex:1}
.xpd-card .bd .m{margin-top:14px;font-family:var(--ff-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--blue);font-weight:500;display:inline-flex;align-items:center;gap:7px}
.xpd-card .bd .m svg{width:13px;height:13px;transition:transform .18s}
.xpd-card:hover .bd .m svg{transform:translateX(3px)}
.xpd-card .bd .m.soon{color:var(--muted)}
.xp-diagram .ph{cursor:zoom-in}
@media(max-width:600px){.xp-sec p,.xp-break p,.xp-diagram p{text-align:left}}

/* ---- xp-eq (équation) merged from actions-du-vent ---- */
.xp-eq{margin-top:18px;background:var(--paper);border:1px solid var(--xp-line);border-left:3px solid var(--blue);padding:16px 22px;font-family:var(--ff-mono);font-size:clamp(15px,1.9vw,19px);color:var(--navy);text-align:center;letter-spacing:.01em}
.xp-eq .wh{display:block;margin-top:10px;font-family:var(--ff-body);font-size:13px;color:var(--ink-2);text-align:left;letter-spacing:0;line-height:1.5}
.xp-eq sub{font-size:.72em}


/* ============================================================
   RECOVERED PAGE-SPECIFIC COMPONENTS (editorial blocks, proof bands…)
   merged from exports mirror after inline-CSS strip — 19/07/2026
   ============================================================ */
/* recovered from data-center/commissioning-study-and-cfd-modeling-of-load-benches */
.xp-break .in{position:relative;max-width:1180px;margin:0 auto;padding:74px 28px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
/* recovered from data-center/data-center-cooling-systems */
.dt-hero{position:relative;background:linear-gradient(180deg,#fff 0%,var(--paper) 100%);border-bottom:1px solid var(--xp-line);overflow:hidden}
.dt-hero .cmap{position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad-thermal);z-index:2}
.dt-hero-in{max-width:1180px;margin:0 auto;padding:30px 28px 52px}
.dt-crumbs{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-family:var(--ff-mono);font-size:12px;letter-spacing:.03em;color:var(--muted)}
.dt-crumbs a{color:var(--ink-2)}
.dt-crumbs a:hover{color:var(--blue)}
.dt-crumbs .sep{color:var(--faint)}
.dt-crumbs .here{color:var(--navy)}
.dt-eyebrow{display:inline-flex;align-items:center;gap:11px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.dt-eyebrow::before{content:"";width:26px;height:2px;background:var(--grad-thermal)}
.dt-hero h1{color:var(--navy);font-size:clamp(31px,4.3vw,52px);line-height:1.04;letter-spacing:-.03em;margin-top:18px;max-width:18ch;font-weight:600}
.dt-hero .sub{color:var(--ink-2);font-size:clamp(17px,1.6vw,20px);line-height:1.58;margin-top:20px;max-width:62ch}
.dt-meta{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px}
.dt-meta .chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.04em;color:var(--ink-2);background:#fff;border:1px solid var(--xp-line);padding:8px 13px}
.dt-meta .chip svg{width:14px;height:14px;color:var(--blue)}
.dt-meta .chip b{color:var(--navy);font-weight:600}
.dt-hero-fig{position:relative;overflow:hidden;border:1px solid var(--xp-line);box-shadow:var(--sh-lg);background:var(--navy);aspect-ratio:4/3.05}
.dt-hero-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dt-hero-fig figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:26px 18px 13px;background:linear-gradient(180deg,transparent,rgba(7,17,42,.85));color:#dbe7fb;font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.02em}
.dt-body{background:#fff}
.dt-shell{max-width:1180px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:288px 1fr;gap:54px}
.dt-index{align-self:start;padding-top:54px;padding-bottom:48px;display:flex;flex-direction:column;gap:18px}
.dt-progress{height:3px;background:var(--line);position:relative;margin:0 16px 8px;overflow:hidden}
.dt-progress i{position:absolute;inset:0 auto 0 0;width:0;background:var(--grad-thermal);background-size:240px 100%;background-repeat:no-repeat}
.dt-toc{display:flex;flex-direction:column;padding:2px 12px 12px}
.dt-toc a{display:flex;gap:11px;align-items:baseline;padding:8px 8px;border-radius:8px;color:var(--ink-2);font-size:13px;line-height:1.3;transition:background .15s,color .15s}
.dt-toc a .nn{font-family:var(--ff-mono);font-size:11px;color:var(--faint);flex:none}
.dt-toc a:hover{background:var(--paper);color:var(--navy)}
.dt-toc a.active{background:var(--sky);color:var(--blue);font-weight:600}
.dt-toc a.active .nn{color:var(--blue)}
.dt-keys{padding:6px 20px 18px;display:flex;flex-direction:column;gap:12px}
.dt-keys li{list-style:none;display:flex;gap:10px;font-size:13px;line-height:1.4;color:var(--ink-2)}
.dt-keys li svg{flex:none;width:15px;height:15px;color:var(--blue);margin-top:1px}
.dt-keys b{color:var(--navy);font-weight:600}
.dt-index .aside-search{padding:0 4px 4px}
.dt-article{padding:54px 0 50px;min-width:0;max-width:780px}
.dt-sec{padding-block:38px;border-top:1px solid var(--xp-line)}
.dt-sec:first-child{border-top:0;padding-top:6px}
.dt-num{font-family:var(--ff-mono);font-size:12px;font-weight:500;color:var(--blue);letter-spacing:.08em;text-transform:uppercase}
.dt-sec h2{font-size:clamp(24px,3vw,33px);line-height:1.12;letter-spacing:-.02em;margin-top:11px;color:var(--navy)}
.dt-sec h3{font-size:18.5px;color:var(--navy);margin-top:30px;font-weight:600}
.dt-sec p{margin-top:15px;color:#22374f;font-size:17.5px;line-height:1.78;text-align:justify;text-wrap:pretty;-webkit-hyphens:none;hyphens:none}
.dt-sec p.lead{font-size:20px;line-height:1.6;color:var(--ink)}
.dt-sec strong{font-weight:600;color:var(--navy)}
.dt-trip.three{grid-template-columns:repeat(3,1fr)}
.dt-box.pos::before{background:var(--t-4)}
.dt-fig{margin-top:28px}
.dt-fig .ph{border:1px solid var(--xp-line);background:var(--paper-2);overflow:hidden;box-shadow:var(--sh-md);cursor:zoom-in}
.dt-fig .ph img{width:100%;height:auto;display:block}
.dt-fig figcaption{margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em;display:flex;align-items:flex-start;gap:9px}
.dt-fig figcaption::before{content:"FIG";font-size:10px;letter-spacing:.1em;color:var(--blue);background:var(--sky);padding:3px 7px;flex:none;margin-top:1px}
.dt-fig.two .ph{height:100%}
.dt-fig.two .ph img{height:100%;object-fit:cover}
.dt-fig.two figcaption{grid-column:1/-1;margin-top:0}
.dt-vid{margin-top:28px}
.dt-vid .fr{position:relative;border:1px solid var(--xp-line);background:#000;overflow:hidden;aspect-ratio:16/9}
.dt-vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dt-vid .pp{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--navy);pointer-events:none;z-index:2;transition:opacity .25s}
.dt-vid .fr.on .pp{opacity:0}
.dt-vid .pp svg{width:24px;height:24px;margin-left:3px}
.dt-vid figcaption{margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em;display:flex;align-items:flex-start;gap:9px}
.dt-vid figcaption::before{content:"VIDEO";font-size:10px;letter-spacing:.07em;color:var(--blue);background:var(--sky);padding:3px 7px;flex:none;margin-top:1px}
.dt-soft{margin-top:30px;border:1px solid var(--xp-line);background:var(--paper);padding:26px 28px;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.dt-soft .tx{max-width:54ch}
.dt-soft .tx b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:18px}
.dt-soft .tx p{margin-top:7px;font-size:14.5px;color:var(--ink-2);line-height:1.55}
.dt-rel{background:var(--paper);border-top:1px solid var(--xp-line)}
.dt-rel-in{max-width:1180px;margin:0 auto;padding:62px 28px}
.dt-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.dt-rc{display:block;border:1px solid var(--xp-line);background:#fff;overflow:hidden;transition:transform .2s,box-shadow .2s}
.dt-rc:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.dt-rc .im{aspect-ratio:16/10;overflow:hidden;background:var(--navy)}
.dt-rc .im img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.dt-rc:hover .im img{transform:scale(1.05)}
.dt-rc .bd{padding:16px 17px 18px}
.dt-rc .bd .k{font-family:var(--ff-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.dt-rc .bd h4{font-size:15.5px;color:var(--navy);margin-top:7px;line-height:1.25;font-weight:600}
.dt-rc .bd .m{margin-top:11px;font-size:12.5px;color:var(--blue);font-weight:600;display:inline-flex;align-items:center;gap:6px}
.dt-topprog{position:fixed;top:0;left:0;right:0;height:3px;z-index:80;background:transparent;pointer-events:none}
.dt-topprog i{display:block;height:100%;width:0;background:var(--grad-thermal);background-size:100vw 100%;background-repeat:no-repeat}
.dt-anchor{position:absolute;left:-28px;top:.1em;color:var(--faint);opacity:0;transition:opacity .15s,color .15s;font-weight:400;text-decoration:none;font-family:var(--ff-mono)}
.dt-sec h2:hover .dt-anchor{opacity:1}
.dt-anchor:hover{color:var(--blue)}
@media(max-width:600px){.dt-sec p,.dt-def p{text-align:left}}
.dt-apps{grid-template-columns:repeat(4,1fr)}
.dt-apps .dt-rc .bd{padding:14px 15px 16px}
.dt-apps .dt-rc .bd h4{margin-top:6px;font-size:14.5px}
.dt-apps-more{display:flex;justify-content:center;margin-top:30px}
.xv-head .xv-k{font-family:var(--ff-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#8fb6ff;display:inline-flex;align-items:center;gap:10px}
.xv-head .xv-k::before{content:"";width:24px;height:2px;background:var(--grad-thermal)}
.dt-formula{margin-top:24px;border:1px solid var(--xp-line);background:var(--paper);padding:24px;text-align:center}
.dt-formula .eq sub{font-size:.7em}
.dt-formula .leg{margin-top:14px;font-size:13.5px;color:var(--ink-2);line-height:1.7;text-align:left}
.dt-formula .leg b{color:var(--navy);font-weight:600}
/* recovered from data-center/guide-calcul-pue-data-center */
.dt-formula::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.dt-formula .frac{display:inline-flex;flex-direction:column;text-align:center;font-size:15px}
.dt-formula .frac .num{border-bottom:2px solid var(--blue);padding:0 14px 5px}
.dt-formula .frac .den{padding:5px 14px 0}
.dt-tbl{margin-top:24px}
.dt-tbl table{width:100%;border-collapse:collapse;font-size:14.5px;border:1px solid var(--xp-line);background:#fff}
.dt-tbl caption{caption-side:bottom;margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);text-align:left;line-height:1.5}
.dt-tbl thead th{background:var(--navy);color:#fff;font-family:var(--ff-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;font-weight:500;text-align:left;padding:12px 14px;line-height:1.3;vertical-align:bottom}
.dt-tbl tbody th{text-align:left;font-weight:600;color:var(--navy);background:var(--paper);padding:12px 14px;border-top:1px solid var(--xp-line);font-size:14px;line-height:1.3}
.dt-tbl tbody td{padding:12px 14px;border-top:1px solid var(--xp-line);color:#22374f;line-height:1.5;vertical-align:top}
.dt-tbl tbody tr:hover th,.dt-tbl tbody tr:hover td{background:var(--sky)}
.dt-tbl .dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle}
.dt-tbl .g{background:var(--t-4)}
.dt-tbl .o{background:#e0972f}
.dt-tbl .r{background:var(--t-7)}
.dt-tbl .b{background:var(--blue)}
.dt-steps{margin-top:24px;display:flex;flex-direction:column;counter-reset:st}
.dt-step{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:18px 0;border-top:1px solid var(--xp-line)}
.dt-step:first-child{border-top:0;padding-top:4px}
.dt-step .si{counter-increment:st;width:38px;height:38px;flex:none;display:grid;place-items:center;background:var(--sky);color:var(--blue);font-family:var(--ff-display);font-weight:600;border-radius:50%;font-size:16px}
.dt-step .si::before{content:counter(st)}
.dt-step h4{color:var(--navy);font-size:16.5px;font-weight:600;margin:0;line-height:1.25}
.dt-step p{margin-top:6px;font-size:15.5px;line-height:1.6;color:var(--ink-2);text-align:justify;-webkit-hyphens:none;hyphens:none}
.dt-step p strong{color:var(--navy)}
.dt-calc{margin-top:28px;border:1px solid var(--xp-line);background:#fff;overflow:hidden;box-shadow:var(--sh-md)}
.dt-calc .calc-head{background:var(--navy);color:#fff;padding:22px 26px;position:relative;overflow:hidden}
.dt-calc .calc-head .thermal{position:absolute;inset:0;opacity:.32}
.dt-calc .calc-head .k{position:relative;z-index:1;font-family:var(--ff-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8fb6ff}
.dt-calc .calc-head h3{position:relative;z-index:1;color:#fff;margin-top:7px;font-size:20px;font-weight:600}
.dt-calc .calc-head p{position:relative;z-index:1;color:#c8d6ee;margin-top:7px;font-size:14px;line-height:1.55;max-width:60ch}
.dt-calc .calc-body{padding:24px 26px}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.calc-field span{display:block;font-family:var(--ff-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);margin-bottom:8px}
.calc-field .inp{display:flex;align-items:center;border:1px solid var(--line);background:var(--paper)}
.calc-field input{flex:1;border:0;background:transparent;padding:13px 14px;font-family:var(--ff-display);font-size:20px;color:var(--navy);width:100%;outline:none}
.calc-field input:focus{background:#fff}
.calc-field .inp em{font-style:normal;font-family:var(--ff-mono);font-size:12px;color:var(--muted);padding:0 14px;border-left:1px solid var(--line)}
.calc-presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;align-items:center}
.calc-presets .pl{font-family:var(--ff-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.calc-presets button{font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.03em;color:var(--ink-2);background:var(--paper);border:1px solid var(--line);padding:8px 13px;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.calc-presets button:hover{border-color:var(--blue);color:var(--blue);background:var(--sky)}
.calc-out{margin-top:22px;display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:center;padding:22px 24px;background:var(--paper);border:1px solid var(--xp-line)}
.co-main{text-align:center}
.co-main .co-l{font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.co-main .co-v{font-family:var(--ff-display);font-weight:600;font-size:clamp(46px,8vw,64px);color:var(--navy);line-height:1;letter-spacing:-.03em;margin-top:6px}
.co-side{display:flex;flex-direction:column;gap:11px}
.co-side > div{display:flex;align-items:baseline;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line-soft);padding-bottom:9px}
.co-side > div:last-child{border-bottom:0;padding-bottom:0}
.co-side span{font-size:13.5px;color:var(--ink-2)}
.co-side b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:17px}
.co-side b.cv{font-size:13.5px;padding:5px 11px;color:#fff;border-radius:3px}
.calc-gauge{margin-top:20px}
.cg-track{position:relative;height:10px;border-radius:6px;background:linear-gradient(90deg,var(--t-4) 0%,#5aa469 28%,#e0972f 60%,var(--t-7) 100%)}
.cg-track i{position:absolute;top:50%;left:33%;width:5px;height:22px;background:var(--navy);border:2px solid #fff;border-radius:3px;transform:translate(-50%,-50%);box-shadow:0 2px 7px rgba(7,26,68,.45);transition:left .25s}
.cg-scale{display:flex;justify-content:space-between;margin-top:9px;font-family:var(--ff-mono);font-size:10.5px;color:var(--muted)}
.calc-note{margin-top:14px;font-family:var(--ff-mono);font-size:11px;color:var(--faint);line-height:1.5}
.dt-faq{margin-top:24px;border-top:1px solid var(--xp-line)}
.dt-faq details{border-bottom:1px solid var(--xp-line)}
.dt-faq summary{list-style:none;cursor:pointer;padding:18px 2px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:17px}
.dt-faq summary::-webkit-details-marker{display:none}
.dt-faq summary .pm{flex:none;width:22px;height:22px;position:relative}
.dt-faq summary .pm::before,.dt-faq summary .pm::after{content:"";position:absolute;background:var(--blue);transition:transform .2s}
.dt-faq summary .pm::before{top:10px;left:2px;right:2px;height:2px}
.dt-faq summary .pm::after{left:10px;top:2px;bottom:2px;width:2px}
.dt-faq details[open] summary .pm::after{transform:scaleY(0)}
.dt-faq .ans{padding:0 2px 20px;color:#22374f;font-size:16px;line-height:1.7;text-align:justify;-webkit-hyphens:none;hyphens:none}
/* recovered from data-center/hot-spot-in-the-data-center-causes-and-effects */
.dt-table{margin-top:24px;width:100%;border-collapse:collapse;font-size:14.5px;border:1px solid var(--xp-line)}
.dt-table caption{caption-side:bottom;margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em;text-align:left}
.dt-table th,.dt-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--xp-line);vertical-align:top}
.dt-table thead th{font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500;background:var(--paper)}
.dt-table tbody th{font-weight:600;color:var(--navy);font-family:var(--ff-display);white-space:nowrap}
.dt-table td{color:#22374f;line-height:1.5}
.dt-table tbody tr:last-child th,.dt-table tbody tr:last-child td{border-bottom:0}
/* recovered from data-center/thermal-study-of-technical-premises */
.xp-ing{position:relative;overflow:hidden;background:radial-gradient(125% 130% at 82% -15%,#143a6b 0%,#0d2444 50%,#071a33 100%);color:#fff;border-top:1px solid rgba(255,255,255,.06)}
.xp-ing .thermal{position:absolute;inset:0;opacity:.18}
.xp-ing-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:74px 28px 78px}
.xp-ing .xp-kicker{color:#8fb6ff}
.xp-ing h2{color:#fff;font-size:clamp(26px,3.4vw,40px);line-height:1.1;letter-spacing:-.02em;margin-top:12px;max-width:24ch}
.xp-ing .ing-grid{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.xp-ing p{color:#cddcf2;font-size:16.5px;line-height:1.74;text-align:justify;-webkit-hyphens:none;hyphens:none;text-wrap:pretty}
.xp-ing p strong{color:#fff;font-weight:600}
.xp-ing .ing-foot{margin-top:34px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding-top:26px;border-top:1px solid rgba(255,255,255,.14)}
.xp-ing .ing-foot .b{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;background:#fff;color:var(--navy);font-weight:600;font-size:14.5px;padding:12px 20px;transition:background .18s,color .18s}
.xp-ing .ing-foot .b:hover{background:#cfe0ff}
.xp-ing .ing-foot .b svg{width:16px;height:16px}
.xp-ing .ing-cities{font-family:var(--ff-mono);font-size:12px;letter-spacing:.1em;color:#9fc0ff;line-height:1.7}
.xp-ing .ing-cities b{color:#fff;font-weight:600;letter-spacing:.16em;margin-right:6px}
/* recovered from data-center/urban-heat-island-impact-study-for-data-centers */
.xp-proof{position:relative;overflow:hidden;background:radial-gradient(120% 130% at 85% 0%,#143a6b 0%,#0d2444 50%,#071a33 100%);color:#fff;border-top:1px solid var(--xp-line)}
.xp-proof .thermal{position:absolute;inset:0;opacity:.26}
.xp-proof-in{position:relative;max-width:1180px;margin:0 auto;padding:44px 28px;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.xp-stat{position:relative;padding-left:18px;display:flex;flex-direction:column;gap:7px}
.xp-stat::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:3px;background:var(--grad-thermal)}
.xp-stat .n{font-family:var(--ff-display);font-weight:600;font-size:clamp(30px,4vw,46px);line-height:1;letter-spacing:-.02em;color:#fff}
.xp-stat .n s{font-size:.5em;font-weight:500;color:#8fb6ff;text-decoration:none;margin-left:3px;letter-spacing:0}
.xp-stat .l{font-size:13px;line-height:1.45;color:#bcd0ee}
.xp-method{background:#fff;border-top:1px solid var(--xp-line)}
.xp-method-in{max-width:1180px;margin:0 auto;padding:62px 28px 64px}
.xp-method .hd{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:30px}
.xp-method .hd h2{font-size:clamp(24px,3vw,34px);color:var(--navy);margin-top:10px;letter-spacing:-.02em;line-height:1.1}
.xp-method .hd p{margin-top:11px;max-width:50ch;color:var(--ink-2);font-size:15.5px;line-height:1.6;text-align:justify;-webkit-hyphens:none;hyphens:none}
.xp-steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--xp-line)}
.xp-step{position:relative;padding:26px 22px 28px;border-right:1px solid var(--xp-line)}
.xp-step::before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:var(--grad-thermal);opacity:.85}
.xp-step:last-child{border-right:0}
@media(max-width:860px){.xp-step:nth-child(2n){border-right:0}
.xp-step:nth-child(1),.xp-step:nth-child(2){border-bottom:1px solid var(--xp-line)}}
.xp-step .k{font-family:var(--ff-mono);font-size:12px;color:var(--blue);letter-spacing:.06em}
.xp-step .ic{width:40px;height:40px;display:grid;place-items:center;background:var(--sky);color:var(--blue);margin:15px 0 15px}
.xp-step .ic svg{width:21px;height:21px}
.xp-step h4{font-size:16px;color:var(--navy);font-weight:600;line-height:1.25}
.xp-step p{margin-top:9px;font-size:13.5px;line-height:1.55;color:var(--ink-2);text-align:left;-webkit-hyphens:none;hyphens:none}
.xp-ba{margin-top:26px}
.xp-ba-stage{position:relative;overflow:hidden;border:1px solid var(--xp-line);background:var(--navy);aspect-ratio:16/9;cursor:ew-resize;touch-action:none;-webkit-user-select:none;user-select:none}
.xp-ba-stage img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.xp-ba-after{position:absolute;inset:0}
.xp-ba-before{position:absolute;inset:0;clip-path:inset(0 50% 0 0);will-change:clip-path}
.xp-ba-tag{position:absolute;top:14px;z-index:2;font-family:var(--ff-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:rgba(7,17,42,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:6px 11px;pointer-events:none}
.xp-ba-tag-l{left:14px}
.xp-ba-tag-r{right:14px}
.xp-ba-handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;transform:translateX(-1px);z-index:3;pointer-events:none;box-shadow:0 0 0 1px rgba(7,17,42,.25)}
.xp-ba-handle i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;box-shadow:0 8px 22px -6px rgba(0,0,0,.55)}
.xp-ba-handle i svg{width:22px;height:22px}
.xp-ba figcaption{margin-top:11px;font-family:var(--ff-mono);font-size:11.5px;color:var(--muted);letter-spacing:.02em}
/* recovered from climatic-engineering/climatic-engineering-of-high-rise-premises */
.faq-list{max-width:840px;margin:34px auto 0;display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);transition:border-color .2s ease,box-shadow .3s ease}
.faq-item[open]{border-color:var(--sky-2);box-shadow:var(--sh-md)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 24px;font-family:var(--ff-display);font-weight:600;font-size:17px;color:var(--navy);line-height:1.3}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--blue)}
.faq-x{flex:none;width:24px;height:24px;position:relative;color:var(--blue);transition:transform .25s ease}
.faq-item[open] .faq-x{transform:rotate(45deg)}
.faq-x::before,.faq-x::after{content:"";position:absolute;background:currentColor}
.faq-x::before{left:50%;top:4px;width:2px;height:16px;transform:translateX(-50%)}
.faq-x::after{top:50%;left:4px;height:2px;width:16px;transform:translateY(-50%)}
.faq-a{padding:0 24px 22px}
.faq-a p{margin:0;color:#0d2444;font-size:16px;line-height:1.7;text-align:justify;-webkit-hyphens:none;hyphens:none}
.faq-a a{color:var(--blue);text-decoration:underline;text-underline-offset:2px;font-weight:600}
.faq-a a:hover{color:var(--navy)}
.section.faq-band{padding-top:56px;padding-bottom:80px}
.faq-inner{max-width:1060px;margin:0 auto}
.faq-band .faq-head{text-align:left;max-width:none;margin:0}
.faq-band .faq-head h2{font-size:clamp(26px,3.2vw,38px);color:var(--navy);margin-top:12px}
.faq-band .faq-head p{color:var(--ink-2);margin-top:12px;font-size:17px}
.faq-grid{margin-top:26px;display:grid;grid-template-columns:1fr 330px;gap:28px;align-items:start}
.faq-grid .faq-list{max-width:none;margin:0}
.faq-cta{position:relative;background:var(--navy);color:#fff;padding:28px 24px;overflow:hidden}
.faq-cta::before{content:"";position:absolute;inset:0;background:var(--grad-thermal);opacity:.36}
.faq-cta > *{position:relative;z-index:1}
.faq-cta .k{font-family:var(--ff-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8fb6ff}
.faq-cta h3{color:#fff;font-size:20px;line-height:1.22;margin-top:12px;font-weight:600}
.faq-cta p{color:#c4d4ee;font-size:14px;line-height:1.6;margin-top:12px}
.faq-cta .btn{margin-top:18px}
.faq-main{min-width:0}
.faq-search{margin-top:16px;background:var(--navy);padding:20px 22px;position:relative;overflow:hidden}
.faq-search::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.faq-search > *{position:relative;z-index:1}
.faq-search .fs-t{font-family:var(--ff-display);font-weight:600;font-size:16px;color:#fff}
.faq-search .fs-bar{margin-top:12px;width:100%;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#bcd0ee;font-size:14px;padding:12px 14px;cursor:pointer;text-align:left;transition:background .2s ease,color .2s ease;font-family:var(--ff-body)}
.faq-search .fs-bar:hover{background:rgba(255,255,255,.14);color:#fff}
.faq-search .fs-bar svg{flex:none;width:18px;height:18px;color:#8fb6ff}
.faq-search .fs-bar span{flex:1}
.faq-search .fs-sub{margin-top:10px;font-size:13px;color:#9db4d6;line-height:1.5}
/* recovered from climatic-engineering/modeling-of-interior-comfort */
.xp-faq .faq-list{margin-top:30px;border-top:1px solid var(--xp-line)}
.xp-faq details{border-bottom:1px solid var(--xp-line)}
.xp-faq summary{list-style:none;cursor:pointer;padding:20px 0;display:flex;justify-content:space-between;gap:20px;align-items:center;font-family:var(--ff-display);font-weight:600;font-size:18px;color:var(--navy)}
.xp-faq summary::-webkit-details-marker{display:none}
.xp-faq summary .pl{flex:none;width:22px;height:22px;position:relative;transition:transform .25s ease}
.xp-faq summary .pl::before,.xp-faq summary .pl::after{content:"";position:absolute;background:var(--blue);border-radius:2px}
.xp-faq summary .pl::before{left:50%;top:3px;width:2px;height:16px;transform:translateX(-50%)}
.xp-faq summary .pl::after{top:50%;left:3px;height:2px;width:16px;transform:translateY(-50%)}
.xp-faq details[open] summary .pl{transform:rotate(45deg)}
.xp-faq .ans{padding:0 0 22px;color:var(--ink);font-size:16px;line-height:1.7;text-align:justify;-webkit-hyphens:none;hyphens:none;text-wrap:pretty}
.xp-faq .ans strong{color:var(--navy)}
/* recovered from climatic-engineering/optimization-of-thermal-ventilation-comfort */
.sx-chips{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 4px}
.sx-chips span{font-family:var(--ff-mono);font-size:12px;letter-spacing:.02em;color:var(--navy);background:var(--sky);border:1px solid var(--sky-2);padding:7px 13px;border-radius:2px}
/* recovered from climatic-engineering/our-hvac-resources */
.rs-hero{position:relative;background:linear-gradient(180deg,#fff 0%,var(--paper) 100%);border-bottom:1px solid var(--xp-line);overflow:hidden}
.rs-hero .cmap{position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad-thermal);z-index:2}
.rs-hero-in{max-width:1180px;margin:0 auto;padding:30px 28px 46px}
.rs-crumbs{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-family:var(--ff-mono);font-size:12px;letter-spacing:.03em;color:var(--muted)}
.rs-crumbs a{color:var(--ink-2)}
.rs-crumbs a:hover{color:var(--blue)}
.rs-crumbs .sep{color:var(--faint)}
.rs-crumbs .here{color:var(--navy)}
.rs-eyebrow{display:inline-flex;align-items:center;gap:11px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-top:26px}
.rs-eyebrow::before{content:"";width:26px;height:2px;background:var(--grad-thermal)}
.rs-hero h1{color:var(--navy);font-size:clamp(30px,4.4vw,52px);line-height:1.04;letter-spacing:-.03em;margin-top:16px;max-width:20ch;font-weight:600}
.rs-hero .sub{color:var(--ink-2);font-size:clamp(17px,1.6vw,20px);line-height:1.58;margin-top:18px;max-width:64ch}
.rs-meta{margin-top:24px;display:flex;flex-wrap:wrap;gap:10px}
.rs-meta .chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--ff-mono);font-size:11.5px;letter-spacing:.04em;color:var(--ink-2);background:#fff;border:1px solid var(--xp-line);padding:8px 13px}
.rs-meta .chip b{color:var(--navy);font-weight:600}
.rs-bar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.rs-bar-in{max-width:1180px;margin:0 auto;padding:15px 28px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.rs-filters{display:flex;gap:8px;overflow-x:auto;flex:1 1 auto;min-width:0;scrollbar-width:none}
.rs-filters::-webkit-scrollbar{display:none}
.rs-filter{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-family:var(--ff-body);font-size:13.5px;font-weight:500;padding:8px 15px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:border-color .18s,color .18s,background .18s}
.rs-filter i{font-style:normal;font-family:var(--ff-mono);font-size:11px;color:var(--muted);background:var(--paper);border-radius:999px;padding:1px 7px}
.rs-filter:hover{border-color:var(--blue);color:var(--ink)}
.rs-filter.active{background:var(--ink);border-color:var(--ink);color:#fff}
.rs-filter.active i{background:rgba(255,255,255,.18);color:#fff}
.rs-search{flex:0 0 auto;width:280px;max-width:100%}
.rs-wrap{max-width:1180px;margin:0 auto;padding:40px 28px 20px}
.rs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rs-card{display:flex;flex-direction:column;border:1px solid var(--xp-line);background:#fff;overflow:hidden;transition:transform .2s,box-shadow .25s,border-color .2s}
.rs-card:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--sky-2)}
.rs-card .im{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--navy)}
.rs-card .im img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.rs-card:hover .im img{transform:scale(1.05)}
.rs-type{position:absolute;left:12px;top:12px;font-family:var(--ff-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(7,17,42,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:5px 10px}
.rs-card .bd{padding:17px 18px 18px;display:flex;flex-direction:column;gap:9px;flex:1}
.rs-card .bd .d{font-size:13.5px;line-height:1.55;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rs-card .bd .m{margin-top:8px}
.rs-card .bd b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:16.5px;line-height:1.26}
.rs-card .m{margin-top:auto;display:flex;align-items:center;justify-content:space-between;font-family:var(--ff-mono);font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.rs-card .m svg{width:16px;height:16px;color:var(--blue);transition:transform .18s;flex:none}
.rs-card:hover .m svg{transform:translateX(3px)}
.rs-card.soon{pointer-events:none}
.rs-card.soon .rs-type{background:rgba(13,36,68,.45)}
.rs-card.soon .m{color:var(--faint)}
.rs-empty{display:none;padding:60px 0;text-align:center;color:var(--muted);font-size:15px}
.rs-more-wrap{display:flex;justify-content:center;padding:34px 0 8px}
.rs-more{display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-body);font-size:14.5px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line);padding:13px 24px;cursor:pointer;transition:all .18s}
.rs-more:hover{border-color:var(--ink);background:var(--ink);color:#fff}
.rs-intro{background:#fff;border-bottom:1px solid var(--line-soft)}
.rs-intro-in{max-width:1180px;margin:0 auto;padding:6px 28px 38px}
.rs-lead{max-width:72ch;color:#22374f;font-size:clamp(17px,1.7vw,19px);line-height:1.7;text-align:justify;-webkit-hyphens:none;hyphens:none}
.rs-lead strong{color:var(--navy);font-weight:600}
.rs-val{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.rs-v{border:1px solid var(--xp-line);background:var(--paper);padding:20px 22px}
.rs-v .ic{width:38px;height:38px;display:grid;place-items:center;background:var(--sky);color:var(--blue);position:relative;overflow:hidden}
.rs-v .ic::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-thermal)}
.rs-v .ic svg{width:19px;height:19px}
.rs-v b{display:block;margin-top:14px;font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:16px}
.rs-v p{margin-top:7px;font-size:13.5px;line-height:1.55;color:var(--ink-2)}
.rs-more-res{background:var(--paper);border-top:1px solid var(--xp-line)}
.rs-mr-in{max-width:1180px;margin:0 auto;padding:60px 28px}
.rs-mr-in .ey{font-family:var(--ff-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.rs-mr-in h2{font-size:clamp(24px,3vw,34px);color:var(--navy);margin-top:10px;letter-spacing:-.02em}
.rs-mr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.rs-mr{display:flex;flex-direction:column;gap:11px;border:1px solid var(--xp-line);background:#fff;padding:24px;transition:transform .2s,box-shadow .25s,border-color .2s}
.rs-mr:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--sky-2)}
.rs-mr .ic{width:42px;height:42px;display:grid;place-items:center;background:var(--sky);color:var(--blue)}
.rs-mr .ic svg{width:21px;height:21px}
.rs-mr b{font-family:var(--ff-display);font-weight:600;color:var(--navy);font-size:17px}
.rs-mr p{font-size:13.5px;color:var(--ink-2);line-height:1.55;flex:1}
.rs-mr .go{font-family:var(--ff-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--blue);font-weight:500;display:inline-flex;align-items:center;gap:7px}
.rs-mr .go svg{width:14px;height:14px;transition:transform .18s}
.rs-mr:hover .go svg{transform:translateX(3px)}
.rs-new{position:absolute;right:12px;top:12px;font-family:var(--ff-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--blue);padding:5px 9px}
.rs-card.feat{grid-column:1 / -1;flex-direction:row;align-items:stretch}
.rs-card.feat .im{flex:0 0 46%;aspect-ratio:16/10}
.rs-card.feat .bd{justify-content:center;padding:30px 36px;gap:12px}
.rs-card.feat .bd b{font-size:clamp(20px,2.3vw,27px);line-height:1.16}
.rs-card.feat .bd .d{-webkit-line-clamp:4;font-size:15px;line-height:1.6}
.feat-ey{font-family:var(--ff-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);display:inline-flex;align-items:center;gap:9px}
.feat-ey::before{content:"";width:22px;height:2px;background:var(--grad-thermal)}
.rs-resbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.03em;color:var(--muted)}
.rs-resbar b{color:var(--navy)}
.rs-reset{border:0;background:none;color:var(--blue);font-family:var(--ff-mono);font-size:12px;cursor:pointer;text-transform:uppercase;letter-spacing:.06em;padding:0}
.rs-reset:hover{text-decoration:underline}
.rs-clear{flex:none;width:26px;height:26px;border-radius:50%;border:0;background:var(--paper);color:var(--ink-2);cursor:pointer;display:grid;place-items:center;font-size:12px;line-height:1}
.rs-clear:hover{background:var(--ink);color:#fff}
.rs-empty .rs-reset{display:inline-block;margin-top:12px;font-size:13px}
/* recovered from air-wind/cfd-simulation-an-alternative-to-wind-tunnel-testing */
.dt-step .sn{width:40px;height:40px;display:grid;place-items:center;background:var(--sky);color:var(--blue);border:1px solid var(--xp-line);font-family:var(--ff-mono);font-size:16px;font-weight:600}
.dt-step .sc h4{margin:2px 0 0;font-size:16.5px;color:var(--navy);font-weight:600;line-height:1.25}
.dt-step .sc p{margin-top:7px;font-size:16px;line-height:1.72;color:#22374f;text-align:justify;-webkit-hyphens:none;hyphens:none;text-wrap:pretty}
.dt-cmp thead th.crit{background:#0a1f3d;width:26%}
.dt-cmp thead th.cfd-h{background:linear-gradient(180deg,#1b3f6f,#143a6b)}
.dt-cmp tbody th .sub{display:block;font-family:var(--ff-mono);font-size:11px;font-weight:400;color:var(--muted);letter-spacing:.01em;margin-top:5px;text-transform:none}
.dt-cmp tbody td.cfd{background:var(--sky);color:#1c3653;font-weight:500}
.dt-cmp tbody tr:hover td.cfd{background:#dfeafb}
.dt-cmp tbody td.win{background:#fff4e6;color:#7a4a12;font-weight:500}
.dt-cmp tbody tr:hover td.win{background:#ffecd2}
.dt-verdict{margin-top:30px;position:relative;overflow:hidden;background:radial-gradient(130% 130% at 85% -20%,#143a6b 0%,#0d2444 50%,#071a33 100%);color:#fff;padding:38px 38px 34px}
.dt-verdict .thermal{position:absolute;inset:0;opacity:.22}
.dt-verdict .vk{position:relative;z-index:1;font-family:var(--ff-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8fb6ff;display:inline-flex;align-items:center;gap:10px}
.dt-verdict .vk::before{content:"";width:24px;height:2px;background:var(--grad-thermal)}
.dt-verdict h3{position:relative;z-index:1;color:#fff;font-size:clamp(22px,2.8vw,30px);line-height:1.16;letter-spacing:-.02em;margin-top:14px;max-width:22ch;font-weight:600}
.dt-verdict .vp{position:relative;z-index:1;color:#c8d6ee;font-size:16.5px;line-height:1.72;margin-top:16px;max-width:62ch;text-align:justify;-webkit-hyphens:none;hyphens:none;text-wrap:pretty}
.dt-verdict .vp strong{color:#fff}
.dt-verdict .vgrid{position:relative;z-index:1;margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
.dt-verdict .vc{background:#0a1f3d;padding:18px 20px}
.dt-verdict .vc .n{font-family:var(--ff-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8fb6ff}
.dt-verdict .vc h4{color:#fff;font-size:15.5px;margin-top:9px;font-weight:600;line-height:1.25}
.dt-verdict .vc p{color:#aebfda;font-size:13.5px;line-height:1.55;margin-top:7px}
.dt-verdict .dt-vcta{position:relative;z-index:1;margin-top:26px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.dt-verdict .dt-vcta span{color:#dbe7fb;font-size:15px;font-weight:500;max-width:46ch}
.dt-verdict .dt-vcta .btn svg{width:17px;height:17px}
/* recovered from air-wind/pressure-loss-and-hydraulic-resistance */
.dt-formula .eq sub,.dt-formula .eq sup{font-size:.7em}